/* ================================================
   VERBO EDUCA - CHAVES  |  Global Styles
   ================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    --bg: #070508;
    --bg-2: #0D0A12;
    --text-primary: #EFEDE8;
    --text-sec: #908B84;
    --text-muted: #3A3430;
    --bronze-100: #FFF0DA;
    --bronze-300: #F2A36F;
    --bronze-text: #F2A36F;
    --bronze-500: #C88828;
    --bronze-700: #8A5C14;
    --bronze-900: #2E1A04;
    --plat-100: #E4EDF4;
    --plat-300: #AABFCF;
    --plat-500: #6C8899;
    --plat-700: #38505F;
    --plat-900: #0E1820;
    --gold-100: #F8DFA8;
    --gold-300: #D8A94A;
    --gold-text: #F5D390;
    --gold-500: #A87520;
    --gold-700: #4A2D09;
    --gold-900: #120A02;
    --card-bg: rgba(12,12,12,0.58);
    --card-border: rgba(245,211,144,0.14);
    --max-w: 1100px;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Montserrat', sans-serif;
    background: var(--bg);
    color: var(--text-primary);
    overflow-x: hidden;
    line-height: 1.65;
}

body.course-modal-open {
    overflow: hidden;
}

h1, h2, h3 {
    font-family: 'Montserrat', sans-serif;
    line-height: 1.2;
    font-weight: 500;
}

h1 {
    font-size: clamp(1.8rem, 3.5vw, 2.8rem);
}

h2 {
    font-size: clamp(1.5rem, 2.8vw, 2.2rem);
}

h3 {
    font-size: clamp(1rem, 1.8vw, 1.2rem);
}

a {
    text-decoration: none;
    color: inherit;
}

.container {
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 0 24px;
}

/* BUTTONS */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    min-width: 270px;
    padding: 13px 28px;
    border-radius: 999px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 0.78rem;
    letter-spacing: 0;
    text-transform: uppercase;
    cursor: pointer;
    border: none;
    transition: all .3s ease;
}

.btn-gold {
    background: linear-gradient(135deg, #ffd384 16%, #fde4b7 49%, #ffd384 85%);
    color: #0A0600;
    box-shadow: inset 0 0 18px rgba(255,255,255,.95), 0 0 0 4px rgba(255,255,255,.24), 0 0 0 7px rgba(34,35,42,.86), 0 18px 36px rgba(200,136,40,.18);
    border: 1px solid rgba(255,255,255,.35);
}

    .btn-gold:hover,
    .btn-gold:active,
    .btn-gold:focus,
    .btn-gold:visited {
        color: #0A0600;
    }

    .btn-gold:hover {
        transform: translateY(-2px);
        box-shadow: inset 0 0 18px rgba(255,255,255,.9), 0 0 0 4px rgba(255,255,255,.2), 0 0 0 7px rgba(34,35,42,.86), 0 8px 32px rgba(200,136,40,.5);
    }

    .btn-gold:focus-visible {
        outline: 2px solid rgba(255,236,196,.95);
        outline-offset: 8px;
    }

.btn-ghost {
    background: #333844;
    border: 1px solid rgba(255,255,255,.16);
    color: #E9ECEF;
    box-shadow: inset 0 0 16px rgba(255,255,255,.08), 0 0 0 4px rgba(255,255,255,.08), 0 0 0 7px rgba(34,35,42,.86);
}

    .btn-ghost:hover {
        border-color: var(--gold-300);
        background: rgba(238,192,84,.07);
    }

/* BREADCRUMB */
.breadcrumb {
    font-size: 0.72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(245,211,144,0.52);
    margin-bottom: 16px;
    font-family: 'Montserrat', sans-serif;
}

    .breadcrumb span {
        color: rgba(245,211,144,0.52);
    }

/* BADGE */
.badge {
    display: inline-block;
    padding: 6px 18px;
    border-radius: 100px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 0.72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
}

.badge-bronze {
    background: linear-gradient(120deg,#9B5A30,#F2A36F 45%,#9B5A30);
    color: #160904;
}

.badge-platinum {
    background: linear-gradient(120deg,#6C8899,#AABFCF 45%,#6C8899);
    color: #08121A;
}

.badge-gold {
    background: linear-gradient(120deg,#4A2D09,#D8A94A 45%,#4A2D09);
    color: #fff0c8;
    border: 1px solid rgba(216,169,74,.5);
}

/* GOLD TEXT GRADIENT */
.text-gold-grad {
    background: linear-gradient(90deg, #f5d390, #ffecc7 50%, #f7d391);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: inline;
}

.hero-headline strong {
    font-weight: 800;
}

/* ================================================
   MARQUEE
   ================================================ */
.marquee-strip {
    position: relative;
    overflow: hidden;
    padding: 13px 0;
    background: #120C04;
    border-top: 1px solid rgba(200,136,42,.18);
    border-bottom: 1px solid rgba(200,136,42,.18);
    white-space: nowrap;
    user-select: none;
}

.marquee-track {
    display: inline-flex;
    animation: scroll-left 30s linear infinite;
}

    .marquee-track:hover {
        animation-play-state: paused;
    }

.marquee-item {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.58rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gold-300);
    padding: 0 48px;
    display: inline-flex;
    align-items: center;
    gap: 40px;
}

    .marquee-item::after {
        content: '...';
        color: var(--gold-700);
        font-size: .6rem;
    }

@keyframes scroll-left {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-50%)
    }
}

/* ================================================
   HERO - index.html
   ================================================ */
.hero {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: #070508;
}

.hero-bg-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 82%;
    object-fit: cover;
    object-position: center 34%;
    width: 100%;
    pointer-events: none;
}

.hero-deco {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 92%;
    background: linear-gradient(to bottom, rgba(7,5,8,0) 0%, rgba(7,5,8,.1) 38%, rgba(7,5,8,.72) 70%, rgba(7,5,8,1) 100%);
    pointer-events: none;
}

.hero-particles {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: radial-gradient(1.5px 1.5px at 10% 20%,rgba(238,192,84,.18) 0%,transparent 100%), radial-gradient(1px 1px at 30% 60%,rgba(238,192,84,.1) 0%,transparent 100%), radial-gradient(1.5px 1.5px at 55% 10%,rgba(238,192,84,.15) 0%,transparent 100%), radial-gradient(1px 1px at 75% 75%,rgba(238,192,84,.08) 0%,transparent 100%), radial-gradient(1.5px 1.5px at 90% 35%,rgba(238,192,84,.12) 0%,transparent 100%);
}

.hero-content {
    position: relative;
    z-index: 1;
    max-width: 1080px;
    margin: 0 auto;
    width: 100%;
    padding: 0 24px 88px;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .82fr);
    gap: 78px;
    align-items: end;
}

.hero-headline {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    max-width: 575px;
    font-size: clamp(1.58rem, 2.06vw, 1.88rem);
    line-height: 1.13;
    letter-spacing: 0;
}

    .hero-headline strong {
        color: #ffe0a1;
        font-weight: 600;
        background: linear-gradient(90deg, #f5d390 0%, #ffe9bc 48%, #c99a42 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.hero-mobile-logo {
    display: none;
}

.hero-right {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
}

.hero-sub {
    color: rgba(239,237,232,.76);
    font-size: .92rem;
    line-height: 1.5;
    font-weight: 400;
    max-width: 430px;
}

    .hero-sub strong {
        color: var(--text-primary);
        font-weight: 600;
    }

.hero-cta {
    min-width: 360px;
    min-height: 40px;
    padding: 12px 34px;
    font-size: .8rem;
    font-weight: 700;
    gap: 12px;
    margin-bottom: 10px;
}

    .hero-cta iconify-icon {
        display: none;
    }

    .hero-cta::before {
        content: '';
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
        background: url('../img/key-icon-cta.png') center / contain no-repeat;
    }

/* ================================================
   D2 - Intro two-cards
   ================================================ */
.section-d2 {
    padding: 76px 24px 54px;
    position: relative;
}

.d2-header {
    max-width: 950px;
    margin: 0 auto 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(245,211,144,.15);
    padding-bottom: 16px;
    opacity: 0.45;
}

.d2-cards {
    max-width: 950px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: .92fr 1.08fr;
    gap: 28px;
}

.d2-card {
    border: 1px solid var(--card-border);
    border-radius: 18px;
    overflow: hidden;
}

.d2-text-card {
    background: var(--card-bg);
    padding: 48px 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .d2-text-card h2 {
        font-size: clamp(1.28rem,2.1vw,1.72rem);
        text-transform: uppercase;
        margin-bottom: 24px;
        line-height: 1.14;
        font-weight: 400;
    }

    .d2-text-card p {
        color: var(--text-sec);
        font-size: .9rem;
        line-height: 1.62;
        margin-bottom: 16px;
    }

        .d2-text-card p:last-child {
            margin-bottom: 0;
        }

.d2-p-amber {
    color: rgba(250,248,243,.92) !important;
    font-weight: 400;
}

.d2-p-amber span {
    color: #f5d390;
    background: linear-gradient(90deg, #ffe8ad 0%, #f5d390 48%, #fff4d2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 500;
}

.d2-image-card {
    position: relative;
    min-height: 370px;
    background: #080808;
}

    .d2-image-card img,
    .d2-image-card video {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 125%;
        object-fit: cover;
        object-position: center center;
        top: -12%;
        filter: brightness(.9);
        display: block;
    }

    .d2-image-card::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(245,211,144,.15) 0%, transparent 50%);
    }

@media (min-width: 901px) {
    .d2-header,
    .d2-cards {
        max-width: 1120px;
    }

    .d2-cards {
        grid-template-columns: .92fr 1.08fr;
        gap: 32px;
    }

    .d2-text-card {
        min-height: 440px;
        padding: 64px 42px;
    }

    .d2-text-card h2 {
        font-size: clamp(1.72rem, 2.18vw, 1.94rem);
        line-height: 1.14;
        margin-bottom: 30px;
    }

    .d2-text-card p {
        font-size: 1.08rem;
        line-height: 1.52;
        margin-bottom: 24px;
    }

    .d2-image-card {
        min-height: 440px;
    }
}

/* ================================================
   D3 - Tier key display (3 keys)
   ================================================ */
.section-tiers {
    padding: 38px 24px 84px;
}

.tiers-heading {
    max-width: 1000px;
    margin: 0 auto 28px;
    display: flex;
    justify-content: center;
    position: relative;
}

    .tiers-heading::before {
        content: '';
        position: absolute;
        left: 50%;
        top: 50%;
        width: min(560px, 78vw);
        height: 1px;
        transform: translate(-50%, -50%);
        background: linear-gradient(90deg, transparent, rgba(245,211,144,.28), transparent);
    }

    .tiers-heading h2 {
        position: relative;
        z-index: 1;
        margin: 0;
        padding: 0 28px 12px;
        background: #070508;
        color: var(--gold-text);
        font-size: clamp(1.05rem, 1.8vw, 1.45rem);
        line-height: 1.25;
        font-weight: 600;
        letter-spacing: .08em;
        text-align: center;
        text-transform: uppercase;
    }

        .tiers-heading h2::after {
            content: '';
            position: absolute;
            left: 50%;
            bottom: 0;
            width: 82px;
            height: 1px;
            transform: translateX(-50%);
            background: linear-gradient(90deg, transparent, rgba(245,211,144,.72), transparent);
        }

.tiers-keys {
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 34px;
    min-height: 360px;
    padding: 50px 28px 38px;
    border: 1px solid rgba(245,211,144,.1);
    border-radius: 20px;
    background: radial-gradient(ellipse 75% 90% at 50% 58%, rgba(238,192,84,.06) 0%, transparent 58%);
    overflow: hidden;
}

.tier-key-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    text-decoration: none;
    cursor: pointer;
    transition: transform .35s ease;
    flex: 1 1 0;
    max-width: 280px;
    min-width: 0;
    position: relative;
    z-index: 1;
}

    .tier-key-link:hover {
        transform: translateY(-10px);
    }

    .tier-key-link:nth-child(2) {
        max-width: 280px;
        transform: none;
        z-index: 1;
    }

        .tier-key-link:nth-child(2):hover {
            transform: translateY(-10px);
        }

/* KEY RENDER - orbital key visual */
.key-render {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1;
    overflow: visible;
    --key-glow-soft: rgba(245,211,144,.18);
    --key-glow-strong: rgba(245,211,144,.34);
}

    .key-render::before {
        content: '';
        position: absolute;
        inset: 10%;
        z-index: 0;
        border-radius: 999px;
        background: radial-gradient(ellipse 62% 46% at 50% 52%, var(--key-glow-strong), transparent 62%), radial-gradient(ellipse 86% 66% at 50% 54%, var(--key-glow-soft), transparent 74%);
        filter: blur(18px);
        opacity: .72;
        transform: scale(.92);
        transition: opacity .35s ease, transform .35s ease;
    }

    .key-render::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        border-radius: 999px;
        background: radial-gradient(ellipse 70% 54% at 50% 52%, transparent 54%, rgba(5,3,2,.22) 72%, rgba(5,3,2,.5) 100%);
        opacity: .28;
    }

.key-video,
.feature-video {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
    mix-blend-mode: screen;
    pointer-events: none;
    filter: saturate(1.12) contrast(1.08) brightness(1.04) drop-shadow(0 18px 28px rgba(0,0,0,.28));
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    transition: transform .35s ease, filter .35s ease, opacity .35s ease;
}

