/* ═══════════════════════════════════════════════════════════
   DESIGN TOKENS
   ═══════════════════════════════════════════════════════════ */
:root {
    /* Brand */
    --accent:        #003DA5;          /* PROTON royal blue */
    --accent-hot:    #0F5BD9;          /* Bright highlight */
    --accent-deep:   #001D5C;          /* Deep navy */
    --accent-glow:   rgba(0,61,165,.32);
    --accent-soft:   rgba(0,61,165,.10);

    /* Mono palette */
    --ink:           #050505;
    --ink-2:         #0E0E0E;
    --ink-3:         #161616;
    --ink-4:         #1F1F1F;
    --line:          rgba(255,255,255,.08);
    --line-2:        rgba(255,255,255,.14);
    --line-3:        rgba(255,255,255,.22);

    --text:          #F5F5F5;
    --text-mute:     #9A9A9A;
    --text-faded:    #5C5C5C;

    /* Light surfaces */
    --paper:         #FFFFFF;
    --paper-2:       #F4F4F4;
    --paper-3:       #E8E8E8;
    --paper-line:    #E0E0E0;
    --ink-on-paper:  #0A0A0A;
    --mute-on-paper: #555555;

    /* Type */
    --f-display:     'Saira Condensed', 'Arial Narrow', sans-serif;
    --f-body:        'Manrope', system-ui, sans-serif;
    --f-mono:        'JetBrains Mono', ui-monospace, monospace;

    /* Geometry */
    --r-sm: 4px;
    --r-md: 8px;
    --r-lg: 12px;
    --pad-x-page: clamp(20px, 4.5vw, 64px);

    /* Shadows */
    --sh-sm: 0 2px 12px rgba(0,0,0,.4);
    --sh-md: 0 12px 40px rgba(0,0,0,.5);
    --sh-lg: 0 24px 80px rgba(0,0,0,.6);
    --sh-accent: 0 12px 50px rgba(0,61,165,.35);
}

/* ═══════════════════════════════════════════════════════════
   RESET / BASE
   ═══════════════════════════════════════════════════════════ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior: smooth; overflow-x: hidden; -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--f-body);
    background: var(--ink);
    color: var(--text);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    padding-top: 52px;
    font-feature-settings: 'ss01' on, 'cv11' on;
}

img, svg, picture { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button { font-family: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
input, select, textarea { font-family: inherit; }
ul, ol { list-style: none; }

::selection { background: var(--accent); color: #fff; }

/* Type defaults */
h1, h2, h3, h4 {
    font-family: var(--f-display);
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.05;
    text-transform: uppercase;
}
em { font-style: normal; color: var(--accent); }

/* ═══════════════════════════════════════════════════════════
   PROGRESS BAR
   ═══════════════════════════════════════════════════════════ */
#progress-bar {
    position: fixed; top: 0; left: 0;
    height: 2px; width: 0%;
    background: linear-gradient(90deg, var(--accent), var(--accent-hot));
    z-index: 9999;
    transition: width .12s linear;
    box-shadow: 0 0 8px var(--accent-glow);
}

/* ═══════════════════════════════════════════════════════════
   NAV
   ═══════════════════════════════════════════════════════════ */
nav#mainNav {
    position: fixed; top: 0; left: 0; right: 0;
    z-index: 1000;
    height: 52px;
    padding: 0 var(--pad-x-page);
    background: rgba(5,5,5,.7);
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    border-bottom: 1px solid transparent;
    display: flex; align-items: center; justify-content: space-between;
    transition: background .25s ease, border-color .25s ease;
}
nav#mainNav.scrolled {
    background: rgba(5,5,5,.92);
    border-bottom-color: var(--line);
}

.logo {
    display: flex; align-items: center; gap: 10px;
    font-family: var(--f-display);
    font-weight: 800;
    font-size: 1.25rem;
    letter-spacing: 0.04em;
    color: var(--text);
    text-transform: uppercase;
}
.logo-mark {
    width: 26px; height: 26px;
    display: grid; place-items: center;
    flex-shrink: 0;
}
.logo-mark img { width: 100%; height: 100%; object-fit: contain; }
.logo-text { line-height: 1; }
.logo-accent { color: var(--accent); }

.nav-right {
    display: flex; align-items: center; gap: 16px;
}
.nav-phone {
    display: none;
    align-items: center; gap: 8px;
    color: var(--text-mute);
    font-size: .9rem;
    font-weight: 500;
    transition: color .2s;
}
.nav-phone:hover { color: var(--text); }
.nav-phone svg { color: var(--accent); }

.btn-nav {
    position: relative;
    padding: 10px 18px;
    background: transparent;
    color: var(--text);
    font-weight: 700;
    font-size: .85rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border: 1.5px solid var(--line-3);
    transition: all .25s ease;
    overflow: hidden;
}
.btn-nav::before {
    content: '';
    position: absolute; inset: 0;
    background: var(--accent);
    transform: translateX(-101%);
    transition: transform .35s cubic-bezier(.7,0,.3,1);
    z-index: -1;
}
.btn-nav:hover {
    border-color: var(--accent);
    color: #fff;
}
.btn-nav:hover::before { transform: translateX(0); }

@media (min-width: 768px) {
    .nav-phone { display: inline-flex; }
}

/* ═══════════════════════════════════════════════════════════
   BUTTONS — GLOBAL
   ═══════════════════════════════════════════════════════════ */
.btn-primary, .btn-ghost {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    gap: 10px;
    padding: 14px 24px;
    font-family: var(--f-body);
    font-weight: 700;
    font-size: .92rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: all .3s cubic-bezier(.7,0,.3,1);
    overflow: hidden;
    white-space: nowrap;
    border: 1.5px solid transparent;
    min-height: 48px;
}
.btn-primary {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 8px 24px var(--accent-glow);
}
.btn-primary::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg, var(--accent-hot), var(--accent));
    opacity: 0;
    transition: opacity .3s;
    z-index: -1;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 40px var(--accent-glow);
}
.btn-primary:hover::after { opacity: 1; }
.btn-primary:active { transform: translateY(0); }

