/* ============ FONTS — D-DIN, self-hosted (SpaceX-style) ============ */
    @font-face { font-family: 'D-DIN'; src: url('fonts/D-DIN.woff2') format('woff2'), url('fonts/D-DIN.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
    @font-face { font-family: 'D-DIN'; src: url('fonts/D-DIN-Bold.woff2') format('woff2'), url('fonts/D-DIN-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }

    /* ============ THEME TOKENS ============ */
    :root {
      --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-xl: 24px;
      --font-d: 'D-DIN', "DIN Alternate", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
      --font-b: 'D-DIN', "DIN Alternate", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
      --maxw: 1120px;
      --t: 0.4s ease;
    }
    /* --- DARK (default) --- */
    [data-theme="dark"] {
      --bg: #000000;
      --surface: #161618;
      --surface-2: #1f1f22;
      --border: rgba(255,255,255,0.11);
      --border-2: rgba(255,255,255,0.06);
      --text: #f5f5f7;
      --muted: #a1a1a6;
      --faint: #828288;
      --accent: #c9a84c;
      --accent-lt: #e3c977;
      --accent-dk: #8a6d22;
      --accent-soft: rgba(201,168,76,0.10);
      --accent-line: rgba(201,168,76,0.30);
      --red: #ff6b5e;
      --green: #5ecc73;
      --hero-from: #ffffff;
      --hero-to: #c7c7cc;
      --glow: rgba(201,168,76,0.06);
      --card-shadow: 0 24px 60px rgba(0,0,0,0.5);
      --nav-bg: rgba(0,0,0,0.6);
      --grain-op: 0.022;
    }
    /* --- LIGHT --- */
    [data-theme="light"] {
      --bg: #ffffff;
      --surface: #f5f5f7;
      --surface-2: #ececee;
      --border: rgba(0,0,0,0.10);
      --border-2: rgba(0,0,0,0.06);
      --text: #1d1d1f;
      --muted: #6e6e73;
      --faint: #86868b;
      --accent: #9a7a1e;
      --accent-lt: #b8923a;
      --accent-dk: #6e561a;
      --accent-soft: rgba(154,122,30,0.10);
      --accent-line: rgba(154,122,30,0.30);
      --red: #c0392b;
      --green: #2e9e4a;
      --hero-from: #1d1d1f;
      --hero-to: #4b4b52;
      --glow: rgba(154,122,30,0.10);
      --card-shadow: 0 18px 44px rgba(0,0,0,0.08);
      --nav-bg: rgba(255,255,255,0.72);
      --grain-op: 0.015;
    }
    /* --- MATRIX --- */
    [data-theme="matrix"] {
      --bg: #000600;
      --surface: #021109;
      --surface-2: #04180d;
      --border: rgba(0,255,65,0.20);
      --border-2: rgba(0,255,65,0.09);
      --text: #c6ffce;
      --muted: #44c267;
      --faint: #3d8c56;
      --accent: #00ff41;
      --accent-lt: #8dffa6;
      --accent-dk: #00a82b;
      --accent-soft: rgba(0,255,65,0.08);
      --accent-line: rgba(0,255,65,0.30);
      --red: #ff5f56;
      --green: #00ff41;
      --hero-from: #aaffba;
      --hero-to: #00ff41;
      --glow: rgba(0,255,65,0.14);
      --card-shadow: 0 24px 60px rgba(0,0,0,0.6);
      --nav-bg: rgba(0,6,0,0.6);
      --grain-op: 0.02;
      --font-d: "SF Mono", ui-monospace, "JetBrains Mono", monospace;
      --font-b: "SF Mono", ui-monospace, "JetBrains Mono", monospace;
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
    body {
      background: var(--bg);
      color: var(--text);
      font-family: var(--font-b);
      font-size: 16px;
      line-height: 1.6;
      overflow-x: hidden;
      transition: background-color var(--t), color var(--t);
    }
    a { color: inherit; text-decoration: none; }
    .wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
    body, .nav, .prob, .prob-quote, .step, .pc, .is-card, .sc, .cstat, .arb,
    .trigger-box, .cmp-wrap, details, .final-card, .ts, .eyebrow, .isnt span,
    .btn-ghost, .theme-switch, .theme-btn {
      transition: background-color var(--t), color var(--t), border-color var(--t), box-shadow var(--t);
    }

    /* ============ AMBIENT BG ============ */
    .glow { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
    .glow::before {
      content: ''; position: absolute; top: -10%; left: 50%; transform: translateX(-50%);
      width: 900px; height: 600px;
      background: radial-gradient(ellipse at center, var(--glow), transparent 70%);
      filter: blur(20px); transition: background var(--t);
    }
    .grain { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: var(--grain-op);
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
    /* Matrix falling-code canvas */
    #rain { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .8s ease; }
    [data-theme="dark"] #rain { opacity: 0.14; }
    [data-theme="light"] #rain { opacity: 0.12; }
    [data-theme="matrix"] #rain { opacity: 0.45; }
    /* Matrix scanlines + glow */
    [data-theme="matrix"] .glow::after {
      content: ''; position: fixed; inset: 0; pointer-events: none;
      background: repeating-linear-gradient(to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,0) 2px, rgba(0,20,0,0.18) 3px);
    }
    [data-theme="matrix"] h1, [data-theme="matrix"] .title, [data-theme="matrix"] .brand-name,
    [data-theme="matrix"] .step-num, [data-theme="matrix"] .pc-price, [data-theme="matrix"] .cstat .big {
      text-shadow: 0 0 10px var(--accent), 0 0 22px rgba(0,255,65,0.35);
    }
    main, .nav, .ftr { position: relative; z-index: 1; }

    /* ============ NAV ============ */
    .nav {
      position: sticky; top: 0; z-index: 50;
      backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
      background: var(--nav-bg); border-bottom: 1px solid var(--border-2);
    }
    .nav-inner { max-width: none; margin: 0; padding: 16px clamp(22px, 4.5vw, 66px); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .brand { display: flex; align-items: baseline; gap: 10px; flex-shrink: 0; }
    .brand-name { font-family: var(--font-d); font-weight: 600; font-size: 20px; letter-spacing: -0.01em; color: var(--text); }
    .brand-by { font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--faint); }
    .nav-right { display: flex; align-items: center; gap: 22px; }
    .nav-links { display: flex; align-items: center; gap: 26px; }
    .nav-links a.lnk { font-size: 13px; font-weight: 600; letter-spacing: 0.02em; color: var(--muted); transition: color .2s; }
    .nav-links a.lnk:hover { color: var(--text); }

    /* theme switch */
    .theme-switch { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--border); border-radius: 99px; background: var(--surface); }
    .theme-btn { width: 30px; height: 26px; border: 0; background: transparent; cursor: pointer; border-radius: 99px; color: var(--faint); font-size: 14px; line-height: 1; display: grid; place-items: center; transition: all .2s; font-family: var(--font-b); }
    .theme-btn:hover { color: var(--text); }
    .theme-btn[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent-line); }

    .btn {
      display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
      font-family: var(--font-b); font-size: 13.5px; font-weight: 700; letter-spacing: 0.02em;
      border-radius: 99px; padding: 11px 22px; border: 1px solid transparent; transition: all .2s; white-space: nowrap;
    }
    .btn-gold { background: linear-gradient(135deg, var(--accent-lt), var(--accent) 75%); color: #1a1405; box-shadow: 0 6px 24px var(--glow); }
    [data-theme="matrix"] .btn-gold { color: #00210a; }
    .btn-gold:hover { transform: translateY(-1px); box-shadow: 0 10px 30px var(--glow); }
    .btn-ghost { background: var(--surface); color: var(--text); border-color: var(--border); }
    .btn-ghost:hover { border-color: var(--accent-line); }
    .nav .btn { padding: 9px 18px; }
    .nav-toggle { display: none; }
    .nav-social { display: flex; align-items: center; color: var(--muted); transition: color .2s; line-height: 1; }
    .nav-social:hover { color: var(--text); }

    /* ============ TYPE HELPERS ============ */
    .eyebrow {
      display: inline-flex; align-items: center; gap: 9px;
      font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--accent); border: 1px solid var(--accent-line);
      border-radius: 99px; padding: 6px 16px; background: var(--accent-soft);
    }
    .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: blink 2.4s ease-in-out infinite; }
    @keyframes blink { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.3;transform:scale(.6)} }
    .kicker { font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); margin-bottom: 18px; }

    h2.title { font-family: var(--font-d); font-weight: 700; font-size: clamp(2.1rem, 6vw, 3rem); line-height: 0.95; letter-spacing: -0.01em; text-transform: uppercase; color: var(--text); }
    h2.title em { font-style: normal; color: var(--accent); }
    .sec-head { max-width: 700px; margin-bottom: 58px; }
    .sec-head.center { margin-left: auto; margin-right: auto; text-align: center; }
    .sec-head p { color: var(--muted); font-size: 17px; margin-top: 16px; line-height: 1.55; }

    /* Apple-style section tiles: translucent boxes (rain shows through), ~3mm gap "lines" between */
    section { padding: 0 16px; margin: 34px 0; scroll-margin-top: 84px; }
    section:not(.final) > .wrap {
      border: 1px solid var(--border);
      border-radius: 26px;
      padding: 84px 56px;
      background: rgba(150,150,160,0.04);
    }
    /* a slightly different colour touch per box — kept faint so the falling code stays visible */
    section:nth-of-type(1) > .wrap { background: rgba(201,168,76,0.05); }
    section:nth-of-type(2) > .wrap { background: rgba(112,144,176,0.05); }
    section:nth-of-type(3) > .wrap { background: rgba(150,152,165,0.045); }
    section:nth-of-type(4) > .wrap { background: rgba(201,168,76,0.045); }
    section:nth-of-type(5) > .wrap { background: rgba(140,140,150,0.045); }
    section:nth-of-type(6) > .wrap { background: rgba(112,144,176,0.05); }
    section:nth-of-type(7) > .wrap { background: rgba(201,168,76,0.05); }
    section:nth-of-type(8) > .wrap { background: rgba(150,152,165,0.045); }
    [data-theme="matrix"] section:not(.final) > .wrap { background: rgba(0,255,65,0.045); border-color: rgba(0,255,65,0.16); }

    /* ============ HERO ============ */
    .hero { text-align: center; min-height: 86vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 24px 84px; }
    .hero h1 {
      font-family: var(--font-d); font-weight: 700; line-height: 0.95; text-transform: uppercase;
      font-size: clamp(2.1rem, 6vw, 3rem); letter-spacing: -0.01em;
      margin: 26px auto 0; max-width: 20ch; color: var(--text);
    }
    .hero-sub { color: var(--muted); font-size: clamp(1rem, 2.4vw, 1.22rem); max-width: 640px; margin: 26px auto 0; line-height: 1.55; }
    .hero-sub em { font-style: italic; color: var(--text); }
    .hero-cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 38px; }
    .hero-note { margin-top: 18px; font-size: 12.5px; color: var(--faint); letter-spacing: 0.02em; }
    .hero-matrix { margin-top: 18px; font-size: 14px; color: var(--muted); letter-spacing: 0.01em; }
    .hero-matrix b { color: var(--accent); font-weight: 700; font-style: italic; }
    .acronym { margin-top: 36px; font-size: 12px; font-weight: 600; letter-spacing: 0.26em; text-transform: uppercase; color: var(--faint); }
    .acronym b { color: var(--accent); font-weight: 700; }

    /* ============ PROBLEM ============ */
    .prob-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
    .prob { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px; }
    .prob-ic { font-size: 24px; margin-bottom: 12px; }
    .prob h4 { font-family: var(--font-d); font-size: 17px; font-weight: 700; color: var(--text); margin-bottom: 7px; letter-spacing: -0.01em; }
    .prob p { font-size: 14.5px; color: var(--muted); line-height: 1.55; }
    .prob-quote {
      grid-column: 1 / -1; text-align: center; padding: 36px 26px; margin-top: 4px;
      background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
    }
    .prob-quote p { font-family: var(--font-d); font-weight: 700; font-size: clamp(1.3rem,3vw,1.8rem); color: var(--text); letter-spacing: -0.02em; line-height: 1.3; }
    .prob-quote .sub { font-family: var(--font-b); font-weight: 400; font-size: 15.5px; color: var(--muted); letter-spacing: 0; line-height: 1.6; max-width: 60ch; margin: 14px auto 0; text-transform: none; }

    /* ============ WHAT IT IS ============ */
    .isnt { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
    .isnt span { font-size: 12.5px; font-weight: 600; color: var(--faint); border: 1px solid var(--border); border-radius: 99px; padding: 7px 15px; text-decoration: line-through; text-decoration-color: var(--red); }
    .is-card {
      background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 40px;
      box-shadow: var(--card-shadow);
    }
    .is-card .lead { font-family: var(--font-d); font-weight: 600; font-size: clamp(1.4rem,3.4vw,2rem); line-height: 1.3; letter-spacing: -0.02em; color: var(--text); }
    .is-card .lead b { color: var(--accent); font-weight: 700; }
    .schema { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; margin-top: 32px; }
    .sc { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 16px 10px; text-align: center; }
    .sc-ic { font-size: 20px; margin-bottom: 6px; }
    .sc-n { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text); }
    .sc-d { font-size: 11px; color: var(--faint); margin-top: 3px; line-height: 1.35; }

    /* ============ STEPS ============ */
    .steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
    .step { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 32px 28px; }
    .step-num { font-family: var(--font-d); font-weight: 600; font-size: 42px; color: var(--faint); opacity: 0.7; line-height: 1; letter-spacing: -0.03em; }
    .step h4 { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin: 16px 0 10px; }
    .step .st { font-family: var(--font-d); font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 8px; letter-spacing: -0.01em; }
    .step p { font-size: 14px; color: var(--muted); line-height: 1.55; }

    /* ============ AUDIENCE ============ */
    .aud-wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 44px; align-items: center; }
    .kv { display: grid; grid-template-columns: 130px 1fr; gap: 12px 18px; }
    .kv dt { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding-top: 3px; }
    .kv dd { font-size: 15px; color: var(--text); }
    .trigger-box { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: var(--r-md); padding: 24px 26px; }
    .trigger-box h4 { font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin-bottom: 12px; }
    .trigger-box ul { list-style: none; }
    .trigger-box li { font-size: 14.5px; color: var(--muted); padding: 8px 0 8px 24px; position: relative; border-bottom: 1px solid var(--border-2); }
    .trigger-box li:last-child { border-bottom: 0; }
    .trigger-box li::before { content: '→'; position: absolute; left: 0; color: var(--accent); }

    /* ============ WHY / COST ============ */
    .cost { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-bottom: 24px; }
    .cstat { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px; text-align: center; }
    .cstat .big { font-family: var(--font-d); font-weight: 600; font-size: 2.5rem; color: var(--text); line-height: 1; letter-spacing: -0.03em; }
    .cstat .lbl { font-size: 12.5px; color: var(--muted); margin-top: 10px; }
    .arb { text-align: center; padding: 28px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); }
    .arb p { font-size: 16px; color: var(--text); }
    .arb b { color: var(--accent); font-weight: 700; }

    /* ============ COMPARE ============ */
    .cmp-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-lg); }
    .cmp { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 620px; }
    .cmp th, .cmp td { padding: 16px 18px; text-align: left; font-size: 14.5px; border-bottom: 1px solid var(--border-2); }
    .cmp thead th { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--faint); }
    .cmp tbody th { color: var(--muted); font-weight: 600; }
    .cmp .yes { color: var(--green); font-weight: 700; }
    .cmp .no { color: var(--faint); }
    .cmp .col-adamas { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
    .cmp thead .col-adamas { color: var(--accent); }

    /* ============ PRICING ============ */
    .price-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
    .pc { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px 24px; display: flex; flex-direction: column; }
    .pc.feature { border-color: var(--accent-line); box-shadow: 0 0 50px var(--glow); }
    .pc-tag { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
    .pc-name { font-family: var(--font-d); font-weight: 700; font-size: 1.4rem; color: var(--text); margin-bottom: 14px; letter-spacing: -0.02em; }
    .pc-price { font-family: var(--font-d); font-size: 26px; font-weight: 700; color: var(--text); letter-spacing: -0.03em; }
    .pc-price small { font-size: 13px; font-weight: 500; color: var(--muted); }
    .pc-desc { font-size: 13.5px; color: var(--muted); margin-top: 12px; line-height: 1.55; flex: 1; }
    .pc-badge { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); border: 1px solid var(--border); border-radius: 99px; padding: 3px 10px; margin-top: 14px; align-self: flex-start; }

    /* ============ RESOURCES ============ */
    .res-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
    .res-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 26px; display: flex; flex-direction: column; transition: border-color .2s, transform .2s; }
    .res-card:hover { border-color: var(--accent-line); transform: translateY(-2px); }
    .res-card .ic { font-size: 24px; margin-bottom: 12px; }
    .res-card h4 { font-family: var(--font-d); font-size: 17px; font-weight: 700; color: var(--text); margin-bottom: 7px; letter-spacing: -0.01em; }
    .res-card p { font-size: 14px; color: var(--muted); line-height: 1.55; flex: 1; }
    .res-card .go { margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--accent); align-self: flex-start; }
    @media (max-width: 880px) { .res-grid { grid-template-columns: 1fr; } }

    /* ============ FAQ ============ */
    .faq { max-width: 780px; margin: 0 auto; }
    details { border: 1px solid var(--border); border-radius: var(--r-md); padding: 4px 22px; margin-bottom: 12px; background: var(--surface); }
    details[open] { border-color: var(--accent-line); }
    summary { cursor: pointer; list-style: none; padding: 18px 0; font-family: var(--font-d); font-size: 16px; font-weight: 700; color: var(--text); display: flex; justify-content: space-between; align-items: center; gap: 16px; letter-spacing: -0.01em; }
    summary::-webkit-details-marker { display: none; }
    summary::after { content: '+'; font-size: 22px; color: var(--accent); transition: transform .2s; flex-shrink: 0; }
    details[open] summary::after { transform: rotate(45deg); }
    details p { font-size: 14.5px; color: var(--muted); padding: 0 0 20px; line-height: 1.6; }

    /* ============ FINAL CTA ============ */
    .final { text-align: center; padding: 96px 0; }
    .final-card {
      max-width: 780px; margin: 0 auto; padding: 58px 40px;
      background: radial-gradient(ellipse at 50% 0%, var(--glow), transparent 70%), var(--surface);
      border: 1px solid var(--accent-line); border-radius: var(--r-xl);
    }
    .final h2 { font-family: var(--font-d); font-weight: 700; font-size: clamp(2.1rem,6vw,3rem); line-height: 0.95; letter-spacing: -0.01em; text-transform: uppercase; color: var(--text); }
    .final p { color: var(--muted); font-size: 17px; margin: 18px auto 0; max-width: 500px; }
    /* lead capture form */
    .lead-form { display: grid; gap: 12px; max-width: 540px; margin: 26px auto 0; text-align: left; }
    .lf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .lead-form input, .lead-form textarea { width: 100%; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; padding: 13px 14px; color: var(--text); font-family: var(--font-b); font-size: 14px; transition: border-color .2s; }
    .lead-form input::placeholder, .lead-form textarea::placeholder { color: var(--faint); }
    .lead-form input:focus, .lead-form textarea:focus { outline: none; border-color: var(--accent); }
    .lead-form textarea { resize: vertical; }
    .lead-form button { justify-content: center; width: 100%; margin-top: 2px; }
    .lf-note { font-size: 11.5px; color: var(--faint); text-align: center; margin-top: -2px; }
    .lf-ok { display: none; max-width: 540px; margin: 26px auto 0; background: rgba(94,204,115,.08); border: 1px solid rgba(94,204,115,.3); border-radius: 14px; padding: 24px; color: var(--text); }
    .cal-cta { margin-top: 18px; font-size: 14px; color: var(--muted); }
    @media (max-width: 540px) { .lf-row { grid-template-columns: 1fr; } }
    .final .hero-cta { margin-top: 32px; }
    .signature { margin-top: 40px; font-family: var(--font-d); font-weight: 700; font-size: 1.3rem; color: var(--text); letter-spacing: -0.01em; }
    .signature span { display: block; font-family: var(--font-b); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--faint); margin-top: 6px; }

    /* ============ FOOTER (Apple-style) ============ */
    .ftr { border-top: 1px solid var(--border-2); background: var(--surface); }
    .ftr-in { max-width: var(--maxw); margin: 0 auto; padding: 34px 24px 30px; }
    .ftr-legal { font-size: 11px; line-height: 1.5; color: var(--faint); display: grid; gap: 9px; max-width: 1000px; }
    .ftr-legal p { margin: 0; }
    .ftr-rule { border: 0; border-top: 1px solid var(--border-2); margin: 20px 0; }
    .ftr-cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 26px 24px; }
    @media (max-width: 1024px) { .ftr-cols { grid-template-columns: repeat(3, 1fr); } }
    .ftr-col h5 { font-size: 12px; font-weight: 700; color: var(--text); letter-spacing: -0.01em; margin: 0 0 9px; }
    .ftr-col a { display: block; font-size: 12.5px; color: var(--muted); padding: 4px 0; transition: color .2s; }
    .ftr-col a:hover { color: var(--text); }
    .ftr-bottom { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; justify-content: space-between; }
    .ftr-bottom .cpy { font-size: 11.5px; color: var(--faint); }
    .ftr-links { display: flex; flex-wrap: wrap; align-items: center; }
    .ftr-links a { font-size: 11.5px; color: var(--muted); padding: 0 14px; transition: color .2s; }
    .ftr-links a:first-child { padding-left: 0; }
    .ftr-links a + a { border-left: 1px solid var(--border); }
    .ftr-links a:hover { color: var(--text); }
    .ftr-region { font-size: 11.5px; color: var(--faint); }
    @media (max-width: 760px) { .ftr-cols { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 440px) { .ftr-cols { grid-template-columns: 1fr; } }

    /* ============ REVEAL ============ */
    .fade { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
    .fade.vis { opacity: 1; transform: translateY(0); }

    /* ============ RESPONSIVE ============ */
    @media (max-width: 880px) {
      .nav-links { position: fixed; inset: 58px 0 auto 0; flex-direction: column; gap: 0; background: var(--bg); border-bottom: 1px solid var(--border); padding: 8px 0; transform: translateY(-130%); transition: transform .3s; }
      .nav-links.open { transform: translateY(0); }
      .nav-links a.lnk { padding: 14px 24px; width: 100%; }
      .nav-links .btn { margin: 10px 24px 14px; justify-content: center; }
      .nav-toggle { display: flex; flex-direction: column; gap: 5px; background: none; border: 0; cursor: pointer; padding: 6px; }
      .nav-toggle span { width: 22px; height: 2px; background: var(--text); border-radius: 2px; }
      .nav-right { gap: 12px; }
      .prob-grid, .steps, .cost, .price-grid { grid-template-columns: 1fr; }
      .schema { grid-template-columns: repeat(2,1fr); }
      .aud-wrap { grid-template-columns: 1fr; gap: 28px; }
      .kv { grid-template-columns: 110px 1fr; }
    }
    @media (max-width: 540px) {
      .wrap { padding: 0 18px; }
      section { padding: 0 10px; margin: 22px 0; }
      section:not(.final) > .wrap { padding: 50px 24px; border-radius: 18px; }
      .is-card, .final-card { padding: 30px 22px; }
      .schema { grid-template-columns: 1fr; }
      .brand-by { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .fade { transition: none; opacity: 1; transform: none; }
      #rain { display: none; }
    }

.lang-link{border:1px solid var(--border);border-radius:99px;padding:3px 9px;font-size:11px;letter-spacing:.06em}
.lang-link:hover{border-color:var(--accent-line);color:var(--text)}

/* ===== intro: initiation (neural matrix -> light bloom) ===== */
#intro{position:fixed;inset:0;z-index:9999;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column;
  background:radial-gradient(125% 90% at 50% 50%, #161310 0%, #060605 60%, #000 100%);
  transition:opacity 1.3s ease,transform 1.4s cubic-bezier(.66,0,.2,1),filter 1.3s ease}
#introNet{position:absolute;inset:0;width:100%;height:100%}
#intro::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1s ease;background:radial-gradient(circle at 50% 50%, rgba(255,250,235,0), rgba(255,250,235,0) 60%)}
.intro-mid{position:relative;z-index:3;text-align:center;padding:0 20px}
.intro-brand{font-family:var(--font-d);font-weight:700;text-transform:uppercase;font-size:clamp(2.6rem,9vw,5.5rem);letter-spacing:.05em;color:#fff;animation:introGlow 3.5s ease-in-out infinite}
.intro-sub{margin-top:14px;font-size:11px;letter-spacing:.36em;text-transform:uppercase;color:var(--accent)}
.intro-enter{position:absolute;bottom:7vh;left:50%;transform:translateX(-50%);background:none;border:0;cursor:pointer;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:12px;font-family:var(--font-b);font-size:11px;letter-spacing:.24em;text-transform:uppercase;z-index:3;animation:introBob 2s ease-in-out infinite}
.intro-enter:hover{color:#fff}
.intro-chev{width:14px;height:14px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg)}
#intro.intro-exit{opacity:0;transform:scale(2.1);filter:blur(14px) brightness(1.5);pointer-events:none}
#intro.intro-exit::after{opacity:1;background:radial-gradient(circle at 50% 50%, rgba(255,252,240,.95), rgba(235,218,160,.5) 34%, transparent 72%)}
html.intro-on,body.intro-on{overflow:hidden!important}
@keyframes introBob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(9px)}}
@keyframes introGlow{0%,100%{text-shadow:0 0 28px rgba(227,201,119,.3)}50%{text-shadow:0 0 54px rgba(227,201,119,.55)}}
@keyframes siteIn{from{opacity:0;transform:translateY(24px) scale(1.03)}to{opacity:1;transform:none}}
body.site-in main{animation:siteIn 1.2s cubic-bezier(.7,0,.2,1) both}
@media (prefers-reduced-motion:reduce){.intro-brand,.intro-enter{animation:none}#intro{transition:opacity .4s ease}}
/* ===== form: phone country-code + selects + calendar ===== */
.lf-phone{display:grid;grid-template-columns:150px 1fr;gap:12px}
.lf-cc,.lf-select{width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:13px 12px;color:var(--text);font-family:var(--font-b);font-size:14px;transition:border-color .2s}
.lf-cc:focus,.lf-select:focus{outline:none;border-color:var(--accent)}
.lf-select:invalid{color:var(--faint)}
@media (max-width:540px){.lf-phone{grid-template-columns:118px 1fr}}

/* ===== trailing alpha mark (ADAMASα) ===== */
.brand-a{color:var(--accent);font-size:1.28em;line-height:1;margin-left:.04em}
.intro-a{color:var(--accent);text-transform:none;font-size:1.18em;line-height:1;margin-left:.05em}

/* ===== subtle "book a call" link ===== */
.book-call{font-size:13px;color:var(--faint);text-align:center;margin-top:16px}
.book-call a{color:var(--accent);font-weight:700}
.book-call a:hover{text-decoration:underline}

/* ===== immersive 3D matrix background ===== */
#bg3d{position:fixed;inset:0;z-index:0;display:block;pointer-events:none}
.scrim3d{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(82% 66% at 50% 40%, rgba(0,0,0,.60), rgba(0,0,0,.46) 100%)}
[data-theme="light"] #bg3d,[data-theme="light"] .scrim3d{opacity:0}
/* darker, readable section tiles over the live background (dark + matrix only) */
[data-theme="dark"] section:not(.final) > .wrap,
[data-theme="matrix"] section:not(.final) > .wrap{background:rgba(9,10,13,0.5)}
[data-theme="dark"] .hero h1,[data-theme="matrix"] .hero h1,
[data-theme="dark"] .hero-sub,[data-theme="matrix"] .hero-sub,
[data-theme="dark"] .hero-matrix,[data-theme="matrix"] .hero-matrix{text-shadow:0 2px 26px rgba(0,0,0,.7)}

/* ===== eBooks & Guides (HBS-style cover grid) ===== */
.gd-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:8px; }
.gd-card{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-lg); overflow:hidden; transition:transform .28s ease, border-color .28s ease, box-shadow .28s ease; }
.gd-card:hover{ transform:translateY(-5px); border-color:var(--accent-line); box-shadow:var(--card-shadow); }
.gd-cover{ background:#0a0908; border-bottom:1px solid var(--border); }
.gd-cover img{ width:100%; height:auto; display:block; }
.gd-body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.gd-tag{ font-family:var(--font-d); font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); margin-bottom:11px; }
.gd-card h4{ font-size:17.5px; line-height:1.25; letter-spacing:-.005em; color:var(--text); margin-bottom:9px; }
.gd-card p{ font-size:13.5px; line-height:1.55; color:var(--muted); flex:1; margin-bottom:16px; }
.gd-card .go{ font-family:var(--font-d); font-size:13px; font-weight:700; color:var(--accent); }
@media (max-width:860px){ .gd-grid{ grid-template-columns:1fr; max-width:430px; margin-left:auto; margin-right:auto; } }

/* footer: linked section headers + stacked sub-group */
.ftr-col h5 a { color: var(--text); transition: color .2s; }
.ftr-col h5 a:hover { color: var(--accent); }
.ftr-col h5.ftr-sub { margin-top: 16px; }

/* ===== nav dropdown (Resources) ===== */
.nav-dd { position: relative; display: inline-flex; }
.nav-dd-trigger { cursor: pointer; display: inline-flex; align-items: center; gap: 5px; user-select: none; }
.nav-dd .caret { font-size: 9px; opacity: .75; transition: transform .2s ease; }
.nav-dd:hover .caret, .nav-dd:focus-within .caret { transform: rotate(180deg); }
.nav-dd-menu {
  position: absolute; top: 100%; right: 0; margin-top: 16px;
  min-width: 660px; padding: 22px 26px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 30px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--card-shadow);
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease; z-index: 70;
}
.nav-dd-menu::before { content: ''; position: absolute; top: -16px; left: 0; right: 0; height: 16px; }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
}
.dd-group .dd-h { display: block; font-family: var(--font-d); font-size: 10px; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin: 2px 0 9px; }
.nav-dd-menu a { display: block; font-size: 13px; color: var(--muted); padding: 6px 0;
  transition: color .2s; white-space: nowrap; }
