/* ─────────────────────────────────────────────────────────────────────────────
   fad.fyi marketing site · Warm Signal v2 · loads after fad.css
   Fraunces for headlines, Manrope for everything else. Motion is additive (.rv reveals, players)
   and switched off for prefers-reduced-motion. Everything is visible without JS.
   ───────────────────────────────────────────────────────────────────────────── */
:root{--fs:"Fraunces",Georgia,"Times New Roman",serif;--wide:1200px;--ease:cubic-bezier(.2,.7,.2,1);--ink-soft:#2A2622;--coral-glow:rgba(255,92,53,.28);--leaf:#1D6B3A;--wa:#25D366}
html{scroll-behavior:smooth}
body.site{font-family:var(--fd);background:var(--bg);color:var(--ink);overflow-x:hidden}
body.site p{max-width:none}
.site .container{max-width:var(--wide)}
.site .narrow-mid{max-width:800px;margin-left:auto;margin-right:auto}
.site .prose-wide{max-width:880px}
.h-serif,.site h1.h-serif,.site h2.h-serif,.site h3.h-serif{font-family:var(--fs);font-weight:600;letter-spacing:-.015em;font-variation-settings:"SOFT" 40,"WONK" 0;text-wrap:balance}
.site h1{font-size:clamp(34px,5vw,58px);line-height:1.04;margin:0 0 .35em}
.site h2{font-size:clamp(28px,3.6vw,44px);line-height:1.08;margin:0 0 .4em}
.site h3{font-family:var(--fd);font-weight:800;font-size:20px;letter-spacing:-.01em;margin:0 0 .35em}
.site .lede{font-size:clamp(17px,1.4vw,20px);line-height:1.55;color:var(--ink-2);max-width:62ch}
.site .sub{font-size:18px;color:var(--ink-2);max-width:66ch;margin:0 auto}
.site .eyebrow{color:var(--accent-text)}
.eyebrow-light{color:#FFB39E}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;z-index:200}.skip:focus{left:8px}
code{font-family:var(--fm);font-size:.92em;background:var(--sand);padding:2px 6px;border-radius:6px}

/* ── reveal motion (only when JS runs) ── */
html.js .rv{opacity:0;transform:translateY(18px);transition:opacity .75s var(--ease) var(--d,0ms),transform .75s var(--ease) var(--d,0ms)}
html.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html.js .rv{opacity:1;transform:none;transition:none}}

/* ── header ── */
.snav{position:sticky;top:0;z-index:60;background:rgba(250,247,242,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,background .2s}
.snav.scrolled{border-bottom-color:var(--line);background:rgba(250,247,242,.94)}
.snav-in{max-width:var(--wide);margin:0 auto;padding:0 20px;height:70px;display:flex;align-items:center;gap:18px;transition:height .2s}
.snav.scrolled .snav-in{height:60px}
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink)}.logo:hover{text-decoration:none}
.logo-mark{width:28px;height:28px;border-radius:9px;background:var(--accent);position:relative;flex:0 0 auto;box-shadow:0 6px 14px -6px var(--coral-glow)}
.logo-mark::after{content:"";position:absolute;left:8px;top:8px;width:12px;height:12px;border-radius:50% 50% 50% 10%;background:#FFF4EF}
.logo-word{font-family:var(--fd);font-weight:800;font-size:22px;letter-spacing:-.04em}.logo-dot{color:var(--accent)}
.logo.light .logo-word{color:#fff}
.snav-menu{display:flex;align-items:center;gap:2px;margin-left:8px}
.mi{position:relative}
.mi-btn,.mi-link{display:inline-flex;align-items:center;gap:5px;height:40px;padding:0 13px;border:0;border-radius:10px;background:transparent;font-family:var(--fd);font-weight:700;font-size:15px;color:var(--ink-2);cursor:pointer;text-decoration:none}
.mi-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.mi-btn:hover,.mi-link:hover,.mi.is-open .mi-btn{background:var(--sand);color:var(--ink);text-decoration:none}
.mi.is-open .mi-btn svg{transform:rotate(180deg)}
.mega{position:absolute;top:calc(100% + 10px);left:0;min-width:300px;background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 80px -30px rgba(26,26,26,.35),0 2px 6px rgba(26,26,26,.06);padding:18px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s var(--ease),transform .18s var(--ease),visibility 0s .18s;z-index:70}
.mi.is-open .mega{opacity:1;visibility:visible;transform:none;transition:opacity .18s var(--ease),transform .18s var(--ease)}
.mega-in{display:grid;gap:18px}
.mega-in.cols-1{width:320px}.mega-in.cols-2{grid-template-columns:repeat(2,260px)}.mega-in.cols-3{grid-template-columns:repeat(3,250px)}
.mcol .mh,.fh{font-family:var(--fd);font-weight:800;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;padding:0 10px}
.mcol a{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:10px;color:var(--ink);text-decoration:none}
.mcol a:hover{background:var(--sand);text-decoration:none}
.mcol a b{display:block;font-size:14px;font-weight:700;line-height:1.2}.mcol a small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px;line-height:1.3}
.mic{width:26px;height:26px;border-radius:8px;background:var(--sand);display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex:0 0 auto}
.mmore{display:inline-block;margin:6px 10px 0;font-weight:800;font-size:13px;color:var(--accent-text)}
.snav-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.snav-signin{font-weight:700;color:var(--ink-2);padding:8px 10px;border-radius:10px}.snav-signin:hover{background:var(--sand);text-decoration:none}
.icon-btn .ico{width:22px;height:22px;fill:currentColor}
.burger{display:none;flex-direction:column;gap:5px}.burger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.burger[aria-expanded="true"] span:nth-child(2){opacity:0}.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{position:fixed;inset:70px 0 0;background:var(--bg);z-index:59;overflow:auto;padding:10px 20px 40px}
.mnav-in{max-width:640px;margin:0 auto}
.macc{border-bottom:1px solid var(--line)}.macc summary{list-style:none;cursor:pointer;font-weight:800;font-size:18px;padding:16px 0;display:flex;justify-content:space-between;align-items:center}
.macc summary::-webkit-details-marker{display:none}.macc summary::after{content:"+";font-size:22px;color:var(--muted)}.macc[open] summary::after{content:"−"}
.macc .mh{padding:0;margin-top:10px}.macc a{display:flex;align-items:center;gap:10px;padding:9px 0;color:var(--ink);font-weight:600;font-size:15px}.macc .mmore{margin:4px 0 12px}
.mlink{display:block;padding:16px 0;font-weight:800;font-size:18px;border-bottom:1px solid var(--line);color:var(--ink)}
.mnav-cta{display:grid;gap:10px;margin-top:22px}
@media (max-width:1023px){.snav-menu{display:none}.burger{display:inline-flex}.snav .btn-primary.btn-sm{display:none}.snav.scrolled .snav-in,.snav-in{height:62px}.mnav{inset:62px 0 0}}

/* ── breadcrumbs ── */
.crumbs{font-size:13.5px;color:var(--muted);padding:14px 20px 0;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}.crumbs a:hover{color:var(--ink)}.crumbs .sep{opacity:.5}.crumbs span[aria-current]{color:var(--ink);font-weight:700}

/* ── sections ── */
.sec{padding:88px 0}
.sec-sand{background:var(--sand)}
.sec-ink{background:var(--ink);color:#F4EFE8}.sec-ink h2{color:#fff}.sec-ink p{color:#D2CABF}.sec-ink a:not(.btn){color:#FFB39E}
.sec-head{text-align:center;max-width:780px;margin:0 auto 44px}
.sec-head .sub{margin-top:8px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 0}
.center{text-align:center}
.split{display:grid;gap:40px;grid-template-columns:1fr 1fr;align-items:center}
@media (max-width:860px){.sec{padding:60px 0}.split{grid-template-columns:1fr;gap:26px}.sec-head{margin-bottom:28px}}

/* ── hero ── */
.hero2{position:relative;overflow:hidden;padding:56px 0 48px}
.hero-bg{position:absolute;inset:0;pointer-events:none}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.75;will-change:transform}
.b1{width:60vw;height:60vw;max-width:760px;max-height:760px;left:-14vw;top:-28vw;background:radial-gradient(closest-side,rgba(255,92,53,.42),rgba(255,92,53,0));animation:drift1 22s ease-in-out infinite alternate}
.b2{width:50vw;height:50vw;max-width:640px;max-height:640px;right:-18vw;top:4vw;background:radial-gradient(closest-side,rgba(255,196,120,.55),rgba(255,196,120,0));animation:drift2 26s ease-in-out infinite alternate}
.b3{width:44vw;height:44vw;max-width:560px;max-height:560px;left:30vw;bottom:-30vw;background:radial-gradient(closest-side,rgba(29,107,58,.22),rgba(29,107,58,0));animation:drift3 30s ease-in-out infinite alternate}
.grain{position:absolute;inset:0;opacity:.35;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes drift1{to{transform:translate(8vw,6vw) scale(1.08)}}
@keyframes drift2{to{transform:translate(-6vw,8vw) scale(1.12)}}
@keyframes drift3{to{transform:translate(-8vw,-6vw) scale(1.06)}}
.hero-grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero-copy h1{font-size:clamp(38px,5.4vw,70px)}
.tw-wrap{display:block;color:var(--ink-2);font-weight:500;font-style:italic;font-size:.62em;margin-top:.25em;letter-spacing:0}
.tw{color:var(--accent-text);font-style:normal;font-weight:600;position:relative;white-space:nowrap}
.tw::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;border-radius:3px;background:var(--accent);opacity:.5}
.tw.typing::before{content:"";display:inline-block;width:2px;height:.9em;background:var(--accent);vertical-align:-.1em;margin-left:2px;animation:blink .9s steps(1) infinite;position:absolute;right:-4px;top:.1em}
@keyframes blink{50%{opacity:0}}
.trust{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--ink-2);font-size:14.5px;font-weight:600}
.trust li::before{content:"✓";color:var(--leaf);font-weight:800;margin-right:7px}
.hero-demo{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}
.phone{position:relative;width:min(360px,92vw);aspect-ratio:9/18.4;background:#1A1A1A;border-radius:46px;padding:12px;box-shadow:0 40px 90px -30px rgba(26,26,26,.55),0 0 0 1px rgba(255,255,255,.06) inset}
.phone::before{content:"";position:absolute;inset:0;border-radius:46px;background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,0) 40%);pointer-events:none}
.phone-top{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:36%;height:26px;background:#1A1A1A;border-radius:0 0 18px 18px;z-index:3}
.phone>iframe,.phone .dstack{position:absolute;inset:12px;border-radius:36px;overflow:hidden;background:var(--bg);border:0;width:calc(100% - 24px);height:calc(100% - 24px)}
.phone.wide{width:min(400px,92vw);aspect-ratio:9/17}
.phone.tall{aspect-ratio:9/18.6}
.hero-badge{display:inline-flex;flex-direction:column;align-items:center;gap:2px;padding:12px 18px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh-2);animation:floaty 5s ease-in-out infinite}
.hero-badge b{font-family:var(--fm);font-size:15px}.hero-badge span{font-size:12.5px;color:var(--muted)}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr;gap:34px}.hero2{padding:34px 0 40px}.hero-copy h1{font-size:clamp(34px,8vw,52px)}.phone{width:min(320px,88vw)}}

