/* ── Hero-only styles ─────────────────────────────── */
        .hero {
            position: relative;
            z-index: 1;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: var(--nav-h) 2rem calc(2rem + 64px);
        }

        .hero-inner {
            text-align: center;
            width: 100%;
            max-width: 1400px;
        }

        .name {
            margin-top: 1.3rem;
            font-family: 'Anton', sans-serif;
            font-size: clamp(5rem, 20vw, 21rem);
            line-height: 0.85;
            letter-spacing: -0.01em;
            color: var(--cream);
            text-transform: uppercase;
        }

        .name span {
            display: block;
            opacity: 0;
            transform: translateY(30px);
            animation: rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.18s forwards;
        }

        /* ── Corner frame ticks ───────────────────────────── */
        .corner-ticks {
            position: fixed;
            inset: 18px;
            z-index: 2;
            pointer-events: none;
        }

        .corner-tick {
            position: absolute;
            width: 16px;
            height: 16px;
            border: 1px solid rgba(74, 185, 107, 0.32);
        }

        .corner-tick--tl { top: 0; left: 0; border-right: none; border-bottom: none; }
        .corner-tick--tr { top: 0; right: 0; border-left: none; border-bottom: none; }
        .corner-tick--bl { bottom: 0; left: 0; border-right: none; border-top: none; }
        .corner-tick--br { bottom: 0; right: 0; border-left: none; border-top: none; }

        /* ── Status eyebrow ───────────────────────────────── */
        .eyebrow {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.6rem;
            opacity: 0;
            animation: rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards;
        }

        .eyebrow-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--green);
            animation: pulse 2.4s ease-in-out infinite;
        }

        .eyebrow-text {
            font-family: 'Space Mono', monospace;
            font-size: 0.62rem;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--green);
        }

        /* ── Role row ─────────────────────────────────────── */
        .role-row {
            display: flex;
            align-items: center;
            gap: 1.25rem;
            margin-top: 2rem;
            max-width: 760px;
            margin-left: auto;
            margin-right: auto;
            opacity: 0;
            animation: rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.46s forwards;
        }

        .role-rule {
            flex: 1;
            height: 1px;
        }

        .role-rule--left {
            background: linear-gradient(to right, transparent, rgba(74, 185, 107, 0.4));
        }

        .role-rule--right {
            background: linear-gradient(to left, transparent, rgba(74, 185, 107, 0.4));
        }

        .role-text {
            font-family: 'Space Mono', monospace;
            font-size: 0.66rem;
            letter-spacing: 0.24em;
            text-transform: uppercase;
            color: var(--cream);
            white-space: nowrap;
        }

        .role-slash {
            color: var(--green);
            opacity: 0.7;
        }

        .tagline {
            margin-top: 1.5rem;
            font-family: 'DM Sans', sans-serif;
            font-size: clamp(0.9rem, 1.4vw, 1.05rem);
            font-weight: 300;
            color: var(--cream);
            opacity: 0;
            letter-spacing: 0.02em;
            line-height: 1.7;
            animation: rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.55s forwards;
        }

        .tagline em {
            color: var(--cream-dim);
            font-style: normal;
        }

        .tagline em a,
        .tagline em a:visited {
            color: var(--green);
            text-decoration: none;
            border-bottom: 1px solid rgba(77, 184, 106, 0.4);
            transition: border-color 0.2s ease;
        }

        .tagline em a:hover,
        .tagline em a:focus-visible {
            border-color: var(--green);
        }

        .cta-row {
            display: flex;
            flex-wrap: wrap;
            gap: 0.75rem;
            justify-content: center;
            margin-top: 3rem;
            opacity: 0;
            animation: rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.7s forwards;
        }

        .cta {
            display: inline-flex;
            align-items: center;
            gap: 0.6rem;
            padding: 0.65rem 1.4rem;
            font-family: 'Space Mono', monospace;
            font-size: 0.65rem;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            text-decoration: none;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
        }

        .cta-primary {
            background: var(--green);
            color: var(--bg);
            border: 1px solid var(--green);
        }

        .cta-primary:hover {
            background: transparent;
            color: var(--green);
        }

        .cta-secondary {
            border: 1px solid var(--nav-border);
            color: var(--cream);
        }

        .cta-secondary:hover {
            border-color: rgba(77, 184, 106, 0.45);
            color: var(--green);
        }

        /* ── Bottom meta strip ────────────────────────────── */
        #hero-meta {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 10;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 1rem clamp(1.5rem, 5vw, 3rem);
            border-top: 1px solid rgba(74, 185, 107, 0.12);
            background: linear-gradient(to top, rgba(6, 14, 8, 0.9), transparent);
            font-family: 'Space Mono', monospace;
            font-size: 0.56rem;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: var(--cream-dim);
        }

        .hero-meta-links {
            display: flex;
            gap: 1.5rem;
        }

        #hero-meta a {
            color: var(--cream-dim);
            letter-spacing: 0.22em;
            transition: color 0.2s;
        }

        #hero-meta a:hover,
        #hero-meta a:focus-visible {
            color: var(--green);
        }

        @media (max-width: 640px) {
            #hero-meta {
                flex-wrap: wrap;
                justify-content: center;
                text-align: center;
                gap: 0.5rem 1.5rem;
            }
        }