.nav-dd-menu a:hover { color: var(--text); }

@media (max-width: 880px) {
  .nav-dd { display: block; width: 100%; }
  .nav-dd-trigger { padding: 14px 24px; width: 100%; }
  .nav-dd .caret { display: none; }
  .nav-dd-menu { position: static; opacity: 1; visibility: visible; pointer-events: auto; transform: none;
    min-width: 0; grid-template-columns: 1fr; gap: 0; padding: 2px 24px 10px; margin-top: 0;
    background: transparent; border: 0; box-shadow: none; }
  .nav-dd-menu::before { display: none; }
  .dd-group { margin-bottom: 6px; }
  .dd-group .dd-h { margin-top: 8px; }
}

/* ===== Connected by Design — sources grid + AI pipeline ===== */
.src-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 44px; }
.src { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md);
  padding: 22px 18px; transition: border-color .25s ease, transform .25s ease; }
.src:hover { border-color: var(--accent-line); transform: translateY(-3px); }
.src-ic { font-size: 24px; margin-bottom: 11px; line-height: 1; }
.src h4 { font-size: 15px; margin-bottom: 4px; color: var(--text); letter-spacing: -0.005em; }
.src p { font-size: 12.5px; color: var(--muted); line-height: 1.45; }

.pipe { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: 12px; }
.pipe-step { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--r-md); padding: 26px 24px; }
.pipe-ic { font-size: 26px; line-height: 1; }
.pipe-step h4 { font-family: var(--font-d); font-size: 15.5px; color: var(--accent); margin: 10px 0 7px; letter-spacing: 0.02em; }
.pipe-step p { font-size: 13.5px; color: var(--muted); line-height: 1.5; }
.pipe-arrow { display: flex; align-items: center; justify-content: center; color: var(--accent); font-size: 22px; font-family: var(--font-d); }
.pipe-out { text-align: center; margin-top: 32px; font-family: var(--font-d);
  font-size: clamp(16px, 2.5vw, 22px); line-height: 1.35; color: var(--text); letter-spacing: -0.01em; }