.btn-ghost {
    background: transparent;
    color: var(--text);
    border-color: var(--line-3);
}
.btn-ghost:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: #fff;
}

.btn-primary.lg, .btn-ghost.lg {
    padding: 18px 32px;
    font-size: 1rem;
    min-height: 56px;
}

/* ═══════════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════════ */
.hero {
    position: relative;
    min-height: calc(100vh - 52px);
    min-height: calc(100svh - 52px);
    background: var(--ink);
    padding: clamp(28px, 5vh, 60px) var(--pad-x-page) 0;
    overflow: hidden;
    isolation: isolate;
}

/* Background atmospherics */
.hero-grain {
    position: absolute; inset: 0;
    pointer-events: none;
    opacity: .35;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .12 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
    z-index: 1;
}
.hero-glow {
    position: absolute;
    top: -10%; left: -15%;
    width: 60vmax; height: 60vmax;
    background: radial-gradient(circle, var(--accent-glow) 0%, transparent 60%);
    filter: blur(60px);
    pointer-events: none;
    z-index: 0;
    will-change: transform;
}
.hero-glow-2 {
    position: absolute;
    bottom: -20%; right: -20%;
    width: 50vmax; height: 50vmax;
    background: radial-gradient(circle, rgba(0,29,92,.4) 0%, transparent 65%);
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
    will-change: transform;
}
.hero-glow-top {
    position: absolute;
    top: 40%; left: 30%;
    width: 30vmax; height: 30vmax;
    background: radial-gradient(circle, rgba(15,91,217,.15) 0%, transparent 70%);
    filter: blur(60px);
    pointer-events: none;
    z-index: 0;
}
.hero-grid-lines {
    position: absolute; inset: 0;
    background-image:
        linear-gradient(var(--line) 1px, transparent 1px),
        linear-gradient(90deg, var(--line) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
    pointer-events: none;
    opacity: .4;
    z-index: 0;
}

.hero-inner {
    position: relative; z-index: 2;
    max-width: 1400px; margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
    padding-bottom: 60px;
}

.hero-badge {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 8px 14px;
    background: rgba(0,61,165,.10);
    border: 1px solid rgba(0,61,165,.4);
    color: #fff;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 28px;
    width: fit-content;
}
.hero-badge-dot {
    width: 6px; height: 6px;
    background: var(--accent);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(0,61,165,.2);
    animation: pulse 1.6s ease-in-out infinite;
}
@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(0,61,165,.2); }
    50%      { box-shadow: 0 0 0 8px rgba(0,61,165,0); }
}

.hero-headline {
    font-family: var(--f-display);
    font-weight: 900;
    font-size: clamp(3rem, 11vw, 8.5rem);
    line-height: .92;
    letter-spacing: -0.015em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 28px;
}
.hero-headline .line {
    display: block;
    overflow: hidden;
}
.hero-headline .accent {
    color: var(--accent);
    position: relative;
}
.hero-headline .dot {
    display: inline-block;
    color: var(--accent);
    margin-left: 4px;
}

.hero-sub {
    color: var(--text-mute);
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.6;
    max-width: 560px;
    margin-bottom: 36px;
    font-weight: 400;
}

.hero-cta {
    display: flex; flex-wrap: wrap; gap: 12px;
    margin-bottom: 48px;
}

.scroll-indicator {
    display: none;
    align-items: center; gap: 12px;
    color: var(--text-mute);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 40px;
    cursor: pointer;
    transition: color .25s;
}
.scroll-indicator:hover { color: var(--text); }
.scroll-line {
    position: relative;
    width: 60px; height: 1px;
    background: var(--line-2);
    overflow: hidden;
}
.scroll-line::before {
    content: '';
    position: absolute; top: 0; left: 0;
    width: 30%; height: 100%;
    background: var(--accent);
    animation: scrollSweep 2.6s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes scrollSweep {
    0% { left: -30%; }
    100% { left: 100%; }
}

.hero-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: var(--line);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 0;
}
.hero-stat {
    background: var(--ink);
    padding: 22px 18px;
    position: relative;
}
.hero-stat h4 {
    font-family: var(--f-display);
    font-weight: 800;
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    color: var(--accent);
    margin-bottom: 4px;
    letter-spacing: -0.01em;
    line-height: 1;
}
.hero-stat p {
    color: var(--text-mute);
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.3;
}

/* Hero image */
.hero-img-col {
    position: relative;
    margin-top: 20px;
}
.hero-img-frame {
    position: relative;
    aspect-ratio: 16 / 11;
    background: linear-gradient(135deg, var(--ink-2), var(--ink));
    border: 1px solid var(--line);
    overflow: hidden;
    box-shadow: var(--sh-md);
}
.hero-img-frame::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 60% 80%, var(--accent-soft), transparent 70%);
    z-index: 1;
}
.hero-car-img {
    width: 100%; height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 2;
    transform: scale(1.02);
    transition: transform 1.2s cubic-bezier(.7,0,.3,1), opacity .8s ease;
    opacity: 0;
}
.hero-img-col picture.in-view .hero-car-img {
    opacity: 1;
    transform: scale(1);
}
.hero-img-col picture {
    display: block;
    width: 100%; height: 100%;
}
.hero-img-bracket {
    position: absolute;
    width: 28px; height: 28px;
    border: 2px solid var(--accent);
    z-index: 3;
}
.hero-img-bracket.tl { top: 12px; left: 12px; border-right: 0; border-bottom: 0; }
.hero-img-bracket.tr { top: 12px; right: 12px; border-left: 0; border-bottom: 0; }
.hero-img-bracket.bl { bottom: 12px; left: 12px; border-right: 0; border-top: 0; }
.hero-img-bracket.br { bottom: 12px; right: 12px; border-left: 0; border-top: 0; }

