@font-face {
      font-family: "Mona Sans";
      src: url("/Mona-Sans.woff2") format("woff2");
      font-weight: 200 900;
      font-stretch: 75% 125%;
      font-display: swap;
    }

    :root {
      --surface: #111413;
      --surface-lowest: #090d0d;
      --surface-low: #151a19;
      --surface-container-low: #181f1d;
      --surface-container: #202725;
      --surface-container-high: #29322f;
      --surface-bright: #35403b;
      --text-main: #F7F1E8;
      --text-accent: #C8A96A;
      --text-body: #DADADA;
      --text-label: rgba(247, 241, 232, 0.58);
      --on-surface: var(--text-main);
      --on-primary: #171006;
      --muted: var(--text-body);
      --muted-soft: rgba(218, 218, 218, 0.72);
      --primary: var(--text-accent);
      --primary-dim: #9e844f;
      --line: rgba(200, 169, 106, 0.16);
      --line-soft: rgba(218, 218, 218, 0.12);
      --danger: #f87171;
      --ok: #9dd4a8;
      --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
      --font-sans: "Satoshi", "Mona Sans", "Avenir Next", "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
      color-scheme: dark;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; background: #050914; overflow-x: clip; overflow-y: auto; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: var(--font-sans);
      font-weight: 400;
      background:
        radial-gradient(circle at 82% 0%, rgba(55, 144, 255, 0.12), transparent 34rem),
        radial-gradient(circle at 78% 38%, rgba(233,193,118,0.07), transparent 32rem),
        radial-gradient(circle at 15% 48%, rgba(87, 216, 255, 0.035), transparent 38rem),
        linear-gradient(180deg, #050914 0%, #071020 26%, #07141f 58%, #050914 100%);
      background-attachment: fixed;
      background-repeat: no-repeat;
      color: var(--text-body);
      text-rendering: optimizeLegibility;
      overflow-x: clip;
      overflow-y: visible;
    }
    body::selection { background: rgba(233, 193, 118, 0.28); }
    img, svg { max-width: 100%; }
    a { color: inherit; text-decoration: none; }
    button, input, select, textarea { font: inherit; }
    button { background: none; border: 0; color: inherit; cursor: pointer; }
    .underline { text-decoration: underline; text-underline-offset: 2px; }
    p, h1, h2, h3, h4, ol, ul { margin-top: 0; }
    h1, h2, h3, h4, h5, h6, .font-headline {
      font-family: var(--font-display);
      font-weight: 500;
      letter-spacing: 0;
    }
    p { margin-bottom: 0; }
    strong { font-weight: 700; }
    details > summary { list-style: none; cursor: pointer; }
    details > summary::-webkit-details-marker { display: none; }
    details[open] .faq-plus::before { content: "-"; }
    .faq-plus::before { content: "+"; }

    .hp-field {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }

    .hidden { display: none !important; }
    .block { display: block; }
    .inline-block { display: inline-block; }
    .flex { display: flex; }
    .flex-col { flex-direction: column; }
    .items-center { align-items: center; }
    .items-start { align-items: flex-start; }
    .justify-between { justify-content: space-between; }
    .justify-center { justify-content: center; }
    .flex-1 { flex: 1 1 0%; }
    .flex-shrink-0 { flex-shrink: 0; }
    .relative { position: relative; }
    .absolute { position: absolute; }
    .fixed { position: fixed; }
    .inset-0 { inset: 0; }
    .top-0 { top: 0; }
    .top-1\/2 { top: 50%; }
    .right-3 { right: 0.75rem; }
    .-translate-y-1\/2 { transform: translateY(-50%); }
    .pointer-events-none { pointer-events: none; }
    .overflow-y-auto { overflow-y: auto; }
    .z-10 { z-index: 10; }
    .z-40 { z-index: 40; }
    .z-50 { z-index: 50; }
    .w-full { width: 100%; }
    .min-h-screen { min-height: 100vh; }
    .min-w-\[2\.5rem\] { min-width: 2.5rem; }
    .h-px { height: 1px; }
    .max-w-xs { max-width: 20rem; }
    .max-w-sm { max-width: 24rem; }
    .max-w-xl { max-width: 36rem; }
    .max-w-2xl { max-width: 42rem; }
    .max-w-3xl { max-width: 48rem; }
    .max-w-5xl { max-width: 64rem; }
    .max-w-6xl { max-width: 72rem; }
    .max-w-7xl { max-width: 80rem; }
    .max-w-\[1400px\] { max-width: 1400px; }
    .mx-auto { margin-left: auto; margin-right: auto; }
    .my-auto { margin-top: auto; margin-bottom: auto; }
    .mb-2 { margin-bottom: 0.5rem; }
    .mb-4 { margin-bottom: 1rem; }
    .mb-10 { margin-bottom: 2.5rem; }
    .mb-12 { margin-bottom: 3rem; }
    .mt-1 { margin-top: 0.25rem; }
    .mt-2 { margin-top: 0.5rem; }
    .mt-3 { margin-top: 0.75rem; }
    .mt-4 { margin-top: 1rem; }
    .mt-6 { margin-top: 1.5rem; }
    .p-4 { padding: 1rem; }
    .p-6 { padding: 1.5rem; }
    .p-8 { padding: 2rem; }
    .p-10 { padding: 2.5rem; }
    .px-4 { padding-left: 1rem; padding-right: 1rem; }
    .px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
    .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
    .px-8 { padding-left: 2rem; padding-right: 2rem; }
    .py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
    .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
    .py-4 { padding-top: 1rem; padding-bottom: 1rem; }
    .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
    .py-16 { padding-top: 4rem; padding-bottom: 4rem; }
    .py-24 { padding-top: 6rem; padding-bottom: 6rem; }
    .py-28 { padding-top: 7rem; padding-bottom: 7rem; }
    .pt-1 { padding-top: 0.25rem; }
    .pt-2 { padding-top: 0.5rem; }
    .pt-3 { padding-top: 0.75rem; }
    .pt-4 { padding-top: 1rem; }
    .pt-6 { padding-top: 1.5rem; }
    .pt-40 { padding-top: 10rem; }
    .pb-24 { padding-bottom: 6rem; }
    .pl-4 { padding-left: 1rem; }
    .pr-10 { padding-right: 2.5rem; }
    .gap-2 { gap: 0.5rem; }
    .gap-3 { gap: 0.75rem; }
    .gap-4 { gap: 1rem; }
    .gap-6 { gap: 1.5rem; }
    .gap-8 { gap: 2rem; }
    .space-y-1 > * + * { margin-top: 0.25rem; }
    .space-y-2 > * + * { margin-top: 0.5rem; }
    .space-y-3 > * + * { margin-top: 0.75rem; }
    .space-y-4 > * + * { margin-top: 1rem; }
    .space-y-5 > * + * { margin-top: 1.25rem; }
    .space-y-6 > * + * { margin-top: 1.5rem; }
    .space-y-10 > * + * { margin-top: 2.5rem; }
    .space-y-12 > * + * { margin-top: 3rem; }
    .space-y-14 > * + * { margin-top: 3.5rem; }
    .rounded { border-radius: 6px; }
    .border { border-width: 1px; border-style: solid; }
    .border-t { border-top-width: 1px; border-top-style: solid; }
    .border-y { border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-bottom-style: solid; }
    .divide-y > * + * { border-top-width: 1px; border-top-style: solid; }
    .border-outline-variant\/10, .divide-outline-variant\/20 > * + * { border-color: rgba(209, 197, 180, 0.10); }
    .border-outline-variant\/20 { border-color: rgba(209, 197, 180, 0.16); }
    .border-outline-variant\/30 { border-color: rgba(209, 197, 180, 0.24); }
    .border-primary\/20 { border-color: rgba(233, 193, 118, 0.20); }
    .border-primary\/30 { border-color: rgba(233, 193, 118, 0.30); }
    .bg-surface { background: var(--surface); }
    .bg-surface-container-lowest { background: var(--surface-lowest); }
    .bg-surface-container-low { background: var(--surface-container-low); }
    .bg-surface-container { background: var(--surface-container); }
    .bg-black\/85 { background: rgba(0, 0, 0, 0.85); }
    .bg-outline-variant\/30 { background: rgba(209, 197, 180, 0.22); }
    .bg-primary-gradient { background: linear-gradient(135deg, var(--primary), #d7a75a); }
    .hairline { height: 1px; background: linear-gradient(90deg, transparent, rgba(233,193,118,0.32), transparent); }
    .text-left { text-align: left; }
    .text-center { text-align: center; }
    .text-xs { font-size: 0.75rem; }
    .text-sm { font-size: 0.875rem; }
    .text-base { font-size: 1rem; }
    .text-lg { font-size: 1.125rem; }
    .text-xl { font-size: 1.25rem; }
    .text-2xl { font-size: 1.5rem; }
    .text-3xl { font-size: 1.875rem; }
    .text-4xl { font-size: 2.25rem; }
    .text-5xl { font-size: 3rem; }
    .text-\[11px\] { font-size: 11px; }
    .font-light { font-weight: 300; }
    .font-normal { font-weight: 400; }
    .font-medium { font-weight: 500; }
    .font-body, .font-label { font-family: var(--font-sans); }
    .font-label { font-weight: 700; }
    .font-headline .italic, .text-primary.italic { font-family: var(--font-display); font-weight: 400; font-style: italic; }
    .italic { font-style: italic; }
    .uppercase { text-transform: uppercase; }
    .leading-none { line-height: 1; }
    .leading-tight { line-height: 1.15; }
    .leading-relaxed { line-height: 1.65; }
    .leading-loose { line-height: 1.85; }
    .tracking-tight, .tracking-wide, .tracking-\[0\.15em\], .tracking-\[0\.2em\], .tracking-\[0\.3em\] { letter-spacing: 0; }
    .tabular-nums { font-variant-numeric: tabular-nums; }
    .text-primary, .marker\:text-primary\/60 ::marker { color: var(--primary); }
    .text-primary\/80 { color: rgba(200, 169, 106, 0.80); }
    .text-on-primary { color: var(--on-primary); }
    .text-on-surface { color: var(--on-surface); }
    .text-on-surface-variant { color: var(--muted); }
    .text-on-surface-variant\/40 { color: rgba(218, 218, 218, 0.40); }
    .text-on-surface-variant\/50 { color: rgba(218, 218, 218, 0.50); }
    .text-on-surface-variant\/60 { color: rgba(218, 218, 218, 0.60); }
    .text-on-surface-variant\/70 { color: rgba(218, 218, 218, 0.70); }
    .text-on-surface-variant\/80 { color: rgba(218, 218, 218, 0.80); }
    .text-on-surface-variant\/90 { color: rgba(218, 218, 218, 0.90); }
    .text-red-400 { color: var(--danger); }
    .list-decimal { list-style: decimal; }
    .appearance-none { appearance: none; }
    .placeholder\:text-on-surface-variant\/30::placeholder { color: rgba(218, 218, 218, 0.30); }
    .focus\:border-primary:focus { border-color: var(--primary); }
    .focus\:ring-0:focus { box-shadow: none; }
    .focus\:outline-none:focus { outline: none; }
    .hover\:opacity-90:hover { opacity: 0.9; }
    .hover\:text-primary:hover { color: var(--primary); }
    .disabled\:opacity-50:disabled { opacity: 0.5; }
    .disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }
    .transition-colors, .transition-opacity { transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, opacity 160ms ease; }

    .site-nav { position: fixed; top: 0; left: 0; right: 0; background: linear-gradient(180deg, rgba(5, 9, 20, 0.62), rgba(5, 9, 20, 0.18) 70%, transparent); border-bottom: 1px solid rgba(233, 193, 118, 0.06); backdrop-filter: blur(8px); transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), background-color 360ms ease, border-color 360ms ease, backdrop-filter 360ms ease; will-change: transform; }
    /* Hidden when scrolling down */
    .site-nav.site-nav--hidden { transform: translateY(-100%); }
    /* Solid-ish background once scrolled away from the hero top */
    .site-nav.site-nav--scrolled { background: linear-gradient(180deg, rgba(5, 8, 16, 0.92), rgba(5, 8, 16, 0.82)); border-bottom-color: rgba(233, 193, 118, 0.14); backdrop-filter: blur(14px); }
    @media (prefers-reduced-motion: reduce) { .site-nav { transition: none; } }
    .site-nav__mobile { border-top: 1px solid rgba(233, 193, 118, 0.12); background: rgba(5, 9, 20, 0.92); backdrop-filter: blur(10px); }
    .nav-shell { width: 100%; }
    .nav-links { gap: clamp(2.05rem, 3.3vw, 3.7rem); }
    .nav-actions { justify-content: flex-end; }
    .nav-link, .site-nav__mobile a { color: var(--text-label); }
    .nav-link:hover, .site-nav__mobile a:hover { color: var(--primary); }
    .site-nav .bg-primary-gradient { display: inline-flex; align-items: center; gap: 0.55rem; min-height: 3.05rem; background: linear-gradient(135deg, rgba(200,169,106,0.18), rgba(0,0,0,0.16) 52%, rgba(200,169,106,0.12)); border: 1px solid rgba(200,169,106,0.78); color: #C8A96A !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 0 1.2rem rgba(200,169,106,0.08); backdrop-filter: blur(8px); font-size: 0.9rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
    .site-nav .bg-primary-gradient:hover { background: linear-gradient(135deg, rgba(200,169,106,0.34), rgba(200,169,106,0.10) 52%, rgba(200,169,106,0.22)); opacity: 1; }
    .nav-menu-btn { color: var(--primary); padding: 0.25rem 0.4rem; border: 1px solid rgba(233, 193, 118, 0.18); border-radius: 6px; }
    .icon { display: inline-flex; align-items: center; justify-content: center; min-width: 1em; font-family: var(--font-display); line-height: 1; }
    .logo-lockup { display: inline-flex; align-items: center; gap: 0.42rem; line-height: 1; color: var(--text-main); }
    .logo-lockup .lockup-mark { display: block; height: 1.38em; width: auto; }
    .logo-lockup .lockup-text { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; letter-spacing: -0.02em; color: var(--text-main); font-size: 0.76em; margin-left: 0; }
    .logo-lockup--footer { font-size: 1.4rem; }
    .logo-lockup--footer .lockup-mark { display: block; height: 1.38em; width: auto; color: inherit; font-size: inherit; }
    .logo-lockup--footer .lockup-text { color: var(--text-main); font-size: 0.76em; }
    .nav-link, .site-nav__mobile a { font-family: var(--font-sans); font-weight: 600; text-transform: uppercase; }
    .hero-kicker, .hero-subtitle, .home-status, .home-eyebrow, .home-card-title, .home-chip, .home-live, .vault-meta-label, .dash-brand-text, .dash-status, .dash-side-label, .dash-card-label, .dash-eyebrow, .dash-stream-head, .mock-booking-status, .text-\[11px\].uppercase, .text-xs.uppercase, label.text-xs, p.text-xs { font-family: var(--font-sans); font-weight: 500; }

    @media (min-width: 768px) {
      .site-nav .nav-shell {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) auto;
        column-gap: clamp(1.8rem, 2.8vw, 3.2rem);
        align-items: center;
      }
      .site-nav .logo-lockup { justify-self: start; }
      .site-nav .nav-links { justify-self: end; }
      .site-nav .nav-actions { justify-self: end; }
    }

    main, main > section:not(.opening-scene):not(.hero-luxe):not(.describe-section):not(.agentum-section), footer { background: transparent !important; }

    .hero-luxe { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; min-height: 100vh; min-height: 100svh; margin-bottom: 0; padding-top: clamp(8rem, 17vh, 12.5rem); padding-bottom: clamp(5.5rem, 10vh, 7.5rem); border-bottom: 0; background: #050914; }
    .hero-luxe::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background:
      linear-gradient(180deg, rgba(5, 9, 20, 0) 48%, rgba(5, 9, 20, 0.72) 78%, #050914 100%),
      linear-gradient(90deg, rgba(4, 5, 12, 0.98) 0%, rgba(5, 10, 24, 0.86) 43%, rgba(7, 22, 48, 0.34) 100%);
    }
    .hero-luxe::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background:
      radial-gradient(circle at 78% 22%, rgba(107, 220, 255, 0.22) 0 0.18rem, transparent 0.42rem),
      radial-gradient(circle at 86% 42%, rgba(233, 193, 118, 0.22) 0 0.14rem, transparent 0.38rem),
      radial-gradient(circle at 70% 56%, rgba(107, 220, 255, 0.16) 0 0.16rem, transparent 0.44rem),
      linear-gradient(115deg, transparent 36%, rgba(107, 220, 255, 0.00) 44%, rgba(107, 220, 255, 0.18) 50%, rgba(233, 193, 118, 0.12) 53%, transparent 62%),
      radial-gradient(circle at 78% 22%, rgba(107, 220, 255, 0.14), transparent 18rem);
      background-size: 100% 100%, 100% 100%, 100% 100%, 240% 100%, 100% 100%;
      -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,0.55) 74%, transparent 94%);
      mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,0.55) 74%, transparent 94%);
      animation: hero-hive-light 13s ease-in-out infinite;
    }
    @keyframes hero-hive-light {
      0%, 100% { opacity: 0.74; background-position: 0 0, 0 0, 0 0, 130% 0, 0 0; }
      48%, 56% { opacity: 1; background-position: 0.7rem -0.5rem, -0.5rem 0.4rem, 0.4rem 0.6rem, -30% 0, 0 0; }
    }
    .hero-content { position: relative; z-index: 2; width: 100%; }
    .hero-kicker { color: var(--text-label); font-size: 0.78rem; text-transform: uppercase; }
    .hero-display { display: block; max-width: 54rem; margin: 0.5rem 0 0; font-family: var(--font-display); font-size: clamp(2.85rem, 6.2vw, 5.55rem); font-weight: 500; letter-spacing: 0; line-height: 1.03; text-transform: none; }
    .hero-display span { display: block; }
    .hero-display span:first-child { text-transform: uppercase; letter-spacing: -0.02em; }
    .hero-display span:last-child { color: var(--text-accent); font-weight: 400; font-style: italic; }
    .hero-subtitle { margin-top: 1rem; color: var(--text-label); font-size: clamp(0.92rem, 1.5vw, 1.15rem); letter-spacing: 0; text-transform: uppercase; }
    .hero-copy { max-width: 42rem; margin-top: 1.5rem; color: var(--text-body); font-size: clamp(1.08rem, 2vw, 1.4rem); line-height: 1.55; }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 0.85rem; margin-top: 2rem; }
    .hero-link { display: inline-flex; align-items: center; justify-content: center; min-height: 3.1rem; border-radius: 6px; padding: 0.9rem 1.35rem; font-family: var(--font-sans); font-weight: 700; font-size: 0.78rem; text-transform: uppercase; transition: border-color 160ms ease, color 160ms ease, opacity 160ms ease, background-color 160ms ease; }
    .hero-link--primary { background: linear-gradient(135deg, var(--primary), #d7a75a); color: var(--on-primary); }
    .hero-link--secondary { border: 1px solid rgba(233,193,118,0.28); color: var(--primary); background: rgba(255,255,255,0.02); }
    .hero-link:hover { opacity: 0.9; }
    .hero-proof { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; margin: 2rem 0 0; padding: 0; list-style: none; color: var(--text-label); font-size: 0.82rem; }
    .hero-proof li { display: inline-flex; align-items: center; gap: 0.5rem; }
    .hero-proof li::before { content: ""; width: 0.35rem; height: 0.35rem; border-radius: 50%; background: var(--primary); flex: none; }
    br.mobile-break { display: none; }

    .describe-section { position: relative; z-index: 2; display: flex; align-items: center; min-height: calc(82vh - 3rem); min-height: calc(82svh - 3rem); margin-top: 0; padding: clamp(5.5rem, 11vh, 7rem) 1.5rem clamp(6rem, 12vh, 8rem); overflow: hidden; background: #050606 !important; }
    .describe-section::before { content: none; display: none; }
    .describe-inner { position: relative; max-width: 980px; margin: 0 auto; }
    .describe-line { margin: 0; color: var(--on-surface); font-family: var(--font-display); font-weight: 500; font-size: clamp(2rem, 4.8vw, 4.4rem); line-height: 1.08; letter-spacing: 0; text-align: center; opacity: 1; transform: translateY(0); transition: opacity 450ms ease, transform 500ms cubic-bezier(0.18, 1, 0.22, 1); }
    .reveal-enabled .describe-line { opacity: 0; transform: translateY(2.25rem); }
    .reveal-enabled .describe-section.is-visible .describe-line { opacity: 1; transform: translateY(0); }
    .describe-word { display: inline-block; }
    /* The two accent words start WHITE. When the describe beat lands, the scene
       briefly LOCKS scrolling (~1.5s) and the words ease to gold one after the
       other, so the user always sees the white→gold moment before moving on.
       (JS adds .is-gold per word on a short timed sequence.) */
    .describe-word--wipe {
      color: var(--text-main);
      background: none;
      transition: color 650ms ease, text-shadow 650ms ease;
      will-change: color, text-shadow;
    }
    .describe-word--wipe.is-gold {
      color: var(--text-accent);
      text-shadow: 0 0 0.9rem rgba(233,193,118,0.28);
    }
    @supports not (-webkit-background-clip: text) {
      .describe-word--wipe { background: none; color: var(--primary); }
    }
    @keyframes describe-build-wipe {
      0%, 100% { background-position: 120% 0; text-shadow: 0 0 0 rgba(233,193,118,0); }
      10%, 18% { background-position: 50% 0; text-shadow: 0 0 1.05rem rgba(233,193,118,0.18); }
      31% { background-position: -20% 0; text-shadow: 0 0 0 rgba(233,193,118,0); }
    }

    .has-seam { position: relative; }
    .section-seam { display: none; }
    .agentum-section { position: relative; z-index: 2; padding-top: clamp(9rem, 18vh, 13rem) !important; padding-bottom: clamp(6rem, 12vh, 8rem) !important; background: linear-gradient(180deg, #050606 0%, #080808 16%, #0d0e0d 50%, #080808 84%, #050606 100%) !important; }
    .agentum-section::before { content: none; display: none; }
    .agentum-frame { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
    .agentum-split { display: grid; grid-template-columns: minmax(17rem, 0.95fr) minmax(0, 1.05fr); gap: clamp(2rem, 5vw, 4.5rem); justify-content: center; align-items: center; }
    .agentum-gold { color: var(--primary); }
    .agentum-divider { display: none; }
    .agentum-copy { max-width: 52rem; text-align: left; }
    .agentum-copy-heading { margin: 0; color: var(--on-surface); font-family: var(--font-display); font-weight: 500; font-size: clamp(1.75rem, 3vw, 2.9rem); line-height: 1.12; letter-spacing: 0; }
    .agentum-copy-heading span { display: block; }
    .agentum-copy-heading-main { font-size: 1.14em; }
    .agentum-copy-heading-accent { color: var(--primary); font-style: italic; font-weight: 400; }
    .agentum-copy-subtext { max-width: 43rem; margin: 1.25rem 0 0; color: var(--text-body); font-size: clamp(1.05rem, 1.7vw, 1.32rem); line-height: 1.55; }
    .agentum-facts { max-width: 39rem; margin: 2.4rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.85rem; color: var(--muted); text-align: left; }
    .agentum-facts li { display: flex; gap: 0.7rem; align-items: baseline; }
    .agentum-facts li::before { content: ""; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--primary); flex: none; margin-top: 0.55rem; }

    .agentum-lux-mockup { position: relative; width: min(100%, 640px); justify-self: start; }
    .agentum-lux-mockup::before { content: none; display: none; }
    .command-image-shell { position: relative; margin: 0; }
    .command-image-shell img { display: block; width: 100%; height: auto; filter: drop-shadow(0 2.2rem 4.5rem rgba(0,0,0,0.44)); }
    .world-mockup { position: relative; overflow: hidden; display: grid; grid-template-columns: 4.35rem minmax(0, 1fr); min-height: clamp(23.5rem, 38vw, 29.5rem); border: 1px solid rgba(233,193,118,0.28); border-radius: 8px; background: linear-gradient(145deg, rgba(5,5,5,0.98), rgba(12,10,7,0.94)); box-shadow: 0 2.2rem 5rem rgba(0,0,0,0.48), inset 0 1px 0 rgba(255,255,255,0.035); }
    .world-mockup::before { content: none; display: none; }
    .world-mockup::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 78% 42%, rgba(233,193,118,0.12), transparent 20rem), linear-gradient(180deg, rgba(255,255,255,0.035), transparent 24%); }
    .world-sidebar { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 0.85rem; padding: 1.25rem 0.65rem; border-right: 1px solid rgba(233,193,118,0.11); background: rgba(0,0,0,0.26); }
    .world-mark { display: grid; place-items: center; width: 2.05rem; height: 2.05rem; }
    .world-mark img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 0.7rem rgba(233,193,118,0.30)); }
    .world-nav { display: grid; gap: 0.48rem; margin-top: 0.15rem; }
    .world-nav span { display: grid; place-items: center; width: 1.82rem; height: 1.82rem; border-radius: 8px; color: var(--text-label); font-size: 0.72rem; border: 1px solid transparent; }
    .world-nav span:first-child { color: var(--primary); border-color: rgba(233,193,118,0.16); background: rgba(233,193,118,0.08); }
    .world-panel { position: relative; z-index: 1; display: grid; grid-template-rows: auto 1fr auto; gap: 0.85rem; padding: clamp(1.05rem, 2.4vw, 1.65rem); min-width: 0; }
    .world-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
    .world-title { margin: 0; color: var(--text-main); font-family: var(--font-sans); font-size: clamp(1.1rem, 1.85vw, 1.45rem); font-weight: 400; line-height: 1.15; }
    .world-subtitle { margin-top: 0.25rem; color: var(--text-body); font-size: 0.8rem; }
    .world-mode { display: inline-flex; align-items: center; gap: 0.42rem; padding: 0.38rem 0.62rem; border: 1px solid rgba(233,193,118,0.13); border-radius: 8px; color: var(--text-label); background: rgba(0,0,0,0.28); font-size: 0.68rem; white-space: nowrap; }
    .world-mode i { width: 0.34rem; height: 0.34rem; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0.8rem rgba(233,193,118,0.5); }
    .world-grid { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(12rem, 0.84fr); gap: 0.72rem; align-content: stretch; }
    .world-stack { display: grid; gap: 0.72rem; min-width: 0; }
    .world-card { position: relative; overflow: hidden; border: 1px solid rgba(233,193,118,0.12); border-radius: 8px; background: rgba(0,0,0,0.42); box-shadow: inset 0 1px 0 rgba(255,255,255,0.028); }
    .world-card--briefing { min-height: 10.8rem; }
    .world-card--digest { min-height: 100%; }
    .world-card--tools { min-height: 8.4rem; }
    .world-card-title { padding: 0.78rem 0.9rem 0.58rem; color: var(--text-label); font-size: 0.78rem; }
    .world-list { display: grid; margin: 0; padding: 0 0.9rem 0.72rem; list-style: none; }
    .world-list li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.58rem; align-items: center; padding: 0.58rem 0; border-top: 1px solid rgba(255,255,255,0.045); }
    .world-list i { display: grid; place-items: center; width: 1.62rem; height: 1.62rem; border: 1px solid rgba(233,193,118,0.11); border-radius: 7px; color: var(--primary); font-style: normal; font-size: 0.76rem; background: rgba(255,255,255,0.035); }
    .world-list svg, .world-nav svg, .world-command svg { width: 1rem; height: 1rem; stroke: currentColor; stroke-width: 1.7; fill: none; stroke-linecap: round; stroke-linejoin: round; }
    .world-list strong { display: block; color: var(--text-main); font-size: 0.78rem; font-weight: 500; line-height: 1.25; }
    .world-list span { display: block; margin-top: 0.12rem; color: var(--text-label); font-size: 0.68rem; line-height: 1.25; }
    .world-priority { color: var(--text-label); font-size: 0.66rem; font-style: normal; }
    .world-digest { display: grid; gap: 0.58rem; margin: 0; padding: 0 0.9rem 0.9rem; list-style: none; }
    .world-digest li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.58rem; align-items: start; padding-top: 0.62rem; border-top: 1px solid rgba(255,255,255,0.045); }
    .world-digest i { width: 0.38rem; height: 0.38rem; margin-top: 0.42rem; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0.8rem rgba(233,193,118,0.42); }
    .world-digest strong { display: block; color: var(--text-main); font-size: 0.78rem; font-weight: 500; line-height: 1.25; }
    .world-digest span { display: block; margin-top: 0.12rem; color: var(--text-label); font-size: 0.70rem; line-height: 1.25; }
    .world-tools { position: relative; z-index: 1; display: flex; align-items: center; justify-content: flex-start; min-height: 0; padding: 0 1rem 0.9rem; }
    .world-tool-icons { display: grid; grid-template-columns: repeat(3, 1.88rem); gap: 0.42rem; justify-content: start; max-width: 100%; }
    .world-tool-icons span { display: grid; place-items: center; width: 1.88rem; height: 1.88rem; border-radius: 7px; color: rgba(247,241,232,0.78); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.055); font-size: 0.68rem; font-weight: 700; }
    .world-tool-icons svg { width: 1.12rem; height: 1.12rem; }
    .world-tool--gmail,
    .world-tool--outlook,
    .world-tool--slack,
    .world-tool--notion,
    .world-tool--drive { color: rgba(247,241,232,0.78) !important; }
    .world-tool--more { color: var(--primary) !important; border-color: rgba(233,193,118,0.16) !important; background: rgba(233,193,118,0.08) !important; }
    .world-command { display: flex; align-items: center; gap: 0.65rem; min-height: 2.75rem; border: 1px solid rgba(233,193,118,0.13); border-radius: 8px; background: rgba(0,0,0,0.46); padding: 0.48rem; color: var(--text-label); font-size: 0.78rem; }
    .world-command-icon { display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 7px; color: var(--primary); background: rgba(233,193,118,0.08); border: 1px solid rgba(233,193,118,0.12); }
    .world-send { margin-left: auto; display: grid; place-items: center; width: 1.65rem; height: 1.65rem; border-radius: 6px; color: #050505; background: linear-gradient(135deg, var(--primary), #d7a75a); }
    .lux-shell { position: relative; overflow: hidden; border: 1px solid rgba(233,193,118,0.34); border-radius: 8px; background: linear-gradient(145deg, #010204 0%, #05070d 46%, #08101d 100%); box-shadow: 0 1.7rem 4.5rem rgba(0,0,0,0.48), 0 0 0 1px rgba(233,193,118,0.06), inset 0 1px 0 rgba(255,255,255,0.08); }
    .lux-shell::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 74% 2%, rgba(233,193,118,0.12), transparent 13rem), radial-gradient(circle at 2% 20%, rgba(107,220,255,0.08), transparent 14rem), linear-gradient(180deg, rgba(255,255,255,0.055), transparent 20%); }
    .home-topbar { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 0.85rem; padding: 0.72rem 0.85rem; border-bottom: 0; background: rgba(0,0,0,0.28); }
    .home-brand { display: inline-flex; align-items: center; gap: 0.45rem; color: var(--on-surface); font-size: 0.78rem; text-transform: uppercase; }
    .home-brand img { width: 1.35rem; height: 1.35rem; }
    .home-brand span { color: var(--primary); }
    .home-status { color: var(--text-label); font-size: 0.68rem; text-transform: uppercase; white-space: nowrap; }
    .home-body { position: relative; display: grid; gap: 0.65rem; padding: 0.85rem; }
    .home-hero-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid rgba(233,193,118,0.18); border-radius: 8px; padding: 0.68rem 0.75rem; background: rgba(0,0,0,0.30); }
    .home-eyebrow, .home-card-title, .home-chip { color: rgba(233,193,118,0.72); font-size: 0.66rem; text-transform: uppercase; }
    .home-title { margin-top: 0.38rem; color: var(--text-main); font-family: var(--font-display); font-weight: 500; font-size: clamp(1.15rem, 2.15vw, 1.55rem); line-height: 1.18; }
    .home-greeting { color: var(--text-main); font-family: var(--font-sans); font-size: clamp(0.82rem, 1.25vw, 1rem); font-weight: 400; line-height: 1.25; letter-spacing: 0; text-transform: none; }
    .home-live { display: inline-flex; align-items: center; gap: 0.45rem; color: var(--text-label); font-size: 0.72rem; text-transform: uppercase; white-space: nowrap; }
    .home-live i { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--ok); box-shadow: 0 0 1rem rgba(157,212,168,0.35); }
    .home-main-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
    .home-card { border: 1px solid rgba(107,220,255,0.13); border-radius: 8px; padding: 0.68rem; background: rgba(0,0,0,0.30); min-width: 0; }
    .home-card--wide { grid-column: 1 / -1; }
    .home-card-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
    .home-chip { color: var(--text-label); }
    .home-schedule, .home-news-list { display: grid; gap: 0.5rem; margin-top: 0.6rem; }
    .home-event { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); gap: 0.65rem; }
    .home-time { color: var(--primary); font-size: 0.72rem; }
    .home-event strong, .home-news-item strong { display: block; color: var(--text-main); font-size: 0.82rem; line-height: 1.25; }
    .home-event span, .home-news-item span { display: block; margin-top: 0.15rem; color: var(--text-label); font-size: 0.72rem; line-height: 1.3; }
    .home-news-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.55rem; }
    .home-news-dot { width: 0.45rem; height: 0.45rem; margin-top: 0.3rem; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0.75rem rgba(233,193,118,0.24); }
    .home-vault-contact { display: grid; gap: 0.5rem; margin-top: 0.6rem; }
    .vault-person { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.62rem; align-items: center; border: 1px solid rgba(233,193,118,0.14); border-radius: 8px; padding: 0.62rem; background: rgba(255,255,255,0.025); }
    .vault-avatar { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: linear-gradient(135deg, var(--primary), #d7a75a); color: var(--on-primary); font-family: var(--font-display); font-size: 0.85rem; flex: none; }
    .vault-name { color: var(--text-main); font-size: 0.86rem; line-height: 1.2; }
    .vault-summary { margin-top: 0.2rem; color: var(--text-label); font-size: 0.72rem; line-height: 1.3; }
    .vault-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.65rem; }
    .vault-meta { border: 1px solid rgba(107,220,255,0.10); border-radius: 8px; padding: 0.52rem; background: rgba(0,0,0,0.12); }
    .vault-meta-label { color: rgba(233,193,118,0.66); font-size: 0.62rem; text-transform: uppercase; }
    .vault-meta-value { margin-top: 0.28rem; color: var(--text-body); font-size: 0.76rem; line-height: 1.32; }
    .vault-action { display: flex; align-items: center; gap: 0.55rem; border: 1px solid rgba(233,193,118,0.12); border-radius: 8px; padding: 0.52rem; background: rgba(233,193,118,0.045); color: var(--text-body); font-size: 0.74rem; line-height: 1.3; }
    .vault-action i { display: inline-block; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0.9rem rgba(157,212,168,0.34); flex: none; }
    .home-footer { display: flex; align-items: center; gap: 0.55rem; border-top: 1px solid rgba(233,193,118,0.10); padding: 0.65rem 0.85rem; color: var(--text-label); font-size: 0.76rem; }
    .home-cursor { width: 0.45rem; height: 1rem; border-radius: 2px; background: var(--primary); box-shadow: 0 0 1rem rgba(233,193,118,0.28); flex: none; animation: home-cursor-blink 1.1s steps(2, start) infinite; }
    @keyframes home-cursor-blink {
      0%, 46% { opacity: 1; }
      47%, 100% { opacity: 0.22; }
    }

    .agentum-dash { width: min(100%, 620px); }
    .dash-window { border: 1px solid rgba(107,220,255,0.13); border-radius: 8px; overflow: hidden; background: rgba(4, 11, 23, 0.74); box-shadow: 0 18px 60px rgba(0,0,0,0.24); }
    .dash-titlebar { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.75rem 0.9rem; border-bottom: 1px solid rgba(107,220,255,0.10); background: rgba(8, 18, 32, 0.78); }
    .dash-traffic { display: inline-flex; gap: 0.35rem; }
    .dash-traffic i, .dash-dot, .dash-live, .dash-bullet, .dash-channel-dot { display: inline-block; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: var(--primary); }
    .dash-traffic i:nth-child(2) { opacity: 0.55; }
    .dash-traffic i:nth-child(3) { opacity: 0.32; }
    .dash-brand { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--primary); font-size: 0.72rem; }
    .dash-brand-mark { width: 1rem; height: 1rem; }
    .dash-brand-text, .dash-status, .dash-side-label, .dash-card-label, .dash-eyebrow, .dash-stream-head { text-transform: uppercase; letter-spacing: 0; font-size: 0.66rem; color: var(--text-label); }
    .dash-status { display: inline-flex; align-items: center; gap: 0.35rem; }
    .dash-body { display: grid; grid-template-columns: 11rem minmax(0, 1fr); min-height: 22rem; }
    .dash-side { border-right: 1px solid rgba(233,193,118,0.10); padding: 1rem; background: rgba(255,255,255,0.02); }
    .dash-list, .dash-log { list-style: none; padding: 0; margin: 0; }
    .dash-list { display: grid; gap: 0.35rem; margin-top: 0.7rem; }
    .dash-item { display: flex; align-items: center; gap: 0.45rem; color: var(--text-label); font-size: 0.78rem; padding: 0.45rem 0.5rem; border-radius: 5px; }
    .dash-item--active { color: var(--on-surface); background: rgba(233,193,118,0.10); }
    .dash-icon { color: var(--primary); font-style: normal; }
    .dash-channel { display: inline-flex; align-items: center; gap: 0.45rem; margin-top: 0.7rem; color: var(--text-label); font-size: 0.78rem; }
    .dash-main { padding: 1rem; display: grid; gap: 1rem; }
    .dash-main-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
    .dash-h { margin-top: 0.25rem; color: var(--on-surface); font-family: var(--font-display); font-weight: 500; font-size: 1.35rem; }
    .dash-time { color: var(--primary); font-size: 0.8rem; }
    .dash-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; }
    .dash-card { border: 1px solid rgba(233,193,118,0.12); border-radius: 6px; padding: 0.75rem; background: rgba(255,255,255,0.03); min-width: 0; }
    .dash-card-value { margin-top: 0.35rem; color: var(--on-surface); font-size: 1.25rem; font-family: var(--font-display); line-height: 1.1; }
    .dash-card-value span { color: var(--text-label); font-size: 0.72rem; font-family: inherit; }
    .dash-card-value--up { color: var(--ok); }
    .dash-card-foot { margin-top: 0.4rem; color: var(--text-label); font-size: 0.68rem; }
    .dash-spark { width: 100%; height: 1.75rem; margin-top: 0.5rem; }
    .dash-stream { border: 1px solid rgba(233,193,118,0.12); border-radius: 6px; padding: 0.8rem; background: rgba(255,255,255,0.025); }
    .dash-stream-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
    .dash-stream-meta { display: inline-flex; align-items: center; gap: 0.35rem; }
    .dash-log { display: grid; gap: 0.55rem; }
    .dash-log li { display: grid; grid-template-columns: auto auto minmax(0,1fr); gap: 0.5rem; color: var(--text-label); font-size: 0.75rem; line-height: 1.45; }
    .dash-log em { color: var(--primary); font-style: normal; }
    .dash-log-time { color: var(--text-label); }
    .dash-bullet--ok { background: var(--ok); }
    .dash-caret, .dash-typing { display: none; }

    .inside-luxe { background: transparent; padding: clamp(6rem, 12vh, 9rem) 0; overflow: hidden; }
    .inside-scrollytelling, .inside-sticky { min-height: auto; height: auto; position: static; }
    .inside-stack { --inside-card-width: min(29rem, calc(100vw - 3rem)); display: flex; gap: clamp(0.95rem, 2vw, 1.4rem); height: auto; overflow-x: auto; overflow-y: visible; align-items: stretch; padding: 1.2rem max(1rem, calc((100% - var(--inside-card-width)) / 2)) 2rem; margin-inline: -1rem; scroll-snap-type: x mandatory; scroll-padding-inline: max(1rem, calc((100% - var(--inside-card-width)) / 2)); scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; cursor: grab; }
    .inside-stack:active { cursor: grabbing; }
    .inside-stack:focus-visible { outline: 1px solid rgba(233,193,118,0.42); outline-offset: 0.35rem; }
    .inside-stack::-webkit-scrollbar { display: none; }
    .inside-card, .inside-card--stacked { position: relative; flex: 0 0 var(--inside-card-width); width: var(--inside-card-width); height: auto; min-height: 0; opacity: 0.48; pointer-events: auto; transform: scale(0.88) translateY(0.65rem); transform-origin: center center; scroll-snap-align: center; border: 1px solid rgba(107,220,255,0.10); border-radius: 8px; overflow: hidden; background: rgba(6, 15, 28, 0.46); box-shadow: 0 1rem 2.8rem rgba(0,0,0,0.14); transition: opacity 260ms ease, transform 320ms cubic-bezier(0.18, 1, 0.22, 1), border-color 260ms ease, box-shadow 260ms ease, background-color 260ms ease; }
    .inside-card.is-active { z-index: 2; opacity: 1; transform: scale(1) translateY(0); border-color: rgba(233,193,118,0.28); background: rgba(8, 18, 34, 0.74); box-shadow: 0 1.6rem 4.5rem rgba(0,0,0,0.28), 0 0 0 1px rgba(233,193,118,0.05); }
    .inside-card__image { min-height: 13rem; padding: 1rem; background: rgba(5, 12, 24, 0.48); display: flex; align-items: center; justify-content: center; }
    .inside-card__body { padding: 1.25rem; display: grid; gap: 0.6rem; justify-items: center; text-align: center; }
    .inside-card__body p { text-align: center; text-wrap: pretty; }
    .slider-controls { display: none; }

    .mock { width: 100%; max-width: 16rem; border: 1px solid rgba(107,220,255,0.12); border-radius: 6px; padding: 0.9rem; background: rgba(7, 14, 25, 0.72); color: var(--muted); box-shadow: 0 12px 38px rgba(0,0,0,0.16); }
    .mock-cal-head, .mock-brief-row, .mock-task, .mock-cal-event, .mock-person, .mock-market-row, .mock-booking-head { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
    .mock-cal-head { color: var(--primary); font-size: 0.78rem; margin-bottom: 0.8rem; }
    .mock-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.28rem; }
    .mock-cal-dow, .mock-cal-day { text-align: center; font-size: 0.68rem; padding: 0.28rem 0; border-radius: 4px; }
    .mock-cal-dow { color: var(--text-label); }
    .mock-cal-day { background: rgba(255,255,255,0.03); }
    .mock-cal-day--mute { color: var(--text-label); }
    .mock-cal-day--today, .mock-cal-day--has { color: var(--on-primary); background: var(--primary); }
    .mock-cal-event { margin-top: 0.8rem; justify-content: flex-start; font-size: 0.72rem; }
    .mock-cal-event-dot { width: 0.45rem; height: 0.45rem; border-radius: 50%; background: var(--primary); }
    .mock--booking { display: grid; gap: 0.65rem; }
    .mock-booking-head { color: var(--primary); font-size: 0.78rem; }
    .mock-booking-status { color: var(--ok); font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.12em; }
    .mock-booking-list { display: grid; gap: 0.5rem; }
    .mock-booking-row { display: grid; grid-template-columns: 4.4rem minmax(0, 1fr); gap: 0.65rem; align-items: start; padding: 0.58rem; border: 1px solid rgba(233,193,118,0.10); border-radius: 5px; background: rgba(255,255,255,0.03); }
    .mock-booking-time { color: var(--primary); font-size: 0.72rem; white-space: nowrap; line-height: 1.35; }
    .mock-booking-task { color: var(--text-body); font-size: 0.77rem; line-height: 1.35; }
    .mock-brief-head { color: var(--primary); font-family: var(--font-display); font-weight: 500; margin-bottom: 0.8rem; }
    .mock-brief-row { border-top: 1px solid rgba(233,193,118,0.10); padding: 0.55rem 0; font-size: 0.78rem; }
    .mock-brief-label { color: var(--text-label); }
    .mock-brief-up { color: var(--ok); }
    .mock--tasks { display: grid; gap: 0.65rem; }
    .mock-task { justify-content: flex-start; font-size: 0.78rem; color: var(--text-body); }
    .mock-task-box { width: 1rem; height: 1rem; border-radius: 4px; border: 1px solid rgba(233,193,118,0.35); display: inline-flex; align-items: center; justify-content: center; color: var(--primary); font-size: 0.7rem; }
    .mock-task--done { color: var(--text-label); }
    .mock-task--soon em { color: var(--primary); font-style: normal; }
    .mock-build-prompt { display: flex; align-items: baseline; gap: 0.5rem; color: var(--on-surface); font-size: 0.8rem; margin-bottom: 0.85rem; }
    .mock-build-cursor { color: var(--primary); }
    .mock-build-out { display: grid; gap: 0.4rem; }
    .mock-build-line { font-size: 0.72rem; color: var(--text-label); }
    .mock-build-line--ok { color: var(--ok); }
    .mock-build-caret { display: none; }
    .mock--vault, .mock--market { display: grid; gap: 0.65rem; }
    .mock-person { justify-content: flex-start; padding: 0.55rem; border: 1px solid rgba(233,193,118,0.10); border-radius: 5px; background: rgba(255,255,255,0.03); }
    .mock-person-avatar { width: 1.65rem; height: 1.65rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(233,193,118,0.14); color: var(--primary); font-size: 0.72rem; flex: none; }
    .mock-person-name { color: var(--on-surface); font-size: 0.78rem; line-height: 1.2; }
    .mock-person-meta { color: var(--text-label); font-size: 0.68rem; line-height: 1.2; }
    .mock-market-row { padding: 0.55rem 0; border-top: 1px solid rgba(233,193,118,0.10); font-size: 0.78rem; color: var(--text-body); }
    .mock-market-row:first-child { border-top: 0; padding-top: 0; }
    .mock-market-tag { color: var(--primary); font-size: 0.68rem; }

    input, select, textarea { color: var(--on-surface); background: var(--surface-lowest); border: 1px solid rgba(209,197,180,0.24); border-radius: 6px; }
    input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); }
    .choice-list { display: grid; gap: 0.75rem; }
    .license-section-inner {
      border-top: 0;
      border-bottom: 1px solid rgba(7,8,8,0.72);
      padding-top: clamp(1.25rem, 3vh, 2.2rem);
      padding-bottom: clamp(1.25rem, 3vh, 2.2rem);
    }
    .license-section-inner > * + * { margin-top: clamp(1rem, 2.2vh, 1.55rem) !important; }
    .license-section-inner .space-y-4 > * + * { margin-top: 0.65rem; }
    .license-section-inner .pt-4,
    .license-section-inner .pt-6 { padding-top: 0; }
    .license-section-inner h2 { font-size: clamp(2.6rem, 5.2vw, 4.25rem); }
    .license-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.85rem;
      max-width: 55rem;
      margin: 0 auto;
      text-align: left;
    }
    .license-card {
      position: relative;
      overflow: hidden;
      min-height: 8.6rem;
      padding: 0.92rem 1rem;
      border: 0;
      border-radius: 8px;
      background: linear-gradient(145deg, rgba(31,32,31,0.86), rgba(12,13,12,0.96));
      box-shadow: 0 1.2rem 3rem rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.035);
    }
    .license-card::before {
      content: "";
      position: absolute;
      inset: 0.08rem;
      border: 1px solid rgba(233,193,118,0.16);
      border-radius: 7px;
      pointer-events: none;
    }
    .license-card::after {
      content: "";
      position: absolute;
      inset: auto -18% -48% 30%;
      height: 8rem;
      pointer-events: none;
      background: radial-gradient(circle, rgba(200,169,106,0.13), transparent 68%);
    }
    .license-icon {
      display: grid;
      place-items: center;
      width: 2.05rem;
      height: 2.05rem;
      border: 1px solid rgba(200,169,106,0.28);
      border-radius: 8px;
      color: var(--primary);
      background: rgba(200,169,106,0.08);
      box-shadow: 0 0 1.25rem rgba(200,169,106,0.10);
    }
    .license-icon svg {
      width: 1rem;
      height: 1rem;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .license-card h3 {
      margin: 0.7rem 0 0.28rem;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: 1.04rem;
      font-weight: 500;
      line-height: 1.2;
    }
    .license-card p {
      margin: 0;
      color: rgba(218,218,218,0.76);
      font-size: 0.84rem;
      line-height: 1.45;
    }
    .choice-card { display: flex; gap: 0.85rem; align-items: flex-start; padding: 1rem; border: 1px solid rgba(233,193,118,0.18); border-radius: 6px; background: rgba(9, 13, 13, 0.64); cursor: pointer; }
    .choice-card:hover, .choice-card:has(input:checked) { border-color: rgba(233,193,118,0.48); background: rgba(233,193,118,0.06); }
    .choice-card input { flex: none; margin-top: 0.18rem; accent-color: var(--primary); }
    .choice-card__body { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
    .choice-card__title { color: var(--on-surface); font-size: 0.95rem; line-height: 1.35; }
    .choice-card__meta { color: var(--text-body); font-size: 0.82rem; line-height: 1.55; }
    .package-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
    .package-price { color: var(--primary); font-family: var(--font-display); font-weight: 500; font-size: 2rem; line-height: 1; }
    .conditional-panel { margin-top: 1rem; padding: 1rem; border: 1px solid rgba(233,193,118,0.18); border-radius: 6px; background: rgba(9, 13, 13, 0.64); }

    [class*="shadow-[0_20px_60px"] { box-shadow: 0 20px 60px -10px rgba(0,0,0,0.45); }
    #apply-card, #apply-success { background: rgba(6, 15, 28, 0.58) !important; box-shadow: 0 18px 70px rgba(0,0,0,0.16); }
    footer { border-top-color: rgba(107,220,255,0.06) !important; }

    /* Luxe editorial direction */
    html { background: #060706; }
    body {
      position: relative;
      background:
        radial-gradient(circle at 82% 8%, rgba(34, 60, 88, 0.24), transparent 34rem),
        linear-gradient(180deg, #020303 0%, #080b0d 34%, #050606 68%, #020303 100%);
    }
    body::before,
    body::after {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
    }
    body::before {
      display: none;
    }
    body::after {
      display: none;
    }
    main,
    footer {
      position: relative;
      z-index: 1;
    }
    main {
      isolation: isolate;
      overflow: visible;
      background:
        radial-gradient(circle at 78% 13%, rgba(200,169,106,0.12), transparent 28rem),
        radial-gradient(circle at 14% 34%, rgba(38,70,104,0.12), transparent 30rem),
        linear-gradient(180deg, #050505 0%, #050606 18%, #080908 35%, #050606 56%, #0b0b0a 76%, #040404 100%);
    }
    main::before {
      content: "";
      position: absolute;
      inset: calc(100vh - 10rem) 0 0;
      z-index: 0;
      pointer-events: none;
      background:
        url("/hero-network.svg") right -22rem top 2rem / min(68rem, 82vw) auto no-repeat,
        url("/hero-network.svg") left -28rem top 84rem / min(58rem, 78vw) auto no-repeat,
        url("/luxe-flow.svg") center 48% / min(118rem, 150vw) auto no-repeat,
        linear-gradient(180deg, rgba(5,6,6,0) 0%, rgba(200,169,106,0.035) 22%, transparent 46%, rgba(45,77,109,0.035) 70%, transparent 100%);
      opacity: 0.18;
      mix-blend-mode: screen;
      animation: none;
    }
    main::after {
      content: "";
      position: absolute;
      top: calc(100vh + 4rem);
      right: clamp(-24rem, -18vw, -10rem);
      z-index: 0;
      width: min(54vw, 48rem);
      height: min(54vw, 48rem);
      pointer-events: none;
      border-radius: 50%;
      background:
        radial-gradient(circle at 35% 30%, rgba(233,193,118,0.14), transparent 24%),
        radial-gradient(circle at 52% 50%, rgba(19,70,118,0.34), transparent 58%),
        radial-gradient(circle at 50% 50%, rgba(233,193,118,0.08), transparent 68%);
      -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,0.86) 48%, rgba(0,0,0,0.32) 74%, transparent 100%);
      mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,0.86) 48%, rgba(0,0,0,0.32) 74%, transparent 100%);
      opacity: 0.48;
      mix-blend-mode: screen;
      animation: none;
    }
    @keyframes story-field-drift {
      from { background-position: right -22rem top 2rem, left -28rem top 84rem, 52% 48%, 0 0; opacity: 0.13; }
      to { background-position: right -20rem top 5rem, left -30rem top 89rem, 48% 51%, 0 0; opacity: 0.21; }
    }
    @keyframes story-orb-echo {
      from { transform: translate3d(0, 0, 0) scale(0.96); opacity: 0.34; }
      to { transform: translate3d(-1rem, 2rem, 0) scale(1.03); opacity: 0.54; }
    }
    main > section {
      position: relative;
      z-index: 1;
    }
    @keyframes luxe-field-drift {
      from { background-position: center top; opacity: 0.36; }
      to { background-position: calc(50% + 2rem) 3.5rem; opacity: 0.58; }
    }

    .site-nav {
      background: linear-gradient(180deg, rgba(4,4,4,0.66), rgba(4,4,4,0.24) 68%, transparent);
      border-bottom-color: rgba(233,193,118,0.10);
    }
    .site-nav__mobile { background: rgba(5,5,5,0.94); }
    .bg-primary-gradient { background: linear-gradient(135deg, #f1d18d, #c99341); }

    .hero-luxe {
      background: linear-gradient(180deg, #050505 0%, #050606 82%, #050606 100%) !important;
      box-shadow: none;
    }
    .hero-luxe::before {
      background:
        linear-gradient(180deg, rgba(3,4,4,0.12) 0%, rgba(3,4,4,0.58) 68%, rgba(5,6,6,0.92) 88%, #050606 100%),
        linear-gradient(90deg, rgba(2,3,3,0.98) 0%, rgba(3,4,4,0.86) 38%, rgba(3,4,4,0.20) 100%);
      opacity: 1;
    }
    .hero-luxe::after {
      top: 50%;
      right: clamp(-20rem, -14vw, -8rem);
      bottom: auto;
      left: auto;
      z-index: 2;
      width: min(54vw, 48rem, calc(100svh - 6rem));
      height: min(54vw, 48rem, calc(100svh - 6rem));
      border-radius: 50%;
      background:
        radial-gradient(circle at 42% 34%, rgba(233,193,118,0.16), transparent 25%),
        radial-gradient(circle at 52% 50%, rgba(19,70,118,0.42), transparent 58%),
        radial-gradient(circle at 50% 50%, rgba(233,193,118,0.10), transparent 68%);
      background-repeat: no-repeat;
      background-size: 100% 100%;
      -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0%, #000 62%, rgba(0,0,0,0.52) 76%, transparent 100%);
      mask-image: radial-gradient(circle at 50% 50%, #000 0%, #000 62%, rgba(0,0,0,0.52) 76%, transparent 100%);
      opacity: 0.82;
      mix-blend-mode: screen;
      animation: hero-orb-aura 16s ease-in-out infinite alternate;
    }
    @keyframes hero-orb-aura {
      from { opacity: 0.62; transform: translate3d(0, -50%, 0) scale(0.94); }
      to { opacity: 0.86; transform: translate3d(-0.7rem, -50.5%, 0) scale(1.02); }
    }
    .hero-content { position: relative; z-index: 5; width: 100%; }
    .hero-showcase {
      position: absolute;
      top: 50%;
      right: clamp(-5.5rem, -4vw, -1.5rem);
      z-index: 3;
      width: min(44vw, 39rem, calc(100svh - 9.5rem));
      aspect-ratio: 1;
      transform: translateY(-50%);
      pointer-events: none;
      perspective: 1200px;
    }
    .hero-orb {
      position: relative;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 31% 23%, rgba(73,130,177,0.42), transparent 30%),
        radial-gradient(circle at 62% 66%, rgba(1,4,8,0.98), rgba(2,6,12,0.92) 48%, rgba(3,13,27,0.68) 72%, rgba(3,4,4,0) 100%),
        linear-gradient(145deg, rgba(8,28,51,0.92), rgba(2,3,4,0.98) 62%);
      box-shadow:
        inset 2.5rem 2rem 5rem rgba(72,132,178,0.22),
        inset -3rem -3.5rem 5.5rem rgba(0,0,0,0.96),
        0 0 5rem rgba(33,92,139,0.24),
        0 0 7rem rgba(233,193,118,0.10);
      animation: hero-orb-float 12s ease-in-out infinite;
      transform-style: preserve-3d;
    }
    .hero-orb::before {
      content: "";
      position: absolute;
      inset: -11%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 36% 28%, rgba(233,193,118,0.16), transparent 35%),
        radial-gradient(circle at 65% 56%, rgba(33,92,139,0.28), transparent 60%);
      filter: blur(18px);
      opacity: 0.76;
    }
    .hero-orb::after {
      content: "";
      position: absolute;
      inset: 7%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 30% 22%, rgba(255,255,255,0.16), transparent 18%),
        radial-gradient(circle at 62% 76%, rgba(0,0,0,0.72), transparent 42%);
      opacity: 0.72;
      mix-blend-mode: screen;
    }
    .hero-orb__network {
      position: absolute;
      inset: -16%;
      z-index: 3;
      background: url("/hero-network.svg") center / contain no-repeat;
      filter: drop-shadow(0 0 1.4rem rgba(233,193,118,0.52));
      mix-blend-mode: screen;
      opacity: 0.98;
      animation: hero-network-drift 18s ease-in-out infinite alternate;
    }
    .hero-orb__ring {
      --ring-x: 68deg;
      --ring-start: -22deg;
      --ring-end: 338deg;
      position: absolute;
      inset: -5%;
      z-index: 4;
      border: 1px solid rgba(233,193,118,0.20);
      border-radius: 50%;
      box-shadow: 0 0 2rem rgba(233,193,118,0.12);
      transform: rotateX(var(--ring-x)) rotateZ(var(--ring-start));
      animation: hero-ring-spin 28s linear infinite;
    }
    .hero-orb__ring--two {
      --ring-x: 62deg;
      --ring-start: 28deg;
      --ring-end: -332deg;
      inset: 4%;
      border-color: rgba(93,160,208,0.18);
      animation-duration: 36s;
    }
    .hero-orb__ring--three {
      --ring-x: 72deg;
      --ring-start: 78deg;
      --ring-end: 438deg;
      inset: 15%;
      border-color: rgba(233,193,118,0.14);
      animation-duration: 44s;
    }
    .hero-orb__flare {
      position: absolute;
      left: 21%;
      top: 43%;
      z-index: 5;
      width: 58%;
      height: 2px;
      border-radius: 999px;
      background: linear-gradient(90deg, transparent, rgba(255,239,186,0.14), rgba(233,193,118,0.68), rgba(255,239,186,0.14), transparent);
      box-shadow: 0 0 1.3rem rgba(233,193,118,0.55);
      transform: rotate(-12deg) scaleX(0.66);
      transform-origin: center;
      opacity: 0;
      animation: hero-flare-sweep 6.5s ease-in-out infinite;
    }
    @keyframes hero-orb-float {
      0%, 100% { transform: translate3d(0, 0, 0) rotateZ(-0.8deg); }
      50% { transform: translate3d(-0.6rem, -0.9rem, 0) rotateZ(1deg); }
    }
    @keyframes hero-network-drift {
      from { transform: translate3d(0.5rem, -0.4rem, 0) scale(0.98) rotateZ(-1.8deg); opacity: 0.84; }
      to { transform: translate3d(-0.25rem, 0.6rem, 0) scale(1.025) rotateZ(1.2deg); opacity: 1; }
    }
    @keyframes hero-ring-spin {
      to { transform: rotateX(var(--ring-x)) rotateZ(var(--ring-end)); }
    }
    @keyframes hero-flare-sweep {
      0%, 20%, 100% { opacity: 0; transform: rotate(-12deg) translateX(-12%) scaleX(0.42); }
      42% { opacity: 0.72; transform: rotate(-12deg) translateX(0) scaleX(1); }
      62% { opacity: 0; transform: rotate(-12deg) translateX(12%) scaleX(0.62); }
    }
    .hero-copy { color: rgba(238,232,220,0.82); }
    .hero-link--secondary {
      background: rgba(255,255,255,0.015);
      border-color: rgba(233,193,118,0.34);
    }

    .describe-section {
      margin-top: 0;
      min-height: 34vh;
      padding-top: clamp(5rem, 10vh, 7rem);
      padding-bottom: clamp(2.6rem, 6vh, 4.5rem);
      background: linear-gradient(180deg, #050914 0%, #050606 30%, #050606 72%, #050505 100%) !important;
      box-shadow: none;
    }
    .describe-section::before {
      content: none;
      display: none;
    }
    .describe-section::after {
      content: none;
      display: none;
    }
    .describe-inner { z-index: 2; }
    /* NOTE: No CSS scroll-snap on the story scenes. Each scene is 2-6x viewport
       tall on purpose — it pins (position: sticky) and scrubs through its beats
       as you scroll. Snapping to a scene that's taller than the viewport fights
       that internal scrub, so we rely on native scrolling + equal-dwell beats
       (see updateScene's Math.floor) to make every beat land cleanly. */
    .story-scene { scroll-snap-align: none; }

    /* NOTE: No page-level CSS scroll-snap. We tried `scroll-snap-type: y proximity`
       to gently centre pricing/how, but proximity RE-snaps every time you come to
       rest near a section — so scrolling past felt like it kept yanking you back
       up. Native free scrolling is smoother; the real fix for "I miss content" is
       beat dwell + faster reveals, not snapping. (The .snap-center class is now a
       no-op kept only to avoid touching markup.) */

    .opening-scene {
      position: relative;
      /* Taller scene + weighted beats (1,2.4) = the "It doesn't improvise…" beat
         gets ~70% of the scroll so its words colour in gold as you scroll and the
         line dwells before advancing — you can't blow past it. */
      height: 340vh;
      height: 340svh;
      z-index: 10;
      isolation: isolate;
      background: #050606 !important;
    }
    .opening-sticky {
      position: sticky;
      top: 0;
      z-index: 11;
      height: 100vh;
      height: 100svh;
      overflow: hidden;
      isolation: isolate;
      background: #050606;
    }
    .opening-sticky::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(5, 9, 20, 0) 48%, rgba(5, 9, 20, 0.72) 78%, #050914 100%),
        linear-gradient(90deg, rgba(4, 5, 12, 0.98) 0%, rgba(5, 10, 24, 0.86) 43%, rgba(7, 22, 48, 0.34) 100%);
    }
    .opening-sticky::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background:
        radial-gradient(circle at 78% 22%, rgba(107, 220, 255, 0.22) 0 0.18rem, transparent 0.42rem),
        radial-gradient(circle at 86% 42%, rgba(233, 193, 118, 0.22) 0 0.14rem, transparent 0.38rem),
        radial-gradient(circle at 70% 56%, rgba(107, 220, 255, 0.16) 0 0.16rem, transparent 0.44rem),
        linear-gradient(115deg, transparent 36%, rgba(107, 220, 255, 0.00) 44%, rgba(107, 220, 255, 0.18) 50%, rgba(233, 193, 118, 0.12) 53%, transparent 62%),
        radial-gradient(circle at 78% 22%, rgba(107, 220, 255, 0.14), transparent 18rem);
      background-size: 100% 100%, 100% 100%, 100% 100%, 240% 100%, 100% 100%;
      -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,0.55) 74%, transparent 94%);
      mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,0.55) 74%, transparent 94%);
      animation: hero-hive-light 13s ease-in-out infinite;
    }
    .opening-scene .opening-panel {
      position: absolute;
      inset: 0;
      z-index: 2;
      display: grid;
      place-items: center;
      width: 100%;
      height: 100%;
      min-height: 100%;
      margin: 0;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(1.6rem) scale(0.985);
      transition: opacity 900ms ease, visibility 900ms ease, transform 1000ms cubic-bezier(0.18, 1, 0.22, 1), filter 900ms ease;
      filter: blur(0.3px);
    }
    .opening-scene .opening-panel.is-active {
      z-index: 4;
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0) scale(1);
      filter: none;
    }
    .opening-scene .hero-luxe {
      display: flex;
      align-items: center;
      padding-top: clamp(7rem, 15vh, 10rem);
      padding-bottom: clamp(4.5rem, 9vh, 6rem);
      background: transparent !important;
    }
    .opening-scene .hero-luxe::before,
    .opening-scene .hero-luxe::after {
      content: none;
      display: none;
    }
    .opening-scene .hero-showcase {
      z-index: 3;
      opacity: 0.96;
      transition: opacity 1000ms ease, transform 1100ms cubic-bezier(0.18, 1, 0.22, 1), filter 1100ms ease;
    }
    .opening-scene[data-active-index="1"] .hero-showcase {
      z-index: 3;
      opacity: 0.38;
      transform: translateY(-43%) scale(0.92);
      filter: blur(0.5px) drop-shadow(0 0 2rem rgba(200,169,106,0.08));
      transition: opacity 1000ms ease, transform 1100ms cubic-bezier(0.18, 1, 0.22, 1), filter 1100ms ease;
    }
    .opening-scene[data-active-index="1"] .hero-orb {
      box-shadow:
        inset 2.5rem 2rem 5rem rgba(72,132,178,0.16),
        inset -3rem -3.5rem 5.5rem rgba(0,0,0,0.96),
        0 0 4.5rem rgba(33,92,139,0.18),
        0 0 6.5rem rgba(233,193,118,0.10);
    }
    .opening-scene[data-active-index="1"] .hero-orb__network {
      filter: drop-shadow(0 0 1.35rem rgba(233,193,118,0.46));
      opacity: 0.76;
    }
    .opening-scene[data-active-index="1"] .hero-orb__ring {
      border-color: rgba(233,193,118,0.18);
      box-shadow: 0 0 1.8rem rgba(233,193,118,0.10);
    }
    .opening-scene .opening-panel--bridge {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: clamp(3rem, 7vh, 5rem) clamp(1.5rem, 4.5vw, 3rem);
      background: transparent !important;
    }
    .opening-scene .opening-panel--bridge .describe-inner {
      width: 100%;
      margin: 0 auto;
      position: relative;
      z-index: 4;
    }
    .opening-scene .opening-panel--bridge .describe-line {
      max-width: 54rem;
      margin: 0;
      text-align: left;
      font-size: clamp(2.45rem, 5.4vw, 5.7rem);
    }
    .describe-phrase {
      display: inline-block;
    }
    /* Keep each highlighted word glued to its trailing period so the "." can
       never wrap onto its own line (the words are inline-block, which otherwise
       creates a break opportunity before the period). */
    .describe-keep { white-space: nowrap; }
    .reveal-enabled .opening-scene .opening-panel--bridge.is-active .describe-line {
      opacity: 1;
      transform: translateY(0);
    }
    @keyframes describe-build-wipe-readable {
      0% {
        color: var(--text-main);
        text-shadow: 0 0 0 rgba(233,193,118,0);
      }
      45% {
        color: #f4d999;
        text-shadow: 0 0 1.05rem rgba(233,193,118,0.22);
      }
      100% {
        color: var(--text-accent);
        text-shadow: 0 0 0.35rem rgba(233,193,118,0.12);
      }
    }
    .pain-section {
      position: relative;
      isolation: isolate;
      z-index: 1;
      /* NOTE: the ACTIVE height for this scene is set lower in the stylesheet
         (the "luxe" override, .pain-section { height: 300vh }). Keep them in
         sync if you re-tune the scroll length. */
      height: 300vh;
      height: 300svh;
      overflow: hidden;
      padding: 0 1.5rem;
      background:
        radial-gradient(ellipse at 50% 35%, rgba(24,25,24,0.36) 0%, rgba(12,13,13,0.24) 46%, rgba(5,6,6,0) 78%),
        linear-gradient(180deg, #050505 0%, #070807 48%, #050606 100%) !important;
    }
    .pain-section::before {
      content: none;
      display: none;
    }
    .pain-section::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(ellipse at 50% 35%, rgba(24,25,24,0.36) 0%, rgba(12,13,13,0.24) 46%, rgba(5,6,6,0) 78%),
        linear-gradient(180deg, #050505 0%, #070807 48%, #050606 100%);
    }
    .pain-inner {
      position: sticky;
      top: 0;
      z-index: 1;
      width: 100%;
      max-width: 74rem;
      height: 100vh;
      height: 100svh;
      margin: 0 auto;
      overflow: hidden;
    }
    .pain-label,
    .story-label,
    .feature-label {
      color: var(--text-label);
      font-family: var(--font-sans);
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.24em;
      text-transform: uppercase;
    }
    .pain-title {
      max-width: 62rem;
      margin: 1.1rem 0 0;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: clamp(2.25rem, 5vw, 5rem);
      font-weight: 500;
      line-height: 1.05;
      letter-spacing: 0;
    }
    .pain-title span {
      display: block;
    }
    .pain-title--solution {
      margin-top: 0;
      font-size: clamp(2.15rem, 4.7vw, 4.6rem);
    }
    .pain-title em {
      color: var(--text-accent);
      font-style: italic;
      font-weight: 400;
    }
    .pain-brand {
      color: var(--text-accent);
    }
    .pain-panel {
      position: absolute;
      inset: 0;
      display: grid;
      align-items: center;
      min-height: 100%;
      padding: clamp(5rem, 10vh, 8rem) 0 clamp(4.5rem, 9vh, 7rem);
      transition: opacity 900ms ease, visibility 900ms ease, transform 1000ms cubic-bezier(0.18, 1, 0.22, 1), filter 900ms ease;
    }
    .reveal-enabled .pain-panel {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(2rem);
      filter: blur(0.35px);
    }
    .reveal-enabled .pain-panel.is-active {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0);
      filter: none;
    }
    .pain-panel--problem {
      grid-template-columns: minmax(18rem, 0.82fr) minmax(20rem, 1.18fr);
      gap: clamp(2rem, 6vw, 6rem);
    }
    .pain-panel--solution {
      align-items: center;
      justify-items: center;
      text-align: center;
    }
    .pain-panel--solution > div {
      transform: none;
    }
    .pain-solution-brand,
    .pain-solution-copy {
      opacity: 1;
      transform: translateY(0);
    }
    .pain-solution-brand {
      margin: 0;
      color: var(--text-accent);
      font-family: var(--font-display);
      font-size: clamp(3.4rem, 8vw, 7rem);
      font-style: italic;
      font-weight: 400;
      line-height: 1.15;
      padding-bottom: 0.18em;
      text-align: center;
    }
    .pain-solution-copy {
      max-width: 48rem;
      margin: clamp(0.65rem, 2vh, 1.1rem) auto 0;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: clamp(2.15rem, 4.7vw, 4.6rem);
      font-weight: 500;
      line-height: 1.22;
      padding-bottom: 0.2em;
      text-align: center;
    }
    .pain-solution-copy em {
      display: inline-block;
      color: var(--text-accent);
      font-style: italic;
      font-weight: 400;
      padding-bottom: 0.18em;
    }
    /* "Your AI watches from the sidelines" subline under the scattered title. */
    .pain-subline {
      margin: 0.9rem 0 0;
      font-family: var(--font-sans);
      font-size: clamp(0.95rem, 1.6vw, 1.15rem);
      color: var(--text-label);
      opacity: 0;
      transform: translateY(0.6rem);
      transition: opacity 420ms ease, transform 480ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .pain-subline__accent { color: var(--text-accent); }
    .pain-section[data-active-index="3"] .pain-subline {
      opacity: 1;
      transform: translateY(0);
    }
    .reveal-enabled .pain-solution-brand,
    .reveal-enabled .pain-solution-copy {
      opacity: 0;
      transform: translateY(24px);
    }
    .pain-panel--solution.is-visible .pain-solution-brand,
    .pain-panel--solution.is-active .pain-solution-brand {
      opacity: 1;
      transform: translateY(0);
      transition: opacity 900ms ease, transform 1000ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .pain-panel--solution.is-visible .pain-solution-copy,
    .pain-panel--solution.is-active .pain-solution-copy {
      opacity: 1;
      transform: translateY(0);
      transition: opacity 900ms ease 140ms, transform 1000ms cubic-bezier(0.18, 1, 0.22, 1) 140ms;
    }
    .pain-copy .pain-label,
    .pain-copy .pain-title,
    .pain-phone-scene {
      opacity: 0;
      transform: translateY(22px);
    }
    .pain-phone-scene {
      position: relative;
      justify-self: center;
      width: min(100%, 46rem);
      min-height: clamp(26rem, 54vw, 37rem);
      display: grid;
      place-items: center;
    }
    .pain-phone-scene::before {
      content: "";
      position: absolute;
      inset: 4% -10% 2%;
      border-radius: 999px;
      pointer-events: none;
      background: radial-gradient(ellipse at 50% 52%, rgba(200,169,106,0.16), rgba(23,33,44,0.14) 40%, transparent 68%);
      filter: blur(18px);
      opacity: 0.76;
    }
    .pain-phone {
      position: relative;
      width: min(22rem, 82vw);
      aspect-ratio: 9 / 16;
      padding: 1rem 0.95rem 1.2rem;
      border: 1px solid rgba(247,241,232,0.16);
      border-radius: 2.35rem;
      background:
        linear-gradient(145deg, rgba(255,255,255,0.12), transparent 9%),
        linear-gradient(180deg, #111312 0%, #060706 100%);
      box-shadow: 0 2.4rem 5rem rgba(0,0,0,0.48), inset 0 0 0 0.42rem rgba(0,0,0,0.78), inset 0 0 0 0.52rem rgba(255,255,255,0.055);
      overflow: hidden;
    }
    .pain-phone::before {
      content: "";
      position: absolute;
      inset: 1.15rem;
      border-radius: 1.7rem;
      background:
        radial-gradient(circle at 72% 18%, rgba(200,169,106,0.15), transparent 8rem),
        radial-gradient(circle at 24% 70%, rgba(28,61,82,0.42), transparent 13rem),
        linear-gradient(145deg, #162c25 0%, #0c1715 52%, #050606 100%);
      opacity: 0.92;
    }
    .pain-phone__notch {
      position: absolute;
      top: 1.25rem;
      left: 50%;
      z-index: 2;
      width: 5.9rem;
      height: 1.55rem;
      border-radius: 999px;
      background: #010101;
      transform: translateX(-50%);
      box-shadow: inset -1.6rem 0 0 rgba(255,255,255,0.025);
    }
    .pain-phone__status {
      position: relative;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      padding: 0.8rem 1rem 0;
      color: rgba(247,241,232,0.86);
      font-family: var(--font-sans);
      font-size: 0.77rem;
      font-weight: 600;
    }
    .pain-phone__status span:last-child {
      color: rgba(247,241,232,0.58);
      letter-spacing: 0.08em;
    }
    .pain-phone__grid {
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: clamp(1.15rem, 3vw, 1.55rem);
      padding: clamp(3.4rem, 8vw, 4.25rem) 1.55rem 0;
    }
    .phone-app {
      position: relative;
      display: grid;
      justify-items: center;
      gap: 0.46rem;
      color: rgba(247,241,232,0.74);
      line-height: 1;
      font-family: var(--font-sans);
      font-size: 0.7rem;
      opacity: 0;
      transform: translateY(16px) scale(0.98);
    }
    .phone-app__icon {
      position: relative;
      display: grid;
      place-items: center;
      width: clamp(3.15rem, 8vw, 4rem);
      aspect-ratio: 1;
      border-radius: 1rem;
      background: linear-gradient(145deg, rgba(247,241,232,0.95), rgba(218,218,218,0.74));
      color: #111312;
      box-shadow: 0 0.8rem 1.8rem rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.72);
      overflow: visible;
    }
    .phone-app__icon::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      border-radius: inherit;
      background: linear-gradient(145deg, rgba(255,255,255,0.34), transparent 38%);
    }
    .phone-app--calendar .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #f3483f 0 34%, #f7f1e8 34% 100%); }
    .phone-app--email .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #1aa4ff, #1d5eea); }
    .phone-app--reminders .phone-app__icon { color: #2b2d2d; background: linear-gradient(145deg, #ffffff, #dcd8ce); }
    .phone-app--research .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #1f8d67, #0d3d37); }
    .phone-app--contacts .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #a9783d, #4d3620); }
    .phone-app--podcast .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #b455f0, #6a1fb0); }
    .phone-app--stocks .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #18181b, #2c2c33); }
    .phone-app--crm .phone-app__icon { color: #ffffff; background: linear-gradient(145deg, #ff8a3d, #e0531f); }
    .phone-app svg {
      position: relative;
      z-index: 1;
      width: 1.65rem;
      height: 1.65rem;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .phone-badge {
      position: absolute;
      top: -0.48rem;
      right: -0.45rem;
      display: grid;
      place-items: center;
      min-width: 1.55rem;
      height: 1.55rem;
      padding: 0 0.34rem;
      border-radius: 999px;
      background: #e92318;
      color: white;
      font-size: 0.78rem;
      font-weight: 700;
      box-shadow: 0 0.55rem 1.25rem rgba(233,35,24,0.34);
      opacity: 0;
      transform: scale(0.68);
    }
    .pain-callouts {
      position: absolute;
      inset: 0;
      z-index: 5;
      pointer-events: none;
    }
    .pain-callout {
      position: absolute;
      left: var(--callout-left, auto);
      right: var(--callout-right, auto);
      top: var(--callout-y);
      z-index: 4;
      display: inline-flex;
      align-items: center;
      justify-content: var(--callout-justify, flex-start);
      gap: 0.3rem;
      min-height: 0;
      padding: 0.32rem 0.46rem;
      max-width: min(11.15rem, 23vw);
      border: 1px solid rgba(200,169,106,0.14);
      border-radius: 0.72rem;
      background: rgba(5,6,6,0.78);
      color: rgba(247,241,232,0.76);
      font-family: var(--font-sans);
      font-size: clamp(0.66rem, 1vw, 0.74rem);
      line-height: 1.05;
      text-align: var(--callout-align, left);
      white-space: normal;
      box-shadow: 0 0.9rem 2rem rgba(0,0,0,0.28), 0 0 1.4rem rgba(200,169,106,0.06);
      opacity: 0;
      transform: translate3d(var(--callout-dx), 0.9rem, 0) scale(0.96);
      transition: opacity 520ms ease, transform 680ms cubic-bezier(0.18, 1, 0.22, 1), border-color 520ms ease;
    }
    .pain-callout::before {
      content: "";
      flex: 0 0 auto;
      width: 0.36rem;
      height: 0.36rem;
      margin-right: 0;
      border-radius: 999px;
      background: #e92318;
      box-shadow: 0 0 0.9rem rgba(233,35,24,0.46);
    }
    .pain-callout--calendar::before,
    .pain-callout--reminders::before,
    .pain-callout--contacts::before {
      order: 2;
      margin-right: 0;
      margin-left: 0;
    }
    .pain-callout.is-visible {
      opacity: 1;
      transform: translate3d(0, 0, 0) scale(1);
      border-color: rgba(200,169,106,0.24);
    }
    .pain-callout--calendar { --callout-right: calc(50% + 11.25rem); --callout-y: 25%; --callout-dx: -0.8rem; --callout-align: right; --callout-justify: flex-end; }
    .pain-callout--email { --callout-left: calc(50% + 11.25rem); --callout-y: 25%; --callout-dx: 0.8rem; }
    .pain-callout--reminders { --callout-right: calc(50% + 11.25rem); --callout-y: 53%; --callout-dx: -0.8rem; --callout-align: right; --callout-justify: flex-end; }
    .pain-callout--research { --callout-left: calc(50% + 11.25rem); --callout-y: 53%; --callout-dx: 0.8rem; }
    .pain-callout--contacts { --callout-right: calc(50% + 11.25rem); --callout-y: 74%; --callout-dx: -0.8rem; --callout-align: right; --callout-justify: flex-end; }
    .pain-section.is-visible .pain-copy .pain-label {
      animation: pain-item-rise 900ms ease forwards;
    }
    .pain-section.is-visible .pain-copy .pain-title {
      animation: pain-item-rise 900ms cubic-bezier(0.18, 1, 0.22, 1) 650ms forwards;
    }
    /* Compressed timing: the phone + apps used to take ~3s to fully arrive
       (apps at 1.85-2.45s, badges 2.65s), so a normal-paced scroller passed the
       beat before anything appeared. Now the whole sequence lands in <1s. */
    .pain-section.is-visible .pain-phone-scene {
      animation: pain-item-rise 600ms cubic-bezier(0.18, 1, 0.22, 1) 0.15s forwards;
    }
    .pain-section.is-visible .phone-app {
      animation: pain-app-arrive 460ms cubic-bezier(0.18, 1, 0.22, 1) forwards;
    }
    .pain-section.is-visible .phone-app:nth-child(1) { animation-delay: 0.32s; }
    .pain-section.is-visible .phone-app:nth-child(2) { animation-delay: 0.40s; }
    .pain-section.is-visible .phone-app:nth-child(3) { animation-delay: 0.48s; }
    .pain-section.is-visible .phone-app:nth-child(4) { animation-delay: 0.56s; }
    .pain-section.is-visible .phone-app:nth-child(5) { animation-delay: 0.64s; }
    .pain-section.is-visible .phone-app:nth-child(6) { animation-delay: 0.72s; }
    .pain-section.is-visible .phone-app:nth-child(7) { animation-delay: 0.80s; }
    .pain-section.is-visible .phone-app:nth-child(8) { animation-delay: 0.88s; }
    .pain-section.is-visible .phone-badge {
      animation: phone-badge-arrive 420ms cubic-bezier(0.18, 1, 0.22, 1) 0.85s forwards;
    }
    .phone-badge.is-popping {
      animation: phone-badge-pop 360ms cubic-bezier(0.18, 1, 0.22, 1) forwards;
    }
    @keyframes pain-item-rise {
      to { opacity: 1; transform: translateY(0); }
    }
    @keyframes pain-app-arrive {
      to { opacity: 1; transform: translateY(0) scale(1); }
    }
    @keyframes phone-badge-arrive {
      to { opacity: 1; transform: scale(1); }
    }
    @keyframes phone-badge-pop {
      0% { opacity: 1; transform: scale(0.9); }
      55% { opacity: 1; transform: scale(1.18); }
      100% { opacity: 1; transform: scale(1); }
    }
    .pain-phone-scene.is-overloaded .pain-phone {
      animation: phone-tension 1.8s ease-in-out 1;
    }
    @keyframes phone-tension {
      0%, 100% { transform: translateX(0); }
      28% { transform: translateX(-0.22rem); }
      52% { transform: translateX(0.2rem); }
      76% { transform: translateX(-0.12rem); }
    }
    @keyframes pain-solution-rise {
      to { opacity: 1; transform: translateY(0); }
    }

    main > .agentum-section,
    .agentum-section {
      background: transparent !important;
    }
    .agentum-section::before,
    .agentum-section::after {
      content: none;
      display: none;
    }
    .agentum-frame {
      position: relative;
      padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 4rem);
      max-width: min(100%, 88rem);
      margin: 0 auto;
      border-top: 0;
      border-bottom: 0;
      overflow: hidden;
      background: radial-gradient(ellipse at 50% 50%, rgba(31,32,31,0.92) 0%, rgba(25,26,25,0.80) 42%, rgba(17,18,17,0.46) 70%, rgba(8,8,8,0.10) 88%, transparent 100%);
      box-shadow: none;
    }
    .lux-shell,
    .mock,
    #apply-card,
    #apply-success {
      background: linear-gradient(145deg, rgba(2,2,2,0.96), rgba(13,13,12,0.92)) !important;
      border-color: rgba(233,193,118,0.24) !important;
      box-shadow: 0 1.8rem 4.5rem rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.06);
    }
    .home-card,
    .home-hero-row,
    .vault-meta,
    .vault-person,
    .mock-booking-row,
    .mock-person,
    .choice-card {
      background: rgba(255,255,255,0.025);
      border-color: rgba(233,193,118,0.14);
    }

    .inside-luxe,
    #how,
    #faq {
      background: transparent !important;
    }
    #pricing {
      background:
        radial-gradient(ellipse at 50% 50%, rgba(31,32,31,0.56) 0%, rgba(19,20,19,0.28) 44%, rgba(4,4,4,0) 78%) !important;
      box-shadow: none;
      padding-top: clamp(3.25rem, 6.5vh, 5rem) !important;
      padding-bottom: clamp(3.25rem, 6.5vh, 5rem) !important;
    }
    #apply {
      background:
        radial-gradient(ellipse at 50% 48%, rgba(31,32,31,0.52), rgba(4,4,4,0) 72%) !important;
      box-shadow: none;
    }
    .inside-luxe::before {
      content: none;
      display: none;
    }
    @keyframes luxe-feature-flow {
      from { background-position: 50% 35%; opacity: 0.13; transform: scale(1); }
      to { background-position: 48% 39%; opacity: 0.24; transform: scale(1.01); }
    }
    #pricing::before,
    #how::before,
    #apply::before,
    #faq::before {
      display: none;
    }
    .inside-luxe::after,
    #pricing::after,
    #how::after,
    #apply::after,
    #faq::after {
      display: none;
    }
    #pricing > *,
    #apply > *,
    #faq > *,
    .inside-luxe > *,
    .agentum-section > * {
      position: relative;
      z-index: 1;
    }
    .inside-card,
    .inside-card--stacked {
      background: linear-gradient(145deg, rgba(31,32,31,0.90), rgba(16,17,16,0.94));
      border-color: rgba(233,193,118,0.13);
      box-shadow: 0 1.2rem 3rem rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.035);
    }
    .inside-card.is-active {
      background: linear-gradient(145deg, rgba(35,36,35,0.98), rgba(18,19,18,0.98));
      border-color: rgba(233,193,118,0.34);
      box-shadow: 0 2rem 5rem rgba(0,0,0,0.36), 0 0 2.5rem rgba(233,193,118,0.08);
    }
    .inside-card__image { background: rgba(5,6,6,0.38); }

    .product-story-section {
      position: relative;
      height: 300vh;
      height: 300svh;
      padding-top: 0 !important;
      padding-bottom: 0 !important;
      /* Kept dark/near-black — the old grey radial glow read as a "weird"
         lighter patch behind the "03 Private by design" text beat. */
      background:
        radial-gradient(ellipse at 50% 42%, rgba(16,17,16,0.16) 0%, rgba(8,9,9,0.08) 50%, rgba(5,6,6,0) 78%),
        linear-gradient(180deg, #050606 0%, #060706 50%, #050606 100%) !important;
    }
    /* Opaque black laid over the page-wide network/constellation decoration
       (main::before) so it doesn't bleed through behind "01 Command layer".
       Anchored to the SECTION (fixed bounds) — NOT the sticky shell — so it
       cannot slide into the neighbouring pain/inside sections. Sits above
       main::before (z 0) but below the section's content. */
    .product-story-section::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: #050606;
      pointer-events: none;
    }
    .product-story-section .agentum-frame {
      padding: 0;
      background: transparent;
      box-shadow: none;
      overflow: visible;
    }
    .product-story-shell {
      position: sticky;
      top: 0;
      z-index: 1;
      width: min(100%, 88rem);
      height: 100vh;
      height: 100svh;
      margin: 0 auto;
      display: grid;
      align-items: center;
      overflow: hidden;
    }
    .product-story-grid {
      display: grid;
      grid-template-columns: minmax(18rem, 0.96fr) minmax(0, 1.04fr);
      gap: clamp(2.5rem, 6vw, 5.5rem);
      align-items: center;
      width: 100%;
      height: 100%;
      min-height: 0;
    }
    .product-story-mockup {
      position: relative;
      top: auto;
      display: block;
      width: min(100%, 560px);
      max-width: 100%;
      justify-self: start;
      align-self: center;
      transform: none;
      z-index: 1;
    }
    .product-story-mockup .world-mockup {
      width: 100%;
    }
    .product-story-beats {
      position: relative;
      z-index: 2;
      height: min(100%, 38rem);
      min-height: clamp(25rem, 58vh, 38rem);
      padding: 0;
    }
    .product-beat {
      position: absolute;
      inset: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      border-top: 0;
      padding: 0;
      transition: opacity 700ms ease, transform 700ms cubic-bezier(0.18, 1, 0.22, 1), border-color 700ms ease, filter 700ms ease;
    }
    .product-beat:first-child {
      border-top: 0;
      padding-top: 0;
    }
    .product-beat__number {
      color: var(--text-accent);
      font-family: var(--font-display);
      font-size: clamp(1.6rem, 2.7vw, 2.25rem);
      line-height: 1;
    }
    .product-beat h2,
    .product-beat h3 {
      margin: 0.85rem 0 0;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: clamp(2rem, 4vw, 3.85rem);
      font-weight: 500;
      line-height: 1.07;
      letter-spacing: 0;
    }
    .product-beat h2 span,
    .product-beat h3 span {
      display: block;
    }
    .product-beat h2 em,
    .product-beat h3 em {
      color: var(--text-accent);
      font-style: italic;
      font-weight: 400;
    }
    .product-beat p {
      max-width: 36rem;
      margin-top: 1rem;
      color: var(--text-body);
      font-size: clamp(1rem, 1.45vw, 1.18rem);
      line-height: 1.65;
    }
    .product-beat--left {
      margin-left: clamp(-9rem, -9vw, -4rem);
      max-width: 38rem;
    }
    .reveal-enabled .product-beat {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(2rem);
      filter: blur(0.35px);
    }
    .reveal-enabled .product-beat.is-visible,
    .reveal-enabled .product-beat.is-active {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0);
      filter: none;
    }
    .product-beat.is-visible,
    .product-beat.is-active {
      border-color: rgba(200,169,106,0.28);
    }
    .product-beat.is-visible .product-beat__number,
    .product-beat.is-active .product-beat__number {
      text-shadow: 0 0 1.1rem rgba(200,169,106,0.22);
    }

    .feature-story-section {
      padding: clamp(4rem, 10vh, 7rem) 0 clamp(3.5rem, 8vh, 6rem) !important;
      overflow: hidden;
    }
    .feature-story-section .inside-scrollytelling {
      display: none;
    }
    .feature-story {
      position: relative;
      max-width: 74rem;
      margin: 0 auto;
      padding: 0 1.5rem;
    }
    .feature-story__intro {
      max-width: 46rem;
      margin-bottom: clamp(2.5rem, 6vh, 4rem);
    }
    .feature-story__intro h2 {
      margin: 0.8rem 0 0;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: clamp(2.4rem, 5vw, 4.6rem);
      font-weight: 500;
      line-height: 1;
    }
    .feature-story__intro h2 span {
      color: var(--text-accent);
      font-style: italic;
      font-weight: 400;
    }
    .feature-story__intro p {
      max-width: 38rem;
      margin: 1rem 0 0;
      color: var(--text-body);
      font-size: clamp(1rem, 1.6vw, 1.18rem);
      line-height: 1.65;
    }
    .feature-row {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: clamp(2rem, 5vw, 5rem);
      align-items: center;
      border-top: 1px solid rgba(200,169,106,0.10);
      min-height: clamp(26rem, 62vh, 38rem);
      padding: clamp(4rem, 9vh, 7rem) 0;
    }
    .feature-row:first-of-type {
      border-top: 0;
      padding-top: 0;
    }
    .feature-row:nth-of-type(even) .feature-copy,
    .feature-row--reverse .feature-copy {
      order: 2;
    }
    .feature-row:nth-of-type(even) .feature-visual,
    .feature-row--reverse .feature-visual {
      order: 1;
    }
    .feature-number {
      color: var(--text-accent);
      font-family: var(--font-display);
      font-size: clamp(1.35rem, 2.4vw, 2rem);
      line-height: 1;
    }
    .feature-copy h3 {
      margin: 0.65rem 0 0;
      color: var(--text-main);
      font-family: var(--font-display);
      font-size: clamp(1.8rem, 3.2vw, 3rem);
      font-weight: 500;
      line-height: 1.08;
    }
    .feature-copy p {
      max-width: 36rem;
      margin: 0.9rem 0 0;
      color: var(--text-body);
      line-height: 1.65;
    }
    .feature-points {
      display: grid;
      gap: 0.55rem;
      margin: 1.2rem 0 0;
      padding: 0;
      color: var(--text-label);
      list-style: none;
    }
    .feature-points li {
      display: flex;
      gap: 0.55rem;
      align-items: baseline;
    }
    .feature-points li::before {
      content: "";
      flex: none;
      width: 0.35rem;
      height: 0.35rem;
      margin-top: 0.5rem;
      border-radius: 50%;
      background: var(--text-accent);
      box-shadow: 0 0 0.85rem rgba(200,169,106,0.30);
    }
    .feature-visual {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 18rem;
      border: 1px solid rgba(200,169,106,0.12);
      border-radius: 8px;
      background:
        radial-gradient(circle at 70% 18%, rgba(200,169,106,0.12), transparent 11rem),
        linear-gradient(145deg, rgba(31,32,31,0.92), rgba(12,13,12,0.96));
      box-shadow: 0 1.4rem 3.4rem rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.035);
      padding: clamp(1rem, 3vw, 1.5rem);
    }
    .feature-visual .mock {
      max-width: min(22rem, 100%);
    }
    .reveal-enabled .reveal-heading {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity 900ms ease, transform 900ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .reveal-enabled .reveal-heading.is-visible {
      opacity: 1;
      transform: translateY(0);
    }
    .reveal-enabled .reveal-card {
      opacity: 0;
      transform: translateY(24px) scale(0.98);
      transition: opacity 700ms ease, transform 800ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .reveal-enabled .reveal-card.is-visible {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
    .reveal-enabled .product-mockup {
      opacity: 0;
      transform: translateY(20px) scale(0.96);
      transition: opacity 900ms ease, transform 1000ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .reveal-enabled .product-mockup.is-visible {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
    #how {
      padding-top: clamp(3.75rem, 7vh, 5.25rem) !important;
      padding-bottom: clamp(3.75rem, 7vh, 5.25rem) !important;
    }
    #how > .max-w-3xl {
      padding-top: clamp(1.35rem, 3vw, 2.25rem);
      padding-bottom: clamp(1.35rem, 3vw, 2.25rem);
    }
    #how .space-y-14 > * + * {
      margin-top: clamp(2rem, 5vh, 3rem);
    }
    #how .space-y-10 > * + * {
      margin-top: 1.5rem;
    }
    #pricing > .max-w-3xl,
    #how > .max-w-3xl,
    #faq > .max-w-3xl,
    #apply > .max-w-2xl {
      border-top: 1px solid rgba(233,193,118,0.14);
      border-bottom: 1px solid rgba(233,193,118,0.10);
      padding-top: clamp(2.4rem, 5vw, 4rem);
      padding-bottom: clamp(2.4rem, 5vw, 4rem);
    }
    #how > .max-w-3xl {
      border-top: 0;
      padding-top: clamp(1.35rem, 3vw, 2.25rem);
      padding-bottom: clamp(1.35rem, 3vw, 2.25rem);
    }
    input,
    select,
    textarea {
      background: rgba(2,2,2,0.58);
      border-color: rgba(233,193,118,0.22);
    }
    footer {
      background: rgba(4,4,4,0.92) !important;
      border-top-color: rgba(233,193,118,0.12) !important;
    }

    /* Directed story sequencing */
    .opening-scene .opening-panel--hero:not(.is-active) .hero-display,
    .opening-scene .opening-panel--hero:not(.is-active) .hero-display span {
      color: var(--text-main) !important;
      text-shadow: none !important;
    }
    .opening-scene .opening-panel--bridge {
      padding-left: clamp(1.5rem, 3.8vw, 3rem);
      padding-right: clamp(1.5rem, 3.8vw, 3rem);
    }
    .opening-scene .opening-panel--bridge .describe-inner {
      max-width: 80rem;
    }
    .opening-scene .opening-panel--bridge .describe-line {
      max-width: 54rem;
      margin-left: 0;
    }

    .pain-section {
      /* 560vh of "invisible scrolling" so the back half (phone → sidelines →
         word-by-word payoff) each holds long enough to read. Beat weights
         0.8,1.2,2.2,2.6,3.4 put most of that distance on beats 2-4. */
      height: 560vh;
      height: 560svh;
      overflow: clip;
    }
    .pain-stage {
      position: absolute;
      inset: 0;
      display: grid;
      grid-template-columns: minmax(18rem, 0.82fr) minmax(20rem, 1.18fr);
      gap: clamp(2rem, 6vw, 6rem);
      align-items: center;
      min-height: 100%;
      padding: clamp(5rem, 10vh, 8rem) 0 clamp(4.5rem, 9vh, 7rem);
    }
    .pain-step-marker {
      display: none !important;
    }
    .pain-copy {
      position: relative;
      z-index: 3;
      align-self: center;
    }
    .pain-copy .pain-label {
      max-width: none;
      color: var(--text-label);
      font-family: var(--font-sans);
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.24em;
      line-height: 1;
      text-transform: uppercase;
    }
    .pain-label,
    .pain-title,
    .pain-phone-scene,
    .pain-solution-scene {
      opacity: 0;
      visibility: hidden;
      transform: translateY(24px);
      transition: opacity 760ms ease, visibility 760ms ease, transform 900ms cubic-bezier(0.18, 1, 0.22, 1), filter 760ms ease;
      filter: blur(0.25px);
    }
    .pain-title {
      margin-top: 1.05rem;
    }
    .pain-solution-scene {
      position: absolute;
      inset: 0;
      z-index: 4;
      display: grid;
      align-content: center;
      justify-items: center;
      gap: clamp(0.55rem, 1.5vh, 1rem);
      overflow: visible;
      padding: clamp(4rem, 8vh, 6rem) 1.25rem;
      text-align: center;
      pointer-events: none;
    }
    .pain-section[data-active-index="0"] .pain-label,
    .pain-section[data-active-index="1"] .pain-label,
    .pain-section[data-active-index="1"] .pain-title,
    .pain-section[data-active-index="2"] .pain-label,
    .pain-section[data-active-index="2"] .pain-title,
    .pain-section[data-active-index="2"] .pain-phone-scene,
    .pain-section[data-active-index="3"] .pain-label,
    .pain-section[data-active-index="3"] .pain-title,
    .pain-section[data-active-index="3"] .pain-phone-scene,
    .pain-section[data-active-index="4"] .pain-solution-scene {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      filter: none;
    }
    /* Fast reveal: the words must be readable the instant this beat lands, not
       wipe in over ~2s (by which point the user has scrolled past). */
    /* Brand starts DIM like the words — it lights up (JS adds .is-lit) only as
       the user scrolls into the reveal, so "Agentum" isn't already fully shown
       by the time they arrive. */
    .pain-section[data-active-index="4"] .pain-solution-brand {
      transform: translateY(0);
      transition: opacity 420ms ease, color 420ms ease, text-shadow 420ms ease, transform 360ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .pain-solution-brand {
      opacity: 0.12;
      color: rgba(218,218,218,0.5);
    }
    .pain-solution-brand.is-lit {
      opacity: 1;
      color: var(--text-accent);
      text-shadow: 0 0 1rem rgba(233,193,118,0.25);
    }
    .pain-section[data-active-index="4"] .pain-solution-copy {
      opacity: 1;
      transform: translateY(0);
      transition: opacity 320ms ease 60ms, transform 360ms cubic-bezier(0.18, 1, 0.22, 1) 60ms;
    }
    /* Word-by-word reveal — each word is hidden until scroll-position lights it
       (JS adds .is-lit progressively), so users literally paint the sentence as
       they scroll and cannot blow past it. */
    .solution-word {
      display: inline-block;
      opacity: 0.12;
      filter: blur(0.4px);
      transform: translateY(0.12em);
      transition: opacity 360ms ease, filter 360ms ease, transform 420ms cubic-bezier(0.18, 1, 0.22, 1), color 360ms ease;
    }
    .solution-word.is-lit {
      opacity: 1;
      filter: none;
      transform: translateY(0);
    }
    .solution-word--amp { color: var(--text-accent); }
    .solution-word em { font-style: italic; color: var(--text-accent); font-weight: 400; }
    @media (prefers-reduced-motion: reduce) {
      .solution-word { opacity: 1; filter: none; transform: none; transition: none; }
      .pain-solution-brand { opacity: 1; color: var(--text-accent); transition: none; }
    }
    @keyframes pain-solution-wipe {
      0% {
        clip-path: inset(-0.1em 100% -0.28em 0);
        opacity: 0;
        filter: blur(0.55px);
      }
      28% {
        opacity: 1;
      }
      68% {
        text-shadow: 0 0 1.2rem rgba(200,169,106,0.16);
      }
      100% {
        clip-path: inset(-0.1em 0 -0.28em 0);
        opacity: 1;
        filter: none;
        text-shadow: 0 0 0 rgba(200,169,106,0);
      }
    }
    .pain-section[data-active-index="2"] .phone-app,
    .pain-section[data-active-index="3"] .phone-app {
      opacity: 1;
      transform: translateY(0) scale(1);
      transition: opacity 720ms ease, transform 820ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .pain-section[data-active-index="2"] .phone-badge,
    .pain-section[data-active-index="3"] .phone-badge {
      opacity: 1;
      transform: scale(1);
    }
    .pain-section:not([data-active-index="3"]) .pain-callout {
      opacity: 0 !important;
      transform: translate3d(var(--callout-dx), 0.9rem, 0) scale(0.96) !important;
    }
    .pain-callout--calendar { --callout-right: calc(50% + 11.1rem); --callout-y: 25%; --callout-dx: -0.7rem; --callout-align: right; --callout-justify: flex-end; }
    .pain-callout--email { --callout-left: calc(50% + 11.1rem); --callout-y: 25%; --callout-dx: 0.7rem; }
    .pain-callout--reminders { --callout-right: calc(50% + 11.1rem); --callout-y: 53%; --callout-dx: -0.7rem; --callout-align: right; --callout-justify: flex-end; }
    .pain-callout--research { --callout-left: calc(50% + 11.1rem); --callout-y: 53%; --callout-dx: 0.7rem; max-width: 9.2rem; padding-inline: 0.42rem; }
    .pain-callout--contacts { --callout-right: calc(50% + 11.1rem); --callout-y: 74%; --callout-dx: -0.7rem; --callout-align: right; --callout-justify: flex-end; }

    .product-story-section {
      --product-mockup-scale: 0.68;
      /* Was 400vh for 4 beats; 300vh (~75vh/beat) keeps each beat readable
         without the long scroll. */
      height: 300vh;
      height: 300svh;
    }
    .product-story-section .product-story-mockup {
      opacity: 0;
      transform: translateY(2rem) scale(0.94);
      transition: opacity 900ms ease, transform 1050ms cubic-bezier(0.18, 1, 0.22, 1), filter 900ms ease;
      filter: blur(0.35px);
    }
    .product-story-section[data-active-index] .product-story-mockup {
      opacity: 1;
      transform: translateY(0) scale(1);
      filter: none;
    }
    .product-story-section[data-active-index="0"] .world-mockup {
      animation: product-mockup-pop 1000ms cubic-bezier(0.18, 1, 0.22, 1) both;
    }
    .product-story-section .product-story-mockup .world-mockup {
      width: 147%;
      transform: scale(var(--product-mockup-scale));
      transform-origin: left center;
    }
    .product-beat--left {
      margin-left: 0;
      max-width: 36rem;
    }
    @keyframes product-mockup-pop {
      0% { opacity: 0; transform: translateY(2rem) scale(0.62); filter: blur(0.7px); }
      60% { opacity: 1; transform: translateY(-0.3rem) scale(0.72); filter: none; }
      100% { opacity: 1; transform: translateY(0) scale(var(--product-mockup-scale)); filter: none; }
    }

    /* ===== How it works — scroll-scrub, steps reveal cumulatively ===== */
    .how-scene {
      position: relative;
    }
    .how-sticky {
      /* Natural flow — steps reveal on scroll via IntersectionObserver. The
         former sticky-scrub pinned the page for a full viewport, so the last
         ~60% of the scroll was "frozen" with nothing changing (felt stuck).
         Section padding comes from the #how { padding } rule. */
      display: block;
    }
    .how-heading { margin: 0 0 clamp(2rem, 5vh, 3.25rem); }
    .how-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(1.75rem, 4vh, 2.75rem); }
    .how-step {
      display: flex;
      gap: clamp(1rem, 2.5vw, 1.6rem);
      align-items: flex-start;
      opacity: 0.12;
      filter: blur(0.4px);
      transform: translateY(1rem);
      transition: opacity 520ms ease, filter 520ms ease, transform 620ms cubic-bezier(0.18, 1, 0.22, 1);
    }
    .how-step.is-shown { opacity: 1; filter: none; transform: translateY(0); }
    /* If steps enter together (tall viewports) cascade them gently. */
    .how-step:nth-child(2).is-shown { transition-delay: 70ms; }
    .how-step:nth-child(3).is-shown { transition-delay: 140ms; }
    .how-step__num {
      flex: 0 0 auto;
      min-width: 2.6rem;
      color: var(--text-accent);
      font-size: clamp(1.9rem, 3.4vw, 2.8rem);
      line-height: 1;
      padding-top: 0.1rem;
    }
    .how-step__body { display: grid; gap: 0.4rem; }
    @media (prefers-reduced-motion: reduce) {
      .how-step { opacity: 1; filter: none; transform: none; transition: none; }
    }

    .feature-story-section {
      /* 560vh (~93vh/beat for 6 beats) so each feature (01–05) holds long enough
         that a quick/fat-finger scroll doesn't blow past it before it's read. */
      height: 560vh;
      height: 560svh;
      padding-top: 0 !important;
      padding-bottom: 0 !important;
      background:
        radial-gradient(ellipse at 50% 48%, rgba(16,18,18,0.92) 0%, rgba(8,9,9,0.98) 58%, #050606 100%),
        #050606 !important;
      isolation: isolate;
      z-index: 1;
      overflow: visible !important;
      position: relative;
    }
    /* Seam blend: a solid #050606 → transparent fade that straddles the boundary
       with the section above, so the constellation/glow eases in instead of
       starting at a hard horizontal line. Sits above the sticky bg, below text. */
    .feature-story-section::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: -2px;
      height: 24vh;
      z-index: 3;
      pointer-events: none;
      background: linear-gradient(180deg, #050606 0%, rgba(5,6,6,0.86) 22%, rgba(5,6,6,0.5) 55%, rgba(5,6,6,0) 100%);
    }
    .feature-story {
      position: sticky;
      top: 0;
      height: 100vh;
      height: 100svh;
      display: grid;
      align-items: center;
      overflow: hidden;
      --feature-gutter: max(1.5rem, calc((100vw - 74rem) / 2));
      width: 100%;
      max-width: none;
      margin: 0;
      padding: 0;
      background:
        radial-gradient(circle at 74% 44%, rgba(200,169,106,0.045), transparent 28rem),
        linear-gradient(180deg, #050606 0%, #080909 48%, #050606 100%);
    }
    .feature-story::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        url("/feature-constellation.svg") center / min(96rem, 112vw) min(48rem, 82vh) no-repeat,
        radial-gradient(ellipse at 50% 50%, rgba(200,169,106,0.052), transparent 38rem);
      opacity: 0.76;
      filter: drop-shadow(0 0 0.55rem rgba(200,169,106,0.14));
      mix-blend-mode: screen;
    }
    .feature-story::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(ellipse at 27% 52%, rgba(5,6,6,0.72) 0%, rgba(5,6,6,0.44) 26%, transparent 49%),
        radial-gradient(ellipse at 72% 52%, rgba(5,6,6,0.68) 0%, rgba(5,6,6,0.38) 24%, transparent 48%),
        linear-gradient(90deg, rgba(5,6,6,0.42) 0%, rgba(5,6,6,0.16) 28%, rgba(5,6,6,0.12) 58%, rgba(5,6,6,0.28) 100%),
        radial-gradient(ellipse at 50% 50%, transparent 0%, rgba(5,6,6,0.1) 58%, rgba(5,6,6,0.38) 100%);
    }
    .feature-story > * {
      position: relative;
      z-index: 1;
    }
    .feature-story__intro,
    .feature-story-section .feature-row {
      position: absolute;
      inset-block: 0;
      left: var(--feature-gutter);
      right: var(--feature-gutter);
      opacity: 0 !important;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(2rem) scale(0.985) !important;
      transition: opacity 760ms ease, visibility 760ms ease, transform 900ms cubic-bezier(0.18, 1, 0.22, 1), filter 760ms ease;
      filter: blur(0.3px);
    }
    .feature-story__intro {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      max-width: 50rem;
      margin: 0;
      text-shadow: 0 0 1.35rem rgba(5,6,6,0.9), 0 0 0.35rem rgba(5,6,6,0.74);
    }
    .feature-story-section .feature-row {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: clamp(2rem, 5vw, 5rem);
      align-items: center;
      min-height: 0;
      padding: 0;
      border-top: 0;
    }
    .feature-story-section .feature-copy {
      text-shadow: 0 0 1.25rem rgba(5,6,6,0.88), 0 0 0.3rem rgba(5,6,6,0.7);
    }
    .feature-story-section .story-panel.is-active {
      opacity: 1 !important;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0) scale(1) !important;
      filter: none;
    }
    .feature-story-section .feature-row:first-of-type {
      padding-top: 0;
    }

    /* Type palette normalization */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .text-on-surface,
    .describe-line,
    .agentum-copy-heading,
    .home-title,
    .home-greeting,
    .home-event strong,
    .home-news-item strong,
    .vault-name,
    .dash-h,
    .dash-card-value,
    .mock-build-prompt,
    .mock-person-name,
    .choice-card__title {
      color: var(--text-main);
    }
    body,
    .text-on-surface-variant,
    .hero-copy,
    .agentum-copy-subtext,
    .agentum-facts,
    .home-event span,
    .home-news-item span,
    .vault-meta-value,
    .vault-action,
    .mock-booking-task,
    .mock-task,
    .mock-market-row,
    .choice-card__meta {
      color: var(--text-body);
    }
    .font-headline .italic,
    .text-primary.italic,
    .hero-display span:last-child {
      color: var(--text-accent);
    }
    .nav-link,
    .site-nav__mobile a,
    .hero-kicker,
    .hero-subtitle,
    .hero-proof,
    .home-status,
    .home-eyebrow,
    .home-card-title,
    .home-chip,
    .home-live,
    .vault-meta-label,
    .vault-summary,
    .dash-brand-text,
    .dash-status,
    .dash-side-label,
    .dash-card-label,
    .dash-eyebrow,
    .dash-stream-head,
    .dash-item,
    .dash-channel,
    .dash-card-value span,
    .dash-card-foot,
    .dash-log li,
    .dash-log-time,
    .mock-cal-dow,
    .mock-cal-day--mute,
    .mock-brief-label,
    .mock-task--done,
    .mock-build-line,
    .mock-person-meta,
    .world-nav span,
    .world-card-title,
    .world-list span,
    .world-priority,
    .world-digest span,
    .world-command,
    .text-\[11px\].uppercase,
    .text-xs.uppercase,
    label.text-xs,
    p.text-xs {
      color: var(--text-label);
    }
    .text-on-surface-variant\/40 { color: rgba(218, 218, 218, 0.40); }
    .text-on-surface-variant\/50 { color: rgba(218, 218, 218, 0.50); }
    .text-on-surface-variant\/60 { color: rgba(218, 218, 218, 0.60); }
    .text-on-surface-variant\/70 { color: rgba(218, 218, 218, 0.70); }
    .text-on-surface-variant\/80 { color: rgba(218, 218, 218, 0.80); }
    .text-on-surface-variant\/90 { color: rgba(218, 218, 218, 0.90); }
    .text-\[11px\].uppercase,
    .text-xs.uppercase,
    label.text-xs,
    p.text-xs,
    .nav-link,
    .site-nav__mobile a {
      color: var(--text-label);
    }
    .home-brand span,
    .home-time,
    .dash-time,
    .mock-brief-up,
    .mock-build-line--ok,
    .mock-market-tag,
    .package-price,
    .text-primary,
    .hover\:text-primary:hover {
      color: var(--primary);
    }
    .world-tool--gmail,
    .world-tool--outlook,
    .world-tool--slack,
    .world-tool--notion,
    .world-tool--drive {
      color: rgba(247, 241, 232, 0.78) !important;
    }
    .site-nav .nav-link,
    .site-nav__mobile a {
      color: var(--text-label);
    }
    .site-nav .nav-link:hover,
    .site-nav__mobile a:hover {
      color: var(--primary);
    }

    @media (min-width: 768px) {
      .md\:flex { display: flex !important; }
      .md\:hidden { display: none !important; }
      .md\:flex-row { flex-direction: row; }
      .md\:items-center { align-items: center; }
      .md\:px-12 { padding-left: 3rem; padding-right: 3rem; }
      .md\:py-4 { padding-top: 1rem; padding-bottom: 1rem; }
      .md\:p-8 { padding: 2rem; }
      .md\:p-10 { padding: 2.5rem; }
      .md\:p-12 { padding: 3rem; }
      .md\:pt-52 { padding-top: 13rem; }
      .md\:pb-32 { padding-bottom: 8rem; }
      .md\:mt-8 { margin-top: 2rem; }
      .md\:mb-14 { margin-bottom: 3.5rem; }
      .md\:mb-16 { margin-bottom: 4rem; }
      .md\:text-base { font-size: 1rem; }
      .md\:text-xl { font-size: 1.25rem; }
      .md\:text-3xl { font-size: 1.875rem; }
      .md\:text-5xl { font-size: 3rem; }
      .md\:text-6xl { font-size: 3.75rem; }
      .package-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (min-width: 1024px) { .lg\:text-6xl { font-size: 3.75rem; } }
    @media (max-width: 1020px) {
      .agentum-split:not(.product-story-grid) { grid-template-columns: 1fr; }
      .agentum-divider { width: 100%; min-height: 1px; height: 1px; }
      .agentum-lux-mockup { justify-self: center; }
      .agentum-copy { max-width: none; }
      .inside-stack { --inside-card-width: min(28rem, calc(100vw - 2rem)); }
      .pain-panel--problem { grid-template-columns: 1fr; gap: clamp(2rem, 5vh, 3rem); }
      .pain-phone-scene { justify-self: center; width: min(100%, 44rem); }
      .product-story-grid { grid-template-columns: minmax(17rem, 0.9fr) minmax(0, 1.1fr); gap: clamp(1.5rem, 4vw, 3rem); }
      .feature-row,
      .feature-row--reverse { grid-template-columns: 1fr; gap: 1.5rem; }
      .feature-row--reverse .feature-copy,
      .feature-row--reverse .feature-visual { order: initial; }
      .hero-showcase { right: -10rem; width: min(35rem, calc(100svh - 8rem)); opacity: 0.42; }
    }
    @media (max-width: 1180px) and (min-width: 981px) {
      .product-story-mockup { width: min(100%, 520px); }
      .product-story-mockup .world-mockup { min-height: clamp(21rem, 34vw, 26rem); }
      .product-beat--left { margin-left: clamp(-5rem, -6vw, -2rem); }
    }
    @media (max-width: 980px) {
      .product-story-section { --product-mockup-scale: 0.82; }
      .product-story-grid { grid-template-columns: 1fr; }
      .product-story-mockup { position: relative; top: auto; width: min(100%, 620px); justify-self: center; transform: none; }
      .product-story-section .product-story-mockup .world-mockup { width: 122%; }
      .product-story-beats { height: clamp(16rem, 36vh, 24rem); min-height: 0; padding-top: 0; }
      .product-beat { min-height: 0; position: absolute; inset: 0; }
      .product-beat--left { margin-left: 0; max-width: none; }
      .reveal-enabled .product-beat { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(1.25rem); filter: blur(0.2px); }
      .reveal-enabled .product-beat.is-visible,
      .reveal-enabled .product-beat.is-active { opacity: 1; visibility: visible; pointer-events: auto; transform: none; filter: none; }
    }
    @media (max-width: 760px) {
      .product-story-section { --product-mockup-scale: 0.78; }
      .product-story-grid { grid-template-columns: 1fr; }
      .product-story-mockup { position: relative; top: auto; justify-self: center; transform: none; }
      .product-story-section .product-story-mockup .world-mockup { width: 128%; }
      .product-story-beats { height: clamp(16rem, 38vh, 23rem); min-height: 0; }
      .product-beat { min-height: 0; position: absolute; inset: 0; }
      .reveal-enabled .product-beat { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(1.25rem); filter: blur(0.2px); }
      .reveal-enabled .product-beat.is-visible,
      .reveal-enabled .product-beat.is-active { opacity: 1; visibility: visible; pointer-events: auto; transform: none; filter: none; }
    }
    @media (max-width: 720px) {
      .hero-luxe { min-height: 100vh; min-height: 100svh; padding-top: clamp(7.25rem, 18vh, 9.5rem); padding-bottom: clamp(4.75rem, 10vh, 6.5rem); }
      .hero-luxe::after { right: -15rem; width: min(31rem, calc(100svh - 7rem)); height: min(31rem, calc(100svh - 7rem)); opacity: 0.22; }
      /* On phones the globe is a faint upper-corner accent, NOT a backdrop sitting
         over the CTAs. (Plain `.hero-showcase` was being out-specified by
         `.opening-scene .hero-showcase{opacity:.96}`, so it rendered at full
         brightness and tangled with the buttons.) Match specificity to win, push
         it up so it lives behind the headline, and damp the bright gold network. */
      .hero-showcase { right: -13rem; width: min(27rem, calc(100svh - 9rem)); }
      .opening-scene .hero-showcase { top: 34%; opacity: 0.26; }
      .opening-scene[data-active-index="1"] .hero-showcase { opacity: 0.14; }
      .hero-orb__network { opacity: 0.55; }
      .hero-orb__flare { opacity: 0.4; }
      /* Give the outline CTA a solid dark backing so the globe can't show through it. */
      .hero-link--secondary { background: rgba(7,11,22,0.62); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
      main::before { background-size: min(44rem, 125vw) auto, min(38rem, 130vw) auto, min(80rem, 175vw) auto, auto; opacity: 0.14; }
      main::after { top: calc(100vh + 2rem); right: -18rem; width: 32rem; height: 32rem; opacity: 0.22; }
      .describe-section { min-height: 38vh; min-height: 38svh; margin-top: 0; padding-top: clamp(4.4rem, 9vh, 5.75rem); padding-bottom: clamp(2.8rem, 7vh, 4.5rem); }
      .pain-section { padding-left: 1rem; padding-right: 1rem; }
      .pain-panel { padding-top: clamp(3.25rem, 8vh, 5rem); padding-bottom: clamp(3.25rem, 8vh, 5rem); }
      .pain-panel--problem { align-items: start; }
      .pain-panel--solution { min-height: 100%; }
      /* Stack the problem stage on mobile (was a 288px+320px 2-col grid that
         overflowed the viewport and pushed the phone off-screen on the right). */
      .pain-stage {
        grid-template-columns: 1fr;
        gap: clamp(0.85rem, 2.8vh, 1.6rem);
        justify-items: center;
        align-content: center;
        text-align: center;
        padding: clamp(3.75rem, 8vh, 5.25rem) 0 clamp(1.75rem, 4.5vh, 2.75rem);
      }
      /* Compose the headline + phone so they never collide (the subline used to
         crash into the phone's "09:41 / 5G" status bar) or clip on short phones.
         The phone + its icons scale together (aspect-ratio is fixed at 9/16). */
      .pain-title { font-size: clamp(2rem, 8.2vw, 2.85rem); line-height: 1.04; margin-top: 0.75rem; }
      .pain-subline { font-size: 0.92rem; }
      .pain-copy { align-items: center; }
      .pain-phone-scene { width: 100%; min-height: 0; justify-self: center; }
      .pain-phone { width: min(16.5rem, 64vw); }
      /* The notch + status bar are fixed-rem, so on the shrunk phone the black
         Dynamic-Island pill ballooned to ~39% width (vs ~27% on desktop) and the
         09:41/5G text looked oversized. Scale both back to desktop proportions. */
      .pain-phone__notch { top: 1.55rem; width: 4rem; height: 1rem; box-shadow: inset -1rem 0 0 rgba(255,255,255,0.025); }
      .pain-phone__status { padding: 0.85rem 0.95rem 0; font-size: 0.62rem; }
      .pain-phone__grid { padding-top: clamp(2.8rem, 7vw, 3.5rem); padding-left: 1.5rem; padding-right: 1.5rem; gap: clamp(0.9rem, 2.6vw, 1.25rem); }
      .phone-app__icon { width: clamp(2.6rem, 11.5vw, 3.4rem); }
      .phone-app { font-size: 0.64rem; }
      /* Notification badges are fixed-rem, so they looked huge once the icons
         shrank on phones — scale them down to stay proportionate to the icon. */
      .phone-badge { min-width: 1.15rem; height: 1.15rem; font-size: 0.62rem; top: -0.34rem; right: -0.32rem; padding: 0 0.26rem; box-shadow: 0 0.4rem 0.9rem rgba(233,35,24,0.3); }
      .pain-callout { position: absolute; max-width: 8.8rem; white-space: normal; font-size: 0.6rem; padding: 0.32rem 0.42rem; border-radius: 0.64rem; }
      .pain-callout--calendar { --callout-right: calc(50% + 9.25rem); --callout-left: auto; --callout-y: 19%; }
      .pain-callout--email { --callout-left: calc(50% + 9.25rem); --callout-right: auto; --callout-y: 19%; }
      .pain-callout--reminders { --callout-right: calc(50% + 9.25rem); --callout-left: auto; --callout-y: 55%; }
      .pain-callout--research { --callout-left: calc(50% + 9.25rem); --callout-right: auto; --callout-y: 55%; }
      .pain-callout--contacts { --callout-right: calc(50% + 9.25rem); --callout-left: auto; --callout-y: 76%; }
      /* On phones: hide the dashboard mockup and show ONE point at a time as a
         sticky scrub (like the opening hero→describe transition), NOT a stacked
         list. Keep the section tall + shell pinned (base rules) so the 3 beats
         cross-fade; just collapse the grid to a single centered column. */
      .product-story-mockup { display: none !important; }
      /* Without the mockup column the grid would collapse to 0 width (its beats
         are absolutely-positioned, so they give the column no intrinsic width) —
         force every wrapper to full width so the single beats column fills it. */
      .product-story-shell { grid-template-columns: minmax(0, 1fr) !important; }
      .product-story-shell > * { width: 100% !important; }
      .product-story-grid { grid-template-columns: 1fr !important; width: 100% !important; }
      .product-story-beats { width: 100% !important; max-width: 34rem !important; margin-inline: auto !important; height: min(74vh, 32rem) !important; }
      .product-beat { align-items: center !important; text-align: center !important; padding: 0 !important; }
      .product-beat--left { margin-left: 0 !important; max-width: 100% !important; }
      .product-beat__number { font-size: clamp(2rem, 8vw, 2.6rem) !important; margin-bottom: 0.15rem; }
      .product-beat .story-label { margin-left: auto; margin-right: auto; }
      .product-beat p { max-width: 30rem !important; margin-left: auto !important; margin-right: auto !important; }
      .world-mockup { grid-template-columns: 3.5rem minmax(0, 1fr); min-height: auto; }
      .world-sidebar { padding: 1rem 0.5rem; }
      .world-nav { gap: 0.45rem; }
      .world-nav span { width: 1.8rem; height: 1.8rem; font-size: 0.68rem; }
      .world-panel { padding: 1rem; }
      .world-head { flex-direction: column; }
      .world-grid { grid-template-columns: 1fr; }
      .world-card--briefing, .world-card--digest, .world-card--tools { min-height: 0; }
      .license-grid { grid-template-columns: 1fr; }
      .hero-actions { flex-direction: column; align-items: stretch; }
      .hero-link { width: 100%; }
      .dash-body { grid-template-columns: 1fr; }
      .dash-side { display: none; }
      .dash-cards { grid-template-columns: 1fr; }
      .inside-stack { --inside-card-width: min(24rem, calc(100vw - 1.5rem)); padding-top: 1rem; }
      .inside-card__image { min-height: 11rem; }
      /* Inside Agentum: on phones, show ONE feature at a time as a sticky scrub
         (like the opening hero→describe transition), NOT a stacked list. Keep the
         section pinned (base 560vh + sticky .feature-story); each beat becomes a
         single centered column (copy then visual) that cross-fades. */
      .feature-story__intro { align-items: center !important; text-align: center !important; }
      .feature-story__intro p { margin-left: auto !important; margin-right: auto !important; }
      .feature-story-section .feature-row {
        grid-template-columns: 1fr !important;
        gap: clamp(0.85rem, 2.4vh, 1.4rem) !important;
        min-height: 0 !important;
        align-content: center !important;
        justify-items: center !important;
        text-align: center !important;
      }
      /* Always copy first, visual below (override desktop even-row reversal). */
      .feature-story-section .feature-copy { order: 0 !important; }
      .feature-story-section .feature-visual { order: 1 !important; width: 100% !important; max-width: 23rem !important; min-height: 0 !important; }
      .feature-copy p { margin-left: auto !important; margin-right: auto !important; }
      .feature-points { display: inline-grid !important; text-align: left !important; gap: 0.4rem !important; }
      .feature-visual .mock { max-width: 100% !important; }
    }
    /* Short phones (e.g. iPhone SE / browser chrome eating height): shrink the
       Problem device + headline further so the title, subline and full 4×2 app
       grid all fit on screen without colliding or clipping. */
    @media (max-width: 720px) and (max-height: 730px) {
      .pain-title { font-size: clamp(1.7rem, 7.2vw, 2.25rem); line-height: 1.03; margin-top: 0.5rem; }
      .pain-subline { font-size: 0.82rem; }
      .pain-stage { padding-top: clamp(3.25rem, 6vh, 4.25rem); gap: clamp(0.6rem, 2vh, 1.1rem); }
      .pain-phone { width: min(13.75rem, 52vw); }
      .pain-phone__notch { top: 1.5rem; width: 3.4rem; height: 0.9rem; }
      .pain-phone__status { padding: 0.82rem 0.8rem 0; font-size: 0.56rem; }
      .pain-phone__grid { padding-top: clamp(2.3rem, 6vw, 2.9rem); gap: clamp(0.7rem, 2.2vw, 1rem); }
      .phone-app__icon { width: clamp(2.3rem, 10vw, 2.9rem); }
      .phone-app { font-size: 0.6rem; }
      .phone-badge { min-width: 1rem; height: 1rem; font-size: 0.55rem; top: -0.3rem; right: -0.28rem; padding: 0 0.22rem; }
    }
    @media (max-width: 640px) {
      .site-nav .px-6 { padding-left: 1rem; padding-right: 1rem; }
      .site-nav .gap-3 { gap: 0.5rem; }
      .site-nav .logo-lockup { font-size: 1.12rem !important; }
      .site-nav .bg-primary-gradient { padding-left: 0.9rem; padding-right: 0.9rem; }
      .hero-display { font-size: clamp(2.45rem, 10.5vw, 3.45rem) !important; line-height: 1.03; }
      .describe-section { padding-left: 1rem; padding-right: 1rem; }
      .describe-line { font-size: clamp(1.8rem, 9vw, 3rem); }
      .home-topbar, .home-hero-row { align-items: flex-start; flex-direction: column; }
      .home-main-grid { grid-template-columns: 1fr; }
      .home-card--wide { grid-column: auto; }
      .home-status, .home-live { white-space: normal; }
      .vault-meta-grid { grid-template-columns: 1fr; }
      .hero-subtitle { font-size: 0.82rem !important; }
      .hero-luxe p { font-size: 1rem; }
      br.mobile-break { display: initial; }
    }
    @media (prefers-reduced-motion: reduce) {
      body::before, main::before, main::after, .opening-panel, .pain-section::before, .pain-panel, .pain-label, .pain-title, .pain-phone-scene, .phone-app, .phone-badge, .hero-luxe::after, .hero-orb, .hero-orb__network, .hero-orb__ring, .hero-orb__flare, .inside-luxe::before, .describe-section::after, .agentum-section::after, .inside-luxe::after, #pricing::after, #how::after, #apply::after, #faq::after { animation: none !important; }
      .opening-scene { height: auto; }
      .opening-sticky { position: relative; top: auto; height: auto; overflow: visible; }
      .opening-scene .opening-panel { position: relative; inset: auto; height: auto; min-height: 100vh; min-height: 100svh; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; filter: none !important; }
      .reveal-enabled .describe-line { opacity: 1; transform: none; transition: none; }
      .describe-word--wipe { animation: none; background-position: 50% 0; text-shadow: 0 0 0 rgba(233,193,118,0); }
      .reveal-enabled .product-beat { opacity: 1; visibility: visible; pointer-events: auto; transform: none; filter: none; }
      .reveal-enabled .reveal-heading,
      .reveal-enabled .reveal-card,
      .reveal-enabled .product-mockup { opacity: 1; transform: none; transition: none; }
      .pain-section,
      .product-story-section { height: auto; }
      .pain-inner { position: relative; top: auto; display: grid; gap: 1.25rem; min-height: auto; }
      .pain-panel { position: relative !important; inset: auto !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; filter: none !important; }
      .product-story-shell { position: relative; top: auto; height: auto; overflow: visible; }
      .product-story-grid { height: auto; }
      .product-story-beats { display: grid; height: auto; min-height: 0; gap: 1.25rem; }
      .product-beat { position: relative; inset: auto; min-height: 0; }
      .pain-copy .pain-label,
      .pain-copy .pain-title,
      .pain-subline,
      .pain-phone-scene,
      .phone-app,
      .phone-badge,
      .pain-solution-brand,
      .pain-solution-copy { opacity: 1; transform: none; }
      .home-cursor { animation: none; }
      .inside-card, .inside-card--stacked { transition: none; }
    }

    /* ===== Testimonials infinite marquee ===== */
    .testimonials { position: relative; overflow: hidden; }
    .testimonials__head { max-width: 46rem; margin: 0 auto clamp(2.5rem, 6vh, 4rem); text-align: center; }
    /* Full-bleed marquee: a single row of cards that drifts continuously. The
       track holds TWO copies of the cards (JS clones the set) and animates from
       0 to -50%, so when the first copy has fully passed, the second copy is in
       exactly the same place — a seamless, never-ending loop. Edge fades hide
       the wrap point. */
    .testi-marquee {
      position: relative; width: 100%; overflow: hidden;
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
              mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    }
    .testi-track {
      display: flex; width: max-content;
      padding: 0.5rem 0 1.5rem; will-change: transform;
      animation: testi-marquee var(--testi-duration, 60s) linear infinite;
    }
    /* Gap as a per-card right margin (not flex gap) so EVERY card — including the
       last of each copy — has trailing space. That keeps the two copies exactly
       equal width, which is what makes the -50% loop seamless. */
    .testi-track > .testi-card { margin-right: clamp(1rem, 2.4vw, 1.75rem); }
    /* The track holds two identical copies of the cards with a uniform gap
       between every card (including between the two copies), so translating by
       exactly -50% lands copy #2 precisely where copy #1 started. Seamless. */
    @keyframes testi-marquee {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }
    .testi-card {
      flex: 0 0 min(30rem, calc(100vw - 4rem)); width: min(30rem, calc(100vw - 4rem));
      display: flex; flex-direction: column; gap: 1.5rem;
      border: 1px solid rgba(200,169,106,0.18); border-radius: 12px;
      background: linear-gradient(160deg, rgba(32,39,37,0.72), rgba(21,26,25,0.66));
      box-shadow: 0 1.4rem 3.4rem rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04);
      padding: clamp(1.75rem, 4vw, 2.5rem);
    }
    .testi-quote-mark { font-family: var(--font-display); font-size: 3.4rem; line-height: 0.6; color: var(--primary); opacity: 0.5; height: 1.4rem; }
    .testi-quote { font-family: var(--font-display); font-size: clamp(1.1rem, 2.2vw, 1.4rem); line-height: 1.5; color: var(--text-main); font-style: italic; }
    .testi-author { display: flex; align-items: center; gap: 0.9rem; margin-top: auto; }
    .testi-avatar { flex: 0 0 auto; width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center;
      font-family: var(--font-sans); font-weight: 700; font-size: 0.95rem; color: var(--on-primary);
      background: linear-gradient(135deg, #f1d18d, #c99341); box-shadow: inset 0 1px 0 rgba(255,255,255,0.2); }
    .testi-name { font-family: var(--font-sans); font-weight: 600; color: var(--text-main); font-size: 0.98rem; }
    .testi-role { font-family: var(--font-sans); font-weight: 400; color: var(--text-label); font-size: 0.82rem; }
    @media (prefers-reduced-motion: reduce) {
      .testi-track { animation: none; flex-wrap: wrap; justify-content: center; width: auto; max-width: 70rem; margin: 0 auto; }
    }

    /* ===== Multi-step Request Access form ===== */
    .form-progress { margin-bottom: 1.25rem; }
    .form-progress__steps { display: flex; gap: 0.5rem; }
    .form-progress__seg { flex: 1; height: 4px; border-radius: 2px; background: rgba(200,169,106,0.14); overflow: hidden; }
    .form-progress__seg span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #f1d18d, #c99341); transition: width 420ms cubic-bezier(0.22, 1, 0.36, 1); }
    .form-progress__seg.is-done span, .form-progress__seg.is-current span { width: 100%; }
    .form-progress__label { margin-top: 0.7rem; display: flex; justify-content: space-between; align-items: baseline; }
    .form-progress__count { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.22em; color: var(--text-label); }
    .form-progress__name { font-size: 0.82rem; color: var(--text-main); font-weight: 600; }
    .form-step { display: none; }
    .form-step.is-active { display: block; }
    .reveal-enabled .form-step.is-active { animation: form-step-in 380ms cubic-bezier(0.22, 1, 0.36, 1); }
    @keyframes form-step-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
    .form-step > * + * { margin-top: 0.9rem; }
    .form-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1.5rem; }
    .form-nav--end { justify-content: flex-end; }
    .form-btn-secondary {
      display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.85rem 1.4rem; border-radius: 6px;
      font-family: var(--font-sans); font-weight: 600; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.12em;
      color: var(--text-label); background: transparent; border: 1px solid rgba(200,169,106,0.32); cursor: pointer;
      transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease;
    }
    .form-btn-secondary:hover { color: var(--primary); border-color: rgba(200,169,106,0.6); background: rgba(200,169,106,0.06); }
    /* Primary form button styled like the nav "Request Access" (outlined gold,
       inline auto width, proper padding, hover) — not the old stretched bar. */
    .form-btn-primary {
      display: inline-flex; align-items: center; gap: 0.55rem; min-height: 3rem;
      padding: 0.85rem 1.75rem; border-radius: 6px; cursor: pointer;
      font-family: var(--font-sans); font-weight: 600; font-size: 0.9rem; letter-spacing: 0;
      color: #C8A96A; border: 1px solid rgba(200,169,106,0.78);
      background: linear-gradient(135deg, rgba(200,169,106,0.18), rgba(0,0,0,0.16) 52%, rgba(200,169,106,0.12));
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 0 1.2rem rgba(200,169,106,0.08);
      transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 120ms ease;
    }
    .form-btn-primary:hover {
      background: linear-gradient(135deg, rgba(200,169,106,0.34), rgba(200,169,106,0.10) 52%, rgba(200,169,106,0.22));
      border-color: rgba(200,169,106,0.95);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 1.6rem rgba(200,169,106,0.16);
    }
    .form-btn-primary:active { transform: scale(0.98); }
    .form-btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
    @media (prefers-reduced-motion: reduce) {
      .form-progress__seg span { transition: none; }
      .reveal-enabled .form-step.is-active { animation: none; }
    }

    /* ===== Inline form validation ===== */
    .field-error { display: none; margin-top: 0.4rem; font-size: 0.75rem; color: var(--danger); }
    .field-error.is-shown { display: block; }
    .input-invalid, .choice-card.input-invalid { border-color: var(--danger) !important; }
    .choice-group-invalid { outline: 1px solid rgba(248,113,113,0.5); outline-offset: 6px; border-radius: 10px; }

    /* (Sticky mobile Request Access bar removed per user request.) */