.pipe-out b { color: var(--accent); font-weight: 700; }

@media (max-width: 880px) {
  .src-grid { grid-template-columns: repeat(2, 1fr); }
  .pipe { grid-template-columns: 1fr; }
  .pipe-arrow { transform: rotate(90deg); padding: 4px 0; }
}
@media (max-width: 440px) { .src-grid { grid-template-columns: 1fr; } }

/* ===== Matrix-theme loading screen (green ramp-up to match the gold version) ===== */
[data-theme="matrix"] #intro { background: radial-gradient(125% 90% at 50% 50%, #07140c 0%, #020803 60%, #000 100%); }
[data-theme="matrix"] .intro-brand { color: #eafff0; animation-name: introGlowMx; }
@keyframes introGlowMx { 0%,100% { text-shadow: 0 0 28px rgba(0,255,65,.32); } 50% { text-shadow: 0 0 58px rgba(0,255,65,.62); } }
[data-theme="matrix"] #intro.intro-exit { filter: blur(14px) brightness(1.6); }
[data-theme="matrix"] #intro.intro-exit::after {
  background: radial-gradient(circle at 50% 50%, rgba(200,255,212,.95), rgba(0,255,65,.5) 34%, transparent 72%);
}

/* "What It Is" — liberation closing line */
.is-card .is-free { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--border-2);
  font-size: 16px; line-height: 1.62; color: var(--muted); }