.hero-img-tag {
    position: absolute;
    bottom: 20px; left: 20px;
    padding: 10px 14px;
    background: rgba(5,5,5,.85);
    backdrop-filter: blur(8px);
    border-left: 3px solid var(--accent);
    z-index: 4;
    font-family: var(--f-display);
    line-height: 1;
}
.hero-img-tag .tag-label {
    display: block;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    color: var(--accent);
    margin-bottom: 4px;
}
.hero-img-tag .tag-name {
    display: block;
    font-size: 1rem;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.04em;
}

/* Marquee */
.hero-marquee {
    position: relative;
    z-index: 2;
    overflow: hidden;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--ink);
    padding: 14px 0;
    margin: 0 calc(-1 * var(--pad-x-page));
}
.marquee-track {
    display: flex; align-items: center; gap: 36px;
    width: max-content;
    animation: marquee 28s linear infinite;
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.18em;
    color: var(--text-mute);
}
.marquee-track .dot { color: var(--accent); font-size: .7rem; }
@keyframes marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Scroll-down hint — below hero stats, mobile portrait only */
.scroll-down-hint {
    display: none;
    justify-content: center;
    margin-top: 16px;
    color: var(--text-mute);
    padding: 8px;
    animation: scrollBounce 1.8s ease-in-out infinite;
    transition: color .25s;
}
.scroll-down-hint:hover { color: var(--accent); }
.scroll-down-hint svg { display: block; }

@keyframes scrollBounce {
    0%, 100% { transform: translateY(0);   opacity: .5; }
    50%       { transform: translateY(8px); opacity: 1;  }
}

@media (max-width: 767px) and (orientation: portrait) {
    .scroll-down-hint { display: flex; }
}

/* ── Hero mobile: tighten spacing so stats visible without scrolling ── */
@media (max-width: 767px) and (orientation: portrait) {
    .hero { padding-top: 18px; }
    .hero-inner { gap: 0; padding-bottom: 0; }
    .hero-badge { margin-bottom: 14px; padding: 6px 12px; }
    .hero-headline { margin-bottom: 14px; font-size: clamp(2.6rem, 10vw, 3.8rem); }
    .hero-sub { margin-bottom: 18px; font-size: .95rem; line-height: 1.5; }
    .hero-cta { margin-bottom: 22px; }
    .hero-stats-col { margin-top: 4px; margin-bottom: 80px; }
}

/* Mobile landscape — text only, no image card, no stats */
@media (max-width: 767px) and (orientation: landscape) {
    .hero {
        min-height: 100vh;
        min-height: 100svh;
    }
    .hero-img-col   { display: none; }
    .hero-stats-col { display: none; }
    .hero-inner     { padding-bottom: 40px; }
    .hero-headline  { font-size: clamp(2rem, 7vw, 3.2rem); }
}

/* Tablet landscape + desktop — full-bleed photo hero, stats 2×2 top-right */
@media (min-width: 768px) and (orientation: landscape),
       (min-width: 980px) {
    .hero {
        background-image:
            linear-gradient(105deg,
                rgba(5,5,5,1)   0%,
                rgba(5,5,5,.90) 30%,
                rgba(5,5,5,.20) 65%,
                transparent     100%),
            url('assets/hero-bg.webp');
        background-size: cover;
        background-position: right center;
        background-repeat: no-repeat;
    }
    .hero-glow-2  { display: none; }
    .hero-img-col { display: none; }
    .hero-inner {
        grid-template-columns: 1fr auto;
        gap: 40px;
        padding-bottom: 80px;
        align-items: start;          /* both columns pin to top */
    }
    /* Smaller headline — cars visible */
    .hero-headline { font-size: clamp(2.2rem, 4.2vw, 4.4rem); }
    .hero-text-col { max-width: 560px; }
    .scroll-indicator { display: inline-flex; }

    /* Stats — 2×2 glass block at top-right, above the cars */
    .hero-stats-col {
        display: flex;
        align-items: flex-start;
    }
    .hero-stats {
        grid-template-columns: 1fr 1fr;
        gap: 1px;
        background: rgba(255,255,255,.10);
        border: 1px solid rgba(255,255,255,.14);
        min-width: 300px;
    }
    .hero-stat {
        background: rgba(5,5,5,.60);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        padding: 22px 24px;
    }
}

/* Desktop wide */
@media (min-width: 1200px) {
    .hero-headline  { font-size: clamp(2.6rem, 4.5vw, 5rem); }
    .hero-text-col  { max-width: 640px; }
    .hero-stats-col { max-width: 640px; }
}

/* ═══════════════════════════════════════════════════════════
   FORM SECTION
   ═══════════════════════════════════════════════════════════ */
.form-section {
    position: relative;
    background: var(--paper-2);
    padding: 80px var(--pad-x-page);
    overflow: hidden;
}
.form-section-bg {
    position: absolute;
    top: -1px; left: 0; right: 0; height: 80px;
    background: var(--ink);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 100%);
}

.form-wrap {
    position: relative; z-index: 2;
    max-width: 820px; margin: 0 auto;
}
.form-card {
    background: var(--paper);
    border: 1px solid var(--paper-line);
    padding: clamp(28px, 5vw, 52px);
    position: relative;
    box-shadow: 0 30px 80px rgba(0,0,0,.08);
    overflow: hidden;
}
.form-card::before {
    content: '';
    position: absolute; top: 0; left: 0;
    width: 80px; height: 4px;
    background: var(--accent);
}

