/* SAPLING redesign 2026-11 — generated from the approved design (marketing/design/homepage-2026-10/round13). */
@font-face{font-family:"Manrope";src:url("../fonts/manrope-var.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Newsreader";src:url("../fonts/newsreader-var.woff2") format("woff2-variations"),url("../fonts/newsreader-var.woff2") format("woff2");font-weight:200 800;font-display:swap}
/* ============ design tokens: Brand + butter ============ */
:root,.site,.app{
  --bg:#f4f6f3; --surface:#ffffff; --tint:#e8f0e8; --ink:#12241a; --muted:#4b5b51; --line:#dde3dc;
  --brand:#15803d; --brand-hover:#106530; --deep:#1f5a3e; --deep-muted:#cfe0d4;
  --butter:#ffe27a; --butter-line:#d9a908; --butter-soft:#fff6d6; --butter-text:#7a5c00;
  --actuals:var(--deep); --obligo:#f2c94c; --track:#e6ebe5; --danger:#b42318; --danger-soft:#fdecea;
  --f-disp:'Newsreader',Georgia,serif; --disp-w:600; --disp-ls:-.02em; --disp-scale:1;
  --f-body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-family:var(--f-body);line-height:1.5;font-size:16px;background:var(--bg);color:var(--ink)}
.eu-only{display:none}
.loc-eu .eu-only{display:inline}
.nw{display:inline-block}
.sec-head.wide{max-width:none}
.sec-head.wide .lead{max-width:none}
.nb{white-space:nowrap}
.plan{font-weight:800;color:var(--ink);white-space:nowrap}
.site p,.app p,.site li{text-wrap:pretty}
.pain b,.ftext h3,.sp h3,.price h3,.faq summary,.left-row,.cta h2{text-wrap:balance}
.planned-hatch{background:repeating-linear-gradient(135deg,#c9d1cb 0 3px,#eef1ee 3px 7px)}

/* ============ homepage ============ */
.site *{box-sizing:border-box}
:where(.site) :where(h1,h2,h3,p){margin:0}
.site h1,.site h2{text-wrap:balance}
.site a:not(.btn){color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.num{font-variant-numeric:tabular-nums}
.disp{font-family:var(--f-disp);font-weight:var(--disp-w);letter-spacing:var(--disp-ls);line-height:1.04}
.sec{padding:clamp(56px,8vw,104px) 0}
.sec-head{max-width:660px;margin-bottom:clamp(28px,4vw,48px);display:grid;gap:12px}
.h2{font-size:calc(clamp(2rem,4.4vw,3.3rem) * var(--disp-scale))}
.h2.sm{font-size:calc(clamp(1.75rem,3.2vw,2.5rem) * var(--disp-scale))}
.lead{color:var(--muted);font-size:1.08rem;max-width:58ch}
.mark{background:linear-gradient(transparent 60%,var(--butter) 60%,var(--butter) 93%,transparent 93%);padding:0 .05em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:800;font-size:.95rem;padding:13px 22px;border-radius:12px;cursor:pointer;border:0;white-space:nowrap;transition:background-color .15s,box-shadow .15s}
.btn-sm{padding:9px 16px;font-size:.88rem}
.btn-brand{background:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-hover)}
.btn-line{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(18,36,26,.2)}
.btn-line:hover{box-shadow:inset 0 0 0 1px rgba(18,36,26,.45)}
.btn-white{background:#fff;color:var(--ink)}
.btn-white:hover{background:var(--bg)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

.top{background:var(--tint)}
.layer{position:relative;box-shadow:0 26px 32px -26px rgba(18,36,26,.38)}
.bg-paper{background:var(--bg)}
.layer.pre-dark{box-shadow:0 30px 40px -22px rgba(0,0,0,.55)}
.deep.layer{background-image:linear-gradient(rgba(0,0,0,.24),rgba(0,0,0,0) 40px);box-shadow:0 32px 40px -24px rgba(8,32,20,.6)}
.bg-soft{background:#fafbf9}
.site .logo,.app .logo{height:26px;width:auto;display:block;color:var(--ink);--sq:#15803d}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0}
.nav ul{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0;font-weight:600;font-size:.94rem}
.nav ul a{text-decoration:none}
.hero{display:grid;grid-template-columns:1.32fr 1fr;gap:clamp(28px,4.5vw,56px);align-items:center;padding:clamp(24px,4vw,56px) 0 clamp(48px,7vw,88px)}
.eyebrow{font-weight:700;font-size:.85rem;color:var(--muted);display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--brand)}
.hero h1{font-size:calc(clamp(2.3rem,4.5vw,3.7rem) * var(--disp-scale));margin:18px 0 20px;line-height:1.02}
.hero .sub{font-size:1.14rem;color:var(--muted);max-width:46ch;margin-bottom:26px}
.note{font-size:.86rem;color:var(--muted);margin-top:12px}
.crew{display:flex;align-items:center;gap:14px;margin-top:24px;font-size:.9rem;color:var(--muted);font-weight:600}
.av{width:34px;height:34px;border-radius:50%;display:grid;place-content:center;color:#fff;font-weight:800;font-size:.7rem;flex:none}
.stack{display:flex}
.stack .av{border:2px solid var(--tint);margin-left:-6px}
.stack .av:first-child{margin-left:0}
.a1{background:#15803d}.a2{background:var(--deep)}.a3{background:#6b7d72}.a4{background:#93a198}

.board{background:#fff;border-radius:24px;box-shadow:0 1px 0 rgba(18,36,26,.04),0 24px 48px -28px rgba(18,36,26,.4);padding:clamp(16px,2.6vw,26px);display:grid;gap:16px}
.board-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.board-head small{display:block;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.board-head b{font-size:1.15rem;letter-spacing:-.01em}
.board .stack .av{width:30px;height:30px;font-size:.64rem;border-color:#fff}
.left{display:grid;gap:8px}
.left-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:.88rem;color:var(--muted)}
.left-row strong{font-size:1.3rem;color:var(--brand);letter-spacing:-.02em}
.bar{display:flex;gap:3px;height:10px}
.bar i{border-radius:4px}
.bar .s{flex:45.25 1 0;background:var(--actuals)}.bar .c{flex:26 1 0;background:var(--obligo)}.bar .p{flex:8.33 1 0}.bar .l{flex:20.42 1 0;background:var(--track)}
.feed{display:grid;gap:2px;border-top:1px solid #e4e9e5;padding-top:6px}
.ev{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center;padding:9px 0;font-size:.9rem}
.ev .av{width:30px;height:30px;font-size:.64rem}
.ev time{font-size:.78rem;color:var(--muted)}
.ev .what{color:#4a5850}
.ev .what b{color:var(--ink);font-weight:700;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev .what small{display:block;font-size:.78rem;color:var(--muted)}
.ev .what{min-width:0}
.st{display:inline-block;font-size:.72rem;font-weight:800;padding:2px 8px;border-radius:999px;margin-left:4px;vertical-align:1px}
.thread{background:var(--tint);border-radius:16px;padding:14px;display:grid;gap:10px}
.thread-h{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;font-weight:700;color:#4a5850}
.plus{font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:#fff;color:var(--ink);padding:3px 8px;border-radius:999px}
.msg{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start;font-size:.88rem}
.msg .av{width:26px;height:26px;font-size:.58rem}
.msg p{background:#fff;border-radius:4px 14px 14px 14px;padding:8px 12px}

/* status pills shared by homepage and app */
.pill{display:inline-flex;align-items:center;gap:4px;font-size:.74rem;font-weight:800;padding:3px 9px;border-radius:999px;white-space:nowrap}
/* status pills: colour = the budget bucket the status counts in (2026-11-03, Order.status_family) */
.p-draft,.p-request,.p-offer{background:#fff;color:#4b5b51;box-shadow:inset 0 0 0 1px #c9d1cb}
.p-approved{background:repeating-linear-gradient(135deg,#e9ece8 0 3px,#f7f8f6 3px 7px);color:#4b5b51;box-shadow:inset 0 0 0 1px #c9d1cb}
.p-ordered,.p-part,.p-delivered{background:var(--butter-soft);color:var(--butter-text);box-shadow:inset 0 0 0 1px #f1d675}
.p-invoiced{background:var(--deep-muted);color:var(--deep);box-shadow:inset 0 0 0 1px #a9c6b3}
.p-cancelled{background:var(--danger-soft);color:var(--danger)}

/* monthly chart (homepage second shot) */
.prod{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(28px,5vw,64px);align-items:center}
.prod ul{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:14px}
.prod li{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:baseline;color:var(--muted)}
.prod li::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--brand)}
.prod li b{color:var(--ink)}
.chart-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:clamp(16px,2.4vw,24px);display:grid;gap:16px}
.chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.chart-head b{font-size:1.05rem}
.chart-head small{display:block;color:var(--muted);font-size:.8rem}
.mini-seg{display:flex;background:var(--bg);border-radius:9px;padding:3px;font-size:.78rem;font-weight:700}
.mini-seg span{padding:5px 10px;border-radius:7px;color:var(--muted)}
.mini-seg span.on{background:var(--deep);color:#fff}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.kpis div{background:var(--bg);border-radius:12px;padding:10px 12px;display:grid;gap:2px}
.kpis small{display:flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.kpis small i{width:9px;height:9px;border-radius:2px}
.kpis b{font-size:1.02rem}
.kpis .avail b{color:var(--brand)}
.chart{display:grid;grid-template-columns:34px 1fr;gap:8px}
.yaxis{display:flex;flex-direction:column;justify-content:space-between;font-size:.68rem;color:var(--muted);text-align:right;height:190px;padding-bottom:0}
.plot{position:relative;height:190px;display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;
  background-image:linear-gradient(var(--line) 1px,transparent 1px);background-size:100% 25%;border-bottom:1px solid #c8d0c9}
.col{display:flex;flex-direction:column-reverse;height:100%;justify-content:flex-start}
.col i{display:block;width:100%}
.col i:last-child{border-radius:4px 4px 0 0}
.col .a{background:var(--actuals)}.col .o{background:var(--obligo)}
.today{position:absolute;top:0;bottom:0;border-left:1.5px dashed var(--brand);left:calc((100% - 66px) / 12 * 10 + 6px * 9.5)}
.today span{position:absolute;top:-2px;right:6px;font-size:.66rem;font-weight:800;color:var(--brand);background:#fff;padding:0 4px;border-radius:4px}
.xaxis{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;font-size:.68rem;color:var(--muted);text-align:center;margin-left:42px}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:.78rem;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:2px}

.deep{background:var(--deep);color:#fff}
.deep .lead{color:var(--deep-muted)}
.pains{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.pain{display:grid;gap:10px;align-content:start;padding-top:18px;border-top:2px solid var(--butter)}
.pain b{font-family:var(--f-disp);font-weight:var(--disp-w);letter-spacing:var(--disp-ls);font-size:calc(1.45rem * var(--disp-scale));line-height:1.15}
.pain p{color:var(--deep-muted)}

.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fcard{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:10px 10px 22px;display:grid;grid-template-rows:auto 1fr;gap:18px}
.fcard.span2{grid-column:span 2}
.vis{background:var(--tint);border-radius:15px;padding:18px;min-height:150px;display:grid;align-content:center;gap:10px}
.ftext{padding:0 12px;display:grid;gap:6px;align-content:start}
.ftext h3{font-family:var(--f-disp);font-weight:var(--disp-w);letter-spacing:var(--disp-ls);font-size:calc(1.4rem * var(--disp-scale));line-height:1.15;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ftext p{color:var(--muted)}
.ui{background:#fff;border-radius:12px;box-shadow:0 1px 0 rgba(18,36,26,.05),0 8px 20px -14px rgba(18,36,26,.35);padding:12px 14px}
.vb-row{display:grid;gap:7px}
.vb-row + .vb-row{margin-top:12px;padding-top:12px;border-top:1px solid #eef1ed}
.vb-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:.84rem}
.vb-top b{font-size:.9rem}
.vb-top .ok{color:var(--brand);font-weight:800}
.warn{font-size:.72rem;font-weight:800;background:var(--butter-soft);color:var(--butter-text);box-shadow:inset 0 0 0 1px #f1d675;padding:2px 8px;border-radius:999px}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:5px}
.flow .pill{font-size:.7rem;padding:3px 8px}
.flow .arr{color:#9aa79f;font-size:.8rem}
.late-row{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.82rem;margin-top:10px}
.late-row b{font-weight:700}
.late-row span{color:var(--danger);font-weight:800;font-size:.74rem}
.invite-ui{display:flex;align-items:center;gap:8px;font-size:.8rem;margin-top:10px}
.invite-ui code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--bg);border-radius:7px;padding:5px 8px;font-size:.74rem}
.invite-ui b{background:var(--brand);color:#fff;border-radius:7px;padding:5px 9px;font-size:.72rem}
.srch{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:.84rem}
.srch span{color:var(--muted)}
.srch i{width:1.5px;height:15px;background:var(--ink);margin-left:-6px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.srch i{animation:none}}
.hit{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;margin-top:10px;font-size:.84rem}
.hit .av{width:28px;height:28px;font-size:.6rem}
.hit b{display:block;font-weight:700}
.hit small{color:var(--muted);font-size:.76rem}
.wk-h{display:flex;justify-content:space-between;align-items:center;font-size:.84rem;margin-bottom:6px}
.wk-h span{background:var(--butter-soft);color:var(--butter-text);font-weight:800;font-size:.72rem;border-radius:999px;padding:1px 8px}
.wk{display:flex;justify-content:space-between;gap:10px;font-size:.82rem;padding:6px 0;border-top:1px solid #eef1ed}
.wk em{font-style:normal;font-weight:800;color:var(--deep)}
.wk.late em{color:var(--danger)}
.tm-head{display:flex;justify-content:space-between;align-items:baseline;font-size:.84rem;margin-bottom:10px}
.tm-head span{color:var(--muted);font-size:.78rem}
.tm-list{display:flex;flex-wrap:wrap;gap:6px}
.tm-list .av{width:30px;height:30px;font-size:.62rem}
.roles{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.roles span{font-size:.72rem;font-weight:700;background:var(--bg);border-radius:6px;padding:3px 8px;color:var(--muted)}
.vis .stack .av{border-color:#fff;width:32px;height:32px;font-size:.66rem}
.mbars{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;align-items:end;height:74px;border-bottom:1px solid #d5dcd5}
.mbars i{display:block;border-radius:3px 3px 0 0;background:var(--actuals)}
.mbars i.f{background:repeating-linear-gradient(135deg,#c9d1cb 0 3px,#eef1ee 3px 7px)}
.mcap{display:flex;justify-content:space-between;font-size:.72rem;color:var(--muted);margin-top:6px}
.bub{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start;font-size:.8rem}
.bub .av{width:24px;height:24px;font-size:.56rem}
.bub p{background:#fff;border-radius:4px 12px 12px 12px;padding:7px 10px;box-shadow:0 1px 0 rgba(18,36,26,.05)}
.strip{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.strip > div{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:22px 24px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 16px;min-width:0}
.strip > div:last-child > div:first-child{flex:1 1 220px;min-width:0}
.strip > div:first-child > div:first-child{flex:none}

.strip h3{font-size:1.02rem;font-weight:800}
.strip p{color:var(--muted);font-size:.92rem}
.langsw{display:flex;background:var(--bg);border-radius:8px;padding:3px;font-size:.76rem;font-weight:800;flex:none}
.langsw span{padding:4px 9px;border-radius:6px;color:var(--muted)}
.langsw span.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.chfnum{font-weight:800;font-size:1.05rem;flex:none}
.supl{display:flex;flex-wrap:wrap;gap:6px}
.strip > div:first-child{flex-direction:column;align-items:flex-start;gap:12px}
.supl span{font-size:.76rem;font-weight:700;background:var(--tint);color:var(--deep);border-radius:7px;padding:4px 9px;white-space:nowrap}
.lang-aside{display:flex;align-items:center;gap:12px;flex:none}
.tagp{font-family:var(--f-body);font-weight:800;font-size:.66rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:var(--butter-soft);color:var(--butter-text);padding:2px 7px;border-radius:999px;box-shadow:inset 0 0 0 1px #f1d675}

/* the gap: spectrum */
.gapsec{background:var(--butter-soft)}
.gap-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);align-items:end;margin-bottom:clamp(28px,4vw,44px)}
.gap-head .lead{color:#5a4d1d}
.spectrum{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:14px;align-items:stretch}
.sp{border-radius:20px;padding:24px;display:grid;gap:12px;align-content:start}
.sp.side{border:1px solid rgba(18,36,26,.14)}
.sp.mid{background:#fff;box-shadow:0 0 0 2px var(--brand),0 18px 36px -24px rgba(18,36,26,.35);padding:26px 26px 22px}
.sp-label{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#5a4d1d}
.sp.mid .sp-label{color:var(--brand)}
.sp h3{font-family:var(--f-disp);font-weight:var(--disp-w);letter-spacing:var(--disp-ls);font-size:calc(1.5rem * var(--disp-scale));line-height:1.12}
.sp ul{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:.93rem;color:#4a4430}
.sp li{display:grid;grid-template-columns:16px 1fr;gap:8px}
.sp li::before{content:"–";color:#8a7b45;font-weight:800}
.sp-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:4px}
.sp-stats div{padding:12px 0 10px;display:grid;gap:2px;text-align:center}
.sp-stats div + div{border-left:1px solid var(--line)}
.sp-stats strong{font-size:1.6rem;font-weight:800;letter-spacing:-.04em;line-height:1;white-space:nowrap}
.sp-stats span{font-size:.78rem;color:var(--muted);font-weight:600}
.sp-price{display:flex;justify-content:space-between;align-items:baseline;font-size:.9rem;color:var(--muted)}
.sp-price b{color:var(--ink);font-size:1.05rem}
.forwho{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;margin-top:clamp(28px,4vw,40px);padding-top:22px;border-top:1px solid rgba(18,36,26,.12)}
.forwho p{color:#5a4d1d;max-width:46ch;font-weight:600}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.tchip{padding:7px 14px;border-radius:999px;background:#fff;font-weight:700;font-size:.86rem;box-shadow:inset 0 0 0 1px rgba(18,36,26,.1)}

/* pricing — as on the live site */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.price{background:#fff;border-radius:18px;padding:28px;display:flex;flex-direction:column;position:relative;box-shadow:inset 0 0 0 1px rgba(18,36,26,.1)}
.price.popular{box-shadow:0 0 0 2px var(--brand),0 12px 32px rgba(18,36,26,.10)}
.price.dept{background:transparent;box-shadow:none;border:1.5px dashed #c3ccc5}
.badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--brand);color:#fff;font-size:.74rem;font-weight:700;padding:3px 12px;border-radius:7px;white-space:nowrap}
.price h3{font-size:1.12rem;font-weight:800;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.soon{font-size:.72rem;font-weight:700;background:var(--tint);color:var(--deep);padding:2px 9px;border-radius:6px}
.price .desc{font-size:.88rem;color:var(--muted);margin:4px 0 20px}
.price.dept .desc{color:var(--muted)}
.price.dept .amount{font-size:1.6rem;margin:6px 0 24px}
.amount{font-size:2.3rem;font-weight:800;letter-spacing:-.03em;line-height:1}
.amount small{font-size:.9rem;font-weight:600;color:var(--muted);letter-spacing:0}
.permonth{font-size:.78rem;color:var(--muted);margin:6px 0 22px}
.price ul{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px;flex:1;font-size:.9rem;align-content:start}
.price li{display:grid;grid-template-columns:22px 1fr;align-items:start}
.price li svg{width:16px;height:16px;color:var(--brand);margin-top:2px}
.price.dept li{grid-template-columns:1fr;color:var(--muted)}
.price .btn{width:100%;border-radius:10px;font-size:.9rem;padding:12px}

.faq{display:grid;max-width:820px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:20px 0}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;font-family:var(--f-disp);font-weight:var(--disp-w);letter-spacing:var(--disp-ls);font-size:calc(1.35rem * var(--disp-scale))}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-body);font-weight:400;font-size:1.4rem}
.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:10px;max-width:66ch;color:var(--muted)}
.cta{background:var(--deep);color:#fff;border-radius:clamp(24px,4vw,40px);padding:clamp(32px,6vw,72px);display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:center}
.cta h2{font-size:calc(clamp(2.4rem,6vw,4.6rem) * var(--disp-scale))}
.cta .mark{background:none;padding:0;text-decoration:underline;text-decoration-color:var(--butter);text-decoration-thickness:.085em;text-underline-offset:.13em;text-decoration-skip-ink:none}
.cta p{color:var(--deep-muted);margin-bottom:16px;font-size:1.05rem}
.foot{padding:32px 0;font-size:.9rem;color:var(--muted)}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;align-items:center}
.foot nav{display:flex;flex-wrap:wrap;gap:18px}
.fl{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.foot a{text-decoration:none}
.foot .tm{flex-basis:100%;font-size:.76rem}

@media (max-width:900px){
  .hero,.prod,.cta,.gap-head{grid-template-columns:1fr}
  .pains,.prices,.spectrum{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr 1fr}
  .fcard.span2{grid-column:1/-1}
  .strip{grid-template-columns:1fr}

}
@media (max-width:640px){
  .nav ul .hide-sm{display:none}
  .nav ul{gap:14px}
  .bento{grid-template-columns:1fr}
  .fcard.span2{grid-column:auto}
  .strip > div{flex-wrap:wrap}
  .kpis{grid-template-columns:1fr 1fr}
  .thread{display:none}
  .strip > div{flex-direction:column;align-items:flex-start}
  .supl{justify-content:flex-start;max-width:none}
  .strip > div > div:first-child{flex:none !important}
  .plot,.xaxis{gap:3px}
  .xaxis span:nth-child(even){visibility:hidden}
  .today{left:calc((100% - 33px) / 12 * 10 + 3px * 9.5)}
}

@media (prefers-reduced-motion:reduce){.btn{transition:none}}