.is-card .is-free b { color: var(--text); }

/* ===== Connected by Design — data-flow diagram (sources → ADAMAS → ledger) ===== */
.flowmap{ max-width: 880px; margin: 0 auto; }
.fm-cap{ text-align:center; font-family:var(--font-d); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--faint); margin-bottom:16px; }
.fm-sources{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.fm-tile{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:5px;
  background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px 10px;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.fm-tile:hover{ border-color:var(--accent-line); transform:translateY(-3px); box-shadow:0 10px 30px rgba(0,0,0,.35); }
.fm-tile .ic{ font-size:22px; line-height:1; }
.fm-tile .nm{ font-family:var(--font-d); font-weight:700; font-size:13px; color:var(--text); }
.fm-tile .ex{ font-size:10.5px; color:var(--faint); line-height:1.35; }
/* shared step pill */
.fm-step{ font-family:var(--font-d); font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); background:var(--bg); border:1px solid var(--accent-line); border-radius:99px; padding:5px 12px; white-space:nowrap; }
/* funnel: wide sources narrowing into the core */
.fm-funnel{ position:relative; height:56px; display:flex; align-items:center; justify-content:center; }
.fm-funnel::before{ content:''; position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg, var(--accent-soft), transparent 92%);
  clip-path:polygon(3% 0, 97% 0, 60% 100%, 40% 100%); }