.form-card-header { margin-bottom: 32px; }
.form-tag {
    display: inline-flex; align-items: center; gap: 10px;
    color: var(--accent);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.tag-bar {
    width: 24px; height: 2px;
    background: var(--accent);
    display: inline-block;
}
.form-card-header h2 {
    color: var(--ink-on-paper);
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    line-height: 1;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
}
.form-card-header p {
    color: var(--mute-on-paper);
    font-size: 1rem;
    line-height: 1.6;
    max-width: 520px;
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}
.form-group { position: relative; }
.form-group.full { grid-column: 1 / -1; }
.form-group label {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute-on-paper);
    margin-bottom: 8px;
}
.form-group input,
.form-group select {
    width: 100%;
    padding: 14px 16px;
    border: 1.5px solid var(--paper-line);
    background: var(--paper);
    color: var(--ink-on-paper);
    font-size: 1rem;
    font-weight: 500;
    transition: all .2s;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
}
.form-group select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23555' stroke-width='2'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
}
.form-group input:focus,
.form-group select:focus {
    outline: 0;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(0,61,165,.12);
}
.form-group input::placeholder { color: #B0B0B0; }

.btn-submit {
    width: 100%;
    display: flex; align-items: center; justify-content: center;
    gap: 12px;
    padding: 18px;
    background: var(--ink);
    color: #fff;
    font-family: var(--f-body);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all .3s cubic-bezier(.7,0,.3,1);
    position: relative;
    overflow: hidden;
}
.btn-submit::before {
    content: '';
    position: absolute; inset: 0;
    background: var(--accent);
    transform: translateX(-101%);
    transition: transform .35s cubic-bezier(.7,0,.3,1);
    z-index: 0;
}
.btn-submit > * { position: relative; z-index: 1; }
.btn-submit:hover::before { transform: translateX(0); }
.btn-submit:hover {
    box-shadow: 0 12px 32px var(--accent-glow);
    transform: translateY(-2px);
}

.form-trust {
    display: flex; flex-wrap: wrap; gap: 16px 24px;
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--paper-line);
}
.trust-item {
    display: inline-flex; align-items: center; gap: 8px;
    color: var(--mute-on-paper);
    font-size: .82rem;
    font-weight: 500;
}
.trust-item svg { color: var(--accent); flex-shrink: 0; }

.form-loading {
    display: none;
    position: absolute; inset: 0;
    background: rgba(255,255,255,.96);
    z-index: 10;
    align-items: center; justify-content: center;
    flex-direction: column;
    gap: 16px;
}
.form-loading p {
    color: var(--mute-on-paper);
    font-size: .9rem; font-weight: 600;
}
.spinner {
    width: 40px; height: 40px;
    border: 3px solid var(--paper-line);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin .9s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

@media (min-width: 600px) {
    .form-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   SECTION HEADERS — Shared
   ═══════════════════════════════════════════════════════════ */
.section-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 var(--pad-x-page);
}
.section-inner.narrow { max-width: 920px; }

.section-header {
    text-align: left;
    max-width: 760px;
    margin-bottom: 56px;
}
.s-tag {
    display: inline-flex; align-items: center; gap: 10px;
    color: var(--accent);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.s-tag.light { color: var(--accent-hot); }
.s-tag .tag-bar {
    width: 28px; height: 2px;
    background: var(--accent);
}
.s-title {
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1;
    color: var(--ink-on-paper);
    margin-bottom: 14px;
    letter-spacing: -0.015em;
}
.s-title.light { color: #fff; }
.s-sub {
    color: var(--mute-on-paper);
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 600px;
}
.s-sub.light { color: var(--text-mute); }

/* ═══════════════════════════════════════════════════════════
   PROFILE SECTION
   ═══════════════════════════════════════════════════════════ */
.profile-section {
    background: var(--ink);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}
.profile-section::before {
    content: '';
    position: absolute;
    top: 20%; right: -10%;
    width: 50vmax; height: 50vmax;
    background: radial-gradient(circle, var(--accent-soft) 0%, transparent 60%);
    filter: blur(80px);
    pointer-events: none;
}

.profile-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: center;
    position: relative;
}

.profile-img-col {
    position: relative;
    max-width: 480px;
    margin: 0 auto;
    width: 100%;
}
.profile-img-frame {
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--ink-2);
}
.profile-img-frame img {
    width: 100%; height: 100%;
    object-fit: cover;
    filter: contrast(1.05) saturate(1.05);
}
.profile-bracket {
    position: absolute;
    width: 32px; height: 32px;
    border: 3px solid var(--accent);
    z-index: 2;
    pointer-events: none;
}
.profile-bracket.tl { top: -2px; left: -2px; border-right: 0; border-bottom: 0; }
.profile-bracket.tr { top: -2px; right: -2px; border-left: 0; border-bottom: 0; }
.profile-bracket.bl { bottom: -2px; left: -2px; border-right: 0; border-top: 0; }
.profile-bracket.br { bottom: -2px; right: -2px; border-left: 0; border-top: 0; }

.profile-badge-float {
    position: absolute;
    bottom: -24px; right: -16px;
    background: var(--ink-2);
    border: 1px solid var(--line-2);
    border-left: 3px solid var(--accent);
    padding: 14px 18px;
    display: flex; align-items: center; gap: 12px;
    box-shadow: var(--sh-md);
    z-index: 3;
    max-width: 280px;
}
.badge-icon {
    color: var(--accent);
    flex-shrink: 0;
}
.badge-text {
    line-height: 1.2;
}
.badge-text strong {
    display: block;
    font-family: var(--f-display);
    font-weight: 700;
    color: #fff;
    font-size: .95rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}
.badge-text span {
    display: block;
    color: var(--text-mute);
    font-size: .78rem;
    font-weight: 500;
}

.profile-content {
    color: var(--text);
}
.profile-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    color: var(--accent);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.eyebrow-bar {
    width: 28px; height: 2px;
    background: var(--accent);
}
.profile-name {
    font-size: clamp(2.4rem, 5vw, 3.5rem);
    color: var(--accent);
    margin-bottom: 8px;
    letter-spacing: 0.01em;
}
.profile-title {
    font-size: clamp(1.6rem, 3.2vw, 2.2rem);
    color: #fff;
    line-height: 1.1;
    margin-bottom: 24px;
    text-transform: none;
    font-family: var(--f-display);
    font-weight: 700;
    letter-spacing: -0.01em;
}
.profile-content p {
    color: var(--text-mute);
    font-size: 1.02rem;
    line-height: 1.7;
    margin-bottom: 16px;
    max-width: 540px;
}
.profile-creds {
    display: flex; align-items: stretch;
    margin-top: 32px;
    padding: 24px;
    background: var(--ink-2);
    border: 1px solid var(--line);
}
.cred {
    flex: 1;
    text-align: left;
}
.cred-num {
    display: block;
    font-family: var(--f-display);
    font-weight: 800;
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    color: var(--accent);
    line-height: 1;
    margin-bottom: 6px;
}
.cred-label {
    display: block;
    color: var(--text-mute);
    font-size: .76rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.3;
}
.cred-divider {
    width: 1px;
    background: var(--line-2);
    margin: 0 16px;
}

@media (min-width: 900px) {
    .profile-grid {
        grid-template-columns: 0.85fr 1fr;
        gap: 72px;
    }
    .profile-img-col { margin: 0; }
    .profile-creds { padding: 28px 32px; }
}

/* ═══════════════════════════════════════════════════════════
   FEATURES SECTION
   ═══════════════════════════════════════════════════════════ */
.features-section {
    background: var(--paper);
    padding: 100px 0;
    position: relative;
}

.features-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    background: var(--paper-line);
    border: 1px solid var(--paper-line);
}