.key-page-visual .key-video {
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 37% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-benefits-visual .key-video {
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 64% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-render-bronze {
    --key-glow-soft: rgba(200,136,42,.2);
    --key-glow-strong: rgba(238,192,84,.42);
}

.key-render-gold {
    --key-glow-soft: rgba(216,169,74,.22);
    --key-glow-strong: rgba(248,223,168,.45);
}

.key-render-plat {
    --key-glow-soft: rgba(170,191,207,.18);
    --key-glow-strong: rgba(170,191,207,.38);
}

.key-render-bronze .key-video {
    transform: scale(1.08) rotate(-4deg);
}

.key-render-gold .key-video {
    transform: scale(1.48);
}

.key-render-plat .key-video {
    transform: scale(1.38) rotate(5deg);
}

.tiers-keys .key-video {
    transform: scale(1.34);
    -webkit-mask-image: radial-gradient(ellipse 46% 42% at 50% 50%, #000 0 46%, rgba(0,0,0,.78) 57%, rgba(0,0,0,.22) 66%, transparent 76%);
    mask-image: radial-gradient(ellipse 46% 42% at 50% 50%, #000 0 46%, rgba(0,0,0,.78) 57%, rgba(0,0,0,.22) 66%, transparent 76%);
}

.tiers-keys .key-render-bronze .key-video,
.tiers-keys .key-render-gold .key-video,
.tiers-keys .key-render-plat .key-video {
    transform: scale(1.28) rotate(-72deg);
}

.tiers-keys .key-render-gold .key-video {
    transform: scale(1.14) rotate(-72deg);
}

.tiers-keys .key-render-bronze .key-video {
    filter: sepia(.18) saturate(1.28) hue-rotate(-10deg) brightness(.88) contrast(1.12) drop-shadow(0 18px 28px rgba(0,0,0,.28));
}

.tiers-keys .key-render-gold .key-video {
    filter: sepia(.08) saturate(1.08) hue-rotate(6deg) brightness(1.24) contrast(1.04) drop-shadow(0 20px 34px rgba(216,169,74,.18));
}

.tiers-keys .key-render-gold {
    --key-glow-soft: rgba(248,223,168,.3);
    --key-glow-strong: rgba(255,236,184,.58);
}

.tier-key-link:hover .key-render::before {
    opacity: .98;
    transform: scale(1.04);
}

.tier-key-link:hover .key-video {
    filter: saturate(1.22) contrast(1.12) brightness(1.08) drop-shadow(0 22px 34px rgba(0,0,0,.34));
}

.key-render-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Orbital rings via CSS */
.orbital-ring {
    position: absolute;
    border-radius: 50%;
    border: 1.5px solid;
    pointer-events: none;
}

.key-render iconify-icon {
    position: relative;
    z-index: 1;
    transition: transform .4s ease, filter .4s ease;
}

.tier-key-link:hover .key-render iconify-icon {
    transform: rotate(-8deg) scale(1.08);
}

@media (min-width: 901px) {
    .section-tiers {
        padding-top: 44px;
        padding-bottom: 96px;
    }

    .tiers-keys {
        max-width: 1220px;
        min-height: 520px;
        gap: 50px;
        padding: 64px 48px 46px;
    }

    .tier-key-link,
    .tier-key-link:nth-child(2) {
        max-width: 370px;
    }

    .tiers-keys .key-render-bronze .key-video,
    .tiers-keys .key-render-plat .key-video {
        transform: scale(1.72) rotate(-72deg);
    }

    .tiers-keys .key-render-gold .key-video {
        transform: scale(1.92) rotate(-72deg);
    }

    .tier-pill {
        min-width: 112px;
        padding: 10px 22px;
    }
}

/* COURSE SELECTION MODAL */
.course-modal {
    position: fixed;
    inset: 0;
    z-index: 9990;
    display: grid;
    place-items: center;
    padding: 24px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

    .course-modal[hidden] {
        display: none;
    }

.course-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.78);
    backdrop-filter: blur(10px);
}

.course-modal-panel {
    position: relative;
    z-index: 1;
    width: min(560px, 100%);
    max-height: calc(100dvh - 48px);
    border: 1px solid rgba(245,211,144,.2);
    border-radius: 18px;
    padding: 34px;
    background: radial-gradient(ellipse 70% 70% at 88% 0%, rgba(216,169,74,.16), transparent 62%), rgba(8,7,6,.96);
    box-shadow: 0 28px 80px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.05);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.course-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: rgba(239,237,232,.82);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
}

.course-modal-panel h2 {
    margin-bottom: 12px;
    color: var(--gold-text);
    font-size: clamp(1.45rem, 3vw, 2rem);
    font-weight: 700;
}

.course-modal-copy {
    max-width: 430px;
    margin-bottom: 24px;
    color: rgba(255,255,255,.92);
    font-family: 'Montserrat', sans-serif;
    font-size: .88rem;
    font-weight: 400;
    line-height: 1.55;
}

.course-form {
    display: grid;
    gap: 12px;
    position: relative;
}

    .course-form label {
        color: rgba(239,237,232,.84);
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

.course-select-wrap {
    position: relative;
    z-index: 30;
}

.course-form input {
    width: 100%;
    min-height: 50px;
    border-radius: 12px;
    border: 1px solid rgba(245,211,144,.22);
    background: rgba(255,255,255,.045);
    color: var(--text-primary);
    padding: 0 48px 0 16px;
    font-family: 'Montserrat', sans-serif;
    font-size: .86rem;
    outline: none;
}

.course-select-arrow {
    position: absolute;
    right: 18px;
    top: 50%;
    width: 9px;
    height: 9px;
    border-right: 2px solid rgba(245,211,144,.72);
    border-bottom: 2px solid rgba(245,211,144,.72);
    pointer-events: none;
    transform: translateY(-65%) rotate(45deg);
    transition: transform .2s ease;
}

.course-select-wrap.is-open .course-select-arrow {
    transform: translateY(-35%) rotate(225deg);
}

.course-form input:focus {
    border-color: rgba(245,211,144,.58);
    box-shadow: 0 0 0 4px rgba(216,169,74,.12);
}

.course-options {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 20;
    max-height: 260px;
    overflow-y: auto;
    display: none;
    gap: 8px;
    padding: 8px;
    border: 1px solid rgba(245,211,144,.28);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(245,211,144,.08), transparent 38%), #070605;
    box-shadow: 0 20px 48px rgba(0,0,0,.72), 0 0 0 1px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.05);
    scrollbar-color: rgba(245,211,144,.42) rgba(255,255,255,.06);
    scrollbar-width: thin;
}

.course-select-wrap.is-open .course-options {
    display: grid;
}

.course-select-wrap.is-open::after {
    content: '';
    position: absolute;
    left: -4px;
    right: -4px;
    top: calc(100% + 4px);
    height: 272px;
    border-radius: 16px;
    background: #050403;
    box-shadow: 0 22px 54px rgba(0,0,0,.76);
    z-index: 19;
    pointer-events: none;
}

.course-options::-webkit-scrollbar {
    width: 8px;
}

.course-options::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05);
    border-radius: 999px;
}

.course-options::-webkit-scrollbar-thumb {
    background: rgba(245,211,144,.38);
    border-radius: 999px;
}

.course-option {
    width: 100%;
    display: grid;
    align-items: center;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid rgba(245,211,144,.08);
    border-radius: 10px;
    background: #11100e;
    color: var(--text-primary);
    font-family: 'Montserrat', sans-serif;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

    .course-option:hover,
    .course-option.is-selected {
        border-color: rgba(245,211,144,.48);
        background: radial-gradient(ellipse 90% 120% at 100% 50%, rgba(216,169,74,.2), transparent 68%), #242016;
    }

    .course-option:active {
        transform: scale(.99);
    }

    .course-option strong {
        overflow: visible;
        color: rgba(255,252,244,.94);
        font-size: .72rem;
        font-weight: 600;
        line-height: 1.35;
        text-overflow: initial;
        white-space: normal;
        overflow-wrap: anywhere;
    }

.course-option-empty {
    margin: 0;
    padding: 14px;
    color: rgba(239,237,232,.54);
    font-size: .76rem;
    text-align: center;
}

.course-form-error {
    min-height: 18px;
    margin-top: 2px;
    color: var(--bronze-300);
    font-size: .72rem;
}

.course-submit {
    width: 100%;
    margin-top: 6px;
}

/* BRONZE key */
.key-render-bronze iconify-icon {
    color: #C88828;
    font-size: 140px;
    filter: drop-shadow(0 0 30px rgba(200,136,42,.8));
}

.key-render-bronze .orbital-ring:nth-child(1) {
    width: 170px;
    height: 100px;
    border-color: rgba(200,136,42,.5);
    transform: rotateX(60deg);
}

.key-render-bronze .orbital-ring:nth-child(2) {
    width: 150px;
    height: 90px;
    border-color: rgba(238,192,84,.3);
    transform: rotateX(60deg) rotateZ(60deg);
}

/* GOLD key */
.key-render-gold iconify-icon {
    color: #D8A94A;
    font-size: 180px;
    filter: drop-shadow(0 0 40px rgba(216,169,74,.8));
}

.key-render-gold .orbital-ring:nth-child(1) {
    width: 220px;
    height: 130px;
    border-color: rgba(216,169,74,.5);
    transform: rotateX(60deg);
}

.key-render-gold .orbital-ring:nth-child(2) {
    width: 195px;
    height: 115px;
    border-color: rgba(248,223,168,.3);
    transform: rotateX(60deg) rotateZ(60deg);
}

/* PLATINUM key */
.key-render-plat iconify-icon {
    color: #AABFCF;
    font-size: 140px;
    filter: drop-shadow(0 0 30px rgba(108,136,153,.8));
}

.key-render-plat .orbital-ring:nth-child(1) {
    width: 170px;
    height: 100px;
    border-color: rgba(108,136,153,.5);
    transform: rotateX(60deg);
}

.key-render-plat .orbital-ring:nth-child(2) {
    width: 150px;
    height: 90px;
    border-color: rgba(170,191,207,.3);
    transform: rotateX(60deg) rotateZ(60deg);
}

/* Tier label pill */
.tier-pill {
    min-width: 142px;
    min-height: 38px;
    padding: 11px 24px;
    border-radius: 10px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 0.72rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    border: 1px solid;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    box-sizing: border-box;
    line-height: 1;
    text-align: center;
    text-indent: .06em;
    color: #f7f4ee;
    background: rgba(14,14,14,.82);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 34px rgba(0,0,0,.32);
}

.tier-pill-bronze {
    border-color: rgba(202,129,63,.56);
    color: #fffaf2;
    background: linear-gradient(180deg, rgba(42,30,22,.86), rgba(15,12,10,.92));
    box-shadow: inset 0 1px 0 rgba(255,226,194,.1), 0 18px 36px rgba(0,0,0,.38), 0 0 36px rgba(202,129,63,.16);
}

.tier-pill-gold {
    border-color: rgba(245,211,144,.58);
    color: #fffaf0;
    background: linear-gradient(180deg, rgba(32,28,21,.88), rgba(14,13,11,.94));
    box-shadow: inset 0 1px 0 rgba(255,242,208,.12), 0 18px 38px rgba(0,0,0,.38), 0 0 40px rgba(245,211,144,.16);
}

.tier-pill-plat {
    border-color: rgba(170,191,207,.58);
    color: #f5f9fc;
    background: linear-gradient(180deg, rgba(31,38,48,.9), rgba(11,14,19,.94));
    box-shadow: inset 0 1px 0 rgba(229,240,248,.12), 0 18px 38px rgba(0,0,0,.38), 0 0 40px rgba(170,191,207,.18);
}

.tier-mobile-actions {
    display: none;
}

/* ================================================
   D4 - Benefits table
   ================================================ */
.section-benefits {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 70px 24px 88px;
    font-family: 'Montserrat', sans-serif;
}

    .section-benefits::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        background: url('../img/hero-bg.png') center 38% / cover no-repeat;
        opacity: .07;
        filter: saturate(.85) contrast(1.05);
        pointer-events: none;
    }

    .section-benefits::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        background: radial-gradient(ellipse 78% 52% at 70% 48%, rgba(245,211,144,.08), transparent 64%), linear-gradient(180deg, rgba(7,5,8,.96), rgba(7,5,8,.82) 42%, rgba(7,5,8,.98));
        pointer-events: none;
    }

    .section-benefits > * {
        position: relative;
        z-index: 1;
    }

.benefits-header {
    max-width: 950px;
    margin: 0 auto 48px;
    display: grid;
    grid-template-columns: .88fr 1.12fr;
    gap: 82px;
    align-items: start;
}

    .benefits-header h2 {
        max-width: 430px;
        font-size: clamp(1.72rem,2.35vw,2.12rem);
        font-weight: 400;
        line-height: 1.05;
        letter-spacing: -.015em;
        color: rgba(235,235,232,.9);
    }

        .benefits-header h2 .text-gold-grad {
            font-weight: 600;
        }

    .benefits-header p {
        font-family: 'Montserrat', sans-serif;
        max-width: 560px;
        color: rgba(232,230,226,.82);
        font-size: .9rem;
        font-weight: 400;
        line-height: 1.55;
        letter-spacing: -.008em;
    }

.benefits-wrap {
    max-width: 1120px;
    margin: 0 auto;
    overflow-x: auto;
    padding: 2px 0 8px;
}

.benefits-mobile {
    display: none;
}

.benefits-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 24px 0;
    table-layout: fixed;
    min-width: 1120px;
}

    .benefits-table thead tr th {
        padding: 28px 20px 18px;
        text-align: center;
    }

        .benefits-table thead tr th:first-child {
            text-align: left !important;
            padding-left: 34px !important;
            color: var(--text-primary) !important;
            font-size: 1.25rem !important;
            font-weight: 400 !important;
            text-transform: none !important;
            letter-spacing: 0 !important;
            border: 1px solid rgba(255,255,255,.08);
            border-bottom: 0;
            border-radius: 20px 20px 0 0;
            background: rgba(6,6,6,.66);
        }

.section-benefits .col-bronze-head,
.section-benefits .col-plat-head,
.section-benefits .col-gold-head {
    font-family: 'Montserrat',sans-serif;
    font-weight: 600;
    font-size: .76rem;
    line-height: 1;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: rgba(239,237,232,.9);
    border-top: 1px solid rgba(255,255,255,.14);
    border-left: 1px solid rgba(255,255,255,.1);
    border-right: 1px solid rgba(255,255,255,.1);
    border-radius: 14px 14px 0 0;
    overflow: hidden;
    background: transparent;
}

.section-benefits .col-bronze-head {
    color: #f5b374;
    border-color: rgba(245,179,116,.38);
}

.section-benefits .col-plat-head {
    color: #bfd8ef;
    border-color: rgba(190,214,236,.42);
}

.section-benefits .col-gold-head {
    color: #ffe7a6;
    border-color: rgba(255,231,166,.42);
}

/* Column color is applied to cells so border-radius clips correctly. */
col.col-bronze,
col.col-p,
col.col-gold {
    width: 20%;
    background: transparent;
}

.benefits-table tbody td {
    padding: 12px 16px;
    text-align: center;
    border-top: 1px solid rgba(255,255,255,.11);
}

    .benefits-table tbody td:first-child {
        font-family: 'Montserrat', sans-serif;
        text-align: left;
        font-size: .82rem;
        color: rgba(239,237,232,.64);
        font-weight: 400;
        line-height: 1.32;
        padding: 12px 32px 12px 34px;
        background: linear-gradient(90deg, rgba(255,255,255,.022), transparent 58%), rgba(5,5,5,.78);
        border-top-color: rgba(255,255,255,.09);
        border-left: 1px solid rgba(255,255,255,.1);
        border-right: 1px solid rgba(255,255,255,.1);
    }

td.col-bronze, td.col-plat, td.col-gold {
    position: relative;
    padding: 13px 8px;
    border-top-color: rgba(255,255,255,.055);
    background: transparent;
}

.section-benefits .benefits-table tbody tr:nth-child(1) {
    --benefit-bg-y: 0px;
}

.section-benefits .benefits-table tbody tr:nth-child(2) {
    --benefit-bg-y: 56px;
}

.section-benefits .benefits-table tbody tr:nth-child(3) {
    --benefit-bg-y: 112px;
}

.section-benefits .benefits-table tbody tr:nth-child(4) {
    --benefit-bg-y: 168px;
}

.section-benefits .benefits-table tbody tr:nth-child(5) {
    --benefit-bg-y: 224px;
}

.section-benefits .benefits-table tbody tr:nth-child(6) {
    --benefit-bg-y: 280px;
}

.section-benefits .benefits-table tbody tr:nth-child(7) {
    --benefit-bg-y: 336px;
}

.section-benefits .benefits-table tbody tr:nth-child(8) {
    --benefit-bg-y: 392px;
}

.section-benefits .benefits-table tbody tr:nth-child(9) {
    --benefit-bg-y: 448px;
}

.section-benefits .benefits-table tbody tr:nth-child(10) {
    --benefit-bg-y: 504px;
}

.section-benefits .benefits-table tbody tr:nth-child(11) {
    --benefit-bg-y: 560px;
}