.fm-funnel .fm-step{ position:relative; z-index:1; }
/* core engine */
.fm-core{ max-width:560px; margin:0 auto; text-align:center;
  background:linear-gradient(180deg, var(--accent-soft), transparent), var(--surface-2);
  border:1px solid var(--accent-line); border-radius:18px; padding:24px 26px; box-shadow:0 0 50px var(--glow); }
.fm-brand{ font-family:var(--font-d); font-weight:700; font-size:24px; color:var(--text); letter-spacing:-.01em; }
.fm-brand i{ color:var(--accent); font-style:normal; font-size:1.18em; }
.fm-in{ display:inline-block; margin:11px 0 0; }
.fm-core p{ font-size:13.5px; color:var(--muted); line-height:1.5; max-width:440px; margin:12px auto 0; }
/* down to ledger */
.fm-down{ display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 0 12px; }
.fm-down .ar{ color:var(--accent); font-size:18px; line-height:1; }
/* ledger output */
.fm-ledger{ max-width:560px; margin:0 auto; text-align:center;
  background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:24px 26px; }
.fm-ledger .t{ display:block; font-family:var(--font-d); font-weight:700; font-size:17px; color:var(--text); letter-spacing:.01em; }
.fm-ledger .d{ display:block; font-size:13.5px; color:var(--muted); margin-top:6px; }
.fm-ledger .pills{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-top:14px; }
.fm-ledger .pill{ font-family:var(--font-d); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); border:1px solid var(--accent-line); border-radius:99px; padding:5px 12px; }
@media (max-width:680px){
  .fm-sources{ grid-template-columns:repeat(2,1fr); }
  .fm-funnel::before{ clip-path:polygon(10% 0, 90% 0, 62% 100%, 38% 100%); }
}

