:root{
  /* Surfaces */
  --paper:#FBFAFF;--panel:#FFFFFF;--soft:#F4F1FF;--line:#EAE6F5;
  --ink:#0E0B1A;--ink-2:#171326;
  /* Text */
  --tx:#16121F;--muted:#5B556B;--faint:#9690A6;
  /* The three collaborators (the signature motif) */
  --you:#6C3BFF;--you-2:#9B7BFF;--you-wash:#EFEAFF;
  --mate:#FF5C44;--agent:#12B79A;--note:#E0A100;
  --ok:#1F9A63;--bad:#D44A3A;
  /* Type + motion */
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --lift:0 28px 60px -32px rgba(40,20,110,.40);
  --grad:linear-gradient(100deg,#6C3BFF,#9B7BFF 55%,#FF5C44);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--tx);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}

.wrap{max-width:1120px;margin:0 auto;padding-left:26px;padding-right:26px}
.center{text-align:center}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 15px/1 var(--sans);border-radius:12px;padding:15px 24px;cursor:pointer;text-decoration:none;border:1.5px solid transparent;transition:transform .16s var(--ease),background .2s ease,box-shadow .2s ease,border-color .2s ease}
.btn.sm{padding:10px 16px;font-size:14px;border-radius:10px}
.btn.big{padding:18px 34px;font-size:17px;border-radius:14px}
.btn.full{width:100%;margin-top:auto}
.btn.p{background:var(--you);color:#fff;box-shadow:0 12px 26px -12px rgba(108,59,255,.75)}
.btn.p:hover{background:#5a2ef0;transform:translateY(-2px);box-shadow:0 18px 36px -12px rgba(108,59,255,.8)}
.btn.ghost{background:transparent;color:var(--tx);border-color:#D9D2EE}
.btn.ghost:hover{border-color:var(--you);color:var(--you);transform:translateY(-2px)}

.eyebrow{display:inline-block;font:700 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--you);margin-bottom:14px}
.eyebrow.light{color:var(--you-2)}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- Nav ---------- */
nav{position:sticky;top:0;z-index:40;background:rgba(251,250,255,.82);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.nav-row{display:flex;align-items:center;gap:22px;height:66px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.02em;font-size:18px;text-decoration:none;color:var(--tx)}
.logo .co{color:var(--you)}
.logo .dot{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#a48cff,var(--you));box-shadow:0 0 0 4px var(--you-wash);animation:pulse 3.2s var(--ease) infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px var(--you-wash)}50%{box-shadow:0 0 0 7px rgba(108,59,255,.08)}}
nav .links{display:flex;gap:26px;margin-left:auto;align-items:center}
nav .links a:not(.btn){font:600 14.5px/1 var(--sans);color:var(--muted);text-decoration:none;position:relative;padding:4px 0}
nav .links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;background:var(--you);border-radius:2px;transition:width .25s var(--ease)}
nav .links a:not(.btn):hover{color:var(--tx)}
nav .links a:not(.btn):hover::after{width:100%}
@media(max-width:780px){nav .links a:not(.btn){display:none}}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;padding-bottom:40px}
.hero-glow{position:absolute;inset:-30% -10% auto -10%;height:680px;z-index:0;pointer-events:none;
  background:
    radial-gradient(620px 380px at 22% 8%,rgba(108,59,255,.18),transparent 60%),
    radial-gradient(560px 360px at 92% 0%,rgba(255,92,68,.13),transparent 60%),
    radial-gradient(520px 360px at 60% 30%,rgba(18,183,154,.10),transparent 60%)}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.04fr .96fr;gap:60px;align-items:center;padding-top:74px;padding-bottom:56px}
.hero h1{font-size:clamp(38px,5.4vw,62px);line-height:1.02;letter-spacing:-.035em;margin:0;font-weight:840}
.hero h1 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{font-size:19px;color:#37323f;margin:24px 0 0;max-width:46ch;line-height:1.55}
.hero .cta{display:flex;gap:13px;margin-top:32px;flex-wrap:wrap}
.hero .trust{margin-top:20px;font:600 13px/1.5 var(--sans);color:var(--faint)}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:44px;padding-top:48px}.hero .sub{max-width:54ch}}

/* Hero browser mock */
.hero-demo{position:relative}
.browser{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--lift);overflow:hidden}
.bbar{display:flex;align-items:center;gap:7px;padding:13px 14px;border-bottom:1px solid var(--line);background:#FCFBFE}
.bbar i{width:11px;height:11px;border-radius:50%;background:#E5E0F0}
.bbar i:nth-child(1){background:#FF5F57}.bbar i:nth-child(2){background:#FEBC2E}.bbar i:nth-child(3){background:#28C840}
.bbar .url{display:flex;align-items:center;gap:6px;margin-left:8px;font:600 11.5px/1 var(--mono);color:var(--faint);background:#F2EFFA;padding:7px 10px;border-radius:7px}
.bbar .url svg{color:var(--you);opacity:.8}
.bbar .faces{margin-left:auto;display:flex}
.bbar .faces b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:800 10px/1 var(--sans);color:#fff;border:2px solid #fff;margin-left:-7px}
.bbar .faces .f1{background:var(--you)}.bbar .faces .f2{background:var(--mate)}.bbar .faces .f3{background:var(--agent)}
.app{position:relative;padding:34px 30px 30px;text-align:center;color:#fff;background:linear-gradient(135deg,#6C3BFF,#8a2be2 50%,#6C3BFF);background-size:200% 200%;animation:grad 11s ease infinite}
@keyframes grad{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.app .badge{display:inline-block;font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.16);padding:6px 11px;border-radius:999px}
.app h3{margin:14px 0 0;font-size:23px;line-height:1.15;letter-spacing:-.02em;font-weight:780}
.app .price{font-size:42px;font-weight:850;margin-top:14px;letter-spacing:-.02em}
.app .price small{font-size:15px;font-weight:600;opacity:.8}
.app .go{margin-top:18px;background:#fff;color:var(--you);border:0;border-radius:11px;padding:13px;font-weight:800;font-size:14.5px;width:100%;cursor:pointer;transition:transform .16s var(--ease)}
.app .go:hover{transform:scale(1.03)}
.pin{position:absolute;top:16px;right:-11px;width:27px;height:27px;border-radius:50% 50% 50% 3px;background:var(--note);border:2px solid #fff;display:grid;place-items:center;color:#fff;font:800 12px/1 var(--sans);box-shadow:0 4px 10px rgba(0,0,0,.28);animation:pin-pop 4.2s var(--ease) infinite}
@keyframes pin-pop{0%,84%,100%{transform:scale(1)}90%{transform:scale(1.2)}}
.bubble{position:absolute;top:6px;right:32px;background:#fff;border:1px solid var(--line);border-radius:12px 12px 2px 12px;padding:9px 11px;width:182px;box-shadow:0 14px 32px -12px rgba(0,0,0,.34);text-align:left;animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.bubble .a{display:flex;align-items:center;gap:6px;font:800 11px/1 var(--tx)}
.bubble .a span{width:17px;height:17px;border-radius:50%;background:var(--mate);color:#fff;display:grid;place-items:center;font-size:8px}
.bubble .t{font:550 11.5px/1.4 var(--sans);color:#403c4b;margin-top:5px}
.cursor{position:absolute;font:800 10px/1 var(--sans);color:#fff;padding:3px 7px;border-radius:0 9px 9px 9px;white-space:nowrap;box-shadow:0 4px 10px rgba(0,0,0,.2);animation:float 5.6s ease-in-out infinite}
.cursor.v{background:var(--you);bottom:74px;left:-12px}
.cursor.c{background:var(--mate);top:104px;left:26px;animation-delay:.8s}
.cursor.bot{background:var(--agent);bottom:18px;right:-8px;animation-delay:1.6s}

/* Logos / trust strip */
.logos{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding-top:8px;padding-bottom:30px}
.logos-label{font:700 11.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.logos-row{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.logos-row span{font:750 17px/1 var(--sans);letter-spacing:-.02em;color:#8a8398;opacity:.85;transition:color .2s ease,opacity .2s ease}
.logos-row span:hover{color:var(--you);opacity:1}
@media(max-width:560px){.logos-row span{font-size:15px;gap:16px}}

/* ---------- Section scaffolding ---------- */
section{padding:84px 0;position:relative}
.sec-head{margin-bottom:48px}
.sec-head.center{max-width:680px;margin-left:auto;margin-right:auto}
h2{font-size:clamp(28px,3.6vw,40px);line-height:1.08;letter-spacing:-.03em;font-weight:820;margin:0 0 14px}
.lead{color:var(--muted);font-size:17px;margin:0;max-width:60ch;line-height:1.55}
.lead.center{margin-left:auto;margin-right:auto}
.lead.light{color:#b9b2cf}

/* Dark band */
.band-dark{background:radial-gradient(900px 500px at 50% -10%,#231a3d,transparent 60%),var(--ink);color:#fff}
.band-dark h2{color:#fff}
.band-dark .eyebrow{color:var(--you-2)}
/* Soft band */
.band-soft{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
/* Gradient band */
.band-grad{background:linear-gradient(135deg,#1a1230,#2a1c52 55%,#3a1f5e);color:#fff;overflow:hidden}

/* ---------- Problem (in dark band) ---------- */
.problem{display:grid;grid-template-columns:.9fr 1.45fr;gap:46px;align-items:center}
.problem-head h2{margin-bottom:16px}
.problem-head p{color:#c5bedb;font-size:16.5px;margin:0;max-width:38ch}
.flip{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center}
.flip-card{border-radius:18px;padding:24px;border:1px solid rgba(255,255,255,.1)}
.flip-card .tag{display:inline-block;font:700 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.flip-card.before{background:rgba(255,92,68,.08);border-color:rgba(255,92,68,.25)}
.flip-card.before .tag{color:#ff8b78}
.flip-card.after{background:rgba(108,59,255,.12);border-color:rgba(155,123,255,.4)}
.flip-card.after .tag{color:var(--you-2)}
.flip-card ul{margin:0;padding-left:18px}
.flip-card li{font-size:13.5px;line-height:1.5;margin:10px 0;color:#d7d2e6}
.flip-card.before li{color:#cfc4cf}
.flip-arrow{font-size:26px;color:var(--you-2);font-weight:700}
@media(max-width:920px){.problem{grid-template-columns:1fr;gap:32px}}
@media(max-width:620px){.flip{grid-template-columns:1fr;gap:14px}.flip-arrow{transform:rotate(90deg);justify-self:center}}

/* ---------- Bento (what it does) ---------- */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cell{border:1px solid var(--line);border-radius:20px;background:var(--panel);padding:26px;display:flex;flex-direction:column;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s ease,border-color .25s ease}
.cell:hover{transform:translateY(-5px);box-shadow:var(--lift);border-color:#d6cdf3}
.cell.big{grid-column:span 1;grid-row:span 1}
.cell.wide{grid-column:span 3;flex-direction:row;align-items:center;gap:34px}
.cell-txt h3{margin:0 0 8px;font-size:20px;letter-spacing:-.02em;font-weight:760}
.cell-txt p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.55}
.cell-art{position:relative;border-radius:14px;background:linear-gradient(160deg,#F6F3FF,#EDE7FF);border:1px solid var(--line);height:140px;margin-bottom:20px;overflow:hidden;display:grid;place-items:center}
.cell.wide .cell-art{flex:0 0 320px;height:120px;margin-bottom:0}
@media(max-width:840px){.bento{grid-template-columns:1fr 1fr}.cell.wide{grid-column:span 2;flex-direction:column;align-items:flex-start;gap:20px}.cell.wide .cell-art{flex:0 0 auto;width:100%}}
@media(max-width:560px){.bento{grid-template-columns:1fr}.cell.wide{grid-column:span 1}}

/* art: share */
.art-share{flex-direction:column;gap:12px}
.link-chip{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 11px;font:600 12px/1 var(--mono);color:#4a4458;box-shadow:0 8px 20px -14px rgba(40,20,110,.5)}
.link-chip .d{width:8px;height:8px;border-radius:50%;background:var(--agent)}
.link-chip .copy{margin-left:6px;background:var(--you);color:#fff;border-radius:6px;padding:4px 8px;font:700 10px/1 var(--sans)}
.viewers{display:flex;align-items:center;gap:8px;font:700 11px/1 var(--sans);color:var(--you)}
.viewers i{font-weight:500;font-style:normal;color:var(--faint)}
/* art: edit */
.art-edit{background:linear-gradient(160deg,#FFF1EE,#FFE7E1)}
.edit-line{font:780 18px/1.2 var(--sans);color:#2a2336;letter-spacing:-.02em;position:relative}
.edit-line .caret{display:inline-block;width:2px;height:18px;background:var(--mate);margin-left:2px;vertical-align:-3px;animation:blink 1.1s step-end infinite}
@keyframes blink{50%{opacity:0}}
.art-edit .nocode{position:absolute;bottom:12px;right:12px;font:700 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mate);background:#fff;border:1px solid #ffd9d0;border-radius:999px;padding:5px 9px}
/* art: collab */
.art-collab{background:linear-gradient(160deg,#EBFBF7,#E0F6EF)}
.art-collab .cur{position:absolute;font:800 10px/1 var(--sans);color:#fff;padding:4px 8px;border-radius:0 9px 9px 9px;box-shadow:0 4px 10px rgba(0,0,0,.18);animation:float 5.5s ease-in-out infinite}
.art-collab .cur.a{background:var(--you);top:28px;left:36px}
.art-collab .cur.b{background:var(--mate);top:66px;left:120px;animation-delay:.7s}
.art-collab .cur.c{background:var(--agent);top:92px;left:54px;animation-delay:1.4s}
/* art: history timeline */
.art-history{background:linear-gradient(160deg,#F3F0FF,#E9F7F3)}
.art-history .tl{display:flex;align-items:center;gap:0;width:80%}
.art-history .tl i{flex:1;height:3px;position:relative;background:var(--line)}
.art-history .tl i::after{content:"";position:absolute;right:-7px;top:50%;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.art-history .tl i.v::after{background:var(--you)}
.art-history .tl i.c::after{background:var(--mate)}
.art-history .tl i.bot::after{background:var(--agent)}

/* ---------- Edit loop band ---------- */
.loop{text-align:center;max-width:780px;margin:0 auto}
.band-grad h2{color:#fff}
.loop-sub{color:#cdc4e6;font-size:16.5px;max-width:62ch;margin:0 auto 36px;line-height:1.6}
.loop-steps{display:flex;align-items:stretch;justify-content:center;gap:14px;flex-wrap:wrap}
.ls{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:20px 22px;min-width:190px;text-align:left}
.ls-n{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--you);color:#fff;font:800 13px/1 var(--sans);margin-bottom:12px}
.ls b{display:block;font-size:16px;letter-spacing:-.01em}
.ls p{margin:5px 0 0;font-size:13.5px;color:#bdb4d6}
.ls-arrow{align-self:center;font-size:22px;color:var(--you-2)}
@media(max-width:620px){.ls-arrow{transform:rotate(90deg)}}

/* ---------- Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.step{padding:28px;border-radius:18px;background:var(--panel);border:1px solid var(--line);transition:transform .25s var(--ease),box-shadow .25s ease,border-color .25s ease}
.step:hover{transform:translateY(-5px);box-shadow:var(--lift);border-color:#d6cdf3}
.step::before{counter-increment:s;content:counter(s);font:850 15px/1 var(--sans);color:#fff;background:var(--you);width:34px;height:34px;border-radius:11px;display:grid;place-items:center}
.step h4{margin:18px 0 7px;font-size:17px;letter-spacing:-.01em}
.step p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.55}
@media(max-width:780px){.steps{grid-template-columns:1fr}}

/* ---------- Use cases ---------- */
.kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.kind{border:1px solid var(--line);border-radius:18px;padding:26px;background:var(--panel);transition:transform .25s var(--ease),box-shadow .25s ease,border-color .25s ease}
.kind:hover{transform:translateY(-5px);box-shadow:var(--lift);border-color:#d6cdf3}
.kind .ic{font-size:24px;line-height:1;display:grid;place-items:center;width:50px;height:50px;border-radius:13px;background:var(--you-wash);transition:transform .25s var(--ease)}
.kind:hover .ic{transform:scale(1.08) rotate(-4deg)}
.kind h4{margin:16px 0 6px;font-size:16.5px;letter-spacing:-.01em}
.kind p{margin:0;font-size:14px;color:var(--muted);line-height:1.5}
@media(max-width:820px){.kinds{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.kinds{grid-template-columns:1fr}}
.who{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:40px}
.who-label{font:700 13px/1.4 var(--sans);color:var(--muted)}
.who .chip{background:#fff;border:1px solid #ddd6f5;border-radius:999px;padding:9px 15px;font:650 12.5px/1 var(--sans);color:var(--you);transition:transform .2s var(--ease),box-shadow .2s ease}
.who .chip:hover{transform:translateY(-2px);box-shadow:0 8px 18px -10px rgba(108,59,255,.5)}

/* ---------- Comparison ---------- */
.cmpwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
.cmp th,.cmp td{padding:15px 13px;text-align:center;border-bottom:1px solid var(--line)}
.cmp thead th{background:#F5F2FE;font:750 13px/1.2 var(--sans);color:var(--tx)}
.cmp tbody td:first-child,.cmp thead th:first-child{text-align:left;font-weight:650}
.cmp .co{background:var(--you-wash)}
.cmp thead th.co{background:var(--you);color:#fff}
.cmp .y{color:var(--ok);font-weight:850}
.cmp .n{color:#c4bcd2;font-weight:850}
.cmp .pp{color:var(--note);font-weight:850}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp tbody tr{transition:background .2s ease}
.cmp tbody tr:hover td{background:#FAF8FF}
.cmp tbody tr:hover td.co{background:#e7e0fb}
.cmpnote{font:550 12.5px/1.6 var(--sans);color:var(--faint);margin-top:16px;text-align:center}
@media(max-width:680px){
  .cmpwrap{overflow:visible}
  .cmp{border:0;font-size:14px}
  .cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .cmp,.cmp tbody,.cmp tr,.cmp td{display:block;width:100%}
  .cmp tr{border:1px solid var(--line);border-radius:16px;background:var(--panel);margin-bottom:14px;overflow:hidden;box-shadow:0 10px 26px -22px rgba(40,20,110,.4)}
  .cmp td{display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;border:0;border-bottom:1px solid var(--line);padding:13px 16px}
  .cmp td:first-child{font-weight:750;font-size:14.5px;background:#F5F2FE;color:var(--tx)}
  .cmp td:not(:first-child)::before{content:attr(data-label);font:650 12.5px/1 var(--sans);color:var(--muted)}
  .cmp td:last-child{border-bottom:0}
  .cmp td.co{background:var(--you-wash)}
}

/* ---------- Proof stats (dark) ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.stat{text-align:center;border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:30px 18px;background:rgba(255,255,255,.03)}
.stat .big{font:850 40px/1 var(--sans);letter-spacing:-.03em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .lab{font:550 13px/1.5 var(--sans);color:#bbb4d2;margin-top:12px}
@media(max-width:680px){.stats{grid-template-columns:1fr 1fr;gap:16px}}

/* ---------- Pricing ---------- */
.pricing{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
.tier{position:relative;border:1px solid var(--line);border-radius:18px;padding:28px 24px;background:var(--panel);display:flex;flex-direction:column;transition:transform .25s var(--ease),box-shadow .25s ease}
.tier:hover{transform:translateY(-5px);box-shadow:var(--lift)}
.tier.feat{border-color:var(--you);box-shadow:0 0 0 3px var(--you-wash)}
.tier.feat:hover{box-shadow:0 0 0 3px var(--you-wash),var(--lift)}
.tier .ribbon{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--you);color:#fff;font:800 10.5px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:6px 12px;border-radius:999px;white-space:nowrap}
.tier .nm{font:800 14px/1 var(--sans)}
.tier .pr{font-size:30px;font-weight:850;margin:14px 0 4px;letter-spacing:-.02em}
.tier .pr small{font-size:13px;font-weight:600;color:var(--faint)}
.tier .for{font:550 12.5px/1.45 var(--sans);color:var(--muted);min-height:36px}
.tier ul{margin:16px 0 22px;padding-left:18px}
.tier li{font-size:13px;color:#3b3548;margin:9px 0;line-height:1.45}
@media(max-width:880px){.pricing{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.pricing{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;grid-template-columns:.8fr 1.3fr;gap:48px;align-items:start}
.faq-head{position:sticky;top:90px}
.faq-list details{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:18px 20px;margin-bottom:12px;transition:border-color .2s ease,box-shadow .2s ease}
.faq-list details[open]{border-color:#d6cdf3;box-shadow:0 14px 30px -22px rgba(40,20,110,.5)}
.faq summary{font:700 16px/1.4 var(--sans);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;transition:color .2s ease}
.faq summary:hover{color:var(--you)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--you);font-weight:800;font-size:20px;line-height:1;transition:transform .25s var(--ease)}
.faq details[open] summary::after{content:"\2212"}
.faq p{margin:12px 0 0;color:#403c4b;font-size:14.5px;line-height:1.6}
@media(max-width:820px){.faq-grid{grid-template-columns:1fr;gap:26px}.faq-head{position:static}}

/* ---------- Final CTA ---------- */
.final{position:relative;text-align:center;background:radial-gradient(700px 360px at 50% 0%,#2a1c52,transparent 65%),var(--ink);color:#fff;border-radius:28px;padding:78px 28px;overflow:hidden}
.final-glow{position:absolute;inset:auto -20% -60% -20%;height:380px;background:radial-gradient(closest-side,rgba(108,59,255,.4),transparent);pointer-events:none}
.final h2{position:relative;color:#fff;font-size:clamp(26px,3.4vw,38px);margin:0 0 14px}
.final p{position:relative;color:#c7c0dd;margin:0 0 30px;font-size:17px}
.final .btn{position:relative}
.final-trust{position:relative;margin-top:20px;font:600 13px/1.5 var(--sans);color:#9c95b6}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--line);padding:38px 0;color:var(--faint)}
.foot-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.foot-tag{font:520 13px/1.6 var(--sans);max-width:52ch;text-align:right}
@media(max-width:680px){.foot-tag{text-align:left}}

/* ---------- Phone tuning ---------- */
@media(max-width:600px){
  .wrap{padding-left:20px;padding-right:20px}
  section{padding:58px 0}
  .hero-grid{padding-top:36px;padding-bottom:24px;gap:36px}
  .hero .cta{flex-direction:column;align-items:stretch}
  .hero .cta .btn{width:100%}
  .sec-head{margin-bottom:34px}
  .final{padding:54px 22px;border-radius:22px}
}

/* ---------- Motion preferences ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .app,.bubble,.cursor,.pin,.logo .dot,.art-collab .cur,.edit-line .caret{animation:none}
  *{transition:none!important}
}