.section-benefits .benefits-table tbody tr:nth-child(12) {
    --benefit-bg-y: 616px;
}

.section-benefits .benefits-table tbody tr:nth-child(13) {
    --benefit-bg-y: 672px;
}

.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-bronze {
    background: transparent;
    border-left: 1px solid rgba(245,179,116,.32);
    border-right: 1px solid rgba(245,179,116,.32);
}

.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-plat {
    background: transparent;
    border-left: 1px solid rgba(190,214,236,.34);
    border-right: 1px solid rgba(190,214,236,.34);
}

.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-gold {
    background: transparent;
    border-left: 1px solid rgba(255,231,166,.34);
    border-right: 1px solid rgba(255,231,166,.34);
}

.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-bronze,
.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-plat,
.section-benefits .benefits-table tbody tr:nth-child(-n+13) td.col-gold {
    overflow: hidden;
    box-shadow: none;
}

.benefits-table tbody tr:nth-child(-n+13) td.col-bronze > *,
.benefits-table tbody tr:nth-child(-n+13) td.col-plat > *,
.benefits-table tbody tr:nth-child(-n+13) td.col-gold > * {
    position: relative;
    z-index: 1;
}

.benefits-table tbody tr:nth-child(n+2):nth-child(-n+13) td.col-bronze::before,
.benefits-table tbody tr:nth-child(n+2):nth-child(-n+13) td.col-plat::before,
.benefits-table tbody tr:nth-child(n+2):nth-child(-n+13) td.col-gold::before {
    display: none;
}
/* Rounded top/bottom for column cards */
.benefits-table tbody tr:first-child td:first-child,
.benefits-table tbody tr:first-child td.col-bronze,
.benefits-table tbody tr:first-child td.col-plat,
.benefits-table tbody tr:first-child td.col-gold {
    border-top: 0;
}

.benefits-table tbody tr:nth-child(13) td:first-child {
    border-radius: 0 0 20px 20px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.benefits-table tbody tr:nth-child(13) td.col-bronze {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(245,179,116,.32);
}

.benefits-table tbody tr:nth-child(13) td.col-plat {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(190,214,236,.34);
}

.benefits-table tbody tr:nth-child(13) td.col-gold {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(255,231,166,.34);
}

.benefits-table tbody tr:last-child td.col-bronze {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(245,179,116,.32);
}

.benefits-table tbody tr:last-child td.col-plat {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(190,214,236,.34);
}

.benefits-table tbody tr:last-child td.col-gold {
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(255,231,166,.34);
}

/* Check/X icons - white on gradient backgrounds */
.chk-icon,
.x-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 18px;
    height: 18px;
    min-height: 34px;
    min-width: 18px;
    box-sizing: border-box;
    padding: 0;
    font-size: 0;
    line-height: 1;
    vertical-align: middle;
    color: rgba(255,255,255,.92);
    background: transparent;
    border: 0;
    box-shadow: none;
}

    .chk-icon svg,
    .x-icon svg {
        display: none !important;
    }

    .chk-icon::before,
    .x-icon::before {
        content: '';
        display: block;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        border: 1.8px solid rgba(255,255,255,.8);
        background: rgba(255,255,255,.09);
        box-shadow: 0 0 0 4px rgba(255,255,255,.06);
    }

    .chk-icon::after {
        content: '';
        position: absolute;
        width: 6px;
        height: 9px;
        border-right: 1.8px solid rgba(255,255,255,.92);
        border-bottom: 1.8px solid rgba(255,255,255,.92);
        transform-origin: center;
        transform: rotate(42deg);
        top: 11px;
    }

    .x-icon::before {
        border-color: rgba(255,255,255,.74);
        background: linear-gradient(45deg, transparent calc(50% - 1px), rgba(255,255,255,.86) calc(50% - 1px), rgba(255,255,255,.86) calc(50% + 1px), transparent calc(50% + 1px)), linear-gradient(-45deg, transparent calc(50% - 1px), rgba(255,255,255,.86) calc(50% - 1px), rgba(255,255,255,.86) calc(50% + 1px), transparent calc(50% + 1px)), rgba(0,0,0,.18);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 9px 9px, 9px 9px, auto;
        box-shadow: 0 0 0 4px rgba(255,255,255,.045);
    }

    .x-icon::after {
        display: none;
    }

td.col-bronze .chk-icon,
td.col-plat .chk-icon,
td.col-gold .chk-icon {
    box-shadow: none;
}

/* Price rows */
.price-spacer td {
    height: 34px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.price-spacer--small td {
    height: 34px;
}

.section-benefits .price-row td {
    height: 120px;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 20px !important;
    padding: 26px 22px !important;
    text-align: center;
    vertical-align: middle;
    background: linear-gradient(135deg, rgba(22,22,22,.95), rgba(12,12,12,.98)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

    .section-benefits .price-row td:first-child {
        text-align: left;
        color: rgba(247,247,246,.94);
        font-size: 1.26rem;
        font-weight: 400;
        line-height: 1.35;
        letter-spacing: 0;
        text-transform: none;
        padding: 28px 42px !important;
    }

        .section-benefits .price-row td:first-child strong {
            color: rgba(255,255,255,.98);
            font-weight: 600;
        }

.section-benefits .price-benefits-row td {
    margin-top: 18px;
}

    .section-benefits .price-benefits-row td:first-child,
    .section-benefits .price-investment-row td:first-child {
        background: radial-gradient(ellipse 88% 120% at 100% 50%, rgba(255,255,255,.035), transparent 72%), linear-gradient(135deg, rgba(18,18,18,.97), rgba(11,11,11,.98)) !important;
    }

    .section-benefits .price-benefits-row td.col-bronze,
    .section-benefits .price-benefits-row td.col-plat,
    .section-benefits .price-benefits-row td.col-gold {
        background: linear-gradient(135deg, rgba(20,20,20,.96), rgba(10,10,10,.98)) !important;
        border-color: rgba(255,255,255,.14) !important;
    }

    .section-benefits .price-investment-row td.col-bronze {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(255,223,190,.24), transparent 64%), linear-gradient(135deg, rgba(70,49,39,.72), rgba(28,23,20,.96)) !important;
        border-color: rgba(245,179,116,.36) !important;
    }

    .section-benefits .price-investment-row td.col-plat {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(235,246,255,.32), transparent 64%), linear-gradient(135deg, rgba(55,72,92,.74), rgba(17,25,36,.96)) !important;
        border-color: rgba(190,214,236,.46) !important;
    }

    .section-benefits .price-investment-row td.col-gold {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(255,238,184,.24), transparent 64%), linear-gradient(135deg, rgba(62,56,37,.76), rgba(24,21,13,.96)) !important;
        border-color: rgba(255,231,166,.38) !important;
    }

.section-benefits .price-benefits-row .price-cell {
    font-size: 1.42rem;
}

.section-benefits .price-investment-row td {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.section-benefits .price-cell {
    font-family: 'Montserrat',sans-serif;
    font-weight: 500;
    font-size: 1.48rem;
    line-height: 1.1;
    display: block;
    color: rgba(255,255,255,.96) !important;
    letter-spacing: -.035em;
}

.section-benefits .price-note {
    font-size: .86rem;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: rgba(255,255,255,.9);
    opacity: 1;
    display: block;
    margin-bottom: 4px;
    font-weight: 400;
    white-space: nowrap;
}

.section-benefits .p-bronze {
    color: var(--bronze-300);
}

.section-benefits .p-plat {
    color: var(--plat-300);
}

.section-benefits .p-gold {
    color: var(--gold-100);
}

/* Benefits marquee under comparison */
.benefits-marquee {
    position: relative;
    max-width: 1000px;
    margin: 30px auto 0;
    overflow: hidden;
    border-top: 1px solid rgba(245,211,144,.12);
    border-bottom: 1px solid rgba(245,211,144,.08);
    padding: 14px 0;
}

    .benefits-marquee::before,
    .benefits-marquee::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        z-index: 2;
        width: 90px;
        pointer-events: none;
    }

    .benefits-marquee::before {
        left: 0;
        background: linear-gradient(90deg, rgba(7,5,8,.98), transparent);
    }

    .benefits-marquee::after {
        right: 0;
        background: linear-gradient(270deg, rgba(7,5,8,.98), transparent);
    }

.benefits-marquee-track {
    display: inline-flex;
    align-items: center;
    width: max-content;
    animation: benefitsMarquee 28s linear infinite;
    will-change: transform;
}

.benefits-marquee span {
    flex: 0 0 auto;
    padding: 0 42px;
    font-family: 'Montserrat', sans-serif;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.2;
    text-transform: uppercase;
    color: rgba(245,211,144,.76);
}

    .benefits-marquee span:nth-child(3n+1) {
        color: rgba(245,211,144,.48);
    }

@keyframes benefitsMarquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

/* Bottom callout + CTA */
.benefits-bottom {
    max-width: 1000px;
    margin: 82px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 44px;
    flex-wrap: wrap;
    padding-top: 50px;
    border-top: 1px solid rgba(245,211,144,.16);
}

