/* ============================================================
   CONTEXT — DESIGN SYSTEM + COMPONENTS
   ------------------------------------------------------------
   :root holds every design token (color, type, space, motion).
   Components below style THROUGH the tokens — never hardcode a
   raw value in a component. Sections are marked by banner
   comments: ambient field, nav, hero, live meeting mock,
   shift, pillars, how, versus, after, meta, final, footer,
   AI guide + orb.
   ============================================================ */
:root{
    --void:#07080c; --void2:#0a0c13; --glass:rgba(255,255,255,.045);
    --glass2:rgba(255,255,255,.07); --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.14);
    --moon:#eaf0fa; --moon2:#aab4c6; --mute:#59606e;
    --glow:#6fa8ff; --glow2:#9cc4ff; --cue:#f4c77b; --cue2:#f6d59a;
    --good:#5fd0a0; --bad:#e0705f;
    --display:"SF Pro Display",ui-sans-serif,-apple-system,system-ui,"Segoe UI",sans-serif;
    --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
    color-scheme:dark;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--void); color:var(--moon);
    font-family:var(--display); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    overflow-x:hidden; line-height:1.5;
  }
  ::selection{background:rgba(111,168,255,.28);}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1120px;margin:0 auto;padding:0 28px;}

  /* ambient field */
  #field{position:fixed;inset:0;z-index:0;display:block;}
  .blob{position:fixed;border-radius:50%;filter:blur(90px);opacity:.5;z-index:0;pointer-events:none;mix-blend-mode:screen;}
  .b1{width:52vw;height:52vw;left:-12vw;top:-14vw;background:radial-gradient(circle,rgba(60,110,220,.55),transparent 65%);animation:drift1 34s ease-in-out infinite;}
  .b2{width:44vw;height:44vw;right:-10vw;top:24vh;background:radial-gradient(circle,rgba(120,90,230,.34),transparent 65%);animation:drift2 44s ease-in-out infinite;}
  .b3{width:40vw;height:40vw;left:32vw;bottom:-18vw;background:radial-gradient(circle,rgba(70,150,210,.30),transparent 65%);animation:drift3 40s ease-in-out infinite;}
  @keyframes drift1{50%{transform:translate(8vw,10vh) scale(1.12);}}
  @keyframes drift2{50%{transform:translate(-7vw,-6vh) scale(1.1);}}
  @keyframes drift3{50%{transform:translate(-6vw,-9vh) scale(1.15);}}
  #light{position:fixed;width:640px;height:640px;left:0;top:0;transform:translate(-50%,-50%);pointer-events:none;z-index:1;
    background:radial-gradient(circle,rgba(120,170,255,.10),transparent 60%);opacity:0;transition:opacity .6s;}
  #grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
    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='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

  /* opening veil */
  #veil{position:fixed;inset:0;z-index:60;background:#04050a;display:flex;align-items:center;justify-content:center;flex-direction:column;
    transition:opacity 1.1s ease, visibility 1.1s;}
  #veil.gone{opacity:0;visibility:hidden;}
  #veil .vlight{position:absolute;width:520px;height:520px;transform:translate(-50%,-50%);pointer-events:none;
    background:radial-gradient(circle,rgba(140,180,255,.12),transparent 62%);}
  .ring{width:66px;height:66px;border-radius:50%;border:1.5px solid rgba(160,190,255,.85);
    box-shadow:0 0 30px rgba(120,170,255,.55),inset 0 0 22px rgba(120,170,255,.25);
    transition:transform 1.2s cubic-bezier(.16,1,.3,1),opacity 1s,border-color 1s;position:relative;z-index:2;}
  #veil.open .ring{transform:scale(26);opacity:0;border-color:rgba(160,190,255,0);}
  .vtext{font-family:var(--mono);font-size:12px;letter-spacing:2px;color:#8ea3c8;margin-top:26px;
    text-transform:uppercase;opacity:0;transition:opacity .8s;z-index:2;}
  .vtext.show{opacity:1;}
  .vskip{position:absolute;bottom:34px;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;color:#3a4356;text-transform:uppercase;}

  /* nav */
  nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;
    padding:18px 28px;backdrop-filter:blur(10px);background:linear-gradient(#07080c 20%,rgba(7,8,12,0));}
  .brand{display:flex;align-items:center;gap:11px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
  .mark{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--glow2);
    box-shadow:0 0 14px rgba(120,170,255,.6),inset 0 0 8px rgba(120,170,255,.35);transition:box-shadow .25s,transform .25s;}
  .brand:hover .mark{box-shadow:0 0 20px rgba(120,170,255,.85),inset 0 0 10px rgba(120,170,255,.5);transform:scale(1.06);}
  .brand:focus-visible{outline:none;} .brand:focus-visible .mark{box-shadow:0 0 0 3px rgba(156,196,255,.5),0 0 18px rgba(120,170,255,.7);}
  .brand b{font-weight:500;font-size:16px;letter-spacing:.2px;color:var(--moon);}
  nav .sp{flex:1;}
  nav a.nl{font-size:13px;color:var(--moon2);margin-right:22px;transition:color .2s;}
  nav a.nl:hover{color:var(--moon);}
  .btn{font-family:var(--display);font-size:13.5px;font-weight:500;border-radius:10px;padding:9px 16px;cursor:pointer;border:1px solid transparent;transition:all .2s;display:inline-block;}
  .btn.primary{background:var(--moon);color:#0a0d14;box-shadow:0 6px 30px rgba(150,190,255,.18);}
  .btn.primary:hover{transform:translateY(-1px);box-shadow:0 10px 40px rgba(150,190,255,.3);}
  .btn.ghost{background:var(--glass2);color:var(--moon);border-color:var(--line2);}
  .btn.ghost:hover{background:rgba(255,255,255,.12);}

  /* hero */
  .hero{position:relative;z-index:5;padding:170px 0 90px;}
  .eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:3px;text-transform:uppercase;color:var(--glow2);opacity:.9;}
  .hgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;margin-top:26px;}
  h1{font-weight:200;font-size:clamp(44px,6.4vw,88px);line-height:1.02;letter-spacing:-.02em;margin:16px 0 0;text-wrap:balance;}
  h1 .em{font-weight:400;background:linear-gradient(120deg,var(--moon),var(--glow2));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .sub{color:var(--moon2);font-size:18px;line-height:1.6;max-width:34ch;margin:26px 0 30px;font-weight:300;}
  .heroctas{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
  .trust{margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:1.5px;color:var(--mute);text-transform:uppercase;}

  /* live meeting mock */
  @keyframes pulse{50%{opacity:.3;}}
  .meeting{position:relative;border-radius:20px;border:1px solid var(--line2);overflow:hidden;
    background:linear-gradient(170deg,rgba(16,20,30,.9),rgba(9,11,18,.96));backdrop-filter:blur(20px);box-shadow:0 30px 80px rgba(0,0,0,.6);}
  .mbar{display:flex;align-items:center;gap:9px;padding:11px 14px;border-bottom:1px solid var(--line);}
  .mdots{display:flex;gap:6px;} .mdots i{width:9px;height:9px;border-radius:50%;background:#2a2f3c;display:block;}
  .mtitle{font-size:12.5px;color:var(--moon2);}
  .mbar .rec{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;color:var(--bad);display:flex;align-items:center;gap:6px;text-transform:uppercase;}
  .mbar .rec:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--bad);box-shadow:0 0 8px var(--bad);animation:pulse 1.3s infinite;}
  /* live call strip — small participant seats + audio waveform (no fake video) */
  .strip{display:flex;gap:10px;padding:14px 14px 6px;}
  .seat{flex:1;min-width:0;display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:13px;
    border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
    transition:border-color .3s,box-shadow .3s,background .3s;}
  .pfp{width:38px;height:38px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
    font-family:var(--display);font-size:15px;font-weight:600;color:var(--moon);letter-spacing:.3px;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),inset 0 6px 12px rgba(255,255,255,.06);transition:box-shadow .3s;}
  .pfp.you{background:radial-gradient(circle at 34% 26%,#3f66ac,#1a2b4c);}
  .pfp.pro{background:radial-gradient(circle at 66% 26%,#7d5cae,#392a58);}
  .seatmeta{display:flex;flex-direction:column;min-width:0;flex:1;}
  .seatname{font-size:13.5px;font-weight:500;color:var(--moon);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .seatrole{font-family:var(--mono);font-size:8.5px;letter-spacing:.7px;text-transform:uppercase;color:var(--mute);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .wave{display:flex;align-items:center;gap:2.5px;height:20px;flex:none;}
  .wave i{width:2.5px;height:4px;border-radius:2px;background:var(--mute);transition:background .3s;}
  .seat.speaking{border-color:rgba(111,168,255,.45);box-shadow:0 0 0 1px rgba(111,168,255,.3),0 0 26px rgba(111,168,255,.14);background:rgba(111,168,255,.055);}
  .seat.speaking .pfp{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 0 0 2px rgba(111,168,255,.55),0 0 16px rgba(111,168,255,.4);}
  .seat.speaking .wave i{background:var(--glow2);animation:eq .9s ease-in-out infinite;}
  .seat.speaking .wave i:nth-child(2){animation-delay:.15s;}
  .seat.speaking .wave i:nth-child(3){animation-delay:.3s;}
  .seat.speaking .wave i:nth-child(4){animation-delay:.45s;}
  .seat.speaking .wave i:nth-child(5){animation-delay:.2s;}
  @keyframes eq{0%,100%{height:4px;}50%{height:17px;}}
  @media(prefers-reduced-motion:reduce){ .seat.speaking .wave i{animation:none;height:11px;} }
  .cap{padding:12px 14px 8px;font-size:13.5px;color:var(--moon);line-height:1.45;min-height:44px;opacity:0;transition:opacity .3s;}
  .cap.show{opacity:1;}
  .cap .cwho{font-family:var(--mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--glow2);margin-right:9px;}
  .ovl{margin:2px 10px 12px;border-radius:14px;padding:13px 14px;border:1px solid rgba(244,199,123,.32);
    background:linear-gradient(160deg,rgba(26,23,15,.9),rgba(13,12,8,.95));box-shadow:0 14px 40px rgba(0,0,0,.45);}
  .ovlh{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cue);margin-bottom:10px;}
  .ovlh .odot{width:6px;height:6px;border-radius:50%;background:var(--cue);box-shadow:0 0 8px var(--cue);}
  .ovlh .osee{margin-left:auto;color:var(--mute);font-size:8.5px;letter-spacing:.8px;}
  .cuebox{margin:0 0 11px;opacity:0;transform:translateY(6px);transition:all .5s;}
  .cuebox.in{opacity:1;transform:none;}
  .cuebox .lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cue);display:block;margin-bottom:5px;}
  .cuebox .txt{font-size:14px;color:var(--cue2);line-height:1.45;}
  .objs{display:flex;gap:8px;flex-wrap:wrap;}
  .obj{font-family:var(--mono);font-size:10px;letter-spacing:.5px;color:var(--mute);border:1px solid var(--line);border-radius:20px;padding:5px 10px;transition:all .5s;display:flex;align-items:center;gap:6px;}
  .obj .tick{width:12px;height:12px;border-radius:50%;border:1.5px solid #39414f;display:inline-flex;align-items:center;justify-content:center;font-size:8px;color:#07080c;}
  .obj.met{color:var(--good);border-color:rgba(95,208,160,.4);}
  .obj.met .tick{background:var(--good);border-color:var(--good);}
  .throw{padding:12px 14px 14px;border-top:1px solid var(--line);}
  .throwlbl{font-family:var(--mono);font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--mute);display:block;margin-bottom:9px;}
  .ochips{display:flex;flex-wrap:wrap;gap:7px;}
  .ochip{font-family:var(--display);font-size:12px;color:var(--moon2);background:var(--glass2);border:1px solid var(--line2);border-radius:20px;padding:6px 12px;cursor:pointer;transition:all .2s;}
  .ochip:hover{color:var(--moon);border-color:rgba(111,168,255,.5);background:rgba(111,168,255,.1);transform:translateY(-1px);}
  .ochip.on{color:var(--glow2);border-color:rgba(111,168,255,.7);background:rgba(111,168,255,.16);}

  /* sections */
  section{position:relative;z-index:5;}
  .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);}
  .reveal.in{opacity:1;transform:none;}
  .kicker{font-family:var(--mono);font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--glow2);}
  h2{font-weight:200;font-size:clamp(30px,3.8vw,48px);line-height:1.08;letter-spacing:-.015em;margin:14px 0 0;text-wrap:balance;}
  .lead{color:var(--moon2);font-weight:300;font-size:19px;line-height:1.55;max-width:42ch;}

  .shift{padding:100px 0;text-align:center;}
  .shift h2{margin:16px auto 0;max-width:20ch;}
  .shift .big{font-weight:200;font-size:clamp(26px,3.4vw,40px);line-height:1.25;max-width:24ch;margin:0 auto;}
  .shift .big .cold{color:var(--mute);} .shift .big .warm{color:var(--moon);}

  .pillars{padding:70px 0;}
  .phead{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:34px;}
  .bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .card{border-radius:18px;padding:26px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(14px);transition:border-color .3s,transform .3s;position:relative;overflow:hidden;}
  .card:hover{border-color:var(--line2);transform:translateY(-3px);}
  .card .ic{width:34px;height:34px;margin-bottom:16px;stroke:var(--glow2);}
  .card h3{font-weight:500;font-size:19px;margin:0 0 8px;}
  .card p{color:var(--moon2);font-weight:300;font-size:14.5px;line-height:1.55;margin:0;}
  .card .gl{position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(111,168,255,.16),transparent 65%);opacity:0;transition:opacity .4s;}
  .card:hover .gl{opacity:1;}

  .how{padding:90px 0;}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;}
  .step{border-top:1px solid var(--line);padding-top:20px;}
  .step .n{font-family:var(--mono);font-size:12px;letter-spacing:2px;color:var(--glow2);}
  .step h4{font-weight:500;font-size:17px;margin:12px 0 8px;}
  .step p{color:var(--moon2);font-weight:300;font-size:14px;line-height:1.55;margin:0;}

  .versus{padding:80px 0;}
  .tablewrap{overflow-x:auto;margin-top:30px;border:1px solid var(--line);border-radius:18px;background:var(--glass);backdrop-filter:blur(14px);}
  table{border-collapse:collapse;width:100%;min-width:640px;}
  th,td{padding:15px 18px;text-align:left;font-size:14px;border-bottom:1px solid var(--line);}
  thead th{font-family:var(--mono);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);font-weight:400;}
  thead th.us{color:var(--moon);}
  tbody th{font-weight:300;color:var(--moon2);}
  td.c{text-align:center;font-family:var(--mono);font-size:13px;}
  td.us{background:linear-gradient(180deg,rgba(111,168,255,.08),rgba(111,168,255,.02));color:var(--moon);border-left:1px solid rgba(111,168,255,.25);border-right:1px solid rgba(111,168,255,.25);}
  .yes{color:var(--good);} .no{color:var(--mute);}
  tr:last-child td,tr:last-child th{border-bottom:none;}

  .after{padding:90px 0;}
  .agrid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;}
  .scoremock{border-radius:18px;border:1px solid var(--line);background:linear-gradient(170deg,rgba(18,22,32,.8),rgba(11,13,20,.9));backdrop-filter:blur(18px);padding:22px;box-shadow:0 24px 60px rgba(0,0,0,.5);}
  .smrow{display:flex;gap:10px;margin-bottom:14px;}
  .metric{flex:1;border:1px solid var(--line);border-radius:12px;padding:12px;}
  .metric .k{font-family:var(--mono);font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);}
  .metric .v{font-weight:300;font-size:24px;margin-top:5px;}
  .bar{height:8px;border-radius:6px;background:rgba(255,255,255,.06);display:flex;gap:2px;overflow:hidden;margin-top:8px;}
  .bar span{display:block;border-radius:4px;}
  .smlist{margin-top:6px;}
  .smitem{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--moon2);padding:6px 0;}
  .smitem:before{content:"";margin-top:6px;width:5px;height:5px;border-radius:50%;background:var(--cue);flex:none;}

  .meta{padding:120px 0;text-align:center;}
  .meta .q{font-weight:200;font-size:clamp(28px,4vw,52px);line-height:1.12;letter-spacing:-.015em;max-width:20ch;margin:0 auto;text-wrap:balance;}
  .meta .q .hl{color:var(--cue);}

  .final{padding:90px 0 40px;text-align:center;}
  .final h2{margin:0 auto 10px;max-width:16ch;}
  .form{display:flex;gap:10px;justify-content:center;margin-top:26px;flex-wrap:wrap;}
  .form input{font-family:var(--display);font-size:14.5px;background:var(--glass2);border:1px solid var(--line2);color:var(--moon);border-radius:11px;padding:12px 16px;width:300px;max-width:80vw;}
  .form input:focus{outline:none;border-color:var(--glow);}
  .form .msg{flex-basis:100%;font-family:var(--mono);font-size:11.5px;letter-spacing:.3px;color:var(--good);line-height:1.55;max-width:46ch;margin:16px auto 0;opacity:0;transition:opacity .3s;}
  .form .msg.show{opacity:1;}
  .formnote{font-family:var(--mono);font-size:10.5px;letter-spacing:.4px;color:var(--mute);line-height:1.6;max-width:52ch;margin:16px auto 0;}

  /* pricing */
  .pricing{padding:80px 0;}
  .billtoggle{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--glass);margin-top:8px;}
  .billtoggle .bt{font-family:var(--mono);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--moon2);background:transparent;border:none;border-radius:9px;padding:8px 14px;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:7px;}
  .billtoggle .bt.on{background:var(--glass2);color:var(--moon);box-shadow:inset 0 0 0 1px var(--line2);}
  .billtoggle .save{font-size:9px;letter-spacing:.5px;color:var(--glow2);}
  .ptiers{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:38px;align-items:start;}
  .ptier{display:flex;flex-direction:column;border-radius:18px;padding:24px 22px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(14px);position:relative;transition:border-color .3s,transform .3s;}
  .ptier:hover{border-color:var(--line2);transform:translateY(-3px);}
  .ptier.feat{border-color:rgba(111,168,255,.42);background:linear-gradient(180deg,rgba(111,168,255,.09),rgba(111,168,255,.02));box-shadow:0 24px 60px rgba(0,0,0,.4);}
  .ptier .ptag{position:absolute;top:-10px;left:22px;font-family:var(--mono);font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:#0a0d14;background:var(--glow2);padding:4px 9px;border-radius:20px;}
  .pname{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--moon2);}
  .pprice{margin:14px 0 2px;display:flex;align-items:baseline;gap:5px;}
  .pprice .amt{font-weight:200;font-size:40px;letter-spacing:-.02em;color:var(--moon);line-height:1;}
  .pprice .cur{font-family:var(--mono);font-size:12px;color:var(--mute);}
  .pper{font-family:var(--mono);font-size:10px;letter-spacing:.5px;color:var(--mute);text-transform:uppercase;min-height:13px;}
  .pmin{font-size:13.5px;color:var(--glow2);margin:14px 0 18px;font-weight:300;line-height:1.4;}
  .ptier .pcta{width:100%;text-align:center;}
  .pfeatures{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px;}
  .pfeatures li{position:relative;padding-left:20px;font-size:13px;font-weight:300;color:var(--moon2);line-height:1.45;}
  .pfeatures li:before{content:"";position:absolute;left:0;top:5px;width:11px;height:11px;border-radius:50%;border:1.5px solid rgba(111,168,255,.5);background:radial-gradient(circle,rgba(111,168,255,.4),transparent 70%);}
  .pnote{text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.5px;color:var(--mute);margin:26px auto 0;}

  footer{border-top:1px solid var(--line);padding:34px 0;position:relative;z-index:5;}
  footer .row{display:flex;align-items:center;gap:14px;color:var(--mute);font-size:12.5px;flex-wrap:wrap;}
  footer .row .sp{flex:1;}
  footer .fnav{display:flex;gap:20px;margin-left:8px;}
  footer .fnav a{color:var(--moon2);font-size:12.5px;transition:color .2s;}
  footer .fnav a:hover{color:var(--moon);}

  /* legal pages (privacy / terms) — long-form, styled through the tokens */
  .legalnav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;
    padding:18px 28px;backdrop-filter:blur(10px);background:linear-gradient(#07080c 20%,rgba(7,8,12,0));}
  .legalnav .sp{flex:1;}
  .legalnav .back{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--moon2);transition:color .2s;}
  .legalnav .back:hover{color:var(--moon);}
  .legal{position:relative;z-index:5;max-width:760px;margin:0 auto;padding:148px 28px 40px;}
  .legal .eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:3px;text-transform:uppercase;color:var(--glow2);opacity:.9;}
  .legal h1{font-weight:200;font-size:clamp(34px,5vw,54px);line-height:1.05;letter-spacing:-.02em;margin:16px 0 10px;text-wrap:balance;}
  .legal .updated{font-family:var(--mono);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);}
  .legal .lead{color:var(--moon2);font-weight:300;font-size:18px;line-height:1.65;max-width:none;margin:28px 0 0;}
  .legal h2{font-weight:400;font-size:22px;letter-spacing:-.01em;color:var(--moon);margin:48px 0 12px;}
  .legal h3{font-weight:500;font-size:16px;color:var(--moon);margin:26px 0 8px;}
  .legal p{color:var(--moon2);font-weight:300;font-size:15.5px;line-height:1.72;margin:0 0 16px;}
  .legal ul{margin:0 0 16px;padding-left:20px;display:flex;flex-direction:column;gap:9px;}
  .legal li{color:var(--moon2);font-weight:300;font-size:15.5px;line-height:1.6;}
  .legal li::marker{color:var(--glow2);}
  .legal a{color:var(--glow2);text-decoration:underline;text-underline-offset:2px;text-decoration-color:rgba(156,196,255,.4);transition:color .2s;}
  .legal a:hover{color:var(--moon);}
  .legal strong{color:var(--moon);font-weight:500;}
  .legal hr{border:none;border-top:1px solid var(--line);margin:44px 0;}
  .legal .callout{border:1px solid rgba(244,199,123,.28);border-radius:14px;padding:16px 18px;margin:0 0 24px;
    background:linear-gradient(160deg,rgba(26,23,15,.55),rgba(13,12,8,.5));}
  .legal .callout p{margin:0;color:var(--cue2);font-size:14.5px;line-height:1.6;}
  .legal .callout .lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cue);display:block;margin-bottom:6px;}
  .legal .subproc{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:14px;}
  .legal .subproc th,.legal .subproc td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
  .legal .subproc thead th{font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);font-weight:400;}
  .legal .subproc td{color:var(--moon2);font-weight:300;}
  .legal .subproc tr:last-child td{border-bottom:none;}

  /* the cue that coaches YOU */
  #youcue{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);z-index:45;
    display:flex;align-items:center;gap:11px;max-width:min(560px,92vw);padding:11px 15px;border-radius:14px;
    border:1px solid rgba(244,199,123,.3);background:linear-gradient(160deg,rgba(28,24,16,.82),rgba(14,12,9,.88));
    backdrop-filter:blur(16px);box-shadow:0 16px 46px rgba(0,0,0,.5);opacity:0;transition:opacity .5s,transform .5s;pointer-events:none;}
  #youcue.show{opacity:1;transform:translateX(-50%) translateY(0);}
  #youcue .dotc{width:7px;height:7px;border-radius:50%;background:var(--cue);box-shadow:0 0 10px var(--cue);flex:none;}
  #youcue .lbl{font-family:var(--mono);font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cue);flex:none;}
  #youcue .txt{font-size:13px;color:var(--cue2);line-height:1.4;}
  #youcue .x{margin-left:6px;color:var(--mute);cursor:pointer;font-size:14px;pointer-events:auto;flex:none;}

  /* AI guide that leads + teaches */
  #dim{position:fixed;inset:0;z-index:45;background:rgba(4,5,10,.66);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s;pointer-events:none;}
  #dim.on{opacity:1;visibility:visible;}
  .spotlit{box-shadow:0 0 0 1px rgba(120,170,255,.45),0 0 80px rgba(111,168,255,.22)!important;border-radius:20px;transition:box-shadow .5s;position:relative;}
  #guide{position:fixed;left:24px;bottom:24px;z-index:50;display:none;align-items:flex-end;gap:12px;max-width:min(430px,92vw);}
  #guide.show{display:flex;animation:gin .5s ease;}
  @keyframes gin{from{opacity:0;transform:translateY(12px);}}
  .gorb{flex:none;width:42px;height:42px;position:relative;}
  .gorb canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:84px;height:84px;pointer-events:none;}
  .gcap{background:linear-gradient(160deg,rgba(18,22,32,.92),rgba(11,13,20,.95));border:1px solid var(--line2);border-radius:15px;
    padding:12px 15px;backdrop-filter:blur(20px);box-shadow:0 20px 50px rgba(0,0,0,.55);}
  .gname{font-family:var(--mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--glow2);display:block;margin-bottom:5px;}
  .gtxt{font-size:13.5px;line-height:1.5;color:var(--moon);min-height:20px;}
  .gtxt .car{display:inline-block;width:7px;height:15px;background:var(--glow2);margin-left:1px;vertical-align:-2px;animation:blink 1s steps(1) infinite;}
  @keyframes blink{50%{opacity:0;}}
  .gfoot{display:flex;align-items:center;gap:12px;margin-top:10px;}
  .gprog{font-family:var(--mono);font-size:10px;letter-spacing:1px;color:var(--mute);}
  .gbtns{display:flex;gap:8px;margin-left:auto;}
  .gbtn{font-family:var(--mono);font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--moon2);cursor:pointer;border:1px solid var(--line);border-radius:7px;padding:4px 9px;transition:all .2s;}
  .gbtn:hover{color:var(--moon);border-color:var(--line2);background:var(--glass2);}
  .gbtn.pri{color:var(--cue);border-color:rgba(244,199,123,.35);}
  @media(max-width:820px){
    .hgrid{grid-template-columns:1fr;gap:34px;}
    .bento{grid-template-columns:1fr;}
    .steps{grid-template-columns:1fr;}
    .ptiers{grid-template-columns:1fr;}
    .agrid{grid-template-columns:1fr;gap:28px;}
    .hero{padding:130px 0 60px;}
    nav a.nl{display:none;}
  }
  @media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important;}
    .blob{opacity:.4;}
  }

  /* ============================================================
     FAQ  — native <details> accordion, styled through tokens.
     Content mirrors the FAQPage JSON-LD in index.html <head>.
     ============================================================ */
  .faq{padding:40px 0 20px;}
  .faqlist{margin-top:38px;display:grid;gap:12px;max-width:820px;}
  .faqitem{
    border:1px solid var(--line);border-radius:16px;
    background:var(--glass);padding:0 22px;
    transition:border-color .3s ease,background .3s ease;
  }
  .faqitem[open]{border-color:var(--line2);background:var(--glass2);}
  .faqitem summary{
    list-style:none;cursor:pointer;padding:20px 0;
    font-family:var(--display);font-weight:400;font-size:clamp(16px,1.6vw,19px);
    color:var(--moon);letter-spacing:-.01em;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
  }
  .faqitem summary::-webkit-details-marker{display:none;}
  .faqitem summary::after{
    content:"";flex:0 0 auto;width:11px;height:11px;
    border-right:1.5px solid var(--moon2);border-bottom:1.5px solid var(--moon2);
    transform:rotate(45deg);transition:transform .3s cubic-bezier(.16,1,.3,1);
  }
  .faqitem[open] summary::after{transform:rotate(-135deg);}
  .faqitem p{
    margin:0;padding:0 0 22px;max-width:64ch;
    color:var(--moon2);font-weight:300;font-size:16px;line-height:1.65;
  }
  .faqitem summary:focus-visible{outline:2px solid var(--glow);outline-offset:4px;border-radius:8px;}

  /* sticky CTA — appears once the hero scrolls away, always one tap from action */
  .stickycta{position:fixed;right:20px;bottom:20px;z-index:44;
    opacity:0;transform:translateY(14px) scale(.98);pointer-events:none;
    box-shadow:0 10px 40px rgba(150,190,255,.32);transition:opacity .4s var(--ease,ease),transform .4s var(--ease,ease);}
  .stickycta.show{opacity:1;transform:none;pointer-events:auto;}
  @media(max-width:820px){ .stickycta{right:14px;bottom:14px;} }
  @media(prefers-reduced-motion:reduce){ .stickycta{transition:opacity .2s;transform:none;} }

  /* ============================================================
     Comparison articles (/compare/*) — build on .legal typography.
     ============================================================ */
  .article{max-width:820px;}
  .article h1{margin-top:6px;}
  .article .subproc{font-size:13.5px;}
  .article .subproc th:first-child,.article .subproc td:first-child{color:var(--moon);}
  .article .cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;
    margin:52px 0 8px;padding:26px;border:1px solid var(--line);border-radius:18px;
    background:linear-gradient(160deg,var(--glass2),var(--glass));}
  .article .related{margin-top:44px;border-top:1px solid var(--line);padding-top:22px;}
  .article .related .rlabel{font-family:var(--mono);font-size:10px;letter-spacing:2px;
    text-transform:uppercase;color:var(--mute);margin-bottom:12px;}
  .article .related ul{padding:0;list-style:none;gap:10px;}
  .article .related li{font-size:16px;}
  .article .related a{color:var(--moon2);text-decoration:none;}
  .article .related a:hover{color:var(--moon);}
  @media(max-width:640px){ .article .subproc{font-size:12px;} .article .subproc th,.article .subproc td{padding:8px 8px;} }

  /* landing → compare hub links (under the versus table) */
  .comparelinks{margin-top:20px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;}
  .comparelinks .clabel{font-family:var(--mono);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mute);}
  .comparelinks a{font-size:14px;color:var(--moon2);text-decoration:none;border-bottom:1px solid rgba(156,196,255,.25);padding-bottom:1px;transition:color .2s,border-color .2s;}
  .comparelinks a:hover{color:var(--moon);border-color:var(--glow2);}

  /* post-download install guide modal */
  .imodal{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:24px;}
  .imodal[hidden]{display:none;}
  .imbg{position:absolute;inset:0;background:rgba(4,5,10,.72);backdrop-filter:blur(6px);opacity:0;transition:opacity .3s;}
  .imodal.show .imbg{opacity:1;}
  .impanel{position:relative;z-index:1;width:min(880px,100%);max-height:90vh;overflow:auto;border-radius:22px;
    border:1px solid var(--line2);background:linear-gradient(170deg,rgba(18,22,32,.97),rgba(10,12,19,.98));
    box-shadow:0 40px 120px rgba(0,0,0,.65);padding:34px 34px 26px;text-align:center;
    opacity:0;transform:translateY(14px) scale(.985);transition:opacity .35s var(--ease),transform .35s var(--ease);}
  .imodal.show .impanel{opacity:1;transform:none;}
  .imclose{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
    color:var(--moon2);background:var(--glass2);border:1px solid var(--line);cursor:pointer;transition:all .2s;}
  .imclose:hover{color:var(--moon);background:rgba(255,255,255,.1);}
  .imdone{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--good);}
  .imcheck{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#07080c;background:var(--good);box-shadow:0 0 14px rgba(95,208,160,.5);}
  .imh{font-weight:200;font-size:clamp(26px,3.4vw,38px);letter-spacing:-.015em;margin:12px 0 30px;}
  .imsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .istep{position:relative;border:1px solid var(--line);border-radius:16px;background:var(--glass);padding:20px 15px 16px;
    display:flex;flex-direction:column;align-items:center;gap:14px;}
  .inum{position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:25px;height:25px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;font-weight:600;
    color:#07080c;background:var(--glow2);box-shadow:0 0 14px rgba(120,170,255,.5);}
  .iart{width:100%;aspect-ratio:240/150;border-radius:12px;overflow:hidden;border:1px solid var(--line);
    background:linear-gradient(160deg,rgba(13,16,24,.9),rgba(9,11,18,.95));}
  .iart svg{display:block;width:100%;height:100%;}
  .istep p{margin:0;font-size:13.5px;line-height:1.5;color:var(--moon2);font-weight:300;}
  .istep p b{color:var(--moon);font-weight:500;}
  .imfoot{margin-top:24px;font-size:13px;color:var(--mute);}
  .imfoot a{color:var(--glow2);text-decoration:underline;text-underline-offset:2px;}
  .imfoot a:hover{color:var(--moon);}
  @media(max-width:720px){ .imsteps{grid-template-columns:1fr;gap:24px;} .impanel{padding:30px 18px 22px;} }
  @media(prefers-reduced-motion:reduce){ .imbg,.impanel{transition:none;} .impanel{transform:none;} }

  /* primary download CTA (final section) */
  .dlrow{display:flex;justify-content:center;margin-top:28px;}
  .btn-lg{display:inline-flex;align-items:center;gap:10px;font-size:15.5px;padding:15px 28px;border-radius:13px;}
  .btn-lg svg{margin-top:-2px;}