.feature-card {
    position: relative;
    background: var(--paper);
    padding: 36px 28px;
    transition: background .3s ease;
    overflow: hidden;
}
.feature-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: var(--accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .4s cubic-bezier(.7,0,.3,1);
}
.feature-card:hover::before { transform: scaleX(1); }
.feature-card:hover { background: #FAFAFA; }

.f-num {
    font-family: var(--f-mono);
    font-size: .8rem;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: 0.08em;
    margin-bottom: 24px;
    display: block;
}

.f-icon {
    width: 48px; height: 48px;
    color: var(--ink-on-paper);
    margin-bottom: 20px;
    display: grid; place-items: center;
}
.f-icon svg {
    width: 100%; height: 100%;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.feature-card h3 {
    font-size: 1.35rem;
    color: var(--ink-on-paper);
    margin-bottom: 10px;
    letter-spacing: -0.005em;
    text-transform: none;
    font-weight: 700;
}
.feature-card p {
    color: var(--mute-on-paper);
    font-size: .95rem;
    line-height: 1.65;
}

@media (min-width: 640px) {
    .features-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 980px) {
    .features-grid { grid-template-columns: repeat(3, 1fr); }
    .feature-card { padding: 44px 32px; }
}

/* ═══════════════════════════════════════════════════════════
   MODELS SECTION
   ═══════════════════════════════════════════════════════════ */
.models-section {
    background: var(--ink);
    padding: 100px 0;
    position: relative;
    color: var(--text);
}
.models-section .s-title { color: #fff; }
.models-section .s-sub { color: var(--text-mute); }

.models-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.model-card {
    background: var(--ink-2);
    border: 1px solid var(--line);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color .35s, transform .35s;
}
.model-card:hover {
    border-color: var(--line-3);
    transform: translateY(-4px);
}

.model-img-wrap {
    position: relative;
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, var(--ink-3), var(--ink-2));
    overflow: hidden;
}
.model-img-wrap::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(circle at 50% 100%, var(--accent-soft), transparent 60%);
    z-index: 1;
}
.model-img-wrap img {
    width: 100%; height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 2;
    transition: transform .6s cubic-bezier(.7,0,.3,1);
}
.model-card:hover .model-img-wrap img { transform: scale(1.06); }

.model-tag {
    position: absolute;
    top: 14px; left: 14px;
    z-index: 3;
    padding: 5px 10px;
    background: rgba(5,5,5,.85);
    backdrop-filter: blur(6px);
    color: #fff;
    font-family: var(--f-display);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-left: 2px solid var(--text-mute);
}
.model-tag.hot { border-left-color: var(--accent); color: var(--accent-hot); }

.model-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.model-body h3 {
    font-size: 1.5rem;
    color: #fff;
    margin-bottom: 8px;
    letter-spacing: 0.005em;
}
.model-blurb {
    color: var(--text-mute);
    font-size: .92rem;
    margin-bottom: 20px;
    line-height: 1.5;
}

.model-pricing {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    margin-bottom: 20px;
}
.model-pricing > div { flex: 1; }
.price-label {
    display: block;
    color: var(--text-faded);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.price-value {
    display: block;
    font-family: var(--f-display);
    font-weight: 700;
    color: #fff;
    font-size: 1.15rem;
    letter-spacing: 0;
}
.price-value.accent { color: var(--accent-hot); }

.model-actions {
    margin-top: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.model-detail {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 6px;
    padding: 11px 10px;
    background: transparent;
    border: 1.5px solid var(--line-2);
    color: var(--text-mute);
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all .25s ease;
}
.model-detail:hover {
    border-color: var(--line-3);
    color: var(--text);
}
.model-detail svg { transition: transform .25s; }
.model-detail:hover svg { transform: translateX(3px); }
.model-cta {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 6px;
    padding: 11px 10px;
    background: var(--accent);
    border: 1.5px solid var(--accent);
    color: #fff;
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    transition: all .25s ease;
}
.model-cta:hover {
    background: var(--accent-hot);
    border-color: var(--accent-hot);
    box-shadow: 0 8px 20px var(--accent-glow);
}
.model-cta svg { transition: transform .25s; }
.model-cta:hover svg { transform: translateX(3px); }

/* EV segment divider */
.ev-segment {
    grid-column: 1 / -1;
    display: flex; align-items: center; gap: 16px;
    padding: 20px 0 8px;
}
.ev-segment-label {
    font-family: var(--f-display);
    font-weight: 800;
    font-size: .78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #2ECC71;
    white-space: nowrap;
    display: flex; align-items: center; gap: 8px;
}
.ev-segment-label::before {
    content: '';
    display: inline-block;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #2ECC71;
    box-shadow: 0 0 8px #2ECC7180;
}
.ev-segment-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(46,204,113,.4), transparent);
}

/* EV tag colour override */
.model-tag.ev {
    background: #2ECC71;
    color: #000;
}

@media (min-width: 640px) {
    .models-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1000px) {
    .models-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ═══════════════════════════════════════════════════════════
   PROCESS TIMELINE
   ═══════════════════════════════════════════════════════════ */
.process-section {
    background: var(--paper);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}
.process-glow {
    position: absolute;
    top: 30%; left: 50%;
    transform: translateX(-50%);
    width: 80vmax; height: 30vmax;
    background: radial-gradient(ellipse, rgba(0,61,165,.05), transparent 65%);
    pointer-events: none;
}

.process-timeline {
    position: relative;
    max-width: 880px;
    margin: 0 auto;
}
.process-timeline::before {
    content: '';
    position: absolute;
    top: 12px; bottom: 12px;
    left: 18px;
    width: 2px;
    background: linear-gradient(to bottom, var(--accent), var(--paper-line) 80%);
}

.process-step {
    position: relative;
    padding-left: 60px;
    padding-bottom: 36px;
    counter-increment: step;
}
.process-step:last-child { padding-bottom: 0; }

.process-num {
    position: absolute;
    top: 0; left: 0;
    width: 38px; height: 38px;
    background: var(--ink);
    color: #fff;
    font-family: var(--f-display);
    font-weight: 800;
    font-size: .95rem;
    display: grid; place-items: center;
    z-index: 2;
    border: 2px solid var(--accent);
    letter-spacing: 0;
}
.process-step:hover .process-num {
    background: var(--accent);
}

.process-content h3 {
    font-size: 1.35rem;
    color: var(--ink-on-paper);
    margin-bottom: 8px;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 700;
}
.process-content p {
    color: var(--mute-on-paper);
    font-size: .98rem;
    line-height: 1.65;
    max-width: 540px;
}

@media (min-width: 800px) {
    .process-timeline::before { left: 50%; transform: translateX(-50%); }
    .process-step {
        width: 50%;
        padding-left: 0;
        padding-bottom: 48px;
    }
    .process-step:nth-child(odd) {
        padding-right: 56px;
        text-align: right;
        margin-right: auto;
    }
    .process-step:nth-child(even) {
        padding-left: 56px;
        margin-left: auto;
    }
    .process-step:nth-child(odd) .process-num {
        left: auto; right: -19px;
    }
    .process-step:nth-child(even) .process-num {
        left: -19px;
    }
    .process-step:nth-child(odd) .process-content p { margin-left: auto; }
}

/* ═══════════════════════════════════════════════════════════
   CALCULATOR
   ═══════════════════════════════════════════════════════════ */
.calc-section {
    background: var(--ink);
    padding: 100px 0;
    color: var(--text);
    position: relative;
    overflow: hidden;
}
.calc-section::before {
    content: '';
    position: absolute;
    top: 50%; right: -10%;
    width: 50vmax; height: 50vmax;
    background: radial-gradient(circle, var(--accent-soft) 0%, transparent 60%);
    filter: blur(80px);
    pointer-events: none;
}

.calc-card {
    position: relative;
    background: var(--ink-2);
    border: 1px solid var(--line);
    padding: clamp(24px, 4vw, 44px);
    box-shadow: var(--sh-lg);
}
.calc-card::before {
    content: '';
    position: absolute; top: 0; left: 0;
    width: 80px; height: 4px;
    background: var(--accent);
}

.calc-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}

.calc-block { margin-bottom: 24px; }
.calc-block:last-child { margin-bottom: 0; }

.calc-row {
    display: flex; align-items: baseline; justify-content: space-between;
    margin-bottom: 12px;
}
.calc-label {
    font-family: var(--f-display);
    font-weight: 600;
    font-size: .92rem;
    color: var(--text);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.calc-value {
    font-family: var(--f-mono);
    font-weight: 700;
    font-size: 1rem;
    color: var(--accent-hot);
}

.calc-models {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin-top: 12px;
}
.calc-model-btn {
    padding: 8px 14px;
    border: 1px solid var(--line-2);
    background: transparent;
    color: var(--text-mute);
    font-weight: 600;
    font-size: .85rem;
    letter-spacing: 0.04em;
    transition: all .2s ease;
}
.calc-model-btn:hover { color: #fff; border-color: var(--line-3); }
.calc-model-btn.active {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
}

.calc-slider {
    width: 100%;
    -webkit-appearance: none;
    appearance: none;
    height: 4px;
    background: var(--ink-4);
    outline: 0;
    cursor: pointer;
}
.calc-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px; height: 22px;
    background: var(--accent);
    border: 3px solid #fff;
    cursor: pointer;
    box-shadow: 0 0 0 4px rgba(0,61,165,.2);
    transition: transform .15s, box-shadow .15s;
}
.calc-slider::-webkit-slider-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 0 0 8px rgba(0,61,165,.25);
}
.calc-slider::-moz-range-thumb {
    width: 22px; height: 22px;
    background: var(--accent);
    border: 3px solid #fff;
    cursor: pointer;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(0,61,165,.2);
}

.calc-range-marks {
    display: flex; justify-content: space-between;
    margin-top: 8px;
    font-family: var(--f-mono);
    font-size: .72rem;
    color: var(--text-faded);
}

/* Result panel */
.calc-result {
    background: var(--ink);
    border: 1px solid var(--line);
    padding: 28px 24px;
    position: relative;
    overflow: hidden;
}
.calc-result::before {
    content: '';
    position: absolute; top: 0; right: 0;
    width: 100px; height: 100px;
    background: radial-gradient(circle, var(--accent-soft), transparent 70%);
    pointer-events: none;
}
.calc-result-tag {
    color: var(--accent-hot);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.calc-result-model {
    font-family: var(--f-display);
    font-weight: 800;
    font-size: 1.05rem;
    color: #fff;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.calc-result-amount {
    display: flex; align-items: baseline; gap: 6px;
    color: #fff;
    font-family: var(--f-display);
    font-weight: 800;
    line-height: 1;
    margin-bottom: 24px;
}
.calc-result-amount .rm {
    font-size: 1.4rem;
    color: var(--accent-hot);
}
.calc-result-amount #calcMonthly {
    font-size: clamp(2.6rem, 5vw, 3.6rem);
    color: #fff;
    letter-spacing: -0.02em;
}
.calc-result-amount .per {
    font-size: 1rem;
    color: var(--text-mute);
    font-family: var(--f-body);
    font-weight: 500;
}

.calc-breakdown {
    border-top: 1px solid var(--line);
    padding-top: 16px;
    margin-bottom: 24px;
}
.bd-row {
    display: flex; justify-content: space-between;
    padding: 6px 0;
    font-size: .9rem;
}
.bd-row > span:first-child {
    color: var(--text-mute);
    font-weight: 500;
}
.bd-row > span:last-child {
    color: #fff;
    font-family: var(--f-mono);
    font-weight: 500;
}

.calc-wa-btn {
    width: 100%;
    display: flex; align-items: center; justify-content: center;
    gap: 10px;
    padding: 16px;
    background: var(--accent);
    color: #fff;
    font-weight: 700;
    font-size: .92rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: all .3s cubic-bezier(.7,0,.3,1);
    box-shadow: 0 8px 24px var(--accent-glow);
}
.calc-wa-btn:hover {
    background: var(--accent-hot);
    transform: translateY(-2px);
    box-shadow: 0 14px 36px var(--accent-glow);
}

.calc-disclaimer {
    margin-top: 14px;
    text-align: center;
    color: var(--text-faded);
    font-size: .76rem;
    line-height: 1.4;
}

@media (min-width: 880px) {
    .calc-grid {
        grid-template-columns: 1.1fr 1fr;
        gap: 48px;
    }
}

/* ═══════════════════════════════════════════════════════════
   TESTIMONIALS
   ═══════════════════════════════════════════════════════════ */
.testimonials-section {
    background: var(--paper);
    padding: 100px 0;
}

.testimonials-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.testi-card {
    position: relative;
    background: var(--paper);
    border: 1px solid var(--paper-line);
    padding: 32px;
    transition: border-color .25s, transform .35s;
}
.testi-card:hover {
    border-color: var(--ink-on-paper);
    transform: translateY(-4px);
}
.testi-card.featured {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
}
.testi-card.featured blockquote { color: rgba(255,255,255,.92); }
.testi-card.featured footer strong { color: #fff; }
.testi-card.featured footer span { color: var(--text-mute); }

.testi-stars {
    display: flex; gap: 4px;
    margin-bottom: 18px;
    color: var(--accent);
}
.testi-stars svg { width: 16px; height: 16px; }

.testi-card blockquote {
    color: var(--ink-on-paper);
    font-size: 1.02rem;
    line-height: 1.65;
    margin-bottom: 24px;
    font-style: normal;
    font-weight: 500;
}

.testi-card footer {
    border-top: 1px solid var(--paper-line);
    padding-top: 16px;
}
.testi-card.featured footer {
    border-top-color: var(--line-2);
}
.testi-card footer strong {
    display: block;
    font-family: var(--f-display);
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--ink-on-paper);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin-bottom: 2px;
}
.testi-card footer span {
    color: var(--mute-on-paper);
    font-size: .82rem;
    font-weight: 500;
}

@media (min-width: 640px) {
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 980px) {
    .testimonials-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ═══════════════════════════════════════════════════════════
   FAQ
   ═══════════════════════════════════════════════════════════ */
.faq-section {
    background: var(--ink);
    padding: 100px 0;
    color: var(--text);
}
.faq-section .s-title { color: #fff; }
.faq-section .s-sub { color: var(--text-mute); }

.faq-list {
    border-top: 1px solid var(--line);
}
.faq-item {
    border-bottom: 1px solid var(--line);
}
.faq-q {
    width: 100%;
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
    padding: 22px 0;
    text-align: left;
    font-family: var(--f-display);
    font-weight: 600;
    font-size: 1.05rem;
    color: #fff;
    letter-spacing: 0.005em;
    text-transform: none;
    transition: color .25s;
}
.faq-q:hover { color: var(--accent-hot); }
.faq-icon {
    transition: transform .35s cubic-bezier(.7,0,.3,1);
    color: var(--accent);
    flex-shrink: 0;
}
.faq-item.open .faq-q { color: var(--accent-hot); }
.faq-item.open .faq-icon { transform: rotate(180deg); }
.faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s cubic-bezier(.7,0,.3,1);
}
.faq-a p {
    color: var(--text-mute);
    font-size: 1rem;
    line-height: 1.7;
    padding: 0 0 22px;
    max-width: 720px;
}

/* ═══════════════════════════════════════════════════════════
   FINAL CTA
   ═══════════════════════════════════════════════════════════ */
.final-cta {
    position: relative;
    background: var(--ink);
    padding: 100px 0;
    overflow: hidden;
    isolation: isolate;
}
.final-cta-glow {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse at 70% 40%, var(--accent-glow) 0%, transparent 50%),
        radial-gradient(ellipse at 20% 80%, rgba(0,29,92,.4) 0%, transparent 50%);
    filter: blur(60px);
    pointer-events: none;
    z-index: -1;
}
.final-cta::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    z-index: -1;
}

