body {
    margin: 0;
    min-height: 100dvh;
    word-break: break-word;
    overflow-wrap: anywhere;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-family: 'Red Hat Display', sans-serif
}

.pageheader {
    position: relative;
    background-color: #030B22;
    overflow: hidden
}

.pageheader::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, #030B22 60%, #041236 100%);
    pointer-events: none
}

.pageheader-accent {
    position: absolute;
    top: 0;
    right: 0;
    width: 320px;
    height: 100%;
    background: linear-gradient(200deg, #06cf7414 0%, transparent 70%);
    pointer-events: none
}

.pageheader-accent-secondary {
    position: absolute;
    bottom: 0;
    left: 180px;
    width: 200px;
    height: 3px;
    background: linear-gradient(90deg, #06CF74 0%, transparent 100%);
    pointer-events: none
}

.pageheader-grid {
    position: relative;
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
    z-index: 1
}

.pageheader-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 32px 0 16px;
    flex-wrap: wrap
}

.logozone {
    margin-left: 16px;
    border-top: 2px solid #06cf7459;
    border-bottom: 2px solid #06cf7459;
    padding: 8px 16px;
    background: #ffffff0a;
    box-shadow: 0 3px 6px 1px #030b220d 0 5px 20px 1px #06cf741c;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.logozone img {
    display: block;
    width: 80px;
    height: 75px;
    object-fit: contain;
    object-position: center
}

.brandidentity {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px
}

.brandname {
    font-size: 56px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0;
    background: linear-gradient(90deg, #fff 0%, #06cf74e6 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0;
    padding: 0
}

.brandtagline {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #ffffff9e;
    margin: 0;
    padding: 0
}

.brandtagline strong {
    color: #06CF74;
    font-weight: 600
}

.pageheader-contact {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0
}

.contactlink {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #ffffffbf;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 44px;
    border: 1px solid #06cf7440;
    transition: color .25s cubic-bezier(0.34, 1.56, 0.64, 1), border-color .28s cubic-bezier(0.34, 1.56, 0.64, 1), background-color .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    min-height: 44px
}

.contactlink:hover {
    color: #06CF74;
    border-color: #06CF74;
    background-color: #06cf7414;
    filter: brightness(0.92)
}

.contactlink:focus-visible {
    outline: 2px solid #06CF74;
    outline-offset: 3px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.contactlink .mdi {
    font-size: 18px
}

.pageheader-divider {
    height: 1px;
    background: linear-gradient(90deg, #06cf7466 0%, #fc0e3d33 50%, transparent 100%);
    margin: 0
}

.primarynav {
    padding: 16px 0 32px
}

.primarynav-list {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap
}

.primarynav-list li {
    display: flex
}

.primarynav-list a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.35;
    color: #ffffffb3;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 6px;
    min-height: 44px;
    position: relative;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1), background-color .25s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.primarynav-list a::after {
    content: '';
    position: absolute;
    bottom: 6px;
    left: 16px;
    right: 16px;
    height: 2px;
    background: #06CF74;
    border-radius: 6px;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.primarynav-list a:hover {
    color: #fff;
    background-color: #ffffff0f;
    filter: brightness(0.9)
}

.primarynav-list a:hover::after {
    transform: scaleX(1)
}

.primarynav-list a:focus-visible {
    outline: 2px solid #06CF74;
    outline-offset: 2px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.primarynav-list a .mdi {
    font-size: 18px;
    color: #06CF74
}

.navpill {
    margin-left: 8px;
    background: #fc0e3d26;
    color: #FC0E3D;
    font-size: 16px;
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 44px;
    line-height: 1.1
}

@keyframes focusfade {
    from {
        outline-color: transparent
    }

    to {
        outline-color: #06CF74
    }
}

.pagefooter {
    background-color: #030B22;
    position: relative;
    overflow: hidden
}

.pagefooter::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #06CF74 0%, #FC0E3D 50%, transparent 100%);
    pointer-events: none
}

.pagefooter-grid {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 1
}

.pagefooter-upper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 48px;
    padding: 48px 0 32px;
    align-items: start
}

.footerbrand {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.footerlogorow {
    display: flex;
    align-items: center;
    gap: 16px
}

.footerlogobox {
    border-top: 2px solid #06cf744d;
    border-bottom: 2px solid #06cf744d;
    padding: 8px;
    background: #ffffff08;
    box-shadow: 0 3px 6px 1px #030b220d 0 5px 20px 1px #06cf741c;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center
}

.footerlogobox img {
    display: block;
    width: 56px;
    height: 52px;
    object-fit: contain;
    object-position: center
}

.footerfounded {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.footerfounded-label {
    font-size: 16px;
    font-weight: 400;
    color: #fff6;
    line-height: 1.35;
    margin: 0;
    padding: 0
}

.footerfounded-year {
    font-size: 22px;
    font-weight: 700;
    color: #06CF74;
    line-height: 1.1;
    margin: 0;
    padding: 0
}

.footerbrand-desc {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    color: #ffffff80;
    margin: 0;
    padding: 0
}

.footerlinks {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.footerlinks-heading {
    font-size: 16px;
    font-weight: 600;
    color: #ffffff59;
    text-transform: uppercase;
    letter-spacing: 0;
    margin: 0;
    padding: 0 0 8px;
    border-bottom: 1px solid #ffffff14
}

.footerlinks-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px
}

.footerlinks-list li a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.55;
    color: #ffffffa6;
    text-decoration: none;
    padding: 8px 0;
    min-height: 44px;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footerlinks-list li a:hover {
    color: #06CF74;
    filter: brightness(0.9)
}

.footerlinks-list li a:focus-visible {
    outline: 2px solid #06CF74;
    outline-offset: 2px;
    border-radius: 6px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footerlinks-list li a .mdi {
    font-size: 16px;
    color: #06cf7499
}

.footercontact {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.footercontact-heading {
    font-size: 16px;
    font-weight: 600;
    color: #ffffff59;
    text-transform: uppercase;
    margin: 0;
    padding: 0 0 8px;
    border-bottom: 1px solid #ffffff14
}

.footercontact-email {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #ffffffa6;
    text-decoration: none;
    padding: 8px 0;
    min-height: 44px;
    transition: color .25s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footercontact-email:hover {
    color: #06CF74;
    filter: brightness(0.9)
}

.footercontact-email:focus-visible {
    outline: 2px solid #06CF74;
    outline-offset: 2px;
    border-radius: 6px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footercontact-email .mdi {
    font-size: 18px;
    color: #06CF74
}

.footercontact-note {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    color: #ffffff59;
    margin: 0;
    padding: 0
}

.pagefooter-divider {
    height: 1px;
    background: linear-gradient(90deg, #06cf7440 0%, #fc0e3d26 60%, transparent 100%)
}

.pagefooter-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 24px 0 32px;
    flex-wrap: wrap
}

.footercopyright {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #ffffff59;
    margin: 0;
    padding: 0
}

.footercopyright strong {
    color: #ffffff8c;
    font-weight: 600
}

.footerlegal-list {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap
}

.footerlegal-list li a {
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #ffffff59;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 6px;
    min-height: 44px;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footerlegal-list li a:hover {
    color: #ffffffb3;
    filter: brightness(0.9)
}

.footerlegal-list li a:focus-visible {
    outline: 2px solid #06CF74;
    outline-offset: 2px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.footerlegal-sep {
    color: #ffffff26;
    font-size: 16px;
    user-select: none
}

.cookiepopup {
    display: none;
    position: fixed;
    bottom: 32px;
    right: 32px;
    width: 300px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 12px 52px 1px #030b221a 0 5px 20px 1px #030b221c;
    z-index: 1200;
    padding: 24px;
    opacity: 0;
    transition: opacity .32s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.cookiepopup.visible {
    opacity: 1
}

.cookiepopup-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #030B22;
    margin: 0 0 16px;
    padding: 0
}

.cookiepopup-actions {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.cookiepopup-accept {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Red Hat Display', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #030B22;
    background: #06CF74;
    border: none;
    border-radius: 44px;
    padding: 12px 24px;
    min-height: 44px;
    cursor: pointer;
    transition: filter .22s cubic-bezier(0.34, 1.56, 0.64, 1), background-color .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    width: 100%
}

.cookiepopup-accept:hover {
    filter: brightness(1.08)
}

.cookiepopup-accept:active {
    box-shadow: inset 0 2px 6px #030b222e;
    filter: brightness(0.95)
}

.cookiepopup-accept:focus-visible {
    outline: 2px solid #030B22;
    outline-offset: 2px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.cookiepopup-decline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Red Hat Display', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #030b2299;
    background: transparent;
    border: 1px solid #030b2226;
    border-radius: 44px;
    padding: 8px 16px;
    min-height: 44px;
    cursor: pointer;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1), border-color .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    width: 100%
}

.cookiepopup-decline:hover {
    color: #030B22;
    border-color: #030b2259;
    filter: brightness(0.92)
}

.cookiepopup-decline:active {
    box-shadow: inset 0 2px 4px #030b221a
}

.cookiepopup-decline:focus-visible {
    outline: 2px solid #030B22;
    outline-offset: 2px;
    animation: focusfade .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

@media (max-width: 768px) {
    .pageheader-top {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }

    .brandname {
        font-size: 40px
    }

    .pagefooter-upper {
        grid-template-columns: 1fr;
        gap: 32px
    }

    .pagefooter-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px
    }

    .cookiepopup {
        left: 16px;
        right: 16px;
        bottom: 16px;
        width: auto
    }
}

@media (max-width: 540px) {
    .pageheader-grid {
        padding: 0 16px
    }

    .pagefooter-grid {
        padding: 0 16px
    }

    .brandname {
        font-size: 28px
    }
}

.lkqb-doc-content {
    max-width: 1024px;
    margin: 0 auto;
    padding: 48px 32px;
    color: #030B22
}

.lkqb-doc-content p {
    font-size: 18px;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 16px
}

.lkqb-doc-content ul,
.lkqb-doc-content ol {
    font-size: 18px;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 16px;
    padding-left: 32px
}

.lkqb-doc-content li {
    margin-bottom: 8px
}

.lkqb-doc-content li:last-child {
    margin-bottom: 0
}

.lkqb-doc-content ul li::marker {
    color: #06CF74
}

.lkqb-doc-content ol li::marker {
    color: #06CF74;
    font-weight: 700
}

.lkqb-doc-content table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
    line-height: 1.55;
    margin-bottom: 32px;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 3px 6px 1px #030b220d
}

.lkqb-doc-content thead {
    background-color: #030B22;
    color: #fff
}

.lkqb-doc-content thead th {
    padding: 16px;
    font-size: 16px;
    line-height: 1.35;
    text-align: left;
    font-weight: 700
}

.lkqb-doc-content tbody tr {
    border-bottom: 1px solid #030b2214;
    transition: background-color .25s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.lkqb-doc-content tbody tr:last-child {
    border-bottom: none
}

.lkqb-doc-content tbody tr:hover {
    background-color: #06cf740f
}

.lkqb-doc-content tbody tr:nth-child(even) {
    background-color: #030b2206
}

.lkqb-doc-content tbody tr:nth-child(even):hover {
    background-color: #06cf740f
}

.lkqb-doc-content td {
    padding: 16px;
    font-size: 16px;
    line-height: 1.55;
    vertical-align: top;
    color: #030B22
}

.lkqb-doc-content th {
    padding: 16px
}

.lkqb-doc-content hr {
    border: none;
    height: 2px;
    background: linear-gradient(90deg, #06CF74 0%, #06cf7426 60%, transparent 100%);
    margin-top: 48px;
    margin-bottom: 48px;
    border-radius: 44px
}

.lkqb-doc-content div {
    font-size: 18px;
    line-height: 1.8
}

@media (max-width: 680px) {
    .lkqb-doc-content {
        padding: 32px 16px
    }

    .lkqb-doc-content table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .lkqb-doc-content p,
    .lkqb-doc-content ul,
    .lkqb-doc-content ol,
    .lkqb-doc-content div {
        font-size: 16px
    }

    .lkqb-doc-content hr {
        margin-top: 32px;
        margin-bottom: 32px
    }
}

.blogdetail {
    max-width: 100%;
    overflow-x: hidden
}

.blogdetail .postframe {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px
}

.blogdetail .titleslab {
    position: relative;
    padding: 96px 0 48px;
    background-color: #030B22;
    overflow: hidden
}

.blogdetail .titleslab::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #06CF74 0%, #FC0E3D 100%)
}

.blogdetail .titleslab::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #FC0E3D 0%, #06CF74 100%)
}

.blogdetail .aurorabg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none
}

.blogdetail .aurorabg .zone1 {
    position: absolute;
    width: 60%;
    height: 70%;
    top: -10%;
    left: -5%;
    background: radial-gradient(ellipse at 30% 40%, #06cf741f 0%, transparent 65%);
    animation: aurorashiftA 9s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate
}

.blogdetail .aurorabg .zone2 {
    position: absolute;
    width: 55%;
    height: 65%;
    bottom: -15%;
    right: -5%;
    background: radial-gradient(ellipse at 70% 60%, #fc0e3d17 0%, transparent 60%);
    animation: aurorashiftB 12s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate
}

@keyframes aurorashiftA {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: .7
    }

    100% {
        transform: translate(4%, 6%) scale(1.08);
        opacity: 1
    }
}

@keyframes aurorashiftB {
    0% {
        transform: translate(0, 0) scale(1.05);
        opacity: .6
    }

    100% {
        transform: translate(-5%, -4%) scale(0.95);
        opacity: 1
    }
}

.blogdetail .tagrow {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-bottom: 32px;
    position: relative;
    z-index: 1
}

.blogdetail .tagpill {
    display: inline-block;
    padding: 4px 16px;
    border-radius: 44px;
    background: #06cf7426;
    border: 1px solid #06cf7459;
    color: #06CF74;
    font-size: 16px;
    line-height: 1.55
}

.blogdetail .tagpill.theme {
    background: #fc0e3d1f;
    border-color: #fc0e3d4d;
    color: #FC0E3D
}

.blogdetail .postheading {
    position: relative;
    z-index: 1;
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px
}

.blogdetail .postheading h1 {
    font-size: 56px;
    line-height: 1.1;
    color: #fff;
    margin: 0 0 16px;
    font-weight: 700
}

.blogdetail .postheading .subtitle {
    font-size: 22px;
    line-height: 1.55;
    color: #ffffffb8;
    margin: 0;
    max-width: 680px
}

.blogdetail .wavecut {
    position: relative;
    height: 48px;
    background-color: #030B22;
    overflow: hidden
}

.blogdetail .wavecut svg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.blogdetail .imagepanel {
    background: #f4f5f8;
    padding: 48px 0 0
}

.blogdetail .imagepanel .postframe {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 32px;
    align-items: start
}

.blogdetail .imageframe {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 20px 1px #030b221c
}

.blogdetail .imageframe img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blogdetail .imageframe:hover img {
    transform: scale(1.03);
    filter: brightness(0.93)
}

.blogdetail .imageframe .scanlines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient(0deg, transparent, transparent 3px, #030b220a 3px, #030b220a 4px);
    pointer-events: none
}

.blogdetail .imageframe .cornercut {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 32px;
    height: 32px;
    background: #f4f5f8;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    transition: width .25s cubic-bezier(0.34, 1.56, 0.64, 1), height .25s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blogdetail .imageframe:hover .cornercut {
    width: 52px;
    height: 52px
}

.blogdetail .metaside {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 8px
}

.blogdetail .metaside .statblock {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 3px 6px 1px #030b220d;
    border-top: 3px solid #06CF74;
    border-bottom: 3px solid #FC0E3D;
    position: relative;
    overflow: hidden
}

.blogdetail .metaside .statblock .bignumber {
    font-size: 72px;
    line-height: 1.1;
    font-weight: 700;
    color: #030B22;
    display: flex;
    align-items: flex-start;
    gap: 4px
}

.blogdetail .metaside .statblock .bignumber sup {
    font-size: 22px;
    color: #06CF74;
    font-weight: 700;
    margin-top: 12px
}

.blogdetail .metaside .statblock .statlabel {
    font-size: 16px;
    line-height: 1.55;
    color: #555e75;
    margin-top: 4px
}

.blogdetail .metaside .reportlink {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 16px;
    background: #fff;
    border-radius: 6px;
    border-left: 3px solid #FC0E3D;
    border-right: 1px solid #030b2214;
    text-decoration: none;
    color: #030B22;
    font-size: 16px;
    line-height: 1.55;
    box-shadow: 0 3px 6px 1px #030b220d;
    transition: filter .22s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blogdetail .metaside .reportlink:hover {
    filter: brightness(0.94);
    transform: translateY(-2px)
}

.blogdetail .metaside .reportlink:active {
    box-shadow: inset 0 2px 6px #030b221a;
    transform: translateY(0)
}

.blogdetail .metaside .reportlink .mdi {
    color: #FC0E3D;
    font-size: 18px;
    flex-shrink: 0
}

.blogdetail .arrowdivider {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 16px 0;
    background: #f4f5f8
}

.blogdetail .arrowdivider .arrow {
    width: 10px;
    height: 10px;
    border-right: 2px solid #06CF74;
    border-bottom: 2px solid #06CF74;
    transform: rotate(-45deg);
    opacity: .5
}

.blogdetail .arrowdivider .arrow.mid {
    opacity: .8;
    border-color: #030B22
}

.blogdetail .arrowdivider .arrow.last {
    opacity: .5;
    border-color: #FC0E3D
}

.blogdetail .articlezone {
    background: #fff;
    padding: 48px 0 96px
}

.blogdetail .articlezone .postframe {
    display: grid;
    grid-template-columns: 30% 70%;
    gap: 48px;
    align-items: start
}

.blogdetail .leftrail {
    position: sticky;
    top: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.blogdetail .leftrail .railcard {
    background: #f4f5f8;
    border-radius: 16px;
    padding: 32px;
    border-top: 3px solid #030B22
}

.blogdetail .leftrail .railcard .railheading {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px
}

.blogdetail .leftrail .railcard .railheading::before {
    content: '';
    display: block;
    width: 4px;
    height: 20px;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    border-radius: 6px;
    flex-shrink: 0
}

.blogdetail .leftrail .railcard h4 {
    font-size: 18px;
    line-height: 1.35;
    color: #030B22;
    font-weight: 700;
    margin: 0
}

.blogdetail .leftrail .railcard p {
    font-size: 16px;
    line-height: 1.55;
    color: #3a4255;
    margin: 0
}

.blogdetail .leftrail .backbtn {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 16px 32px;
    background: #030B22;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 16px;
    line-height: 1.35;
    box-shadow: 0 5px 20px 1px #030b221c;
    transition: filter .25s cubic-bezier(0.68, -0.55, 0.27, 1.55), transform .25s cubic-bezier(0.68, -0.55, 0.27, 1.55)
}

.blogdetail .leftrail .backbtn:hover {
    filter: brightness(1.25);
    transform: translateY(-2px)
}

.blogdetail .leftrail .backbtn:active {
    box-shadow: inset 0 2px 8px #030b222e;
    transform: translateY(0)
}

.blogdetail .leftrail .backbtn .mdi {
    font-size: 18px
}

.blogdetail .articlecontent {
    min-width: 0
}

.blogdetail .articlecontent p {
    font-size: 18px;
    line-height: 1.8;
    color: #1e2535;
    margin: 0 0 16px;
    text-indent: -1.2em;
    padding-left: 1.2em
}

.blogdetail .articlecontent h2 {
    font-size: 28px;
    line-height: 1.35;
    color: #030B22;
    font-weight: 700;
    margin: 48px 0 16px;
    padding-left: 16px;
    border-left: 4px solid #06CF74
}

.blogdetail .articlecontent h4 {
    font-size: 22px;
    line-height: 1.35;
    color: #030B22;
    font-weight: 600;
    margin: 32px 0 8px;
    padding-left: 16px;
    border-left: 3px solid #FC0E3D
}

.blogdetail .articlecontent small {
    font-size: 16px;
    line-height: 1.55;
    color: #555e75;
    display: block;
    margin-bottom: 16px
}

.blogdetail .articlecontent abbr {
    text-decoration: underline dotted;
    cursor: help;
    color: #030B22
}

.blogdetail .articlecontent ul {
    margin: 0 0 16px;
    padding-left: 32px
}

.blogdetail .articlecontent li {
    font-size: 18px;
    line-height: 1.8;
    color: #1e2535;
    margin-bottom: 4px
}

.blogdetail .articlecontent blockquote {
    margin: 32px 0;
    padding: 32px;
    background: #f4f5f8;
    border-radius: 16px;
    border-left: 4px solid #06CF74;
    border-right: 4px solid #FC0E3D;
    font-size: 22px;
    line-height: 1.55;
    color: #030B22;
    font-style: italic
}

.blogdetail .articlecontent figure {
    margin: 32px 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 20px 1px #030b221c
}

.blogdetail .articlecontent figure img {
    width: 100%;
    display: block;
    object-fit: cover;
    object-position: center
}

.blogdetail .articlecontent figcaption {
    padding: 8px 16px;
    background: #030B22;
    color: #ffffffb8;
    font-size: 16px;
    line-height: 1.55
}

.blogdetail .arrowdivider2 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    padding: 16px 0;
    background: #fff;
    max-width: 1024px;
    margin: 0 auto;
    padding-left: 32px
}

.blogdetail .arrowdivider2 .arr {
    width: 8px;
    height: 8px;
    border-right: 2px solid #030b2240;
    border-bottom: 2px solid #030b2240;
    transform: rotate(-45deg)
}

.blogdetail .closingband {
    background: #030B22;
    padding: 48px 0;
    position: relative;
    overflow: hidden
}

.blogdetail .closingband::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #06CF74, #FC0E3D)
}

.blogdetail .closingband::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #FC0E3D, #06CF74)
}

.blogdetail .closingband .postframe {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 32px
}

.blogdetail .closingband .closingtext h3 {
    font-size: 28px;
    line-height: 1.35;
    color: #fff;
    margin: 0 0 8px;
    font-weight: 700
}

.blogdetail .closingband .closingtext p {
    font-size: 18px;
    line-height: 1.55;
    color: #ffffffa6;
    margin: 0
}

.blogdetail .closingband .closingactions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-shrink: 0
}

.blogdetail .closingband .closingactions a {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 16px 32px;
    border-radius: 6px;
    font-size: 16px;
    line-height: 1.35;
    text-decoration: none;
    transition: filter .22s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blogdetail .closingband .closingactions a:hover {
    filter: brightness(1.2);
    transform: translateY(-2px)
}

.blogdetail .closingband .closingactions a:active {
    box-shadow: inset 0 2px 6px #030b2233;
    transform: translateY(0)
}

.blogdetail .closingband .closingactions .primary {
    background: #06CF74;
    color: #030B22;
    font-weight: 700;
    box-shadow: 0 5px 20px 1px #06cf741c
}

.blogdetail .closingband .closingactions .secondary {
    background: transparent;
    color: #fff;
    border: 1px solid #ffffff4d
}

@media (max-width: 768px) {
    .blogdetail .postheading h1 {
        font-size: 40px
    }

    .blogdetail .postheading .subtitle {
        font-size: 18px
    }

    .blogdetail .imagepanel .postframe {
        grid-template-columns: 1fr
    }

    .blogdetail .articlezone .postframe {
        grid-template-columns: 1fr
    }

    .blogdetail .leftrail {
        position: static
    }

    .blogdetail .closingband .postframe {
        flex-direction: column;
        align-items: flex-start
    }

    .blogdetail .closingband .closingactions {
        flex-direction: column;
        width: 100%
    }

    .blogdetail .closingband .closingactions a {
        justify-content: center
    }

    .blogdetail .titleslab {
        padding: 48px 0 32px
    }

    .blogdetail .metaside .statblock .bignumber {
        font-size: 56px
    }
}

@media (max-width: 480px) {
    .blogdetail .postframe {
        padding: 0 16px
    }

    .blogdetail .postheading {
        padding: 0 16px
    }
}

.analytics {
    position: relative;
    overflow: hidden
}

.analytics .pageframe {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px
}

.analytics .titleblock {
    padding: 96px 32px 48px;
    text-align: center;
    position: relative;
    background: #fff;
    overflow: hidden
}

.analytics .titleblock .dotpath {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0
}

.analytics .titleblock .dotpath::before {
    content: "";
    position: absolute;
    top: 32px;
    left: 50%;
    transform: translateX(-50%);
    width: 320px;
    height: 320px;
    background-image: radial-gradient(circle, #030B22 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: .06;
    border-radius: 16px
}

.analytics .titleblock .dotpath::after {
    content: "";
    position: absolute;
    bottom: 16px;
    right: 48px;
    width: 160px;
    height: 160px;
    background-image: radial-gradient(circle, #06CF74 1.5px, transparent 1.5px);
    background-size: 16px 16px;
    opacity: .12;
    border-radius: 6px
}

.analytics .titleblock .geoshape {
    position: absolute;
    top: 48px;
    right: 80px;
    width: 120px;
    height: 120px;
    border: 2px solid #06cf741f;
    border-radius: 16px;
    animation: rotateshape 18s linear infinite;
    pointer-events: none;
    z-index: 0
}

.analytics .titleblock .geoshapeinner {
    position: absolute;
    top: 64px;
    left: 60px;
    width: 80px;
    height: 80px;
    border: 2px solid #fc0e3d14;
    border-radius: 16px;
    animation: rotateshape 12s linear infinite reverse;
    pointer-events: none;
    z-index: 0
}

@keyframes rotateshape {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg)
    }
}

.analytics .titleblock .titlematter {
    position: relative;
    z-index: 1;
    max-width: 1024px;
    margin: 0 auto
}

.analytics .titleblock .eyebrow {
    display: inline-block;
    font-size: 16px;
    line-height: 1.35;
    color: #06CF74;
    background: #06cf7414;
    border-radius: 44px;
    padding: 4px 16px;
    margin-bottom: 32px;
    border: 1px solid #06cf7433
}

.analytics .titleblock .bigline {
    font-size: 72px;
    line-height: 1.1;
    color: #030B22;
    display: block;
    margin-bottom: 8px
}

.analytics .titleblock .midline {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    display: block;
    margin-bottom: 8px
}

.analytics .titleblock .smallline {
    font-size: 28px;
    line-height: 1.35;
    color: #06CF74;
    display: block;
    margin-bottom: 32px
}

.analytics .titleblock .titledesc {
    font-size: 18px;
    line-height: 1.55;
    color: #4a5568;
    max-width: 600px;
    margin: 0 auto 48px
}

.analytics .titleblock .imageframe {
    position: relative;
    max-width: 760px;
    margin: 0 auto;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 52px 1px #030b221a
}

.analytics .titleblock .imageframe img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.analytics .titleblock .imageframe:hover img {
    transform: translateX(-12px)
}

.analytics .titleblock .imagegradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #030b2285 0%, #030b221f 50%, #06cf742e 100%);
    pointer-events: none;
    border-radius: 16px
}

.analytics .dividerband {
    height: 48px;
    background: linear-gradient(180deg, #fff 0%, #030b220a 50%, #06cf740f 100%);
    filter: blur(2px);
    margin: 0
}

.analytics .metricsrow {
    padding: 96px 32px;
    background: #f4f6f9;
    position: relative
}

.analytics .metricsrow .bgzoom {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 20% 80%, #06cf740d 0%, transparent 60%), radial-gradient(circle at 80% 20%, #fc0e3d0a 0%, transparent 60%);
    animation: bgscale 16s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0
}

@keyframes bgscale {
    from {
        transform: scale(1)
    }

    to {
        transform: scale(1.04)
    }
}

.analytics .metricsrow .metricsinner {
    max-width: 1024px;
    margin: 0 auto;
    position: relative;
    z-index: 1
}

.analytics .metricsrow .sectionlabel {
    font-size: 16px;
    line-height: 1.35;
    color: #06CF74;
    margin-bottom: 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px
}

.analytics .metricsrow .sectionlabel::before {
    content: "";
    display: block;
    width: 24px;
    height: 3px;
    background: #06CF74;
    border-radius: 6px;
    flex-shrink: 0
}

.analytics .metricsrow .sectionheading {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin-bottom: 16px
}

.analytics .metricsrow .sectiondesc {
    font-size: 18px;
    line-height: 1.55;
    color: #4a5568;
    max-width: 520px;
    margin-bottom: 48px
}

.analytics .metricsrow .threecols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px
}

.analytics .metricsrow .metriccard {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 5px 20px 1px #030b221c;
    border-top: 3px solid transparent;
    transition: transform .25s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative
}

.analytics .metricsrow .metriccard.accent1 {
    border-top-color: #030B22
}

.analytics .metricsrow .metriccard.accent2 {
    border-top-color: #06CF74
}

.analytics .metricsrow .metriccard.accent3 {
    border-top-color: #FC0E3D
}

.analytics .metricsrow .metriccard:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 52px 1px #030b221a;
    filter: brightness(0.97)
}

.analytics .metricsrow .metriccard .cardicon {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    font-size: 22px
}

.analytics .metricsrow .metriccard.accent1 .cardicon {
    background: #030b2212;
    color: #030B22
}

.analytics .metricsrow .metriccard.accent2 .cardicon {
    background: #06cf741a;
    color: #06CF74
}

.analytics .metricsrow .metriccard.accent3 .cardicon {
    background: #fc0e3d14;
    color: #FC0E3D
}

.analytics .metricsrow .metriccard .cardtitle {
    font-size: 18px;
    line-height: 1.35;
    color: #030B22;
    margin-bottom: 8px
}

.analytics .metricsrow .metriccard .cardtext {
    font-size: 16px;
    line-height: 1.55;
    color: #4a5568;
    text-indent: -16px;
    padding-left: 16px
}

.analytics .metricsrow .metriccard .bigpercent {
    font-size: 56px;
    line-height: 1.1;
    color: #030B22;
    display: block;
    margin-bottom: 4px;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text
}

.analytics .dividerband2 {
    height: 48px;
    background: linear-gradient(180deg, #f4f6f9 0%, #fc0e3d0a 50%, #fff 100%);
    filter: blur(2px)
}

.analytics .deepdive {
    padding: 96px 32px;
    background: #fff;
    position: relative
}

.analytics .deepdive .deepinner {
    max-width: 1024px;
    margin: 0 auto
}

.analytics .deepdive .splitlayout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 96px;
    align-items: start
}

.analytics .deepdive .leftpanel .panellabel {
    font-size: 16px;
    line-height: 1.35;
    color: #FC0E3D;
    margin-bottom: 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px
}

.analytics .deepdive .leftpanel .panellabel::before {
    content: "";
    display: block;
    width: 4px;
    height: 20px;
    background: #FC0E3D;
    border-radius: 6px;
    flex-shrink: 0
}

.analytics .deepdive .leftpanel .panelheading {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin-bottom: 16px
}

.analytics .deepdive .leftpanel .paneltext {
    font-size: 16px;
    line-height: 1.8;
    color: #4a5568;
    margin-bottom: 16px;
    text-indent: -16px;
    padding-left: 16px
}

.analytics .deepdive .leftpanel .statstrip {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.analytics .deepdive .leftpanel .statrow {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.analytics .deepdive .leftpanel .statlabel {
    font-size: 16px;
    line-height: 1.35;
    color: #4a5568;
    min-width: 140px
}

.analytics .deepdive .leftpanel .statbar {
    flex: 1;
    height: 8px;
    background: #030b2212;
    border-radius: 44px;
    overflow: hidden
}

.analytics .deepdive .leftpanel .statfill {
    height: 100%;
    border-radius: 44px;
    transition: width .32s cubic-bezier(0.68, -0.55, 0.27, 1.55)
}

.analytics .deepdive .leftpanel .statfill.green {
    background: #06CF74
}

.analytics .deepdive .leftpanel .statfill.red {
    background: #FC0E3D
}

.analytics .deepdive .leftpanel .statfill.dark {
    background: #030B22
}

.analytics .deepdive .leftpanel .statnum {
    font-size: 16px;
    line-height: 1.35;
    color: #030B22;
    min-width: 36px;
    text-align: right
}

.analytics .deepdive .rightpanel {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.analytics .deepdive .rightpanel .insightcard {
    background: #f4f6f9;
    border-radius: 16px;
    padding: 32px;
    border-left: 4px solid #06CF74;
    box-shadow: 0 3px 6px 1px #030b220d;
    transition: border-left-color .22s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.analytics .deepdive .rightpanel .insightcard:hover {
    border-left-color: #030B22;
    box-shadow: 0 5px 20px 1px #030b221c;
    filter: brightness(0.98)
}

.analytics .deepdive .rightpanel .insightcard .insightq {
    font-size: 18px;
    line-height: 1.35;
    color: #030B22;
    margin-bottom: 8px
}

.analytics .deepdive .rightpanel .insightcard .insighttext {
    font-size: 16px;
    line-height: 1.55;
    color: #4a5568
}

@media (max-width: 768px) {
    .analytics .titleblock {
        padding: 64px 16px 32px
    }

    .analytics .titleblock .bigline {
        font-size: 40px
    }

    .analytics .titleblock .midline {
        font-size: 28px
    }

    .analytics .titleblock .smallline {
        font-size: 22px
    }

    .analytics .titleblock .imageframe img {
        height: 260px
    }

    .analytics .metricsrow {
        padding: 48px 16px
    }

    .analytics .metricsrow .threecols {
        grid-template-columns: 1fr;
        gap: 16px
    }

    .analytics .deepdive {
        padding: 48px 16px
    }

    .analytics .deepdive .splitlayout {
        grid-template-columns: 1fr;
        gap: 48px
    }

    .analytics .titleblock .geoshape,
    .analytics .titleblock .geoshapeinner {
        display: none
    }
}

@media (max-width: 480px) {
    .analytics .pageframe {
        padding: 0 16px
    }

    .analytics .metricsrow .sectionheading {
        font-size: 28px
    }

    .analytics .deepdive .leftpanel .panelheading {
        font-size: 28px
    }
}

.blog {
    background: #fff;
    overflow-x: clip
}

.blog .postsgrid {
    max-width: 1024px;
    margin: 0 auto;
    padding: 96px 32px
}

.blog .postsgrid .gridlabel {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    margin-bottom: 48px
}

.blog .postsgrid .gridlabel .accentline {
    width: 4px;
    height: 32px;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    border-radius: 6px;
    flex-shrink: 0
}

.blog .postsgrid .gridlabel h1 {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.blog .postsgrid .cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px
}

.blog .postsgrid .card {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 5px 20px 1px #030b221c;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .25s cubic-bezier(0.34, 1.56, 0.64, 1), transform .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    border-top: 3px solid #06CF74
}

.blog .postsgrid .card:hover {
    box-shadow: 0 12px 52px 1px #030b221a;
    transform: translateY(-4px);
    filter: brightness(0.97)
}

.blog .postsgrid .card .imgwrap {
    width: 100%;
    aspect-ratio: 16/9;
    overflow: hidden;
    position: relative
}

.blog .postsgrid .card .imgwrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .3s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .postsgrid .card:hover .imgwrap img {
    transform: scale(1.04)
}

.blog .postsgrid .card .cardtag {
    display: inline-block;
    font-size: 16px;
    line-height: 1.35;
    color: #06CF74;
    background: #06cf7414;
    border-radius: 44px;
    padding: 4px 16px;
    font-weight: 600;
    margin: 16px 16px 0;
    align-self: flex-start
}

.blog .postsgrid .card .cardbody {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px
}

.blog .postsgrid .card .cardbody h2 {
    font-size: 22px;
    line-height: 1.35;
    color: #030B22;
    margin: 0
}

.blog .postsgrid .card .cardbody .subtitle {
    font-size: 16px;
    line-height: 1.55;
    color: #555e7a;
    margin: 0;
    font-style: italic
}

.blog .postsgrid .card .cardbody .description {
    font-size: 16px;
    line-height: 1.55;
    color: #3a4260;
    margin: 0;
    flex: 1
}

.blog .postsgrid .card .cardfooter {
    padding: 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #030b2212
}

.blog .postsgrid .card .cardfooter .themebadge {
    font-size: 16px;
    color: #030B22;
    background: #030b220d;
    border-radius: 6px;
    padding: 4px 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px
}

.blog .postsgrid .card .cardfooter .readlink {
    font-size: 16px;
    color: #030B22;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    border-radius: 6px;
    padding: 4px 8px;
    transition: background .22s cubic-bezier(0.34, 1.56, 0.64, 1), color .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .postsgrid .card .cardfooter .readlink:hover {
    background: #030B22;
    color: #06CF74;
    filter: brightness(1.08)
}

.blog .postsgrid .card .cardfooter .readlink:active {
    box-shadow: inset 0 2px 6px #030b222e
}

.blog .dividermonogram {
    text-align: center;
    padding: 8px 0;
    position: relative
}

.blog .dividermonogram::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, #030b221f, transparent);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0
}

.blog .dividermonogram .mono {
    display: inline-block;
    width: 44px;
    height: 44px;
    background: #030B22;
    border-radius: 44px;
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.blog .dividermonogram .mono span {
    font-size: 22px;
    font-weight: 700;
    color: #06CF74;
    line-height: 1.1
}

.blog .spotlightband {
    background: #030B22;
    padding: 96px 32px;
    position: relative;
    overflow: hidden
}

.blog .spotlightband::after {
    content: "";
    position: absolute;
    top: -60px;
    right: -60px;
    width: 320px;
    height: 320px;
    border: 2px solid #06cf741a;
    border-radius: 16px;
    transform: rotate(22deg);
    pointer-events: none;
    animation: outlinepulse 4s ease-in-out infinite alternate
}

@keyframes outlinepulse {
    from {
        opacity: .4;
        transform: rotate(22deg) scale(1)
    }

    to {
        opacity: 1;
        transform: rotate(22deg) scale(1.06)
    }
}

.blog .spotlightband .inner {
    max-width: 1024px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center
}

.blog .spotlightband .textside {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.blog .spotlightband .textside .accentline {
    width: 40px;
    height: 3px;
    background: #06CF74;
    border-radius: 6px
}

.blog .spotlightband .textside h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #fff;
    margin: 0
}

.blog .spotlightband .textside p {
    font-size: 18px;
    line-height: 1.55;
    color: #ffffffbf;
    margin: 0;
    text-indent: -1em;
    padding-left: 1em
}

.blog .spotlightband .textside .actions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 8px
}

.blog .spotlightband .textside .actions a {
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 6px;
    padding: 8px 32px;
    transition: filter .28s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1);
    display: inline-block
}

.blog .spotlightband .textside .actions a:hover {
    filter: brightness(1.12);
    transform: translateY(-2px)
}

.blog .spotlightband .textside .actions a:active {
    box-shadow: inset 0 2px 8px #06cf7440;
    transform: translateY(0)
}

.blog .spotlightband .textside .actions .primary {
    background: #06CF74;
    color: #030B22
}

.blog .spotlightband .textside .actions .secondary {
    background: transparent;
    color: #06CF74;
    border: 1.5px solid #06CF74
}

.blog .spotlightband .imageside {
    position: relative
}

.blog .spotlightband .imageside img {
    width: 100%;
    height: 340px;
    object-fit: cover;
    object-position: center;
    border-radius: 16px;
    display: block;
    box-shadow: 0 12px 52px 1px #06cf741a;
    mask-image: radial-gradient(ellipse 85% 85% at center, black 60%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 85% 85% at center, black 60%, transparent 100%)
}

.blog .spotlightband .imageside::before {
    content: "";
    position: absolute;
    bottom: -16px;
    left: -16px;
    width: 80px;
    height: 80px;
    border: 2px solid #fc0e3d40;
    border-radius: 16px;
    pointer-events: none
}

.blog .divider2 {
    max-width: 1024px;
    margin: 0 auto;
    padding: 8px 32px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.blog .divider2 .line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, #030b221f, transparent)
}

.blog .divider2 .monosymbol {
    width: 44px;
    height: 44px;
    background: #06CF74;
    border-radius: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.blog .divider2 .monosymbol span {
    font-size: 22px;
    font-weight: 700;
    color: #030B22;
    line-height: 1.1
}

.blog .metricsrow {
    max-width: 1024px;
    margin: 0 auto;
    padding: 96px 32px;
    display: flex;
    flex-direction: column;
    gap: 48px
}

.blog .metricsrow .rowlabel {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.blog .metricsrow .rowlabel .accentline {
    width: 4px;
    height: 32px;
    background: linear-gradient(180deg, #030B22 50%, #FC0E3D 50%);
    border-radius: 6px;
    flex-shrink: 0
}

.blog .metricsrow .rowlabel h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.blog .metricsrow .statsgrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px
}

.blog .metricsrow .statsgrid .stat {
    background: #f4f6fb;
    border-radius: 16px;
    padding: 32px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    border-left: 3px solid #030B22;
    border-bottom: 3px solid #06CF74;
    transition: box-shadow .22s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .metricsrow .statsgrid .stat:hover {
    box-shadow: 0 5px 20px 1px #030b221c;
    transform: translateY(-3px);
    filter: brightness(0.97)
}

.blog .metricsrow .statsgrid .stat .bignum {
    font-size: 56px;
    line-height: 1.1;
    font-weight: 700;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.blog .metricsrow .statsgrid .stat .statlabel {
    font-size: 16px;
    line-height: 1.55;
    color: #3a4260
}

.blog .metricsrow .description {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px
}

.blog .metricsrow .description p {
    font-size: 18px;
    line-height: 1.8;
    color: #3a4260;
    margin: 0;
    text-indent: -1em;
    padding-left: 1em
}

.blog .divider3 {
    padding: 8px 0;
    text-align: center;
    position: relative
}

.blog .divider3::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, #030b221a, transparent);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0
}

.blog .divider3 .monosymbol {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: #FC0E3D;
    border-radius: 44px;
    position: relative;
    z-index: 1
}

.blog .divider3 .monosymbol span {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    line-height: 1.1
}

.blog .aboutstrip {
    background: linear-gradient(180deg, #030b220a 0%, #06cf740f 100%);
    padding: 96px 32px;
    position: relative
}

.blog .aboutstrip::before {
    content: "";
    position: absolute;
    top: 32px;
    left: 32px;
    width: 120px;
    height: 120px;
    border: 2px solid #030b220f;
    border-radius: 16px;
    transform: rotate(12deg);
    pointer-events: none;
    animation: outlinepulse 5s ease-in-out infinite alternate
}

.blog .aboutstrip .inner {
    max-width: 1024px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 32px
}

.blog .aboutstrip .inner .toprow {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 48px
}

.blog .aboutstrip .inner .toprow .textblock {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.blog .aboutstrip .inner .toprow .textblock .accentline {
    width: 4px;
    height: 32px;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    border-radius: 6px;
    flex-shrink: 0
}

.blog .aboutstrip .inner .toprow .textblock h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.blog .aboutstrip .inner .toprow .textblock p {
    font-size: 18px;
    line-height: 1.8;
    color: #3a4260;
    margin: 0;
    text-indent: -1em;
    padding-left: 1em
}

.blog .aboutstrip .inner .toprow .sideblock {
    width: 260px;
    flex-shrink: 0;
    background: #030B22;
    border-radius: 16px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.blog .aboutstrip .inner .toprow .sideblock .sidetitle {
    font-size: 18px;
    line-height: 1.35;
    color: #06CF74;
    font-weight: 600;
    margin: 0
}

.blog .aboutstrip .inner .toprow .sideblock .sidelinks {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.blog .aboutstrip .inner .toprow .sideblock .sidelinks a {
    font-size: 16px;
    color: #fffc;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    padding: 4px 8px;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1), background .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .aboutstrip .inner .toprow .sideblock .sidelinks a:hover {
    color: #06CF74;
    background: #06cf7414;
    filter: brightness(1.1)
}

.blog .aboutstrip .inner .toprow .sideblock .sidelinks a .mdi {
    font-size: 18px;
    color: #06CF74
}

.blog .aboutstrip .inner .bottomrow {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-wrap: wrap
}

.blog .aboutstrip .inner .bottomrow .pill {
    background: #fff;
    border-radius: 44px;
    padding: 8px 16px;
    font-size: 16px;
    color: #030B22;
    font-weight: 600;
    box-shadow: 0 3px 6px 1px #030b220d;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    transition: box-shadow .25s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .aboutstrip .inner .bottomrow .pill:hover {
    box-shadow: 0 5px 20px 1px #030b221c;
    transform: translateY(-2px);
    filter: brightness(0.97)
}

.blog .aboutstrip .inner .bottomrow .pill .mdi {
    font-size: 18px;
    color: #06CF74
}

.blog .divider4 {
    max-width: 1024px;
    margin: 0 auto;
    padding: 8px 32px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.blog .divider4 .line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, #030b221f, transparent)
}

.blog .divider4 .monosymbol {
    width: 44px;
    height: 44px;
    background: #030B22;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.blog .divider4 .monosymbol span {
    font-size: 22px;
    font-weight: 700;
    color: #06CF74;
    line-height: 1.1
}

.blog .contactband {
    background: #030B22;
    padding: 96px 32px;
    position: relative;
    overflow: hidden
}

.blog .contactband::before {
    content: "";
    position: absolute;
    bottom: -40px;
    left: -40px;
    width: 200px;
    height: 200px;
    border: 2px solid #fc0e3d1f;
    border-radius: 16px;
    transform: rotate(-18deg);
    pointer-events: none;
    animation: outlinepulse 6s ease-in-out infinite alternate
}

.blog .contactband .inner {
    max-width: 1024px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 48px
}

.blog .contactband .textside {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1
}

.blog .contactband .textside h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #fff;
    margin: 0
}

.blog .contactband .textside p {
    font-size: 18px;
    line-height: 1.55;
    color: #ffffffb8;
    margin: 0;
    text-indent: -1em;
    padding-left: 1em
}

.blog .contactband .formside {
    flex-shrink: 0;
    width: 340px
}

.blog .contactband .formside form {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.blog .contactband .formside form input,
.blog .contactband .formside form textarea {
    background: #ffffff12;
    border: 1.5px solid #ffffff26;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 16px;
    color: #fff;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    transition: border-color .22s cubic-bezier(0.34, 1.56, 0.64, 1), background .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.blog .contactband .formside form input::placeholder,
.blog .contactband .formside form textarea::placeholder {
    color: #ffffff59
}

.blog .contactband .formside form input:focus,
.blog .contactband .formside form textarea:focus {
    border-color: #06CF74;
    background: #06cf740f
}

.blog .contactband .formside form textarea {
    min-height: 96px;
    resize: vertical
}

.blog .contactband .formside form button {
    background: #06CF74;
    color: #030B22;
    font-size: 16px;
    font-weight: 700;
    border: none;
    border-radius: 6px;
    padding: 8px 32px;
    cursor: pointer;
    transition: filter .28s cubic-bezier(0.34, 1.56, 0.64, 1), transform .22s cubic-bezier(0.34, 1.56, 0.64, 1);
    align-self: flex-start
}

.blog .contactband .formside form button:hover {
    filter: brightness(1.1);
    transform: translateY(-2px)
}

.blog .contactband .formside form button:active {
    box-shadow: inset 0 2px 8px #030b222e;
    transform: translateY(0)
}

@media (max-width: 900px) {
    .blog .postsgrid .cards {
        grid-template-columns: repeat(2, 1fr)
    }

    .blog .spotlightband .inner {
        grid-template-columns: 1fr
    }

    .blog .spotlightband .imageside {
        display: none
    }

    .blog .metricsrow .statsgrid {
        grid-template-columns: repeat(2, 1fr)
    }

    .blog .metricsrow .description {
        grid-template-columns: 1fr
    }

    .blog .aboutstrip .inner .toprow {
        flex-direction: column
    }

    .blog .aboutstrip .inner .toprow .sideblock {
        width: 100%;
        box-sizing: border-box
    }

    .blog .contactband .inner {
        flex-direction: column
    }

    .blog .contactband .formside {
        width: 100%
    }
}

@media (max-width: 600px) {
    .blog .postsgrid .cards {
        grid-template-columns: 1fr
    }

    .blog .metricsrow .statsgrid {
        grid-template-columns: 1fr
    }

    .blog .postsgrid,
    .blog .metricsrow,
    .blog .aboutstrip,
    .blog .spotlightband,
    .blog .contactband {
        padding: 48px 16px
    }
}

.blog .reveal {
    opacity: 0;
    transform: translateY(32px);
    animation: risein .35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards
}

.blog .reveal.d1 {
    animation-delay: .08s
}

.blog .reveal.d2 {
    animation-delay: .16s
}

.blog .reveal.d3 {
    animation-delay: .24s
}

.blog .reveal.d4 {
    animation-delay: .32s
}

.blog .reveal.d5 {
    animation-delay: .4s
}

@keyframes risein {
    from {
        opacity: 0;
        transform: translateY(32px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.aboutauthor {
    max-width: 100%;
    overflow-x: hidden
}

.aboutauthor .pageframe {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 32px;
    padding-right: 32px
}

.aboutauthor .slidein {
    opacity: 0;
    transform: translateX(-48px);
    animation: slideFromLeft .32s cubic-bezier(0.34, 1.56, 0.64, 1) forwards
}

.aboutauthor .slidein.delay1 {
    animation-delay: .08s
}

.aboutauthor .slidein.delay2 {
    animation-delay: .18s
}

.aboutauthor .slidein.delay3 {
    animation-delay: .28s
}

.aboutauthor .slidein.delay4 {
    animation-delay: .38s
}

.aboutauthor .slidein.delay5 {
    animation-delay: .48s
}

@keyframes slideFromLeft {
    to {
        opacity: 1;
        transform: translateX(0)
    }
}

.aboutauthor .accentline {
    display: block;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, #06CF74 0%, #030B22 60%, transparent 100%);
    margin-bottom: 32px
}

.aboutauthor .strokegroup {
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: absolute
}

.aboutauthor .strokegroup span {
    display: block;
    height: 2px;
    background: #06CF74;
    border-radius: 44px
}

.aboutauthor .headingaccent {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 16px
}

.aboutauthor .headingaccent .vline {
    width: 3px;
    border-radius: 44px;
    background: linear-gradient(to bottom, #06CF74 50%, #030B22 50%);
    flex-shrink: 0
}

.aboutauthor .panimage {
    animation: panLeftRight 18s linear infinite alternate
}

@keyframes panLeftRight {
    from {
        object-position: left center
    }

    to {
        object-position: right center
    }
}

.aboutauthor .imgscale {
    overflow: hidden;
    border-radius: 16px
}

.aboutauthor .imgscale img {
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1);
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.aboutauthor .imgscale:hover img {
    transform: scale(1.05)
}

.aboutauthor .opener {
    position: relative;
    padding-top: 96px;
    padding-bottom: 48px;
    background: #fff
}

.aboutauthor .opener .strokegroup {
    top: 32px;
    right: 32px
}

.aboutauthor .opener .strokegroup span:nth-child(1) {
    width: 48px
}

.aboutauthor .opener .strokegroup span:nth-child(2) {
    width: 32px
}

.aboutauthor .opener .strokegroup span:nth-child(3) {
    width: 40px
}

.aboutauthor .opener .strokegroup span:nth-child(4) {
    width: 24px
}

.aboutauthor .openerinner {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 48px;
    align-items: start
}

.aboutauthor .openertext {
    padding-right: 16px
}

.aboutauthor .openertext .eyebrow {
    font-size: 16px;
    color: #06CF74;
    letter-spacing: 0;
    margin-bottom: 16px;
    display: block;
    font-weight: 600
}

.aboutauthor .openertext h1 {
    font-size: 56px;
    line-height: 1.1;
    color: #030B22;
    margin: 0 0 32px
}

.aboutauthor .openertext .thesis {
    font-size: 18px;
    line-height: 1.55;
    color: #030B22;
    margin: 0 0 16px
}

.aboutauthor .openertext .thesis.short {
    font-size: 22px;
    line-height: 1.35;
    margin-bottom: 32px;
    color: #030B22
}

.aboutauthor .openerimgcol {
    position: relative
}

.aboutauthor .openerimgwrap {
    width: 100%;
    aspect-ratio: 2/3;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 20px 1px #030b221c;
    position: relative
}

.aboutauthor .openerimgwrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block;
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.aboutauthor .openerimgwrap:hover img {
    transform: scale(1.04)
}

.aboutauthor .graintexture {
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
    pointer-events: none;
    border-radius: 16px
}

.aboutauthor .decorband {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(to right, #06CF74, #030B22, #FC0E3D);
    border-radius: 0 0 16px 16px
}

.aboutauthor .storyblock {
    background: #f4f7f4;
    padding-top: 96px;
    padding-bottom: 96px;
    position: relative
}

.aboutauthor .storyblock .accentline {
    margin-bottom: 48px
}

.aboutauthor .storylayout {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 48px;
    align-items: start
}

.aboutauthor .storysidebar {
    display: flex;
    flex-direction: column;
    gap: 32px
}

.aboutauthor .portraitthumb {
    width: 100%;
    aspect-ratio: 2/3;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 3px 6px 1px #06cf740d
}

.aboutauthor .portraitthumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block;
    transition: transform .25s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.aboutauthor .portraitthumb:hover img {
    transform: scale(1.05)
}

.aboutauthor .metriclist {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.aboutauthor .metricitem {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.aboutauthor .metriclabel {
    font-size: 16px;
    color: #030B22;
    opacity: .65;
    line-height: 1.35
}

.aboutauthor .metricvalue {
    font-size: 22px;
    color: #030B22;
    font-weight: 700;
    line-height: 1.1
}

.aboutauthor .metricbar {
    height: 4px;
    background: #e8ede8;
    border-radius: 44px;
    overflow: hidden;
    margin-top: 4px
}

.aboutauthor .metricfill {
    height: 100%;
    border-radius: 44px;
    background: linear-gradient(to right, #06CF74, #030B22);
    transition: width .35s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.aboutauthor .storybody {
    display: flex;
    flex-direction: column;
    gap: 32px
}

.aboutauthor .storybody h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.aboutauthor .storybody p {
    font-size: 18px;
    line-height: 1.8;
    color: #030B22;
    margin: 0;
    text-indent: -1.2em;
    padding-left: 1.2em
}

.aboutauthor .storybody p+p {
    margin-top: 0
}

.aboutauthor .thinline {
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, #06CF74 0%, transparent 100%)
}

.aboutauthor .approachblock {
    background: #fff;
    padding-top: 48px;
    padding-bottom: 96px;
    position: relative
}

.aboutauthor .approachgrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-top: 48px
}

.aboutauthor .approachgrid .imagecol {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.aboutauthor .approachgrid .imagecol .imgscale {
    height: 220px
}

.aboutauthor .approachgrid .imagecol .imgscale.tall {
    height: 280px
}

.aboutauthor .approachtext {
    display: flex;
    flex-direction: column;
    gap: 32px;
    justify-content: center
}

.aboutauthor .approachtext h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.aboutauthor .approachtext p {
    font-size: 18px;
    line-height: 1.55;
    color: #030B22;
    margin: 0
}

.aboutauthor .tagrow {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px
}

.aboutauthor .tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 16px;
    border-radius: 6px;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 500;
    border: 1.5px solid #030B22;
    color: #030B22;
    background: transparent;
    transition: background .22s cubic-bezier(0.34, 1.56, 0.64, 1), color .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.aboutauthor .tag:hover {
    background: #030B22;
    color: #fff
}

.aboutauthor .tag.accent {
    border-color: #06CF74;
    color: #06CF74
}

.aboutauthor .tag.accent:hover {
    background: #06CF74;
    color: #030B22
}

.aboutauthor .badgerow {
    display: flex;
    flex-direction: row;
    gap: 8px;
    flex-wrap: wrap
}

.aboutauthor .badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 16px;
    background: #030B22;
    color: #fff;
    font-weight: 600
}

.aboutauthor .badge.green {
    background: #06CF74;
    color: #030B22
}

.aboutauthor .badge.red {
    background: #FC0E3D;
    color: #fff
}

.aboutauthor .statcounter {
    display: flex;
    flex-direction: row;
    gap: 32px;
    flex-wrap: wrap
}

.aboutauthor .statitem {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.aboutauthor .statnum {
    font-size: 40px;
    line-height: 1.1;
    font-weight: 800;
    color: #030B22
}

.aboutauthor .statnum .pct {
    font-size: 28px;
    color: #06CF74
}

.aboutauthor .statlabel {
    font-size: 16px;
    color: #030B22;
    opacity: .6;
    line-height: 1.35
}

.aboutauthor .connectblock {
    background: #030B22;
    padding-top: 96px;
    padding-bottom: 96px;
    position: relative;
    overflow: hidden
}

.aboutauthor .connectblock .strokegroup {
    bottom: 32px;
    left: 32px;
    top: auto;
    right: auto
}

.aboutauthor .connectblock .strokegroup span {
    background: #06cf744d
}

.aboutauthor .connectblock .strokegroup span:nth-child(1) {
    width: 56px
}

.aboutauthor .connectblock .strokegroup span:nth-child(2) {
    width: 36px
}

.aboutauthor .connectblock .strokegroup span:nth-child(3) {
    width: 44px
}

.aboutauthor .connectblock .strokegroup span:nth-child(4) {
    width: 28px
}

.aboutauthor .connectlayout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 96px;
    align-items: center
}

.aboutauthor .connecttext h2 {
    font-size: 40px;
    line-height: 1.1;
    color: #fff;
    margin: 0 0 32px
}

.aboutauthor .connecttext p {
    font-size: 18px;
    line-height: 1.8;
    color: #ffffffc7;
    margin: 0 0 32px
}

.aboutauthor .connecttext .emaillink {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    color: #06CF74;
    text-decoration: none;
    border-bottom: 1.5px solid #06cf7466;
    padding-bottom: 4px;
    transition: border-color .22s cubic-bezier(0.34, 1.56, 0.64, 1), color .22s cubic-bezier(0.68, -0.55, 0.27, 1.55)
}

.aboutauthor .connecttext .emaillink:hover {
    color: #fff;
    border-color: #fff;
    filter: brightness(1.12)
}

.aboutauthor .connectimgcol {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.aboutauthor .connectimgwrap {
    width: 100%;
    height: 300px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 52px 1px #06cf741a
}

.aboutauthor .connectimgwrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.aboutauthor .connectimgwrap:hover img {
    transform: scale(1.05)
}

.aboutauthor .connectquote {
    background: #ffffff0f;
    border-radius: 16px;
    padding: 16px;
    border-left: 3px solid #06CF74;
    border-top: 1px solid #ffffff1a
}

.aboutauthor .connectquote p {
    font-size: 16px;
    line-height: 1.55;
    color: #ffffffb3;
    margin: 0;
    font-style: italic
}

.aboutauthor .connectquote .quoteauthor {
    font-size: 16px;
    color: #06CF74;
    margin-top: 8px;
    display: block;
    font-style: normal;
    font-weight: 600
}

@media (max-width: 768px) {
    .aboutauthor .openerinner {
        grid-template-columns: 1fr
    }

    .aboutauthor .openerimgcol {
        order: -1;
        max-width: 280px
    }

    .aboutauthor .openertext h1 {
        font-size: 40px
    }

    .aboutauthor .storylayout {
        grid-template-columns: 1fr
    }

    .aboutauthor .storysidebar {
        flex-direction: row;
        flex-wrap: wrap
    }

    .aboutauthor .portraitthumb {
        width: 140px;
        flex-shrink: 0
    }

    .aboutauthor .approachgrid {
        grid-template-columns: 1fr
    }

    .aboutauthor .connectlayout {
        grid-template-columns: 1fr;
        gap: 48px
    }

    .aboutauthor .connecttext h2 {
        font-size: 28px
    }

    .aboutauthor .pageframe {
        padding-left: 16px;
        padding-right: 16px
    }
}

.base {
    max-width: 100%;
    overflow-x: hidden
}

.base .pagebound {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 32px;
    padding-right: 32px
}

.base .titlesection {
    position: relative;
    background: #030B22
}

.base .stripimage {
    width: 100%;
    height: 220px;
    overflow: hidden;
    position: relative
}

.base .stripimage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block
}

.base .stripimage::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, #030B22 0%, transparent 60%);
    pointer-events: none
}

.base .textzone {
    padding: 48px 32px 96px;
    max-width: 1024px;
    margin: 0 auto;
    position: relative
}

.base .shapelayer {
    position: absolute;
    top: -48px;
    right: 48px;
    width: 180px;
    height: 180px;
    border: 2px solid #06cf741f;
    border-radius: 6px;
    transform: rotate(18deg);
    pointer-events: none
}

.base .shapelayertwo {
    position: absolute;
    bottom: 32px;
    right: 16px;
    width: 90px;
    height: 90px;
    background: #fc0e3d0f;
    border-radius: 6px;
    transform: rotate(-12deg);
    pointer-events: none
}

.base .sitelabel {
    display: inline-block;
    font-size: 16px;
    color: #06CF74;
    letter-spacing: 0;
    margin-bottom: 16px;
    line-height: 1.35
}

.base .maintitle {
    font-size: 56px;
    line-height: 1.1;
    color: #fff;
    margin: 0 0 32px;
    max-width: 680px
}

.base .maintitle span {
    display: block;
    background: linear-gradient(180deg, #fff 50%, #06CF74 50%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.base .titledesc {
    font-size: 18px;
    line-height: 1.55;
    color: #ffffffb8;
    max-width: 520px;
    margin: 0 0 32px
}

.base .titleactions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-wrap: wrap
}

.base .btnprimary {
    display: inline-block;
    padding: 16px 32px;
    background: #06CF74;
    color: #030B22;
    font-size: 16px;
    line-height: 1.35;
    border-radius: 44px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: brightness .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 5px 20px 1px #06cf741c
}

.base .btnprimary:hover {
    filter: brightness(0.88)
}

.base .btnsecondary {
    display: inline-block;
    padding: 16px 32px;
    background: transparent;
    color: #fff;
    font-size: 16px;
    line-height: 1.35;
    border-radius: 44px;
    text-decoration: none;
    border: 1px solid #ffffff47;
    cursor: pointer;
    transition: border-color .22s cubic-bezier(0.34, 1.56, 0.64, 1), color .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.base .btnsecondary:hover {
    border-color: #06CF74;
    color: #06CF74
}

.base .dividersvg {
    display: block;
    width: 100%;
    background: #030B22;
    line-height: 0
}

.base .dividersvg svg {
    display: block;
    width: 100%
}

.base .numberssection {
    background: #f5f5f0;
    padding: 64px 0 48px;
    position: relative
}

.base .numbersinner {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 32px
}

.base .numblock {
    text-align: center;
    padding: 32px 16px;
    background: #fff;
    border-radius: 16px;
    border-top: 3px solid #06CF74;
    box-shadow: 0 3px 6px 1px #030b220d;
    transition: box-shadow .28s cubic-bezier(0.34, 1.56, 0.64, 1), transform .28s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.base .numblock:hover {
    box-shadow: 0 12px 52px 1px #030b221a;
    transform: translateY(-4px)
}

.base .numblock:nth-child(3) {
    border-top-color: #FC0E3D
}

.base .numblock:nth-child(4) {
    border-top-color: #030B22
}

.base .numvalue {
    font-size: 56px;
    line-height: 1.1;
    color: #030B22;
    display: block;
    margin-bottom: 8px
}

.base .numlabel {
    font-size: 16px;
    line-height: 1.55;
    color: #444c60
}

.base .dividerflat {
    height: 4px;
    background: linear-gradient(90deg, #06CF74 0%, #030B22 50%, #FC0E3D 100%)
}

.base .postsection {
    background: #fff;
    padding: 96px 0 64px;
    position: relative
}

.base .postsection::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url(./visual_archive/thumb-12.jpg);
    background-size: cover;
    background-position: center;
    opacity: .03;
    pointer-events: none
}

.base .sectiontop {
    max-width: 1024px;
    margin: 0 auto 48px;
    padding: 0 32px;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px
}

.base .sectionheadingwrap {
    position: relative;
    padding-left: 16px
}

.base .sectionheadingwrap::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    bottom: 4px;
    width: 3px;
    background: #06CF74;
    border-radius: 6px
}

.base .sectiontag {
    font-size: 16px;
    color: #06CF74;
    line-height: 1.35;
    display: block;
    margin-bottom: 8px
}

.base .sectionheading {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0
}

.base .sectionlink {
    font-size: 16px;
    color: #030B22;
    text-decoration: none;
    border-bottom: 1px solid #06CF74;
    padding-bottom: 4px;
    white-space: nowrap;
    transition: color .22s cubic-bezier(0.68, -0.55, 0.27, 1.55)
}

.base .sectionlink:hover {
    color: #06CF74
}

.base .postcard {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px
}

.base .postcardinner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
    background: #fff;
    border-radius: 16px;
    border-left: 4px solid #06CF74;
    border-right: 1px solid #030b2214;
    border-top: 1px solid #030b2214;
    border-bottom: 1px solid #030b2214;
    box-shadow: 0 5px 20px 1px #030b221c;
    overflow: hidden
}

.base .postimgwrap {
    overflow: hidden;
    height: 360px
}

.base .postimgwrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .32s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.base .postcardinner:hover .postimgwrap img {
    transform: scale(1.04)
}

.base .posttext {
    padding: 48px 32px 48px 0;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.base .posttag {
    display: inline-block;
    font-size: 16px;
    color: #FC0E3D;
    background: #fc0e3d12;
    padding: 4px 16px;
    border-radius: 44px;
    line-height: 1.55
}

.base .postcategorytag {
    display: inline-block;
    font-size: 16px;
    color: #030B22;
    background: #030b220f;
    padding: 4px 16px;
    border-radius: 44px;
    line-height: 1.55;
    margin-left: 8px
}

.base .posttitle {
    font-size: 28px;
    line-height: 1.35;
    color: #030B22;
    margin: 0
}

.base .postsubtitle {
    font-size: 18px;
    line-height: 1.55;
    color: #444c60;
    margin: 0
}

.base .postdesc {
    font-size: 16px;
    line-height: 1.8;
    color: #555e74;
    margin: 0
}

.base .readlink {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: #030B22;
    text-decoration: none;
    font-weight: 600;
    margin-top: 8px;
    transition: color .22s cubic-bezier(0.34, 1.56, 0.64, 1), gap .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.base .readlink:hover {
    color: #06CF74;
    gap: 16px
}

.base .readlink .mdi {
    font-size: 18px
}

.base .divideraccent {
    height: 2px;
    background: #030b2214;
    max-width: 1024px;
    margin: 0 auto
}

.base .seriessection {
    background: #030B22;
    padding: 96px 0;
    position: relative;
    overflow: hidden
}

.base .seriessection .cornertri {
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-top: 80px solid #06cf741a;
    border-left: 80px solid transparent;
    pointer-events: none
}

.base .seriessection .cornertribottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0;
    border-bottom: 60px solid #fc0e3d14;
    border-right: 60px solid transparent;
    pointer-events: none
}

.base .seriesinner {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: 96px;
    align-items: start
}

.base .seriesleft .sectionheadingwrap::before {
    background: #FC0E3D
}

.base .seriesleft .sectiontag {
    color: #FC0E3D
}

.base .seriesleft .sectionheading {
    color: #fff;
    font-size: 40px
}

.base .seriesdesc {
    font-size: 18px;
    line-height: 1.55;
    color: #ffffffa6;
    margin: 24px 0 0
}

.base .serieslist {
    display: flex;
    flex-direction: column;
    gap: 16px;
    list-style: none;
    padding: 0;
    margin: 0
}

.base .seriesitem {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
    background: #ffffff0a;
    border-radius: 16px;
    padding: 24px;
    border: 1px solid #ffffff12;
    transition: background .25s cubic-bezier(0.34, 1.56, 0.64, 1), border-color .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    cursor: default
}

.base .seriesitem:hover {
    background: #06cf7412;
    border-color: #06cf7440
}

.base .seriesicon {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: #06cf7426;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.base .seriesicon .mdi {
    font-size: 22px;
    color: #06CF74
}

.base .seriestext {
    flex: 1
}

.base .seriesname {
    font-size: 18px;
    line-height: 1.35;
    color: #fff;
    margin: 0 0 8px
}

.base .seriesmeta {
    font-size: 16px;
    line-height: 1.55;
    color: #ffffff80
}

.base .dividersvglight {
    display: block;
    width: 100%;
    background: #fff;
    line-height: 0
}

.base .dividersvglight svg {
    display: block;
    width: 100%
}

.base .subscribesection {
    background: #fff;
    padding: 96px 0;
    position: relative
}

.base .subscribeinner {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 96px;
    align-items: center
}

.base .subvisual {
    position: relative
}

.base .subimgwrap {
    width: 100%;
    aspect-ratio: 7/9;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 12px 52px 1px #030b221a
}

.base .subimgwrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block
}

.base .subaccent {
    position: absolute;
    bottom: -16px;
    right: -16px;
    width: 80px;
    height: 80px;
    background: #06CF74;
    border-radius: 6px;
    z-index: 0;
    pointer-events: none
}

.base .subimgwrap {
    position: relative;
    z-index: 1
}

.base .subtextside {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.base .subtextside .sectionheadingwrap::before {
    background: #FC0E3D
}

.base .subtextside .sectiontag {
    color: #FC0E3D
}

.base .subdesc {
    font-size: 18px;
    line-height: 1.55;
    color: #444c60;
    margin: 0
}

.base .subpoints {
    display: flex;
    flex-direction: column;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0
}

.base .subpoint {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    line-height: 1.55;
    color: #030B22
}

.base .subpoint .mdi {
    color: #06CF74;
    font-size: 18px;
    flex-shrink: 0
}

.base .subform {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.base .subinput {
    width: 100%;
    padding: 16px;
    font-size: 16px;
    line-height: 1.55;
    color: #030B22;
    background: #f5f5f0;
    border: 1px solid #030b221f;
    border-radius: 6px;
    outline: none;
    box-sizing: border-box;
    transition: border-color .22s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .22s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.base .subinput::placeholder {
    color: #030b2261
}

.base .subinput:focus {
    border-color: #06CF74;
    box-shadow: 0 3px 6px 1px #06cf740d
}

.base .subbutton {
    padding: 16px 32px;
    background: #030B22;
    color: #fff;
    font-size: 16px;
    line-height: 1.35;
    border-radius: 44px;
    border: none;
    cursor: pointer;
    transition: background .25s cubic-bezier(0.34, 1.56, 0.64, 1), filter .25s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 5px 20px 1px #030b221c
}

.base .subbutton:hover {
    filter: brightness(1.18)
}

.base .subbutton:active {
    box-shadow: inset 0 2px 6px #030b222e
}

.base .subnotice {
    font-size: 16px;
    line-height: 1.55;
    color: #030b2273;
    margin: 0
}

.base .underlinedraw {
    display: inline-block;
    position: relative
}

.base .underlinedraw::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    height: 3px;
    width: 100%;
    background: #06CF74;
    border-radius: 6px;
    transform-origin: left center;
    animation: drawline .8s cubic-bezier(0.34, 1.56, 0.64, 1) .3s both
}

@keyframes drawline {
    from {
        transform: scaleX(0)
    }

    to {
        transform: scaleX(1)
    }
}

@media (max-width: 768px) {
    .base .maintitle {
        font-size: 40px
    }

    .base .numbersinner {
        grid-template-columns: 1fr 1fr
    }

    .base .postcardinner {
        grid-template-columns: 1fr
    }

    .base .postimgwrap {
        height: 240px
    }

    .base .posttext {
        padding: 32px
    }

    .base .seriesinner {
        grid-template-columns: 1fr;
        gap: 48px
    }

    .base .subscribeinner {
        grid-template-columns: 1fr;
        gap: 48px
    }

    .base .subvisual {
        display: none
    }

    .base .sectiontop {
        flex-direction: column;
        align-items: flex-start
    }

    .base .textzone {
        padding: 32px 24px 64px
    }

    .base .shapelayer {
        display: none
    }
}

@media (max-width: 480px) {
    .base .numbersinner {
        grid-template-columns: 1fr
    }

    .base .titleactions {
        flex-direction: column
    }
}

.successPage {
    min-height: 60vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 96px 16px;
    background: #fff
}

.successPage .successWrapper {
    max-width: 1024px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px
}

.successPage .successIcon {
    width: 72px;
    height: 72px;
    border-radius: 44px;
    background: linear-gradient(180deg, #030B22 50%, #06CF74 50%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 20px 1px #06cf741c;
    flex-shrink: 0
}

.successPage .successIcon svg {
    width: 36px;
    height: 36px
}

.successPage .successCard {
    background: #fff;
    border-radius: 16px;
    border: 1px solid #030b2214;
    border-left: 4px solid #06CF74;
    box-shadow: 0 5px 20px 1px #030b221c;
    padding: 48px;
    max-width: 560px;
    width: 100%;
    text-align: center
}

.successPage .successCard .successHeading {
    font-size: 40px;
    line-height: 1.1;
    color: #030B22;
    margin: 0 0 16px
}

.successPage .successCard .successSubtext {
    font-size: 18px;
    line-height: 1.55;
    color: #030B22;
    opacity: .72;
    margin: 0 0 32px
}

.successPage .successCard .successDetail {
    font-size: 16px;
    line-height: 1.55;
    color: #030B22;
    opacity: .55;
    margin: 0 0 48px;
    padding: 16px;
    background: #06cf740f;
    border-radius: 6px
}

.successPage .successCard .successDetail span {
    color: #030B22;
    opacity: 1;
    font-size: 16px
}

.successPage .successActions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center
}

.successPage .successActions .buttonPrimary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 32px;
    background: #030B22;
    color: #fff;
    font-size: 16px;
    line-height: 1.35;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: brightness .25s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .22s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 3px 6px 1px #030b220d
}

.successPage .successActions .buttonPrimary:hover {
    filter: brightness(1.18);
    box-shadow: 0 5px 20px 1px #030b221c
}

.successPage .successActions .buttonPrimary:active {
    filter: brightness(0.9);
    box-shadow: inset 0 2px 6px 1px #030b222e
}

.successPage .successActions .buttonSecondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 32px;
    background: transparent;
    color: #030B22;
    font-size: 16px;
    line-height: 1.35;
    border: 1.5px solid #030b2238;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: border-color .28s cubic-bezier(0.68, -0.55, 0.27, 1.55), background .28s cubic-bezier(0.68, -0.55, 0.27, 1.55)
}

.successPage .successActions .buttonSecondary:hover {
    filter: brightness(0.92);
    border-color: #06CF74;
    background: #06cf740f
}

.successPage .successActions .buttonSecondary:active {
    box-shadow: inset 0 2px 6px 1px #06cf7424
}

.successPage .successDivider {
    width: 48px;
    height: 3px;
    background: linear-gradient(90deg, #06CF74, #030B22);
    border-radius: 6px;
    margin: 0 auto
}

@media (max-width: 600px) {
    .successPage {
        padding: 48px 16px
    }

    .successPage .successCard {
        padding: 32px 16px
    }

    .successPage .successCard .successHeading {
        font-size: 28px
    }

    .successPage .successActions {
        flex-direction: column;
        align-items: stretch
    }

    .successPage .successActions .buttonPrimary,
    .successPage .successActions .buttonSecondary {
        justify-content: center
    }
}