/* ===== email gate (eBook / guide downloads) ===== */
.gate{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.gate[hidden]{display:none}
.gate-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.gate-card{position:relative;z-index:1;width:100%;max-width:440px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:34px 30px 28px;box-shadow:var(--card-shadow);animation:gateIn .3s cubic-bezier(.2,.7,.2,1)}
@keyframes gateIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.gate-x{position:absolute;top:12px;right:15px;background:none;border:0;color:var(--faint);font-size:26px;line-height:1;cursor:pointer}
.gate-x:hover{color:var(--text)}
.gate-eyebrow{font-family:var(--font-d);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.gate-card h3{font-size:22px;letter-spacing:-.01em;margin-bottom:10px;color:var(--text)}
.gate-sub{font-size:14px;color:var(--muted);line-height:1.55;margin-bottom:20px}
.gate-sub #gateName{color:var(--accent-lt)}
#gateForm input[type=email]{width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;
  padding:13px 14px;color:var(--text);font-family:var(--font-b);font-size:15px;margin-bottom:12px}
#gateForm input[type=email]:focus{outline:none;border-color:var(--accent)}
#gateForm .btn{width:100%;justify-content:center}
.gate-note{font-size:11.5px;color:var(--faint);text-align:center;margin-top:12px}
.gate-note a{color:var(--muted);text-decoration:underline}
.gate-ok{text-align:center;padding:8px 0}
.gate-tick{width:46px;height:46px;border-radius:50%;background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-line);
  display:flex;align-items:center;justify-content:center;font-size:22px;margin:0 auto 14px}