.final-cta-inner {
    text-align: center;
    max-width: 880px;
    margin: 0 auto;
}
.final-cta-tag {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 8px 16px;
    background: rgba(0,61,165,.10);
    border: 1px solid rgba(0,61,165,.4);
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 28px;
}
.dot-pulse {
    width: 6px; height: 6px;
    background: var(--accent-hot);
    border-radius: 50%;
    animation: pulse 1.6s ease-in-out infinite;
}
.final-cta-inner h2 {
    font-size: clamp(2.4rem, 7vw, 5rem);
    line-height: .95;
    color: #fff;
    margin-bottom: 24px;
    letter-spacing: -0.02em;
}
.final-cta-inner p {
    color: var(--text-mute);
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 36px;
    max-width: 560px;
    margin-inline: auto;
}
.final-cta-buttons {
    display: flex; flex-wrap: wrap; gap: 12px;
    justify-content: center;
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */
body > footer {
    background: #020202;
    border-top: 1px solid var(--line);
    color: var(--text-mute);
    padding: 64px 0 0;
}
.footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 var(--pad-x-page);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    padding-bottom: 56px;
    border-bottom: 1px solid var(--line);
}

.footer-brand .footer-logo {
    display: flex; align-items: center; gap: 10px;
    font-family: var(--f-display);
    font-weight: 800;
    font-size: 1.25rem;
    color: #fff;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 24px;
}
.footer-brand h3 {
    font-size: 1.6rem;
    color: #fff;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}
.footer-desg {
    color: var(--accent);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 14px;
}
.footer-blurb {
    color: var(--text-mute);
    font-size: .92rem;
    line-height: 1.65;
    margin-bottom: 22px;
    max-width: 380px;
}

.socials {
    display: flex; gap: 8px;
}
.social-btn {
    width: 38px; height: 38px;
    display: grid; place-items: center;
    background: var(--ink-2);
    border: 1px solid var(--line);
    color: var(--text-mute);
    transition: all .25s;
}
.social-btn svg { width: 16px; height: 16px; }
.social-btn:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.footer-col h4 {
    font-family: var(--f-display);
    font-weight: 700;
    font-size: .9rem;
    color: #fff;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.footer-col ul li {
    margin-bottom: 10px;
}
.footer-col ul a,
.footer-col ul span {
    color: var(--text-mute);
    font-size: .92rem;
    transition: color .2s;
}
.footer-col ul a:hover { color: var(--accent-hot); }

.footer-contact li {
    display: flex; align-items: center; gap: 10px;
}
.footer-contact svg {
    color: var(--accent);
    flex-shrink: 0;
}

.footer-bottom {
    padding: 24px 0;
    display: flex; flex-direction: column; gap: 8px;
    color: var(--text-faded);
    font-size: .82rem;
}
.footer-bottom .disclaimer {
    color: var(--text-faded);
    font-size: .78rem;
    line-height: 1.5;
}
.footer-bottom .disclaimer strong {
    color: var(--text-mute);
}

@media (min-width: 700px) {
    .footer-grid {
        grid-template-columns: 2fr 1fr 1.2fr;
        gap: 56px;
    }
}
@media (min-width: 900px) {
    .footer-bottom {
        flex-direction: row; justify-content: space-between;
    }
}

/* ═══════════════════════════════════════════════════════════
   STICKY CTA (Mobile)
   ═══════════════════════════════════════════════════════════ */
#stickyCTA {
    position: fixed;
    bottom: 18px; right: 18px;
    z-index: 999;
    display: flex; align-items: center; gap: 8px;
    padding: 14px 18px;
    background: var(--accent);
    color: #fff;
    font-weight: 700;
    font-size: .88rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 12px 32px rgba(0,61,165,.4), 0 4px 12px rgba(0,0,0,.3);
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: all .35s cubic-bezier(.7,0,.3,1);
}
#stickyCTA.show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
#stickyCTA:hover { background: var(--accent-hot); }
#stickyCTA::before {
    content: '';
    position: absolute;
    inset: -2px;
    border: 2px solid var(--accent);
    opacity: .5;
    animation: ringPulse 2s ease-in-out infinite;
}
@keyframes ringPulse {
    0%   { transform: scale(1); opacity: .5; }
    100% { transform: scale(1.15); opacity: 0; }
}