.benefits-callout-text {
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: 'Montserrat', sans-serif;
    color: rgba(238,238,236,.84);
    font-size: .84rem;
    font-weight: 400;
    line-height: 1.35;
    max-width: 610px;
}

    .benefits-callout-copy {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .benefits-callout-text iconify-icon {
        font-size: 1.3rem;
        color: var(--gold-300);
        flex-shrink: 0;
    }

    .benefits-callout-text strong {
        color: rgba(255,244,218,.96);
        font-weight: 700;
    }

    .benefits-callout-text .benefits-disclaimer {
        color: rgba(238,238,236,.62);
        font-size: .68rem;
        line-height: 1.42;
        font-weight: 400;
    }

.benefits-cta {
    min-width: 392px;
    min-height: 58px;
    padding: 16px 38px;
    gap: 14px;
    font-size: .86rem;
    font-weight: 800;
    letter-spacing: .01em;
}

    .benefits-cta img {
        width: 20px;
        height: 20px;
        object-fit: contain;
        flex: 0 0 auto;
        display: block;
    }

@media (min-width: 901px) {
    .section-benefits {
        padding-top: 78px;
        padding-bottom: 96px;
    }

    .benefits-header,
    .benefits-marquee,
    .benefits-bottom {
        max-width: 1120px;
    }

    .benefits-wrap {
        max-width: 1120px;
    }

    .benefits-header {
        grid-template-columns: 430px minmax(0, 560px);
        gap: 78px;
        margin-bottom: 58px;
        align-items: start;
        justify-content: center;
    }

        .benefits-header h2 {
            font-size: clamp(1.95rem, 2.55vw, 2.18rem);
            font-weight: 400;
            line-height: 1.04;
            letter-spacing: -.018em;
        }

        .benefits-header p {
            font-size: .9rem;
            font-weight: 400;
            line-height: 1.56;
            color: rgba(232,230,226,.82);
        }

    .benefits-table {
        border-spacing: 26px 0;
        min-width: 1120px;
    }

        .benefits-table col:first-child {
            width: 40%;
        }

        .benefits-table thead tr th:first-child {
            height: auto;
            padding-top: 26px !important;
            padding-bottom: 22px !important;
            padding-left: 36px !important;
            font-size: 1.2rem !important;
            font-weight: 400 !important;
        }

    .section-benefits .col-bronze-head,
    .section-benefits .col-plat-head,
    .section-benefits .col-gold-head {
        height: auto;
        padding-top: 28px;
        padding-bottom: 18px;
        font-size: .78rem;
        font-weight: 600;
    }

    .benefits-table tbody td {
        padding-top: 6px;
        padding-bottom: 6px;
    }

        .benefits-table tbody td:first-child {
            font-size: .78rem;
            line-height: 1.34;
            color: rgba(239,237,232,.62);
            font-weight: 400;
            padding: 10px 24px 10px 36px;
        }

    .section-benefits .benefits-table tbody tr:nth-child(1) {
        --benefit-bg-y: 0px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(2) {
        --benefit-bg-y: 47px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(3) {
        --benefit-bg-y: 94px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(4) {
        --benefit-bg-y: 141px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(5) {
        --benefit-bg-y: 188px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(6) {
        --benefit-bg-y: 235px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(7) {
        --benefit-bg-y: 282px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(8) {
        --benefit-bg-y: 329px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(9) {
        --benefit-bg-y: 376px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(10) {
        --benefit-bg-y: 423px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(11) {
        --benefit-bg-y: 470px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(12) {
        --benefit-bg-y: 517px;
    }

    .section-benefits .benefits-table tbody tr:nth-child(13) {
        --benefit-bg-y: 564px;
    }

    .price-spacer td {
        height: 36px;
    }

    .price-spacer--small td {
        height: 38px;
    }

    .section-benefits .price-row td {
        height: 122px;
        border-radius: 20px !important;
        padding: 26px 22px !important;
    }

        .section-benefits .price-row td:first-child {
            font-size: 1.26rem;
            font-weight: 400;
            line-height: 1.36;
            padding-left: 42px !important;
        }

    .section-benefits .price-benefits-row .price-cell,
    .section-benefits .price-cell {
        font-size: 1.48rem;
        font-weight: 500;
        letter-spacing: -.035em;
        white-space: nowrap;
    }

    .section-benefits .price-note {
        font-size: .86rem;
        letter-spacing: .01em;
        margin-bottom: 4px;
    }

    .section-benefits .price-investment-row td.col-bronze {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(255,223,190,.24), transparent 64%), linear-gradient(135deg, rgba(70,49,39,.72), rgba(28,23,20,.96)) !important;
    }

    .section-benefits .price-investment-row td.col-plat {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(235,246,255,.32), transparent 64%), linear-gradient(135deg, rgba(55,72,92,.74), rgba(17,25,36,.96)) !important;
    }

    .section-benefits .price-investment-row td.col-gold {
        background: radial-gradient(ellipse 105% 120% at 45% 70%, rgba(255,238,184,.24), transparent 64%), linear-gradient(135deg, rgba(62,56,37,.76), rgba(24,21,13,.96)) !important;
    }

    .benefits-bottom {
        margin-top: 86px;
        padding-top: 52px;
        flex-wrap: nowrap;
    }

    .benefits-callout-text {
        max-width: 620px;
        font-size: .84rem;
        line-height: 1.36;
    }

        .benefits-callout-text iconify-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 34px;
            height: 34px;
            border: 2px solid var(--gold-300);
            border-radius: 50%;
            font-size: 1.2rem;
        }

            .benefits-callout-text iconify-icon::before {
                content: '!';
                font-family: 'Montserrat', sans-serif;
                font-weight: 700;
                font-size: 1rem;
                line-height: 1;
            }
}

/* ================================================
   D5 - Features grid
   ================================================ */
.section-features {
    padding: 54px 24px 78px;
}

.features-inner {
    max-width: 1000px;
    margin: 0 auto;
}

.features-grid-top {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 26px;
    margin-bottom: 26px;
}

.feat-card {
    border: 1px solid var(--card-border);
    border-radius: 18px;
    overflow: hidden;
}

.feat-text-card {
    background: var(--card-bg);
    padding: 34px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .feat-text-card h3 {
        font-size: 1.22rem;
        line-height: 1.12;
        margin-bottom: 14px;
        font-weight: 400;
        color: #f5d390;
        background: linear-gradient(90deg, #ffe2a5 0%, #f1c975 48%, #fff0c6 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .feat-text-card p {
        font-family: 'Montserrat', sans-serif;
        color: rgba(246,244,239,.88);
        font-size: .78rem;
        font-weight: 400;
        line-height: 1.42;
        letter-spacing: -.015em;
    }

.feat-key-card {
    background: #080808;
    min-height: 170px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    isolation: isolate;
}

    .feat-key-card::before {
        content: '';
        position: absolute;
        inset: 8%;
        border-radius: 999px;
        background: radial-gradient(ellipse 64% 46% at 50% 52%, rgba(245,211,144,.2), transparent 68%);
        filter: blur(16px);
        opacity: .75;
    }

.feat-key-bronze::before {
    background: radial-gradient(ellipse 64% 46% at 50% 52%, rgba(200,136,42,.22), transparent 68%);
}

.feat-key-plat::before {
    background: radial-gradient(ellipse 64% 46% at 50% 52%, rgba(170,191,207,.2), transparent 68%);
}

.feat-key-gold::before {
    background: radial-gradient(ellipse 64% 46% at 50% 52%, rgba(248,223,168,.22), transparent 68%);
}

.feat-key-card .feature-video {
    inset: 50% auto auto 50%;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: center center;
    transform: translate(-50%, -50%) scale(1);
    -webkit-mask-image: none;
    mask-image: none;
}

.feat-key-plat .feature-video {
    object-position: 50% 42%;
    transform: translate(-50%, -50%) scale(1.18);
}

.feat-key-bronze .feature-video {
    object-position: 48% 44%;
    transform: translate(-50%, -50%) scale(1.22);
}

.feat-key-gold .feature-video {
    object-position: 52% 44%;
    transform: translate(-50%, -50%) scale(1.22);
}
/* Gold feature key */
.feat-key-bronze {
    position: relative;
}

    .feat-key-bronze iconify-icon {
        color: #C88828;
    }

.feat-key-plat iconify-icon {
    color: #9AAFBF;
}

.feat-key-gold iconify-icon {
    color: #D8A94A;
}

/* Bottom full-width card */
.features-bottom-card {
    border: 1px solid var(--card-border);
    border-radius: 18px;
    background: var(--card-bg);
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.08fr .92fr;
    min-height: 184px;
}

.features-bottom-text {
    padding: 34px 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
}

    .features-bottom-text h3 {
        font-size: 1.28rem;
        line-height: 1.12;
        font-weight: 400;
        color: #f5d390;
        background: linear-gradient(90deg, #ffe2a5 0%, #f1c975 48%, #fff0c6 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .features-bottom-text p {
        font-family: 'Montserrat', sans-serif;
        color: rgba(246,244,239,.88);
        font-size: .78rem;
        font-weight: 400;
        line-height: 1.42;
        letter-spacing: -.015em;
    }

.features-bottom-logo {
    background: radial-gradient(ellipse 72% 58% at 50% 50%, rgba(216,169,74,.09), transparent 72%), #080808;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 18px 30px 18px 0;
    padding: 10px 18px;
    border-radius: 18px;
    overflow: hidden;
}

    .features-bottom-logo img {
        width: min(104%, 500px);
        height: auto;
        max-height: 184px;
        object-fit: contain;
        transform: scale(1.12);
        transform-origin: center;
        filter: drop-shadow(0 18px 34px rgba(0,0,0,.4));
    }

/* ================================================
   CTA SECTION - index.html
   ================================================ */
.section-cta {
    max-width: 1000px;
    margin: 0 auto;
    padding: 54px 0 76px;
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
    grid-auto-rows: 194px auto;
    gap: 24px;
    align-items: stretch;
}

    .section-cta::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse 65% 45% at 50% 50%, rgba(200,136,42,.055) 0%, transparent 65%);
        pointer-events: none;
    }

.cta-media {
    border: 1px solid rgba(245,211,144,.5);
    border-radius: 18px;
    overflow: hidden;
    background: #080808;
    min-height: 0;
    height: 100%;
}

    .cta-media picture {
        display: block;
        width: 100%;
        height: 100%;
    }

    .cta-media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 0% 30%;
        display: block;
        transform: scale(1.34);
        transform-origin: left top;
        filter: brightness(1.19) saturate(1.6) sepia(0.4) contrast(1.08) hue-rotate(-4deg);
    }

.cta-copy {
    border: 1px solid var(--card-border);
    border-radius: 18px;
    background: var(--card-bg);
    padding: 34px 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.section-cta .breadcrumb {
    display: block;
}

.section-cta h2 {
    max-width: 100%;
    margin: 0 0 18px;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: clamp(1.12rem,1.65vw,1.42rem);
    font-weight: 600;
    line-height: 1.16;
}

.section-cta .cta-heading-break {
    display: block;
}

.section-cta p {
    color: rgba(246,244,239,.9);
    max-width: 520px;
    margin: 0;
    position: relative;
    font-size: .86rem;
    font-weight: 400;
    line-height: 1.48;
}

.btn-row {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(250px, .7fr) repeat(2, minmax(260px, 1fr));
    gap: 16px;
    align-items: center;
    position: relative;
    padding-top: 34px;
    border-top: 1px solid rgba(245,211,144,.12);
}

.section-cta .cta-bottom-breadcrumb {
    margin: 0;
    color: rgba(239,237,232,.92);
    font-size: 1rem;
    line-height: 1;
    letter-spacing: -.03em;
    text-transform: none;
}

.section-cta .cta-bottom-breadcrumb span {
    color: rgba(239,237,232,.58);
}

.section-cta .btn {
    min-width: 0;
    width: 100%;
    min-height: 44px;
    padding: 12px 28px;
    font-size: .76rem;
    font-weight: 700;
    gap: 11px;
}

.section-cta .btn iconify-icon {
    display: none;
}

.section-cta .btn::before {
    content: '';
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.section-cta .btn-gold::before {
    background-image: url('../img/key-icon-cta.png');
}

.section-cta .btn-ghost::before {
    background-image: url('../img/consultor-icon-cta.png');
}

@media (min-width: 901px) {
    .section-features {
        padding-top: 62px;
        padding-bottom: 88px;
    }

    .features-inner,
    .section-cta {
        max-width: 1120px;
    }

    .features-grid-top {
        gap: 30px;
        margin-bottom: 30px;
    }

    .feat-card,
    .features-bottom-card,
    .cta-media,
    .cta-copy {
        border-radius: 20px;
    }

    .feat-text-card {
        min-height: 224px;
        padding: 38px 38px;
    }

        .feat-text-card h3,
        .features-bottom-text h3 {
            font-size: 1.38rem;
            line-height: 1.08;
        }

        .feat-text-card p,
        .features-bottom-text p {
            font-size: .78rem;
            font-weight: 400;
            line-height: 1.42;
            color: rgba(246,244,239,.88);
            letter-spacing: -.015em;
        }

    .feat-key-card {
        min-height: 198px;
    }

    .features-bottom-card {
        min-height: 230px;
    }

    .features-bottom-text {
        padding: 42px 42px;
    }

    .features-bottom-logo img {
        width: min(104%, 520px);
        max-height: 190px;
        transform: scale(1.12);
    }

    .section-cta {
        grid-template-columns: minmax(360px, .72fr) minmax(0, 1.28fr);
        grid-auto-rows: 214px auto;
        gap: 28px;
        padding-top: 58px;
        padding-bottom: 84px;
    }

    .cta-copy {
        padding: 42px 48px 40px;
    }

    .section-cta h2 {
        max-width: 100%;
        font-size: clamp(1.26rem, 1.58vw, 1.5rem);
        line-height: 1.18;
        margin-bottom: 24px;
    }

    .section-cta p {
        font-size: .92rem;
        line-height: 1.5;
    }

    .btn-row {
        gap: 30px;
        grid-template-columns: minmax(300px, .72fr) repeat(2, minmax(310px, .64fr));
    }

    .section-cta .btn {
        min-height: 44px;
        font-size: .76rem;
        font-weight: 700;
    }
}

/* ================================================
   FOOTER
   ================================================ */
footer,
.rodape,
footer .rodape {
    background: #000 !important;
}

.footer {
    background: linear-gradient(180deg, var(--bg) 0%, #030206 100%);
    border-top: 1px solid rgba(255,255,255,.055);
    padding: 64px 24px 32px;
}

.footer-inner {
    max-width: var(--max-w);
    margin: 0 auto;
}

.footer-top {
    display: grid;
    grid-template-columns: 180px 1fr 1fr 1fr;
    gap: 40px;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(255,255,255,.055);
    margin-bottom: 28px;
}

.footer-logo {
    font-family: 'Montserrat',sans-serif;
    font-weight: 800;
    font-size: 1.5rem;
    letter-spacing: .04em;
    margin-bottom: 18px;
    display: block;
}

    .footer-logo span {
        color: var(--gold-300);
    }

.footer-social {
    display: flex;
    gap: 14px;
}

    .footer-social a {
        color: var(--text-sec);
        font-size: 1.4rem;
        transition: color .2s;
    }

        .footer-social a:hover {
            color: var(--gold-300);
        }

.footer-col h4 {
    font-size: .68rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--text-sec);
    margin-bottom: 14px;
    font-family: 'Montserrat',sans-serif;
    font-weight: 700;
}

.footer-col ul {
    list-style: none;
}

    .footer-col ul li {
        margin-bottom: 9px;
    }

        .footer-col ul li a {
            color: var(--text-sec);
            font-size: .86rem;
            transition: color .2s;
        }

            .footer-col ul li a:hover {
                color: var(--text-primary);
            }

.footer-col p {
    color: var(--text-sec);
    font-size: .86rem;
    line-height: 1.6;
}

.footer-col + .footer-col .footer-col-extra {
    margin-top: 22px;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.footer-copy {
    color: var(--text-muted);
    font-size: .78rem;
}

/* ================================================
   INDIVIDUAL KEY PAGES - HERO
   ================================================ */
.key-page-hero {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 120px 24px 80px;
    background: #070508;
}

.key-page-hero-inner {
    position: relative;
    z-index: 1;
    max-width: var(--max-w);
    margin: 0 auto;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.key-page-toprow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

    .key-page-toprow .breadcrumb {
        margin-bottom: 0;
    }

.key-page-text h1 {
    margin-bottom: 18px;
    letter-spacing: 0;
}

.key-page-text p {
    color: var(--text-sec);
    font-size: .95rem;
    line-height: 1.7;
    margin-bottom: 32px;
}

/* Key visual column */
.key-page-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    min-height: 380px;
}

    .key-page-visual .key-render {
        width: 380px;
    }

/* Ambient glow */
.key-glow-ambient {
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    filter: blur(80px);
    opacity: .22;
    pointer-events: none;
}

.glow-bronze {
    background: var(--bronze-500);
}

.glow-platinum {
    background: var(--plat-500);
}

.glow-gold {
    background: var(--gold-500);
}

/* bg radials per key type */
.key-hero-bg-bronze {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 75% 40%, rgba(96,48,18,.48) 0%, transparent 65%), radial-gradient(ellipse 48% 42% at 56% 46%, rgba(242,163,111,.2), transparent 68%);
}

.key-hero-bg-plat {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 75% 40%, rgba(22,42,60,.5) 0%, transparent 65%), radial-gradient(ellipse 48% 42% at 56% 46%, rgba(216,232,242,.18), transparent 68%);
}

.key-hero-bg-gold {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 75% 40%, rgba(92,66,18,.48) 0%, transparent 65%), radial-gradient(ellipse 48% 42% at 56% 46%, rgba(216,169,74,.22), transparent 68%);
}

/* ================================================
   KEY PAGE MARQUEE STRIP (flat, not scrolling animation)
   ================================================ */
.key-strip {
    padding: 14px 24px;
    background: #0C0A10;
    border-top: 1px solid rgba(255,255,255,.06);
    border-bottom: 1px solid rgba(255,255,255,.06);
    display: flex;
    align-items: center;
    gap: 40px;
    max-width: 100%;
    overflow: hidden;
}

    .key-strip .strip-label {
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        font-size: .7rem;
        letter-spacing: .2em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .key-strip .strip-divider {
        opacity: .2;
    }

    .key-strip .strip-text {
        font-size: .8rem;
        color: var(--text-sec);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.strip-bronze {
    color: var(--bronze-300);
}

.strip-plat {
    color: var(--plat-300);
}

.strip-gold {
    color: var(--gold-100);
}

/* ================================================
   KEY PAGE - BENEFITS (pill style)
   ================================================ */
.section-key-benefits {
    padding: 72px 24px;
}

.key-benefits-layout {
    max-width: var(--max-w);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.key-benefits-header {
    margin-bottom: 28px;
}

    .key-benefits-header .breadcrumb {
        margin-bottom: 4px;
    }

    .key-benefits-header .strip-label {
        margin-bottom: 6px;
        font-family: 'Montserrat',sans-serif;
        font-weight: 800;
        font-size: .7rem;
        letter-spacing: .2em;
        text-transform: uppercase;
    }

.benefits-pills {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.benefit-pill {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    border-radius: 12px;
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.07);
    font-size: .86rem;
    line-height: 1.4;
    cursor: default;
    transition: background .2s, border-color .2s;
}

    .benefit-pill:hover {
        background: rgba(255,255,255,.055);
    }

    .benefit-pill .pill-star {
        flex-shrink: 0;
        font-size: .9rem;
    }

.pill-star-bronze {
    color: var(--bronze-300);
}

.pill-star-plat {
    color: var(--plat-300);
}

.pill-star-gold {
    color: var(--gold-100);
}

/* Key visual in benefits section */
.key-benefits-visual {
    position: relative;
    min-height: 440px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.01);
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 18px;
    overflow: hidden;
}

    .key-benefits-visual .key-render {
        width: 340px;
    }

/* ================================================
   KEY PAGE - SAVINGS CALLOUT
   ================================================ */
.savings-strip {
    padding: 48px 24px;
}

.savings-strip-inner {
    max-width: var(--max-w);
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 28px 40px;
    border-radius: 14px;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.07);
}

.savings-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1.5px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.05rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
}

.savings-circle-bronze {
    border-color: var(--bronze-300);
    color: var(--bronze-300);
}

.savings-circle-plat {
    border-color: var(--plat-300);
    color: var(--plat-300);
}

.savings-circle-gold {
    border-color: var(--gold-100);
    color: var(--gold-100);
}

.savings-strip-text {
    font-size: .88rem;
    color: var(--text-sec);
    line-height: 1.6;
}

    .savings-strip-text strong {
        color: var(--text-primary);
    }

/* ================================================
   KEY PAGE - END CTA STRIP
   ================================================ */
.key-end-cta {
    padding: 0 24px 80px;
}

.key-end-cta-inner {
    max-width: var(--max-w);
    margin: 0 auto;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    background: rgba(255,255,255,.02);
    padding: 36px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
}

.key-end-left {
    flex: 1;
    min-width: 280px;
}

.key-end-label {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: .72rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.key-end-left p {
    color: var(--text-sec);
    font-size: .9rem;
    line-height: 1.6;
}

.key-end-left strong {
    color: var(--text-primary);
}

.key-end-btns {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    flex-shrink: 0;
}

    .key-end-btns .btn-ghost-link {
        font-size: .82rem;
        color: var(--text-sec);
        text-decoration: underline;
        cursor: pointer;
        background: none;
        border: none;
        padding: 0;
        transition: color .2s;
    }

        .key-end-btns .btn-ghost-link:hover {
            color: var(--text-primary);
        }

/* ================================================
   KEY DETAIL PAGES - Figma-specific layout
   ================================================ */
.key-detail {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 82% 37%, rgba(245,211,144,.045) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 54% 36% at 0% 72%, rgba(90,58,28,.22), transparent 62%), #040404;
}

.key-detail--platinum {
    background: radial-gradient(circle at 82% 37%, rgba(170,191,207,.055) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 54% 36% at 0% 72%, rgba(22,42,60,.3), transparent 62%), radial-gradient(ellipse 48% 34% at 88% 32%, rgba(32,52,70,.22), transparent 68%), #030405;
}

.key-detail--bronze {
    background: radial-gradient(circle at 82% 37%, rgba(242,163,111,.05) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 54% 36% at 0% 72%, rgba(96,48,18,.28), transparent 62%), radial-gradient(ellipse 48% 34% at 88% 32%, rgba(74,34,14,.2), transparent 68%), #040404;
}

.key-detail--gold {
    background: radial-gradient(circle at 82% 37%, rgba(245,211,144,.05) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 54% 36% at 0% 72%, rgba(94,66,18,.28), transparent 62%), radial-gradient(ellipse 48% 34% at 88% 32%, rgba(74,52,15,.2), transparent 68%), #040404;
}

.key-detail::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 45% 40% at 87% 47%, rgba(255,255,255,.075), transparent 62%);
}

.key-detail--gold::before {
    background: radial-gradient(ellipse 45% 40% at 87% 47%, rgba(245,211,144,.055), transparent 62%), radial-gradient(ellipse 34% 28% at 66% 42%, rgba(216,169,74,.075), transparent 70%);
}

.key-detail--bronze::before {
    background: radial-gradient(ellipse 45% 40% at 87% 47%, rgba(242,163,111,.055), transparent 62%), radial-gradient(ellipse 34% 28% at 66% 42%, rgba(200,104,54,.075), transparent 70%);
}

.key-detail--platinum::before {
    background: radial-gradient(ellipse 45% 40% at 87% 47%, rgba(216,232,242,.055), transparent 62%), radial-gradient(ellipse 34% 28% at 66% 42%, rgba(120,156,184,.08), transparent 70%);
}

.key-detail .key-page-hero {
    min-height: 475px;
    padding: 110px 24px 56px;
    background: transparent;
}

.key-detail .key-page-hero-inner,
.key-detail .key-strip,
.key-detail .key-section-title,
.key-detail .key-benefits-layout,
.key-detail .key-offer {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.key-detail--bronze .key-page-hero-inner,
.key-detail--bronze .key-strip,
.key-detail--bronze .key-section-title,
.key-detail--bronze .key-benefits-layout,
.key-detail--bronze .key-offer {
    max-width: 820px;
}

.key-detail--platinum .key-page-hero-inner,
.key-detail--platinum .key-strip,
.key-detail--platinum .key-section-title,
.key-detail--platinum .key-benefits-layout,
.key-detail--platinum .key-offer {
    max-width: 820px;
}

.key-detail--gold .key-page-hero-inner,
.key-detail--gold .key-strip,
.key-detail--gold .key-section-title,
.key-detail--gold .key-benefits-layout,
.key-detail--gold .key-offer {
    max-width: 820px;
}

.key-detail .key-page-hero-inner {
    grid-template-columns: .92fr 1.08fr;
    gap: 70px;
}

.key-detail .key-page-text h1 {
    max-width: 330px;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    line-height: 1.12;
    font-weight: 400;
}

    .key-detail .key-page-text h1 strong {
        color: var(--key-accent, var(--gold-text));
        font-weight: 600;
    }

.key-detail .key-page-description {
    max-width: 350px;
    font-family: 'Montserrat', sans-serif;
    font-size: .88rem;
    line-height: 1.62;
    font-weight: 400;
    color: rgba(239,237,232,.72);
}

.key-detail .key-page-toprow {
    max-width: 340px;
    justify-content: flex-start;
    gap: 56px;
    border-bottom: 1px solid rgba(255,255,255,.05);
    padding-bottom: 12px;
}

.key-detail .breadcrumb {
    color: rgba(239,237,232,.26);
    letter-spacing: 0;
    text-transform: none;
}

.key-detail .badge {
    padding: 7px 18px;
    border-radius: 9px;
    background: rgba(255,255,255,.035);
    color: var(--key-accent, var(--gold-text));
    border: 1px solid rgba(255,255,255,.055);
    font-weight: 700;
    letter-spacing: .16em;
}

.key-detail .key-page-visual {
    min-height: 260px;
    justify-content: flex-start;
}

    .key-detail .key-page-visual .key-render {
        width: 360px !important;
        transform: translateX(-12px);
    }

    .key-detail .key-page-visual .key-video {
        transform: scale(1.18);
    }

.key-detail--bronze .key-page-visual .key-render {
    width: 420px !important;
    transform: translateX(-18px) translateY(-8px);
    --key-glow-soft: rgba(200,104,54,.42);
    --key-glow-strong: rgba(242,163,111,.7);
}

    .key-detail--bronze .key-page-visual .key-render::before {
        inset: 2%;
        background: radial-gradient(ellipse 42% 35% at 50% 50%, rgba(255,204,166,.66), rgba(242,132,72,.32) 38%, transparent 68%), radial-gradient(ellipse 78% 58% at 50% 52%, rgba(200,104,54,.34), transparent 72%), radial-gradient(ellipse 108% 80% at 50% 52%, rgba(96,48,18,.28), transparent 76%);
        filter: blur(24px);
        opacity: 1;
        transform: scale(1.08);
    }

    .key-detail--bronze .key-page-visual .key-render::after {
        background: radial-gradient(ellipse 46% 36% at 50% 50%, rgba(242,163,111,.16), transparent 56%), radial-gradient(ellipse 72% 56% at 50% 52%, transparent 58%, rgba(80,36,12,.16) 76%, rgba(5,3,2,.44) 100%);
        opacity: .58;
    }

.key-detail--bronze .key-page-visual .bronze-header-video {
    transform: scale(1.1) rotate(-72deg);
    filter: sepia(.18) saturate(1.34) hue-rotate(-12deg) contrast(1.1) brightness(1.16) drop-shadow(0 18px 28px rgba(242,132,72,.2)) drop-shadow(0 0 30px rgba(200,104,54,.3));
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 37% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-detail--bronze .key-page-hero-inner {
    grid-template-columns: 1.08fr .92fr;
    gap: 54px;
}

.key-detail--bronze .key-page-text {
    min-width: 0;
}

.key-detail--bronze .key-page-toprow {
    max-width: 380px;
    gap: 70px;
}

    .key-detail--bronze .key-page-toprow .breadcrumb {
        white-space: nowrap;
    }

.key-detail--bronze .key-page-text h1 {
    max-width: 440px;
    font-size: clamp(1.5rem, 2.05vw, 1.95rem);
    line-height: 1.16;
}

    .key-detail--bronze .key-page-text h1 strong {
        white-space: nowrap;
    }

.key-detail--bronze .key-page-description {
    max-width: 390px;
    margin-top: 18px;
}

.key-detail--platinum .key-video {
    filter: saturate(.9) contrast(1.06) brightness(1.06);
}

.key-detail--platinum .key-page-visual .key-render {
    width: 420px !important;
    transform: translateX(-18px) translateY(-8px);
    --key-glow-soft: rgba(120,156,184,.42);
    --key-glow-strong: rgba(216,232,242,.68);
}

    .key-detail--platinum .key-page-visual .key-render::before {
        inset: 2%;
        background: radial-gradient(ellipse 42% 35% at 50% 50%, rgba(238,247,252,.62), rgba(170,191,207,.3) 38%, transparent 68%), radial-gradient(ellipse 78% 58% at 50% 52%, rgba(120,156,184,.34), transparent 72%), radial-gradient(ellipse 108% 80% at 50% 52%, rgba(30,52,70,.28), transparent 76%);
        filter: blur(24px);
        opacity: 1;
        transform: scale(1.08);
    }

    .key-detail--platinum .key-page-visual .key-render::after {
        background: radial-gradient(ellipse 46% 36% at 50% 50%, rgba(216,232,242,.16), transparent 56%), radial-gradient(ellipse 72% 56% at 50% 52%, transparent 58%, rgba(16,31,45,.18) 76%, rgba(3,5,8,.46) 100%);
        opacity: .58;
    }

.key-detail--platinum .key-page-visual .platinum-header-video {
    transform: scale(1.1) rotate(-72deg);
    filter: saturate(.92) contrast(1.1) brightness(1.16) drop-shadow(0 18px 28px rgba(216,232,242,.18)) drop-shadow(0 0 30px rgba(120,156,184,.3));
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 37% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-detail--platinum .key-page-hero-inner {
    grid-template-columns: 1.08fr .92fr;
    gap: 54px;
}

.key-detail--platinum .key-page-text {
    min-width: 0;
}

.key-detail--platinum .key-page-toprow {
    max-width: 380px;
    gap: 54px;
}

    .key-detail--platinum .key-page-toprow .breadcrumb {
        white-space: nowrap;
    }

.key-detail--platinum .key-page-text h1 {
    max-width: 440px;
    font-size: clamp(1.5rem, 2.05vw, 1.95rem);
    line-height: 1.16;
}

    .key-detail--platinum .key-page-text h1 strong {
        white-space: nowrap;
    }

.key-detail--platinum .key-page-description {
    max-width: 390px;
    margin-top: 18px;
}

.key-detail--gold .key-video {
    filter: sepia(.18) saturate(1.42) hue-rotate(-10deg) contrast(1.1) brightness(1.24) drop-shadow(0 22px 36px rgba(216,169,74,.34));
}

.key-detail--gold .key-page-visual .key-render {
    width: 420px !important;
    transform: translateX(-18px) translateY(-8px);
    --key-glow-soft: rgba(216,169,74,.42);
    --key-glow-strong: rgba(255,214,122,.72);
}

    .key-detail--gold .key-page-visual .key-render::before {
        inset: 2%;
        background: radial-gradient(ellipse 42% 35% at 50% 50%, rgba(255,238,182,.74), rgba(255,190,72,.34) 38%, transparent 68%), radial-gradient(ellipse 78% 58% at 50% 52%, rgba(216,169,74,.36), transparent 72%), radial-gradient(ellipse 108% 80% at 50% 52%, rgba(120,74,8,.28), transparent 76%);
        filter: blur(24px);
        opacity: 1;
        transform: scale(1.08);
    }

    .key-detail--gold .key-page-visual .key-render::after {
        background: radial-gradient(ellipse 46% 36% at 50% 50%, rgba(255,214,122,.18), transparent 56%), radial-gradient(ellipse 72% 56% at 50% 52%, transparent 58%, rgba(80,45,5,.16) 76%, rgba(5,3,2,.44) 100%);
        opacity: .6;
    }

.key-detail--gold .key-page-visual .gold-header-video {
    transform: scale(1.1) rotate(-72deg);
    filter: sepia(.22) saturate(1.58) hue-rotate(-12deg) contrast(1.12) brightness(1.3) drop-shadow(0 18px 28px rgba(255,190,72,.28)) drop-shadow(0 0 34px rgba(216,169,74,.42));
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 37% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-detail--gold .key-page-hero-inner {
    grid-template-columns: 1.08fr .92fr;
    gap: 54px;
}

.key-detail--gold .key-page-text {
    min-width: 0;
}

.key-detail--gold .key-page-toprow {
    max-width: 380px;
    gap: 86px;
}

    .key-detail--gold .key-page-toprow .breadcrumb {
        white-space: nowrap;
    }

.key-detail--gold .key-page-text h1 {
    max-width: 440px;
    font-size: clamp(1.5rem, 2.05vw, 1.95rem);
    line-height: 1.16;
}

    .key-detail--gold .key-page-text h1 strong {
        white-space: nowrap;
    }

.key-detail--gold .key-page-description {
    max-width: 390px;
    margin-top: 18px;
}.key-detail .key-strip {
    padding: 12px 20px;
    border-color: rgba(255,255,255,.055);
    border-left: 0;
    border-right: 0;
    background: transparent;
    justify-content: space-between;
}

    .key-detail .key-strip .strip-label,
    .key-detail .key-strip .strip-text {
        color: var(--key-accent, var(--gold-text));
        font-size: .58rem;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

.key-detail .strip-marquee {
    position: relative;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    color: var(--key-accent, var(--gold-text));
    font-size: .58rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    white-space: nowrap;
}

    .key-detail .strip-marquee::before,
    .key-detail .strip-marquee::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        width: 34px;
        z-index: 2;
        pointer-events: none;
    }

    .key-detail .strip-marquee::before {
        left: 0;
        background: linear-gradient(90deg, #040404, transparent);
    }

    .key-detail .strip-marquee::after {
        right: 0;
        background: linear-gradient(270deg, #040404, transparent);
    }

    .key-detail .strip-marquee span {
        flex: 0 0 auto;
        padding-right: 42px;
        animation: keyStripMarquee 18s linear infinite;
    }

@keyframes keyStripMarquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}

/* Key pages hero - Figma refinement */
.key-detail .key-page-hero {
    min-height: 560px;
    padding: 72px 24px 28px;
}.key-detail .key-page-hero-inner,
.key-detail--bronze .key-page-hero-inner,
.key-detail--platinum .key-page-hero-inner,
.key-detail--gold .key-page-hero-inner{
    grid-template-columns: minmax(600px, 650px) minmax(0, 1fr);
    gap: 52px;
    align-items: start;
}

.key-detail .key-page-text,
.key-detail--bronze .key-page-text,
.key-detail--platinum .key-page-text,
.key-detail--gold .key-page-text{
    padding-top: 64px;
}

.key-detail .key-page-toprow,
.key-detail--bronze .key-page-toprow,
.key-detail--platinum .key-page-toprow,
.key-detail--gold .key-page-toprow{
    max-width: 650px;
    gap: 24px;
    justify-content: space-between;
    padding-bottom: 18px;
    margin-bottom: 28px;
    border-bottom-color: rgba(245,211,144,.13);
}

.key-detail .breadcrumb {
    color: rgba(239,237,232,.34);
    font-size: .95rem;
    font-weight: 400;
    line-height: 1;
}

.key-detail .badge {
    min-width: 104px;
    padding: 10px 22px;
    border-radius: 12px;
    background: rgba(10,10,10,.5);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .12em;
}

.key-detail .key-page-text h1,
.key-detail--bronze .key-page-text h1,
.key-detail--platinum .key-page-text h1,
.key-detail--gold .key-page-text h1{
    max-width: 650px;
    font-size: clamp(2rem, 2.36vw, 2.48rem);
    line-height: 1.18;
    font-weight: 400;
    letter-spacing: -.025em;
    margin-bottom: 26px;
}

.key-detail .key-page-text h1 strong,
.key-detail--bronze .key-page-text h1 strong,
.key-detail--platinum .key-page-text h1 strong,
.key-detail--gold .key-page-text h1 strong{
    font-weight: 600;
    white-space: nowrap;
}

.key-detail .key-page-description,
.key-detail--bronze .key-page-description,
.key-detail--platinum .key-page-description,
.key-detail--gold .key-page-description{
    max-width: 590px;
    margin-top: 0;
    color: rgba(239,237,232,.78);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.48;
    letter-spacing: -.02em;
}

.key-detail .key-page-visual {
    min-height: 500px;
    justify-content: center;
}

.key-detail .key-page-visual .key-render,
.key-detail--bronze .key-page-visual .key-render,
.key-detail--platinum .key-page-visual .key-render,
.key-detail--gold .key-page-visual .key-render{
    width: 490px !important;
    max-width: none;
    flex: 0 0 490px;
    transform: translateX(-8px) translateY(0);
}

.key-detail--bronze .key-page-visual .bronze-header-video,
.key-detail--platinum .key-page-visual .platinum-header-video,
.key-detail--gold .key-page-visual .gold-header-video{
    transform: scale(1.24) rotate(-72deg);
}

.key-detail--bronze {
    background: radial-gradient(circle at 82% 37%, rgba(242,163,111,.035) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 50% 34% at 88% 36%, rgba(96,48,18,.16), transparent 66%), #030303;
}

.key-detail--platinum {
    background: radial-gradient(circle at 82% 37%, rgba(170,191,207,.04) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 50% 34% at 88% 36%, rgba(22,42,60,.18), transparent 66%), #030303;
}

.key-detail--gold {
    background: radial-gradient(circle at 82% 37%, rgba(245,211,144,.035) 0 1px, transparent 2px) 0 0 / 58px 58px, radial-gradient(ellipse 50% 34% at 88% 36%, rgba(94,66,18,.16), transparent 66%), #030303;
}.key-detail .key-strip {
    margin-top: 22px;
}

.key-detail .section-key-benefits {
    padding: 92px 24px 18px;
}

.key-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255,255,255,.08);
    padding-bottom: 14px;
    margin-bottom: 28px;
}

    .key-section-title .breadcrumb {
        margin: 0;
        font-size: .9rem;
    }

    .key-section-title span {
        color: rgba(255,255,255,.28);
        letter-spacing: .18em;
    }

.key-detail .key-benefits-layout {
    grid-template-columns: 1.15fr .85fr;
    gap: 30px;
    align-items: stretch;
}

.key-detail .benefits-pills,
.key-detail .key-benefits-visual {
    border: 1px solid rgba(245,211,144,.12);
    border-radius: 18px;
    background: rgba(3,3,3,.52);
}

.key-detail--platinum .benefits-pills,
.key-detail--platinum .key-benefits-visual {
    border-color: rgba(170,191,207,.12);
}

.key-detail .benefits-pills {
    justify-content: center;
    padding: 42px 56px;
    min-height: 300px;
}

.key-detail .benefit-pill {
    border-radius: 13px;
    padding: 12px 18px;
    border-color: rgba(255,255,255,.08);
    background: rgba(255,255,255,.04);
    color: rgba(239,237,232,.86);
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.42;
}

    .key-detail .benefit-pill .pill-star {
        width: 14px;
        height: 14px;
        min-width: 14px;
        overflow: hidden;
        color: currentColor;
        font-size: 0;
        line-height: 1;
    }

        .key-detail .benefit-pill .pill-star::before {
            content: "";
            display: block;
            width: 14px;
            height: 14px;
            background: currentColor;
            clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 56%, 79% 91%, 50% 70%, 21% 91%, 32% 56%, 2% 35%, 39% 35%);
        }

.key-detail--bronze .benefit-pill {
    border-color: rgba(242,163,111,.2);
    background: linear-gradient(90deg, rgba(242,163,111,.07), rgba(255,255,255,.035));
    color: rgba(242,188,154,.95);
}

.key-detail--platinum .benefit-pill {
    border-color: rgba(170,191,207,.2);
    background: linear-gradient(90deg, rgba(170,191,207,.075), rgba(255,255,255,.035));
    color: rgba(210,226,239,.94);
}

.key-detail--gold .benefit-pill {
    border-color: rgba(245,211,144,.22);
    background: linear-gradient(90deg, rgba(245,211,144,.08), rgba(255,255,255,.035));
    color: rgba(248,223,168,.96);
}.key-detail .benefit-pill small {
        display: block;
        margin-left: auto;
        max-width: 190px;
        color: rgba(239,237,232,.5);
        font-size: .64rem;
        line-height: 1.35;
        font-weight: 400;
    }

.key-detail .benefit-pill-featured {
    align-items: flex-start;
}

.key-detail .key-benefits-visual {
    min-height: 300px;
    background: radial-gradient(ellipse 60% 45% at 50% 45%, rgba(245,211,144,.16), transparent 70%), rgba(3,3,3,.62);
}

.key-detail--platinum .key-benefits-visual {
    background: radial-gradient(ellipse 44% 40% at 50% 45%, rgba(216,232,242,.24), transparent 62%), radial-gradient(ellipse 72% 62% at 50% 50%, rgba(120,156,184,.2), transparent 74%), rgba(3,8,13,.68);
    border-color: rgba(170,191,207,.2);
    box-shadow: inset 0 0 42px rgba(120,156,184,.08), 0 18px 50px rgba(0,0,0,.24);
}

.key-detail .key-benefits-visual .key-render {
    width: 250px !important;
}

.key-detail .key-benefits-visual .key-video {
    transform: scale(1.18);
}

.key-detail--bronze .key-benefits-visual .key-render {
    width: 275px !important;
    --key-glow-soft: rgba(200,104,54,.42);
    --key-glow-strong: rgba(242,163,111,.68);
}

.key-detail--bronze .key-benefits-visual {
    background: radial-gradient(ellipse 44% 40% at 50% 45%, rgba(255,190,142,.26), transparent 62%), radial-gradient(ellipse 72% 62% at 50% 50%, rgba(200,104,54,.2), transparent 74%), rgba(3,3,3,.62);
    border-color: rgba(242,163,111,.18);
    box-shadow: inset 0 0 42px rgba(200,104,54,.08), 0 18px 50px rgba(0,0,0,.24);
}

    .key-detail--bronze .key-benefits-visual .key-render::before {
        inset: 0;
        background: radial-gradient(ellipse 42% 46% at 50% 50%, rgba(255,204,166,.48), rgba(242,132,72,.24) 42%, transparent 70%), radial-gradient(ellipse 78% 70% at 50% 52%, rgba(200,104,54,.28), transparent 74%);
        filter: blur(22px);
        opacity: 1;
        transform: scale(1.06);
    }

    .key-detail--bronze .key-benefits-visual .key-render::after {
        background: radial-gradient(ellipse 48% 54% at 50% 50%, rgba(242,163,111,.14), transparent 58%), radial-gradient(ellipse 76% 72% at 50% 52%, transparent 58%, rgba(80,36,12,.14) 78%, rgba(5,3,2,.42) 100%);
        opacity: .56;
    }

    .key-detail--bronze .key-benefits-visual .bronze-body-video {
        transform: scale(.86);
        filter: sepia(.16) saturate(1.32) hue-rotate(-12deg) contrast(1.08) brightness(1.12) drop-shadow(0 18px 28px rgba(242,132,72,.18)) drop-shadow(0 0 26px rgba(200,104,54,.28));
        -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
        mask-image: radial-gradient(ellipse 48% 64% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    }

.key-detail--platinum .key-benefits-visual .key-render {
    width: 275px !important;
    --key-glow-soft: rgba(120,156,184,.42);
    --key-glow-strong: rgba(216,232,242,.66);
}

    .key-detail--platinum .key-benefits-visual .key-render::before {
        inset: 0;
        background: radial-gradient(ellipse 42% 46% at 50% 50%, rgba(238,247,252,.46), rgba(170,191,207,.24) 42%, transparent 70%), radial-gradient(ellipse 78% 70% at 50% 52%, rgba(120,156,184,.28), transparent 74%);
        filter: blur(22px);
        opacity: 1;
        transform: scale(1.06);
    }

    .key-detail--platinum .key-benefits-visual .key-render::after {
        background: radial-gradient(ellipse 48% 54% at 50% 50%, rgba(216,232,242,.14), transparent 58%), radial-gradient(ellipse 76% 72% at 50% 52%, transparent 58%, rgba(16,31,45,.16) 78%, rgba(3,5,8,.42) 100%);
        opacity: .56;
    }

.key-detail--platinum .key-benefits-visual .platinum-body-video {
    transform: scale(.86);
    filter: saturate(.9) contrast(1.1) brightness(1.14) drop-shadow(0 18px 28px rgba(216,232,242,.16)) drop-shadow(0 0 26px rgba(120,156,184,.28));
    -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    mask-image: radial-gradient(ellipse 48% 64% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
}

.key-detail--gold .key-benefits-visual .key-render {
    width: 275px !important;
    --key-glow-soft: rgba(216,169,74,.44);
    --key-glow-strong: rgba(255,214,122,.7);
}

.key-detail--gold .key-benefits-visual {
    background: radial-gradient(ellipse 44% 40% at 50% 45%, rgba(255,232,166,.32), transparent 62%), radial-gradient(ellipse 72% 62% at 50% 50%, rgba(216,169,74,.2), transparent 74%), rgba(3,3,3,.62);
    border-color: rgba(245,211,144,.2);
    box-shadow: inset 0 0 42px rgba(216,169,74,.08), 0 18px 50px rgba(0,0,0,.24);
}

    .key-detail--gold .key-benefits-visual .key-render::before {
        inset: 0;
        background: radial-gradient(ellipse 42% 46% at 50% 50%, rgba(255,238,182,.58), rgba(255,190,72,.28) 42%, transparent 70%), radial-gradient(ellipse 78% 70% at 50% 52%, rgba(216,169,74,.3), transparent 74%);
        filter: blur(22px);
        opacity: 1;
        transform: scale(1.06);
    }

    .key-detail--gold .key-benefits-visual .key-render::after {
        background: radial-gradient(ellipse 48% 54% at 50% 50%, rgba(255,214,122,.16), transparent 58%), radial-gradient(ellipse 76% 72% at 50% 52%, transparent 58%, rgba(80,45,5,.14) 78%, rgba(5,3,2,.42) 100%);
        opacity: .58;
    }

    .key-detail--gold .key-benefits-visual .gold-body-video {
        transform: scale(.86);
        filter: sepia(.2) saturate(1.5) hue-rotate(-12deg) contrast(1.1) brightness(1.26) drop-shadow(0 18px 28px rgba(255,190,72,.24)) drop-shadow(0 0 30px rgba(216,169,74,.38));
        -webkit-mask-image: radial-gradient(ellipse 48% 44% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
        mask-image: radial-gradient(ellipse 48% 64% at 50% 50%, #000 0 48%, rgba(0,0,0,.82) 58%, rgba(0,0,0,.28) 68%, transparent 78%);
    }

@media (min-width: 901px) {
    .key-detail--platinum .key-benefits-visual .key-render {
        width: 100% !important;
        --key-glow-soft: rgba(120,156,184,.42);
        --key-glow-strong: rgba(216,232,242,.66);
    }

    .key-detail--gold .key-benefits-visual .key-render {
        width: 100% !important;
        --key-glow-soft: rgba(216,169,74,.44);
        --key-glow-strong: rgba(255,214,122,.7);
    }
}

.key-offer {
    padding: 0 0 120px;
    position: relative;
}

.key-value-note {
    max-width: none;
    margin: 18px auto 28px;
    padding: 26px 72px;
    justify-content: center;
    border-radius: 18px;
    background: rgba(20,20,20,.52);
}

    .key-value-note p {
        margin: 0;
        max-width: 500px;
        color: rgba(239,237,232,.74);
        font-family: 'Montserrat', sans-serif;
        font-size: .82rem;
        line-height: 1.48;
        font-weight: 400;
        text-transform: none;
    }

    .key-value-note strong {
        color: var(--key-accent, var(--gold-text));
        font-weight: 600;
    }

.key-price-row {
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 28px;
    margin: 32px 0 24px;
}

.key-price-label,
.key-price-value {
    min-height: 116px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.09);
    background: rgba(23,23,23,.72);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 26px 38px;
    color: rgba(239,237,232,.82);
    font-size: 1.05rem;
    font-weight: 400;
}

.key-price-label {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
    font-size: clamp(1.22rem, 1.75vw, 1.58rem);
    letter-spacing: -.025em;
}

    .key-price-label strong {
        color: var(--key-accent, var(--gold-text));
        font-weight: 500;
    }

.key-course-name {
    display: none;
    max-width: 100%;
    margin-top: 12px;
    color: rgba(239,237,232,.76);
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.35;
}

.key-price-label small {
    display: none;
    margin-top: 6px;
    color: rgba(239,237,232,.5);
    font-size: .64rem;
    font-weight: 500;
}

.key-price-value {
    justify-content: center;
    font-size: clamp(1.65rem, 3vw, 2.15rem);
    font-weight: 600;
    line-height: 1.08;
    color: #fff;
    background: radial-gradient(ellipse 58% 85% at 10% 100%, rgba(245,211,144,.24), transparent 62%), rgba(6,6,6,.66);
}

.key-detail--platinum .key-price-value {
    background: radial-gradient(ellipse 70% 92% at 10% 100%, rgba(216,232,242,.22), transparent 64%), radial-gradient(ellipse 95% 120% at 100% 0%, rgba(80,111,137,.16), transparent 68%), linear-gradient(135deg, rgba(4,12,21,.96), rgba(13,28,42,.92));
    border-color: rgba(170,191,207,.24);
    box-shadow: inset 0 0 34px rgba(216,232,242,.055), 0 18px 42px rgba(0,0,0,.22);
}

.key-detail--bronze .key-price-label {
    background: radial-gradient(ellipse 80% 110% at 100% 100%, rgba(242,163,111,.1), transparent 70%), rgba(20,15,12,.76);
    border-color: rgba(242,163,111,.18);
}

.key-detail--bronze .key-price-value {
    background: radial-gradient(ellipse 70% 92% at 10% 100%, rgba(242,163,111,.24), transparent 64%), radial-gradient(ellipse 95% 120% at 100% 0%, rgba(120,68,34,.16), transparent 68%), linear-gradient(135deg, rgba(20,9,5,.96), rgba(48,25,13,.9));
    border-color: rgba(242,163,111,.25);
    box-shadow: inset 0 0 34px rgba(242,163,111,.055), 0 18px 42px rgba(0,0,0,.22);
}

.key-detail--gold .key-price-label {
    background: radial-gradient(ellipse 80% 110% at 100% 100%, rgba(245,211,144,.12), transparent 70%), rgba(22,18,12,.78);
    border-color: rgba(245,211,144,.22);
}
.key-detail--gold .key-price-value {
    background: radial-gradient(ellipse 72% 96% at 10% 100%, rgba(255,231,166,.32), transparent 64%), radial-gradient(ellipse 95% 120% at 100% 0%, rgba(216,169,74,.2), transparent 68%), linear-gradient(135deg, rgba(22,15,5,.98), rgba(72,53,16,.92));
    border-color: rgba(255,231,166,.32);
    box-shadow: inset 0 0 38px rgba(255,231,166,.08), 0 18px 46px rgba(0,0,0,.24), 0 0 34px rgba(216,169,74,.08);
}
.key-payment-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 0 0 28px;
}

.payment-card {
    min-height: 152px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 16px;
    padding: 24px 20px;
    background: radial-gradient(ellipse 80% 110% at 50% 100%, rgba(245,211,144,.1), transparent 68%), rgba(12,12,12,.64);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.payment-card--featured {
    border-color: rgba(245,211,144,.34);
    background: radial-gradient(ellipse 82% 110% at 50% 100%, rgba(245,211,144,.24), transparent 70%), rgba(20,18,14,.76);
}

.key-detail--bronze .payment-card {
    border-color: rgba(242,163,111,.16);
    background: radial-gradient(ellipse 86% 118% at 50% 100%, rgba(242,163,111,.09), transparent 70%), linear-gradient(145deg, rgba(18,8,4,.82), rgba(24,15,10,.68));
}

.key-detail--bronze .payment-card--featured {
    border-color: rgba(242,163,111,.42);
    background: radial-gradient(ellipse 92% 128% at 50% 100%, rgba(242,163,111,.24), transparent 70%), radial-gradient(ellipse 82% 90% at 0% 0%, rgba(120,68,34,.16), transparent 70%), linear-gradient(145deg, rgba(22,9,4,.94), rgba(58,31,16,.78));
    box-shadow: inset 0 0 34px rgba(242,163,111,.08), 0 18px 44px rgba(0,0,0,.24);
}

.key-detail--platinum .key-price-label {
    background: radial-gradient(ellipse 80% 110% at 100% 100%, rgba(170,191,207,.09), transparent 70%), rgba(14,18,22,.76);
    border-color: rgba(170,191,207,.18);
}

.key-detail--platinum .payment-card {
    border-color: rgba(170,191,207,.16);
    background: radial-gradient(ellipse 86% 118% at 50% 100%, rgba(170,191,207,.09), transparent 70%), linear-gradient(145deg, rgba(5,10,16,.78), rgba(13,18,24,.68));
}

.key-detail--platinum .payment-card--featured {
    border-color: rgba(216,232,242,.42);
    background: radial-gradient(ellipse 92% 128% at 50% 100%, rgba(216,232,242,.24), transparent 70%), radial-gradient(ellipse 82% 90% at 0% 0%, rgba(80,111,137,.16), transparent 70%), linear-gradient(145deg, rgba(6,13,22,.92), rgba(28,43,56,.76));
    box-shadow: inset 0 0 34px rgba(216,232,242,.08), 0 18px 44px rgba(0,0,0,.24);
}

.key-detail--platinum .payment-card span {
    color: #D8E6EF;
}

.key-detail--platinum .payment-card small,
.key-detail--platinum .key-price-label small {
    color: rgba(216,232,242,.58);
}

.key-detail--gold .payment-card {
    border-color: rgba(245,211,144,.2);
    background: radial-gradient(ellipse 86% 118% at 50% 100%, rgba(245,211,144,.12), transparent 70%), linear-gradient(145deg, rgba(20,14,5,.84), rgba(28,23,14,.7));
}
.key-detail--gold .payment-card--featured {
    border-color: rgba(255,231,166,.5);
    background: radial-gradient(ellipse 92% 128% at 50% 100%, rgba(255,231,166,.32), transparent 70%), radial-gradient(ellipse 82% 90% at 0% 0%, rgba(216,169,74,.2), transparent 70%), linear-gradient(145deg, rgba(24,15,4,.96), rgba(78,58,18,.82));
    box-shadow: inset 0 0 38px rgba(255,231,166,.1), 0 18px 46px rgba(0,0,0,.24), 0 0 34px rgba(216,169,74,.1);
}
.key-detail--bronze .payment-card span {
    color: #F2A36F;
}

.key-detail--gold .payment-card span {
    color: #F5D390;
}
.key-detail--bronze .payment-card small,
.key-detail--bronze .key-price-label small {
    color: rgba(242,163,111,.55);
}

.key-detail--gold .payment-card small,
.key-detail--gold .key-price-label small {
    color: rgba(245,211,144,.58);
}
.payment-card span {
    display: block;
    color: var(--key-accent, var(--gold-text));
    font-size: .64rem;
    font-weight: 500;
    letter-spacing: .09em;
    text-transform: uppercase;
    line-height: 1.35;
}

.payment-card strong {
    display: block;
    margin-top: 14px;
    color: #fff;
    font-size: clamp(1.18rem, 2vw, 1.42rem);
    font-weight: 600;
    line-height: 1.25;
}

.payment-card small {
    display: block;
    margin-top: 10px;
    color: rgba(239,237,232,.62);
    font-size: .66rem;
    line-height: 1.45;
}

.key-economy-row {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    align-items: center;
    gap: 22px;
    min-height: 62px;
    padding: 15px 34px;
    border-radius: 12px;
    border: 1px solid rgba(245,211,144,.09);
    background: rgba(3,3,3,.42);
}

    .key-economy-row span {
        color: var(--key-accent, var(--gold-text));
        font-size: .68rem;
        font-weight: 400;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .key-economy-row p {
        margin: 0;
        color: rgba(239,237,232,.68);
        font-family: 'Montserrat', sans-serif;
        font-size: .78rem;
        line-height: 1.42;
        font-weight: 400;
        text-transform: none;
        width: min(100%, 440px);
    }

    .key-economy-row strong {
        color: var(--key-accent, var(--gold-text));
        font-weight: 600;
    }

.key-detail--platinum .key-economy-row {
    border-color: rgba(170,191,207,.14);
    background: radial-gradient(ellipse 90% 140% at 100% 50%, rgba(170,191,207,.08), transparent 72%), rgba(3,8,13,.48);
}

.key-detail--bronze .key-economy-row {
    border-color: rgba(242,163,111,.14);
    background: radial-gradient(ellipse 90% 140% at 100% 50%, rgba(242,163,111,.08), transparent 72%), rgba(18,8,4,.48);
}

.key-detail--gold .key-economy-row {
    border-color: rgba(245,211,144,.18);
    background: radial-gradient(ellipse 90% 140% at 100% 50%, rgba(245,211,144,.1), transparent 72%), rgba(18,13,5,.5);
}
.key-detail-actions {
    display: flex;
    justify-content: space-between;
    gap: 28px;
    margin-top: 42px;
}

.key-detail-actions--single {
    justify-content: center;
}

.key-detail-actions .btn {
    min-width: 360px;
    min-height: 48px;
    font-family: 'Montserrat', sans-serif;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .01em;
    padding: 13px 28px;
    text-decoration: none;
}

.key-detail-actions .btn iconify-icon {
    display: none;
}

.key-detail-actions .btn::before {
    content: '';
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    background: url('../img/key-icon-cta.png') center / contain no-repeat;
}

.key-detail-actions .btn-ghost::before {
    opacity: .72;
}

.btn-platinum {
    background: linear-gradient(135deg, #dce8f0 16%, #ffffff 52%, #b4c3cf 85%);
    color: #07101a;
    box-shadow: inset 0 0 18px rgba(255,255,255,.95), 0 0 0 4px rgba(255,255,255,.2), 0 0 0 7px rgba(34,35,42,.86), 0 18px 36px rgba(170,191,207,.12);
    border: 1px solid rgba(255,255,255,.35);
}
.key-detail--bronze {
    --key-accent: #F2A36F;
}

.key-detail--platinum {
    --key-accent: #D8E6EF;
}

.key-detail--gold {
    --key-accent: #F5D390;
}
.key-detail--bronze .btn-gold {
    background: linear-gradient(135deg, #f3a477 16%, #ffd0b4 49%, #f2a36f 85%);
}

/* ================================================
   RESPONSIVE
   ================================================ */
@media (max-width: 900px) {
    .hero-content {
        grid-template-columns: 1fr;
        padding-top: 50px;
    }

    .d2-cards {
        grid-template-columns: 1fr;
    }

    .d2-image-card {
        min-height: 280px;
    }

    .tiers-keys {
        flex-direction: column;
        align-items: center;
    }

    .tier-key-link {
        max-width: 280px;
    }

    .benefits-header {
        grid-template-columns: 1fr;
    }

    .features-grid-top {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 12px;
    }

    .section-features {
        padding-left: 0;
        padding-right: 0;
    }

    .features-inner {
        width: calc(100% - 48px);
        max-width: 310px;
    }

    .feat-card,
    .features-bottom-card {
        border-radius: 14px;
    }

    .feat-text-card {
        min-height: 160px;
        padding: 28px 26px;
    }

        .feat-text-card h3,
        .features-bottom-text h3 {
            font-size: 1.08rem;
            line-height: 1.08;
            margin-bottom: 12px;
        }

        .feat-text-card p,
        .features-bottom-text p {
            font-size: .68rem;
            line-height: 1.38;
            font-weight: 400;
        }

    .feat-key-card {
        min-height: 128px;
    }

    .features-bottom-card {
        grid-template-columns: 1fr;
    }

    .features-bottom-text {
        padding: 28px 26px;
    }

    .features-bottom-logo {
        margin: 0 18px 18px;
        min-height: 128px;
    }

        .features-bottom-logo img {
            max-height: 118px;
            transform: scale(1.04);
        }

    .section-cta {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
        width: calc(100% - 48px);
        max-width: 310px;
        padding-left: 0;
        padding-right: 0;
    }

    .cta-media {
        min-height: 158px;
        aspect-ratio: 1.72 / 1;
    }

        .cta-media img {
            object-position: 0% 28%;
            transform: scale(1.16);
            transform-origin: left top;
        }

    .cta-copy {
        padding: 36px 28px;
        align-items: center;
        text-align: center;
    }

    .section-cta h2 {
        font-size: 1.05rem;
        line-height: 1.14;
        text-align: center;
    }

    .section-cta p {
        max-width: 245px;
        font-family: 'Montserrat', sans-serif;
        font-size: .68rem;
        font-weight: 400;
        line-height: 1.45;
        letter-spacing: -.01em;
        color: rgba(246,244,239,.82);
        text-align: center;
    }

    .btn-row {
        grid-template-columns: 1fr;
        gap: 16px;
        padding-top: 24px;
    }

    .section-cta .cta-bottom-breadcrumb {
        text-align: center;
        font-size: .9rem;
    }

    .section-cta .btn {
        width: min(100%, 310px);
        justify-self: center;
    }

    .footer-top {
        grid-template-columns: 1fr 1fr;
    }

    .key-page-hero-inner {
        grid-template-columns: 1fr;
    }

    .key-page-visual {
        display: none;
    }

    .key-benefits-layout {
        grid-template-columns: 1fr;
    }

    .key-benefits-visual {
        min-height: 220px;
    }

    .key-end-cta-inner {
        flex-direction: column;
    }

    .key-detail .key-page-hero {
        min-height: auto;
        padding: 18px 20px 34px;
    }

    .key-detail .key-page-hero-inner {
        grid-template-columns: 1fr;
        gap: 18px;
        max-width: 360px;
    }

    .key-detail .key-page-visual {
        display: flex;
        order: -1;
        min-height: 220px;
        justify-content: center;
    }

        .key-detail .key-page-visual .key-render {
            width: 260px !important;
            transform: none;
        }

    .key-detail .key-page-toprow {
        max-width: none;
        gap: 18px;
        justify-content: space-between;
        border-bottom: 0;
        padding-bottom: 0;
    }

    .key-detail .key-page-text h1 {
        max-width: 280px;
        font-size: 1.42rem;
    }

    .key-detail .key-page-description {
        max-width: 270px;
        font-size: .72rem;
        line-height: 1.5;
    }

    .key-detail .key-strip {
        max-width: 360px;
        gap: 14px;
        padding: 9px 0;
    }

        .key-detail .key-strip .strip-text {
            font-size: .42rem;
            white-space: normal;
            text-align: right;
        }

    .key-detail .section-key-benefits {
        padding: 28px 20px 12px;
    }

    .key-detail .key-section-title {
        display: none;
    }

    .key-detail .key-benefits-layout {
        grid-template-columns: 1fr;
        max-width: 360px;
        gap: 18px;
    }

    .key-detail .benefits-pills {
        padding: 32px 22px;
        min-height: auto;
    }

    .key-detail .benefit-pill {
        justify-content: center;
        text-align: center;
        font-size: .62rem;
        padding: 10px 14px;
    }

        .key-detail .benefit-pill small {
            display: none;
        }

    .key-detail .key-benefits-visual {
        min-height: 330px;
    }

        .key-detail .key-benefits-visual .key-render {
            width: 260px !important;
        }

    .key-offer {
        max-width: 360px;
        padding: 0 20px 72px;
    }

    .key-price-row {
        grid-template-columns: 1fr;
        gap: 14px;
        margin: 16px 0;
    }

    .key-payment-options {
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 0 0 18px;
    }

    .payment-card {
        min-height: 104px;
        padding: 18px;
    }

    .key-detail--bronze .key-value-note {
        order: 0;
    }

    .key-price-label,
    .key-price-value {
        min-height: 86px;
        justify-content: center;
        padding: 18px;
        font-size: .72rem;
    }

    .key-price-label {
        align-items: center;
        text-align: center;
    }

    .key-price-value {
        font-size: 1.35rem;
    }

    .key-value-note {
        padding: 22px 18px;
        margin: 12px auto 16px;
        flex-direction: column;
        text-align: center;
    }

        .key-value-note p {
            font-size: .58rem;
            line-height: 1.38;
            max-width: 250px;
        }

    .key-economy-row {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 18px;
        gap: 8px;
    }

        .key-economy-row p {
            font-size: .56rem;
        }

    .key-detail-actions {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        margin-top: 28px;
    }

        .key-detail-actions .btn {
            min-width: 0;
            width: 100%;
            max-width: 300px;
            font-size: .56rem;
        }

    .key-detail .footer-top {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .key-detail .section-key-benefits {
        padding: 24px 14px 10px;
    }

    .key-detail .key-page-hero {
        padding: 12px 18px 18px;
    }

    .key-detail .key-benefits-layout,
    .key-offer {
        width: min(100%, 310px);
        max-width: calc(100vw - 36px);
    }

    .key-detail .key-page-hero-inner {
        width: min(100%, 320px);
        max-width: calc(100vw - 36px);
        gap: 8px;
        justify-items: center;
    }

    .key-detail .key-page-visual {
        min-height: 150px;
    }

        .key-detail .key-page-visual .key-render {
            width: 205px !important;
            flex-basis: 205px;
        }

    .key-detail .key-page-text {
        width: 100%;
        padding-top: 0;
        text-align: center;
    }

    .key-detail .key-page-toprow {
        width: 100%;
        max-width: 320px;
        justify-content: center;
        gap: 8px;
        margin: 0 auto 10px;
        text-align: center;
    }

    .key-detail .key-page-toprow .breadcrumb {
        flex: 1 1 auto;
        text-align: center;
    }

    .key-detail .badge {
        min-width: 68px;
        padding: 7px 12px;
        font-size: .48rem;
        border-radius: 8px;
    }

    .key-detail .key-page-text h1 {
        max-width: 315px;
        margin: 0 auto 9px;
        font-size: 1.08rem;
        line-height: 1.1;
        text-align: center;
    }

    .key-detail .key-page-text h1 strong {
        white-space: normal;
    }

    .key-detail .key-page-description {
        max-width: 305px;
        margin: 0 auto;
        font-size: .6rem;
        line-height: 1.34;
        text-align: center;
    }

    .key-detail .key-benefits-layout {
        gap: 12px;
    }

    .key-detail .benefits-pills {
        padding: 20px 14px;
        border-radius: 12px;
    }

    .key-detail .benefit-pill {
        min-height: 34px;
        padding: 7px 10px;
        border-radius: 8px;
        font-size: .5rem;
        line-height: 1.22;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
    }

    .key-detail--gold .benefit-pill-featured{
        min-height: 34px;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .key-detail .key-benefits-visual {
        min-height: 178px;
        border-radius: 12px;
    }

        .key-detail .key-benefits-visual .key-render {
            width: 180px !important;
        }

    .key-offer {
        padding: 0 0 48px;
    }

    .key-price-row {
        gap: 8px;
        margin: 12px 0;
    }

    .key-price-label,
    .key-price-value {
        min-height: 56px;
        padding: 12px 14px;
        border-radius: 10px;
        font-size: .58rem;
    }

    .key-price-value {
        font-size: 1rem;
    }

    .key-payment-options {
        gap: 8px;
        margin-bottom: 12px;
    }

    .payment-card {
        min-height: 74px;
        padding: 12px 14px;
        border-radius: 10px;
    }

    .payment-card span {
        font-size: .5rem;
        letter-spacing: .06em;
    }

    .payment-card strong {
        margin-top: 6px;
        font-size: .82rem;
    }

    .payment-card small {
        margin-top: 5px;
        font-size: .5rem;
        line-height: 1.28;
    }

    .key-value-note {
        padding: 14px 12px;
        margin: 10px auto 12px;
        border-radius: 10px;
        gap: 8px;
    }

        .key-value-note p {
            max-width: 235px;
            font-family: 'Montserrat', sans-serif;
            font-size: .54rem;
            line-height: 1.42;
            font-weight: 400;
            letter-spacing: 0;
            color: rgba(239,237,232,.72);
            text-transform: none;
        }

        .key-value-note strong {
            font-weight: 700;
        }

    .key-economy-row {
        padding: 12px 14px;
        border-radius: 10px;
    }

        .key-economy-row p {
            width: auto;
            max-width: 245px;
            font-family: 'Montserrat', sans-serif;
            font-size: .54rem;
            line-height: 1.42;
            font-weight: 400;
            letter-spacing: 0;
            color: rgba(239,237,232,.68);
            text-transform: none;
        }

        .key-economy-row strong {
            font-weight: 700;
        }

    .key-detail-actions .btn {
        font-family: 'Montserrat', sans-serif;
        font-size: .58rem;
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: .01em;
        text-transform: uppercase;
    }

    .hero {
        min-height: 560px;
    }

    .hero-bg-img {
        height: 50%;
        object-position: center top;
    }

    .hero-content {
        max-width: 390px;
        padding: 0 18px 74px;
        gap: 7px;
        text-align: center;
    }

    .hero-left,
    .hero-right {
        align-items: center;
    }

    .hero-mobile-logo {
        display: block;
        width: 128px;
        height: auto;
        margin: 0 auto 8px;
        filter: drop-shadow(0 10px 18px rgba(0,0,0,.45));
    }

    .hero-headline {
        font-size: 1.3rem;
        line-height: 1.06;
        max-width: 360px;
        margin: 0 auto;
    }

    .hero-sub {
        max-width: 340px;
        font-size: .66rem;
        line-height: 1.32;
        margin: 15px;
        text-align: center;
    }

    .btn {
        min-width: 0;
        width: min(100%, 330px);
        min-height: 48px;
        padding: 13px 24px;
        font-size: .66rem;
        gap: 9px;
    }

    .section-d2 {
        padding: 38px 18px 34px;
    }

    .d2-header {
        width: min(100%, 310px);
        max-width: calc(100vw - 36px);
        margin-bottom: 18px;
    }

    .d2-cards {
        width: min(100%, 310px);
        max-width: calc(100vw - 36px);
        gap: 22px;
    }

    .d2-text-card {
        min-height: 208px;
        padding: 34px 28px;
        border-radius: 14px;
        border-color: rgba(245,211,144,.14);
        background: rgba(8,8,8,.76);
    }

        .d2-text-card h2 {
            font-size: 1.16rem;
            line-height: 1.14;
            margin-bottom: 17px;
            color: rgba(239,237,232,.82);
            font-weight: 300;
            letter-spacing: -.01em;
        }

        .d2-text-card p {
            font-size: .74rem;
            line-height: 1.46;
            margin-bottom: 14px;
            color: rgba(239,237,232,.78);
            font-weight: 300;
            letter-spacing: 0;
        }

        .d2-text-card .text-gold-grad {
            background: linear-gradient(90deg, #ffe6aa 0%, #f5d390 48%, #fff1cc 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .d2-text-card .d2-p-amber {
            color: rgba(250,248,243,.84) !important;
            font-weight: 300;
        }

            .d2-text-card .d2-p-amber span {
                background: linear-gradient(90deg, #fff0c6 0%, #f5d390 52%, #ffe5a6 100%);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
                font-weight: 400;
            }

    .d2-image-card {
        min-height: 204px;
        border-radius: 14px;
        border-color: rgba(245,211,144,.14);
    }

    .section-tiers {
        padding: 24px 18px 54px;
        overflow: hidden;
    }

    .tiers-heading h2 {
        font-size: .78rem;
        letter-spacing: .08em;
        padding-bottom: 8px;
    }

    .tiers-keys {
        max-width: 320px;
        gap: 22px;
        min-height: auto;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        overflow: hidden;
    }

    .tier-key-link {
        width: 100%;
        max-width: 320px;
        gap: 8px;
        min-height: 170px;
        padding: 0 8px 10px;
        border: 0;
        border-radius: 0;
        background: transparent;
        overflow: hidden;
        justify-content: flex-start;
    }

        .tier-key-link:nth-child(2) {
            max-width: 320px;
        }

        .tier-key-link[data-key-choice="platinum"] {
            order: 2;
            border-color: rgba(170,191,207,.16);
        }

        .tier-key-link[data-key-choice="gold"] {
            order: 3;
            border-color: rgba(245,211,144,.16);
        }

        .tier-key-link[data-key-choice="bronze"] {
            order: 1;
            border-color: rgba(242,163,111,.15);
        }

        .tier-key-link:hover,
        .tier-key-link:nth-child(2):hover {
            transform: none;
        }

        .tier-key-link .key-render {
            width: 100%;
            max-width: 158px;
            overflow: hidden;
        }

    .tiers-keys .key-render-bronze .key-video,
    .tiers-keys .key-render-gold .key-video,
    .tiers-keys .key-render-plat .key-video {
        transform: scale(1.72) rotate(-72deg);
    }

    .tier-pill {
        min-width: 0;
        min-height: 26px;
        padding: 7px 14px;
        font-size: .52rem;
        position: relative;
        z-index: 3;
        margin-top: 0;
        border-radius: 8px;
        letter-spacing: .05em;
    }

    .tier-key-link > .tier-pill {
        display: none;
    }

    .tier-mobile-actions {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        z-index: 4;
    }

    .tier-click-pill {
        min-height: 26px;
        padding: 7px 12px;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        font-family: 'Montserrat', sans-serif;
        font-size: .48rem;
        line-height: 1;
        font-weight: 500;
        letter-spacing: .04em;
        color: rgba(239,237,232,.82);
        background: linear-gradient(180deg, rgba(28,28,28,.88), rgba(10,10,10,.92));
        box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 22px rgba(0,0,0,.32);
        text-transform: uppercase;
        white-space: nowrap;
    }

    .tier-click-pill img {
        width: 10px;
        height: 10px;
        object-fit: contain;
        flex: 0 0 10px;
        opacity: .88;
    }

    .section-benefits {
        padding: 56px 18px 68px;
    }

    .benefits-header {
        max-width: 340px;
        margin-bottom: 28px;
        gap: 14px;
    }

        .benefits-header h2 {
            font-size: 1.35rem;
            line-height: 1.08;
        }

        .benefits-header p {
            font-size: .68rem;
            line-height: 1.58;
        }

    .benefits-wrap {
        display: none;
    }

    .benefits-mobile {
        display: flex;
        max-width: 340px;
        margin: 0 auto;
        flex-direction: column;
        gap: 18px;
    }

    .benefits-mobile-card {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 86px;
        gap: 12px;
        align-items: stretch;
    }

    .benefits-mobile-list,
    .benefits-mobile-column {
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 14px;
        background: rgba(9,9,9,.68);
        overflow: hidden;
    }

        .benefits-mobile-list h3,
        .benefits-mobile-column h3 {
            min-height: 48px;
            display: flex;
            align-items: center;
            padding: 0 16px;
            color: var(--text-primary);
            font-size: .76rem;
            font-weight: 500;
        }

        .benefits-mobile-list ul {
            list-style: none;
        }

        .benefits-mobile-list li {
            min-height: 34px;
            display: flex;
            align-items: center;
            padding: 7px 16px;
            border-top: 1px solid rgba(255,255,255,.07);
            color: rgba(239,237,232,.72);
            font-size: .54rem;
            line-height: 1.22;
        }

    .benefits-mobile-column {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        isolation: isolate;
    }

        .benefits-mobile-column h3 {
            justify-content: center;
            width: 100%;
            padding: 0 8px;
            font-size: .72rem;
            font-weight: 600;
            letter-spacing: .13em;
            text-transform: uppercase;
        }

    .benefits-mobile-card--gold .benefits-mobile-column {
        background: transparent;
        border-color: rgba(255,231,166,.38);
    }

    .benefits-mobile-card--platinum .benefits-mobile-column {
        background: transparent;
        border-color: rgba(190,214,236,.38);
    }

    .benefits-mobile-card--bronze .benefits-mobile-column {
        background: transparent;
        border-color: rgba(245,179,116,.36);
    }

    .benefits-mobile-card--gold .benefits-mobile-column h3 { color: #ffe7a6; }
    .benefits-mobile-card--platinum .benefits-mobile-column h3 { color: #bfd8ef; }
    .benefits-mobile-card--bronze .benefits-mobile-column h3 { color: #f5b374; }

    .mobile-check {
        width: 18px;
        height: 18px;
        min-height: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }

        .mobile-check::before {
            content: '';
            width: 18px;
            height: 18px;
            border-radius: 50%;
            border: 1.8px solid rgba(255,255,255,.8);
            background: rgba(255,255,255,.09);
            box-shadow: 0 0 0 4px rgba(255,255,255,.06);
        }

        .mobile-check::after {
            content: '';
            position: absolute;
            width: 6px;
            height: 9px;
            border-right: 1.8px solid rgba(255,255,255,.92);
            border-bottom: 1.8px solid rgba(255,255,255,.92);
            transform: rotate(42deg);
            top: 11px;
        }

        .mobile-check.is-off::before {
            background: linear-gradient(45deg, transparent calc(50% - 1px), rgba(255,255,255,.86) calc(50% - 1px), rgba(255,255,255,.86) calc(50% + 1px), transparent calc(50% + 1px)), linear-gradient(-45deg, transparent calc(50% - 1px), rgba(255,255,255,.86) calc(50% - 1px), rgba(255,255,255,.86) calc(50% + 1px), transparent calc(50% + 1px)), rgba(0,0,0,.18);
            background-position: center;
            background-repeat: no-repeat;
            background-size: 9px 9px, 9px 9px, auto;
            border-color: rgba(255,255,255,.74);
            box-shadow: 0 0 0 4px rgba(255,255,255,.045);
        }

        .mobile-check.is-off::after {
            display: none;
        }

        .mobile-check.is-off {
            opacity: .72;
        }

    .benefits-mobile-summary {
        display: none;
        grid-template-columns: repeat(3, 1fr);
        gap: 9px;
        margin-top: 2px;
    }

    .benefits-mobile-label {
        grid-column: 1 / -1;
        min-height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 11px 14px;
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 10px;
        background: linear-gradient(135deg, rgba(30,29,27,.88), rgba(15,14,13,.92));
        color: rgba(247,247,246,.82);
        font-family: 'Montserrat', sans-serif;
        font-size: .62rem;
        font-weight: 300;
        line-height: 1.18;
        text-align: center;
    }

        .benefits-mobile-label span {
            display: block;
            width: 100%;
        }

        .benefits-mobile-label strong {
            color: rgba(255,244,218,.92);
            font-weight: 600;
        }

        .benefits-mobile-label br {
            display: block;
        }

    .benefits-mobile-price {
        min-height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        border: 1px solid rgba(255,255,255,.1);
        font-size: .56rem;
        font-weight: 500;
        letter-spacing: -.02em;
    }

    .benefits-mobile-price--bronze {
        color: rgba(255,255,255,.96);
        background: radial-gradient(ellipse 90% 120% at 28% 78%, rgba(245,179,116,.18), transparent 64%), linear-gradient(145deg, rgba(34,25,21,.94), rgba(13,11,10,.98));
        border-color: rgba(245,179,116,.2);
    }

    .benefits-mobile-price--platinum {
        color: rgba(255,255,255,.96);
        background: radial-gradient(ellipse 90% 120% at 50% 78%, rgba(198,224,245,.32), transparent 64%), linear-gradient(145deg, rgba(25,36,50,.96), rgba(7,13,21,.98));
        border-color: rgba(190,214,236,.28);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 22px rgba(190,214,236,.12);
    }

    .benefits-mobile-price--gold {
        color: rgba(255,255,255,.96);
        background: radial-gradient(ellipse 90% 120% at 72% 78%, rgba(255,231,166,.18), transparent 64%), linear-gradient(145deg, rgba(31,27,18,.94), rgba(12,10,7,.98));
        border-color: rgba(255,231,166,.2);
    }

    .course-modal {
        padding: 14px;
        place-items: start center;
    }

    .course-modal-panel {
        width: min(100%, 360px);
        max-height: calc(100dvh - 28px);
        padding: 26px 18px 20px;
        border-radius: 16px;
    }

    .course-select-wrap.is-open::after {
        display: none;
    }

    .course-options {
        position: static;
        margin-top: 8px;
        max-height: clamp(140px, calc(100dvh - 390px), 220px);
    }

    .course-option strong {
        white-space: normal;
    }

    .btn-row {
        flex-direction: column;
        align-items: center;
    }

    .footer-top {
        grid-template-columns: 1fr;
    }

    .benefits-marquee {
        margin-top: 24px;
        padding: 12px 0;
    }

        .benefits-marquee::before,
        .benefits-marquee::after {
            width: 46px;
        }

        .benefits-marquee span {
            padding: 0 28px;
            font-size: .5rem;
        }

    .benefits-bottom {
        flex-direction: column;
        align-items: center;
        margin-top: 48px;
        padding-top: 30px;
        text-align: center;
    }

    .benefits-callout-text {
        align-items: flex-start;
        text-align: left;
    }

    .key-strip {
        gap: 16px;
    }

    .key-detail + .footer {
        padding-top: 42px;
    }

        .key-detail + .footer .footer-inner {
            max-width: 360px;
        }

        .key-detail + .footer .footer-top {
            grid-template-columns: 1fr 1fr;
            gap: 22px;
        }

        .key-detail + .footer .footer-logo {
            grid-column: 1 / -1;
        }

        .key-detail + .footer .footer-col h4 {
            font-size: .52rem;
        }

        .key-detail + .footer .footer-col p,
        .key-detail + .footer .footer-col ul li a,
        .key-detail + .footer .footer-copy {
            font-size: .54rem;
        }
}