.gate-ok strong{display:block;font-size:17px;margin-bottom:6px;color:var(--text)}
.gate-ok p{font-size:13.5px;color:var(--muted)}
.gate-ok a{color:var(--accent-lt);text-decoration:underline}

/* ===== funnel pulse — data flowing down into ADAMAS ===== */
.fm-funnel{overflow:hidden}
.fm-funnel .pulse{position:absolute;top:-4px;left:calc(50% - 3px);width:6px;height:6px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 10px var(--accent);opacity:0;z-index:0}
.fm-funnel .pulse:nth-child(1){animation:fmDrop 2.4s linear infinite}
.fm-funnel .pulse:nth-child(2){animation:fmDrop 2.4s linear infinite .8s}
.fm-funnel .pulse:nth-child(3){animation:fmDrop 2.4s linear infinite 1.6s}
.fm-funnel .pulse.p-l{--dx:-78px}
.fm-funnel .pulse.p-r{--dx:78px}
.fm-funnel .pulse.p-c{--dx:0px}
@keyframes fmDrop{
  0%{opacity:0;transform:translate(var(--dx,0),0) scale(.6)}
  15%{opacity:1}
  100%{opacity:0;transform:translate(0,52px) scale(.5)}
}
@media (prefers-reduced-motion:reduce){.fm-funnel .pulse{display:none}}

/* ============ PHASE 5 — visual polish ============ */
/* custom SVG icon set (replaces emoji) */
.icn{width:1em;height:1em;display:block;color:var(--accent)}
.prob-ic .icn,.sc-ic .icn{margin:0 auto 0 0}
.prob-ic,.sc-ic,.fm-tile .ic{color:var(--accent);line-height:1}
.fm-tile .ic .icn{margin:0 auto}