@media (min-width: 768px) {
    .sticky-cta-label { display: inline; }
}
@media (max-width: 480px) {
    #stickyCTA { padding: 13px 16px; font-size: .82rem; }
}

/* ═══════════════════════════════════════════════════════════
   SCROLL REVEALS
   ═══════════════════════════════════════════════════════════ */
.reveal,
.reveal-left,
.reveal-right {
    opacity: 0;
    transition: opacity .9s cubic-bezier(.7,0,.3,1), transform .9s cubic-bezier(.7,0,.3,1);
    will-change: opacity, transform;
}
.reveal       { transform: translateY(32px); }
.reveal-left  { transform: translateX(-40px); }
.reveal-right { transform: translateX(40px); }

.reveal.visible,
.reveal-left.visible,
.reveal-right.visible {
    opacity: 1;
    transform: translate(0,0);
}

/* Stagger children */
.features-grid > .stagger-in,
.models-grid > .stagger-in,
.process-timeline > .stagger-in,
.testimonials-grid > .stagger-in,
.stagger-grid > .stagger-in {
    opacity: 1;
    transform: translateY(0);
}
.features-grid > *,
.models-grid > *,
.process-timeline > *,
.testimonials-grid > *,
.stagger-grid > * {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .8s cubic-bezier(.7,0,.3,1), transform .8s cubic-bezier(.7,0,.3,1);
    will-change: opacity, transform;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    .reveal, .reveal-left, .reveal-right,
    .features-grid > *, .models-grid > *,
    .process-timeline > *, .testimonials-grid > * {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* iOS / safe area */
@supports (padding: max(0px)) {
    body {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
    #stickyCTA {
        bottom: max(18px, env(safe-area-inset-bottom));
        right: max(18px, env(safe-area-inset-right));
    }
}

/* Touch targets */
@media (hover: none) and (pointer: coarse) {
    .btn-primary, .btn-ghost, .btn-nav, .btn-submit,
    .calc-wa-btn, .model-cta, .faq-q, .calc-model-btn {
        min-height: 44px;
    }
}