/* ── demo chat (player) ── */
.dchat{--acc:#FF5C35;display:flex;flex-direction:column;background:var(--bg);border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh-1);min-height:320px}
.dchat.in-phone{border:0;border-radius:0;height:100%;box-shadow:none;background:var(--bg)}
.dchat.tall{min-height:420px}
.dchat-bar{display:flex;align-items:center;gap:10px;padding:14px 14px 12px;background:var(--surface);border-bottom:1px solid var(--line)}
.in-phone .dchat-bar{padding-top:40px}
.davatar{width:36px;height:36px;border-radius:50%;background:var(--acc);color:#1A1A1A;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;flex:0 0 auto;box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 25%,transparent)}
.dname{font-weight:800;font-size:14.5px;line-height:1.1}.dsub{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px}
.dsub i{width:7px;height:7px;border-radius:50%;background:var(--leaf);display:inline-block;animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(29,107,58,.5)}70%{box-shadow:0 0 0 7px rgba(29,107,58,0)}100%{box-shadow:0 0 0 0 rgba(29,107,58,0)}}
.dchat-body{flex:1;padding:14px;display:flex;flex-direction:column;gap:9px;overflow:hidden;justify-content:flex-end}
.db{max-width:86%;padding:10px 13px;border-radius:16px;font-size:14.5px;line-height:1.42;font-family:var(--fd);font-weight:500}
.db.u{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:5px}
.db.b{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:5px}
.sec-ink .db.b{background:#2A2622;border-color:#3A342D;color:#F4EFE8}.sec-ink .db.u{background:var(--accent);color:#141210}
.db.pop{animation:pop .35s var(--ease) both}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.dtyping{align-self:flex-start;display:inline-flex;gap:4px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;border-bottom-left-radius:5px}
.dtyping i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:bounce 1.2s infinite}.dtyping i:nth-child(2){animation-delay:.15s}.dtyping i:nth-child(3){animation-delay:.3s}
.dchat-in{display:flex;align-items:center;gap:10px;margin:0 12px 12px;padding:10px 12px 10px 16px;background:var(--surface);border:1.5px solid var(--line);border-radius:999px;color:var(--muted);font-size:14px}
.dchat-in i{margin-left:auto;width:32px;height:32px;border-radius:50%;background:var(--acc);display:inline-block;position:relative}
.dchat-in i::after{content:"";position:absolute;left:11px;top:9px;width:8px;height:8px;border-right:2.5px solid #1A1A1A;border-top:2.5px solid #1A1A1A;transform:rotate(45deg)}

/* ── marquee ── */
.marq-wrap{padding:6px 0 10px;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marq{overflow:hidden}
.marq-track{display:flex;gap:10px;width:max-content;animation:marq 48s linear infinite}
.marq:hover .marq-track{animation-play-state:paused}
.marq-track a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-weight:700;font-size:14px;white-space:nowrap}
.marq-track a:hover{border-color:var(--accent);text-decoration:none}
@keyframes marq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marq-track{animation:none;flex-wrap:wrap;width:auto}.blob{animation:none}.hero-badge{animation:none}}

/* ── three explainer cards ── */
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tcard{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:18px 20px 22px;box-shadow:var(--sh-1)}
.tcard h3{margin-top:14px}.tcard p{color:var(--ink-2);margin:0;font-size:15.5px}
.tart{height:160px;border-radius:18px;background:linear-gradient(160deg,var(--sand),#FFF7F3);display:flex;align-items:center;justify-content:center;gap:12px;position:relative;overflow:hidden}
.tart.a1 span{font-size:38px;display:inline-block;animation:floaty 4s ease-in-out infinite}.tart.a1 span:nth-child(2){animation-delay:.6s}.tart.a1 span:nth-child(3){animation-delay:1.2s}
.tart.a2{flex-direction:column;align-items:stretch;padding:18px 22px;justify-content:center;gap:8px}
.mini-bubble{padding:8px 12px;border-radius:14px;font-size:13.5px;font-weight:600;max-width:78%}
.mini-bubble.u{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:4px}
.mini-bubble.b{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px}
.tart.a3{flex-direction:column;gap:12px}
.mini-link{font-family:var(--fm);font-size:14px;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--line)}.mini-link.big{font-size:17px;padding:12px 20px}.mini-link b{color:var(--accent-text)}
.mini-qr{width:84px;height:84px;background:#fff;border-radius:10px;padding:6px;display:flex;align-items:center;justify-content:center}.mini-qr.lg{width:132px;height:132px}
.mini-qr img,.mini-qr canvas{width:100%!important;height:100%!important}
@media (max-width:900px){.three{grid-template-columns:1fr}}

/* ── how it works ── */
.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.hsteps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:22px;position:relative}
.hsteps li{display:flex;gap:18px;align-items:flex-start}
.hn{width:44px;height:44px;border-radius:50%;background:var(--accent);color:#1A1A1A;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;flex:0 0 auto;box-shadow:0 10px 24px -10px var(--coral-glow)}
.hsteps h3{margin:8px 0 4px}.hsteps p{margin:0;color:var(--ink-2)}
.hsteps.vertical{gap:28px}.hsteps.vertical li{padding-bottom:28px;border-bottom:1px solid var(--line)}.hsteps.vertical li:last-child{border-bottom:0}
.ui-mock{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:10px;box-shadow:var(--sh-2)}
.um-row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px}
.um-row+.um-row{border-top:1px solid var(--line)}
.um-ic{width:40px;height:40px;border-radius:12px;background:var(--sand);display:inline-flex;align-items:center;justify-content:center;font-size:18px}
.um-row b{display:block;font-size:14.5px}.um-row small{display:block;color:var(--muted);font-size:12.5px}
.um-dot{margin-left:auto;width:10px;height:10px;border-radius:50%;background:var(--sand-2)}.um-dot.ok{background:var(--leaf);animation:pulse 2.4s infinite}
.um-add{opacity:.7;border:1.5px dashed var(--sand-2);margin-top:6px}
@media (max-width:900px){.how-grid{grid-template-columns:1fr;gap:28px}}

/* ── feed tiles ── */
.feedgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ftile{display:flex;flex-direction:column;gap:6px;padding:20px 18px;background:var(--surface);border:1px solid var(--line);border-radius:20px;color:var(--ink);text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s}
.ftile:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:var(--sand-2);text-decoration:none}
.ftile .fi{font-size:30px;line-height:1;transition:transform .3s var(--ease)}.ftile:hover .fi{transform:translateY(-3px) rotate(-6deg)}
.ftile b{font-size:17px;margin-top:6px}.ftile span:last-child{color:var(--muted);font-size:14px;line-height:1.4}
@media (max-width:1000px){.feedgrid{grid-template-columns:repeat(2,1fr)}.feedgrid .ftile:last-child{grid-column:1/-1}}

/* ── language section ── */
.lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.langdemo{background:#201C18;border:1px solid #3A342D;border-radius:24px;padding:18px}
.ltabs{display:flex;gap:6px;margin-bottom:14px}
.ltabs button{flex:1;height:40px;border-radius:999px;border:1px solid #3A342D;background:transparent;color:#D2CABF;font-weight:700;cursor:pointer}
.ltabs button.is-on{background:var(--accent);border-color:var(--accent);color:#141210}
.lpane{display:none;flex-direction:column;gap:10px;min-height:140px}.lpane.is-on{display:flex;animation:pop .3s var(--ease)}
@media (max-width:900px){.lang-grid{grid-template-columns:1fr;gap:26px}}

/* ── share 4 ── */
.share4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sh{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:16px 18px 20px}
.sh-art{height:150px;border-radius:16px;background:linear-gradient(160deg,var(--sand),#FFF7F3);display:flex;align-items:center;justify-content:center;margin-bottom:14px;overflow:hidden;padding:14px}
.sh p{color:var(--ink-2);font-size:14.5px;margin:0 0 8px}.sh a:not(.btn){font-weight:800;font-size:14px}
.mini-wa{display:flex;align-items:flex-start;gap:8px;background:#DCF8C6;color:#063;border-radius:14px;border-bottom-left-radius:4px;padding:10px 12px;font-size:13px;font-weight:600;max-width:100%}
.mini-site{position:relative;width:100%;height:100%;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 12px;display:flex;flex-direction:column;gap:8px}
.mini-site i{display:block;height:8px;border-radius:4px;background:var(--sand-2);width:70%}.mini-site i:nth-child(2){width:90%}.mini-site i:nth-child(3){width:55%}
.mini-fab{position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:var(--accent);box-shadow:0 8px 20px -8px var(--coral-glow);animation:fab 2.4s ease-in-out infinite}
@keyframes fab{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.mini-site.xl{height:300px;border-radius:18px;padding:22px 20px;box-shadow:var(--sh-2)}.mini-site.xl .mini-fab{width:56px;height:56px;right:18px;bottom:18px}
.mini-panel{position:absolute;right:18px;bottom:88px;width:230px;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:12px;display:flex}
@media (max-width:1000px){.share4{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.share4{grid-template-columns:1fr}}

/* ── live demo ── */
.demo-live{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;justify-content:center}
.demo-side{max-width:460px}.demo-side .chip-row{margin-bottom:12px}
@media (max-width:860px){.demo-live{grid-template-columns:1fr;justify-items:center;text-align:center}.demo-side .chip-row{justify-content:center}}

/* ── cards ── */
.cards{display:grid;gap:16px}
.cards.grid2{grid-template-columns:repeat(2,1fr)}.cards.grid3{grid-template-columns:repeat(3,1fr)}.cards.grid4{grid-template-columns:repeat(4,1fr)}
.scard{display:flex;flex-direction:column;gap:8px;padding:22px 20px;background:var(--surface);border:1px solid var(--line);border-radius:20px;color:var(--ink);text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s;min-height:100%}
a.scard:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:var(--sand-2);text-decoration:none}
.scard .sic{width:44px;height:44px;border-radius:14px;background:var(--sand);display:inline-flex;align-items:center;justify-content:center;font-size:22px}
.scard b{font-size:17px;line-height:1.25;margin-top:4px}.scard .sd{color:var(--ink-2);font-size:14.5px;line-height:1.45;flex:1}
.scard .sgo{font-weight:800;font-size:13.5px;color:var(--accent-text);margin-top:4px}
.scard .avatar{width:44px;height:44px}
.whocard{display:flex;flex-direction:column;gap:6px;padding:22px;background:var(--sand);border-radius:20px;color:var(--ink);text-decoration:none;transition:transform .2s var(--ease)}
.whocard:hover{transform:translateY(-3px);text-decoration:none}.whocard b{font-size:17px}.whocard span:last-child{color:var(--ink-2);font-size:14.5px}
.who2{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:1000px){.cards.grid4,.who2{grid-template-columns:repeat(2,1fr)}.cards.grid3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cards.grid2,.cards.grid3,.cards.grid4,.who2{grid-template-columns:1fr}}

/* ── trust ── */
.trust-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center}
.trust-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.trust-list li{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px}
.trust-list b{display:block;font-size:16px;margin-bottom:4px}.trust-list span{color:var(--ink-2);font-size:14.5px}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ticks li{padding-left:28px;position:relative;line-height:1.45}
.ticks li::before{content:"✓";position:absolute;left:0;top:0;color:var(--leaf);font-weight:800}
.ticks.no li::before{content:"✕";color:var(--muted)}
.ticks.two-col{grid-template-columns:1fr 1fr}
@media (max-width:900px){.trust-grid{grid-template-columns:1fr;gap:24px}.trust-list,.ticks.two-col{grid-template-columns:1fr}}

/* ── pricing ── */
.price2{display:grid;grid-template-columns:repeat(2,minmax(0,440px));gap:18px;justify-content:center}
.plan2{background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:26px 26px 24px;display:flex;flex-direction:column}
.plan2.hot{border-color:var(--accent);box-shadow:0 30px 70px -40px var(--coral-glow)}
.plan2 .pr{display:flex;align-items:baseline;gap:8px;margin:6px 0 14px}.plan2 .pr span{font-family:var(--fs);font-size:52px;font-weight:600;letter-spacing:-.03em}.plan2 .pr small{color:var(--muted);font-weight:600}
.plan2 ul{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:9px;flex:1}.plan2 li{padding-left:26px;position:relative;font-size:15.5px}.plan2 li::before{content:"✓";position:absolute;left:0;color:var(--leaf);font-weight:800}
.ptable-wrap{overflow-x:auto;margin-top:34px}
.ptable{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;font-size:15px}
.ptable th,.ptable td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.ptable th{background:var(--sand);font-family:var(--fd);font-weight:800;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.ptable tr:last-child td{border-bottom:0}.ptable td:nth-child(2){font-weight:700}
.ctable td:nth-child(2){background:#FFF7F3}
@media (max-width:760px){.price2{grid-template-columns:1fr}}

/* ── FAQ ── */
.faqs{display:grid;gap:10px}
.faq{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:0 18px}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:800;font-size:16.5px}
.faq summary::-webkit-details-marker{display:none}
.pm{width:28px;height:28px;border-radius:50%;background:var(--sand);position:relative;flex:0 0 auto;transition:transform .25s var(--ease),background .2s}
.pm::before,.pm::after{content:"";position:absolute;left:8px;top:13px;width:12px;height:2px;background:var(--ink);border-radius:2px}.pm::after{transform:rotate(90deg)}
.faq[open] .pm{transform:rotate(45deg);background:var(--accent)}
.fa{padding:0 0 16px;color:var(--ink-2);line-height:1.6;animation:pop .3s var(--ease)}.fa p{margin:0 0 8px}

/* ── CTA band ── */
.cta-band{background:var(--ink);color:#F4EFE8;padding:72px 0;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;width:640px;height:640px;left:-180px;top:-320px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,92,53,.45),rgba(255,92,53,0));filter:blur(40px)}
.cta-in{position:relative;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.cta-in h2{color:#fff;margin-bottom:8px}.cta-in p{color:#D2CABF;max-width:56ch;margin:0}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.btn-outline-light{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}.btn-outline-light:hover{background:rgba(255,255,255,.1)}

/* ── footer ── */
.sfoot{background:var(--sand);padding:56px 0 30px;border-top:1px solid var(--line)}
.fgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:26px 20px}
.fcol a{display:block;font-size:13.5px;color:var(--ink-2);padding:3px 0;font-weight:600}.fcol a:hover{color:var(--ink)}
.fcol .fh{padding:0}
.fbot{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.fbot-links{display:flex;gap:14px;flex-wrap:wrap}.fbot-links a{font-size:13.5px;font-weight:700;color:var(--ink-2)}
@media (max-width:1000px){.fgrid{grid-template-columns:repeat(3,1fr)}}@media (max-width:600px){.fgrid{grid-template-columns:repeat(2,1fr)}}

/* ── search overlay ── */
.search-ov{position:fixed;inset:0;background:rgba(26,26,26,.5);backdrop-filter:blur(6px);z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px 20px}
.search-box{width:100%;max-width:640px;background:var(--surface);border-radius:22px;box-shadow:0 40px 100px -30px rgba(0,0,0,.5);overflow:hidden;animation:pop .25s var(--ease)}
.search-in{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 18px;border-bottom:1px solid var(--line)}
.search-in .ico{width:22px;height:22px;fill:var(--muted);flex:0 0 auto}
.search-in input{flex:1;border:0;outline:0;font-size:18px;height:46px;background:transparent;font-family:var(--fd)}
.search-res{max-height:60vh;overflow:auto;padding:8px}
.sres,.search-res a{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:12px;color:var(--ink);text-decoration:none}
.sres:hover,.search-res a:hover,.search-res a.is-sel{background:var(--sand);text-decoration:none}
.sres b,.search-res a b{display:block;font-size:15px}.sres span,.search-res a span{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.sres{border:1px solid var(--line);background:var(--surface);margin-bottom:8px}
.search-form{display:flex;gap:10px;max-width:640px;margin-top:18px}.search-form .input{flex:1}

/* ── inner page hero ── */
.phero{padding:56px 0 30px}
.phero .cta{margin-top:22px}
.phero-icon .hero-ic{width:72px;height:72px;border-radius:22px;background:var(--surface);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:34px;margin-bottom:16px;box-shadow:var(--sh-1)}

/* ── prose (articles, policies, white paper) ── */
.prose{max-width:760px;padding-top:40px;padding-bottom:40px}
.prose h1{margin-bottom:.3em}
.prose h2{font-family:var(--fs);font-weight:600;font-size:clamp(24px,2.6vw,32px);margin:1.6em 0 .5em;letter-spacing:-.01em}
.prose p,.prose li{font-size:17.5px;line-height:1.7;color:var(--ink-soft)}
.prose ul{padding-left:22px}.prose li{margin-bottom:6px}
.prose .lede{font-size:20px}
.prose .defn{font-family:var(--fs);font-size:24px;line-height:1.4;color:var(--ink)}
.toc{display:flex;flex-direction:column;gap:6px;background:var(--sand);border-radius:18px;padding:18px 20px;margin:26px 0 10px;font-size:15px}.toc b{margin-bottom:4px}.toc a{color:var(--ink-2);font-weight:600}
.takeaway{background:var(--accent-soft);border-radius:16px;padding:16px 18px;margin:26px 0;font-size:16.5px;line-height:1.55}.takeaway b{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:4px}
.kv dt{font-weight:800;color:var(--ink)}.kv{font-size:16px;gap:8px 18px}
@media print{.snav,.sfoot,.cta-band,.crumbs,.search-ov,.toast{display:none!important}.prose{max-width:none}}

/* ── misc lists ── */
.relgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.rel{display:flex;align-items:center;gap:10px;padding:8px 0;color:var(--ink);font-weight:600;font-size:15px}.rel:hover{color:var(--accent-text);text-decoration:none}
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.post{display:flex;flex-direction:column;gap:8px;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:22px;color:var(--ink);text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s}
.post:hover{transform:translateY(-4px);box-shadow:var(--sh-2);text-decoration:none}.post .meta{font-size:13px;color:var(--muted);font-weight:700}.post h3{font-size:22px;font-weight:600}.post p{color:var(--ink-2);margin:0;flex:1}
.timeline{display:grid;gap:14px}
.tl{display:grid;grid-template-columns:150px 1fr;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px 20px}
.tl-when b{display:block;font-size:16px}.tl-when span{color:var(--muted);font-size:13.5px}
.tl ul{margin:0;padding-left:18px;color:var(--ink-2);line-height:1.6}
@media (max-width:600px){.tl{grid-template-columns:1fr;gap:8px}}
.status-list{display:grid;gap:10px}.srow{display:flex;justify-content:space-between;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 18px}
.az-nav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:26px}.az-nav a{width:36px;height:36px;border-radius:10px;background:var(--surface);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-weight:800;color:var(--ink)}
.az-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.az-group{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.az-letter{font-family:var(--fs);font-size:30px;color:var(--accent-text);margin-bottom:6px}
.az-item{display:block;padding:8px 0;border-top:1px solid var(--line);color:var(--ink)}.az-item:hover{text-decoration:none;color:var(--accent-text)}.az-item b{display:block}.az-item span{display:block;color:var(--muted);font-size:13.5px}
.sitemap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:26px}
.smcol h2{font-family:var(--fd);font-weight:800;font-size:16px;margin-bottom:8px}.smcol h2 small{color:var(--muted);font-weight:700;font-size:13px}.smcol a{display:block;font-size:14px;padding:3px 0;color:var(--ink-2);font-weight:600}
.brand-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bcard{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:14px}.bcard.dark{background:var(--ink);color:#fff}
.bprev{height:170px;display:flex;align-items:center;justify-content:center;border-radius:16px;background:var(--sand);margin-bottom:12px}.bcard.dark .bprev{background:#2A2622}
.swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.swc{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:12px}.swc i{display:block;height:70px;border-radius:12px;margin-bottom:10px}.swc b{display:block}.swc span{display:block;color:var(--muted);font-size:13px}.swc small{display:block;color:var(--ink-2);font-size:12.5px;margin-top:4px}
.rules{padding-left:20px;line-height:1.7;font-size:16.5px}
.phrase-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin:18px 0 22px}
.phrase{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px}.phrase b{display:block}.phrase span{color:var(--muted);font-size:13.5px}
.chip.is-static{cursor:default}.chip.is-static:hover{border-color:var(--line)}
.snippet{position:relative;background:var(--ink);color:#F4EFE8;font-family:var(--fm);font-size:13.5px;padding:16px 86px 16px 16px;border-radius:14px;word-break:break-all;line-height:1.5}
.snippet .cp{position:absolute;right:10px;top:10px;height:32px;padding:0 12px;border:0;border-radius:8px;background:var(--accent);color:#1A1A1A;font-family:var(--fd);font-weight:800;font-size:13px;cursor:pointer}
.widget-stage{position:relative;min-height:120px;background:var(--surface);border:1px dashed var(--sand-2);border-radius:18px;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--muted)}
.cform .field{margin-bottom:14px}.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.label .hi{font-weight:500;color:var(--muted)}

/* ── tools ── */
.tool{background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:var(--sh-1)}
.tool-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:start}.tool-grid.one{grid-template-columns:1fr}
.tool-out{background:var(--sand);border-radius:20px;padding:22px;text-align:center}
.qr-out{display:inline-block;background:#fff;padding:14px;border-radius:16px;margin-bottom:14px;box-shadow:var(--sh-1)}.qr-out img,.qr-out canvas{display:block;max-width:100%;height:auto!important}
.gen{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px;text-align:left}.gen p{margin:8px 0 0;font-size:15.5px;line-height:1.55}
.qa-edit{background:var(--sand);border-radius:14px;padding:10px;display:grid;gap:8px}.qa-edit .q{font-weight:700}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px;text-align:left}.stat b{display:block;font-family:var(--fs);font-size:34px;line-height:1.1}.stat span{color:var(--muted);font-size:14px}.stat.hot{border-color:var(--accent);background:var(--accent-soft)}
.slug-idea{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;text-align:left;font-size:15px}.slug-idea b{color:var(--accent-text)}
.ptable.pb td{font-size:14.5px}
@media (max-width:860px){.tool-grid{grid-template-columns:1fr}.tool{padding:18px}}