/* "Early Access" badge (replaces the apologetic α superscript) */
.brand-ea{font-size:8.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-line);border-radius:99px;padding:2.5px 8px;margin-left:9px;vertical-align:2.5px;white-space:nowrap}
.intro-ea{display:inline-block;font-size:clamp(10px,1.3vw,13px);font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-line);border-radius:99px;padding:6px 16px;margin-left:16px;vertical-align:18%}
.fm-brand i{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-line);border-radius:99px;padding:2.5px 8px;margin-left:8px;vertical-align:3.5px}

/* hero product visual */
.hero-shot{display:block;max-width:760px;margin:38px 0 0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--card-shadow);transition:transform .25s ease,border-color .25s ease}
.hero-shot:hover{transform:translateY(-2px);border-color:var(--accent-line)}
.hero-shot .hs-bar{display:flex;gap:6px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--border-2);background:var(--surface-2)}
.hero-shot .hs-bar i{width:8px;height:8px;border-radius:50%;background:var(--border)}
.hero-shot .hs-bar i:first-child{background:var(--accent)}
.hero-shot .hs-bar b{font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:400;color:var(--faint);margin-left:8px}
.hero-shot svg{display:block;width:100%;height:auto}
.hero-shot svg text{font-family:'JetBrains Mono',monospace}
.hero-shot .hs-cap{display:block;padding:12px 18px;border-top:1px solid var(--border-2);font-size:13px;font-weight:600;color:var(--accent)}

/* micro-interactions: card hover lift (subtle, hype-skeptical audience) */
.prob,.step,.pc,.cstat,.fm-tile{transition:transform .25s ease,border-color .25s ease}
.prob:hover,.step:hover,.pc:hover{transform:translateY(-2px);border-color:var(--accent-line)}
@media (prefers-reduced-motion:reduce){
  .prob,.step,.pc,.cstat,.fm-tile,.hero-shot{transition:none}
  .prob:hover,.step:hover,.pc:hover,.hero-shot:hover{transform:none}
}

/* ============ PHASE 6 — offer & pricing ============ */
.price-anchor{max-width:720px;margin:0 auto 30px;text-align:center;border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:var(--r-md);padding:18px 22px}
.price-anchor p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.65}
.price-anchor b{color:var(--text)}
.price-anchor em{color:var(--accent);font-style:normal;font-weight:700}
.pc-guarantee{margin:10px 0 0;font-size:13px;color:var(--green);font-weight:600;line-height:1.5}
.pc-list{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.pc-list li{font-size:13px;color:var(--muted);line-height:1.5;padding-left:20px;position:relative}
.pc-list li::before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700}
.pc-wait{margin-top:14px;display:grid;gap:8px}
.pc-wait input[type=email]{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-family:var(--font-b);font-size:13px;padding:10px 12px;width:100%}
.pc-wait input[type=email]:focus{outline:none;border-color:var(--accent-line)}
.pc-wait .btn{font-size:13px;padding:9px 14px;justify-content:center}
.pc-wait-note{font-size:11.5px;color:var(--faint);line-height:1.5}
.pc-wait-ok{font-size:13px;color:var(--green);font-weight:600}
.price-capacity{text-align:center;margin:26px auto 0;font-size:13.5px;color:var(--muted);max-width:640px}

/* ============ PHASE 3 — honest proof section ============ */
.proof-links{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:8px}

/* ============ EN/DE language switch (always visible in nav) ============ */
.lang-switch{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--border);border-radius:99px;background:var(--surface)}
.lang-switch .lang-opt{font-family:var(--font-b);font-size:10.5px;font-weight:700;letter-spacing:.08em;line-height:1;color:var(--faint);padding:5px 9px;border-radius:99px;transition:color .2s,background .2s}
.lang-switch a.lang-opt:hover{color:var(--text)}
.lang-switch .lang-opt.on{color:var(--accent);background:var(--accent-soft)}
@media (max-width: 480px){
  .nav-social{display:none} /* X link stays in the footer; makes room for the language switch */
}

/* ============ pricing v2 — recurring-led tiers ============ */
.price-grid.two   { grid-template-columns: repeat(2,1fr); max-width: 760px; margin-left:auto; margin-right:auto; }
.price-grid.three { grid-template-columns: repeat(3,1fr); margin-top: 14px; }
.price-grid.one   { grid-template-columns: 1fr; max-width: 380px; margin: 18px auto 0; }
.price-grid.two, .price-grid.three { margin-bottom: 0; }
.kicker.center { margin-top: 28px; }
.price-sub { text-align:center; max-width: 640px; margin: 8px auto 4px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.price-sub b { color: var(--text); }
@media (max-width: 760px){
  .price-grid.two, .price-grid.three { grid-template-columns: 1fr; }
}

/* ============ why-it-compounds section ============ */
.cmp3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.cmp3-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; transition:transform .25s ease,border-color .25s ease; }
.cmp3-card:hover { transform:translateY(-2px); border-color:var(--accent-line); }
.cmp3-card h4 { font-size:15px; font-weight:700; color:var(--text); margin:0 0 10px; }
.cmp3-card p { font-size:14px; line-height:1.65; color:var(--muted); margin:0; }
.cmp3-card em { color:var(--accent); font-style:normal; }
@media (max-width:760px){ .cmp3{ grid-template-columns:1fr; } .cmp3-card:hover{transform:none;} }

/* ============ hardware-options (docs hardware page) ============ */
.dc-art .hardware-options h3 { font-family: var(--font-d); font-weight: 700; font-size: 16px; line-height: 1.3; letter-spacing: -0.01em; color: var(--text); margin: 24px 0 8px; }
.dc-art .hardware-disclaimer { margin: 28px 0 0; padding-top: 16px; border-top: 1px solid var(--border-2); font-size: 12px; line-height: 1.6; color: var(--faint); }