/* ProvisionBench v2: layout for the new sections + motion scaffolding.
   Brand tokens come from styles.css (--navy, --blue, fonts). Everything here degrades
   to a static page when GSAP/Lenis are absent or the visitor prefers reduced motion. */

/* ---------- motion scaffolding ---------- */
html.mo [data-mo]:not(.is-in),
html.mo [data-split]:not(.is-in){visibility:hidden}   /* hidden until GSAP reveals; see motion.js */
html.mo .monitor{visibility:hidden}
html.mo .chip{visibility:hidden}
.split-line{display:block;overflow:hidden}          /* SplitText line masks */
.split-line > div{display:block}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
html.has-lenis{scroll-behavior:auto}

/* ---------- small type ---------- */
.eyebrow{margin:0 0 16px;font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.eyebrow--light{color:rgba(255,255,255,.55)}
.eyebrow--dark{color:var(--blue-light)}
.link{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.tag--dark{background:rgba(143,178,232,.18);color:var(--blue-light);vertical-align:middle;margin-left:8px}

/* ---------- header: pill on scroll (DSID treatment, in PB colours) ---------- */
.hdr--v2{transition:transform .38s var(--ease),border-color .3s linear,max-width .5s var(--ease),
  top .5s var(--ease),padding .5s var(--ease),border-radius .5s var(--ease),box-shadow .5s var(--ease),
  background-color .5s var(--ease)}
.hdr--v2.is-pill{top:14px;max-width:calc(100% - 2 * var(--gutter) + 24px);margin-left:auto;margin-right:auto;
  padding:13px 14px 13px 28px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.88);box-shadow:0 12px 44px rgba(18,24,42,.12)}
.hdr--v2.is-pill .hdr__logo{height:34px}
@media (max-width:760px){.hdr--v2.is-pill{max-width:calc(100% - 16px);padding:10px 10px 10px 18px}.hdr--v2.is-pill .hdr__logo{height:28px}}
.hdr--v2.is-pill.is-hidden{transform:translateY(calc(-100% - 14px))}
@media (max-width:760px){
  .nav{display:none}
  .hdr--v2{flex-wrap:nowrap;gap:12px}
  .hdr--v2 .hdr__logo{height:30px}
  .hdr--v2 .hdr__right{gap:12px}
}
@media (max-width:440px){.hdr--v2 .hdr__signin{display:none}}
html,body{overflow-x:clip}
.shell{overflow-x:clip}

/* ---------- buttons: arrow nudge ---------- */
.btn--arrow i{display:inline-block;font-style:normal;margin-left:6px;transition:transform .3s var(--ease)}
.btn--arrow:hover i{transform:translateX(4px)}

/* ---------- hero v2 ---------- */
.hero--v2{padding-bottom:0}
.hero--v2 .hero__top{align-items:flex-end}
.hero__lead{flex:1 1 min(100%,520px)}
.hero--v2 .hero__title{font-size:clamp(40px,6.6vw,86px);letter-spacing:-.05em;line-height:.98}

/* ---------- demo: monitor + drifting provision chips ---------- */
.demo{padding:clamp(40px,8vw,150px) var(--gutter) 0}
@media (min-width:1600px){.demo{padding-top:180px}}
.demo__stage{position:relative;max-width:1180px;margin:0 auto}
.monitor{position:relative;z-index:2;margin:0 auto;width:min(100%,980px)}
.monitor__body{border-radius:18px;background:#0f1626;padding:12px;
  box-shadow:0 40px 90px rgba(15,33,64,.28),0 0 0 1px rgba(255,255,255,.06) inset}
.monitor__screen{position:relative;overflow:hidden;border-radius:10px;background:#fff;aspect-ratio:16/7.4}
.browser-bar{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:7px;height:34px;
  padding:0 14px;background:#f3f4f7;border-bottom:1px solid rgba(18,24,42,.08)}
.browser-bar i{width:10px;height:10px;border-radius:50%;background:#e3e6ec}
.browser-bar i:nth-child(1){background:#f4a5a0}.browser-bar i:nth-child(2){background:#f7d58a}.browser-bar i:nth-child(3){background:#a9dcb0}
.browser-bar span{margin-left:auto;margin-right:auto;padding:5px 14px;border-radius:7px;background:#fff;
  font:500 11px/1 var(--mono);color:rgba(18,24,42,.55);letter-spacing:.02em}
.screen-view{position:absolute;inset:34px 0 0 0;overflow:hidden}
.screen-view img{width:100%;height:auto;will-change:transform}
.monitor__chin{height:14px}
.monitor__neck{width:86px;height:58px;margin:0 auto;background:linear-gradient(180deg,#d9dde6,#b9bfcc);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
.monitor__foot{width:280px;height:12px;margin:0 auto;border-radius:0 0 10px 10px;background:linear-gradient(180deg,#c9ceda,#aab1c0)}
.chips{list-style:none;margin:0;padding:0;position:absolute;inset:0;z-index:3;pointer-events:none}
.chip{position:absolute;left:var(--x);top:var(--y);display:grid;gap:3px;padding:10px 14px 11px;
  border-radius:12px;background:rgba(255,255,255,.94);border:1px solid var(--line);
  box-shadow:0 14px 34px rgba(15,33,64,.14);backdrop-filter:blur(8px);
  font:600 12.5px/1.2 var(--sans);color:var(--navy);white-space:nowrap}
.chip b{display:inline-block;margin-right:6px;padding:2px 6px;border-radius:5px;background:var(--blue-tint);color:var(--blue);font:600 10.5px/1.3 var(--mono)}
.chip span{font:400 11px/1.2 var(--sans);color:rgba(18,24,42,.55)}
.chip--ok b{background:#e6f4ea;color:#1f7a3a}
.demo__note{margin:26px auto 0;max-width:62ch;text-align:center;font-size:15px;line-height:1.55;color:rgba(18,24,42,.6);padding:0 var(--gutter)}
@media (max-width:900px){
  .chip{display:none}
  .chip:nth-child(1),.chip:nth-child(5){display:grid;font-size:11.5px}
  .monitor__neck,.monitor__foot{display:none}
  .monitor__screen{aspect-ratio:2000/1150}
}

/* ---------- marquee ---------- */
.marquee{margin:clamp(40px,6vw,72px) 0 0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;white-space:nowrap;font:500 13px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:rgba(18,24,42,.5)}
.marquee span{display:inline-block;padding:0 22px}
.marquee span::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--blue);margin:0 22px 2px 0;opacity:.6}
.marquee__track{display:inline-flex;will-change:transform}
.marquee__set{display:inline-flex}

/* ---------- scrub paragraph ---------- */
.scrub{padding:0 var(--gutter);margin-top:clamp(36px,5vw,64px)}
.scrub__inner{border-radius:28px;background:var(--deep);color:#fff;padding:clamp(40px,7vw,110px) clamp(24px,5vw,80px);
  min-height:min(70vh,640px);display:flex;flex-direction:column;justify-content:center}
.scrub__text{max-width:22ch;font:400 clamp(28px,4.6vw,60px)/1.12 var(--serif);letter-spacing:-.015em;text-wrap:pretty}
.scrub__text u{text-decoration:none;position:relative;color:var(--blue-light)}
.scrub__text u svg{position:absolute;left:0;right:0;bottom:-.08em;width:100%;height:.28em;overflow:visible}
.scrub__text u svg path{fill:none;stroke:var(--blue-light);stroke-width:3;stroke-linecap:round;stroke-dasharray:700;stroke-dashoffset:700}
.scrub__text .w{display:inline-block}
html:not(.mo) .scrub__text u svg path{stroke-dashoffset:0}
@media (max-width:900px){.scrub__inner{min-height:0}.scrub__text{max-width:none}}

/* ---------- how it works ---------- */
.how .block__head .h2{max-width:20ch}
.how .lede{max-width:44ch}
.steps3{list-style:none;margin:clamp(36px,5vw,60px) 0 0;padding:0;display:grid;gap:clamp(22px,3vw,40px);
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.step3__num{display:block;color:var(--blue);letter-spacing:.12em}
.rule{height:1px;border:0;background:var(--navy);margin:14px 0 18px;transform-origin:left center}
.step3 h3{font:700 22px/1.15 var(--sans);letter-spacing:-.03em;max-width:16ch}
.step3 p{margin-top:10px;font-size:15px;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:clamp(40px,5vw,64px)}
.stat{border-radius:20px;background:var(--grey);padding:22px 24px 20px}
.stat b{display:block;font:700 clamp(36px,4vw,52px)/1 var(--sans);letter-spacing:-.05em;color:var(--navy)}
.stat b small{font:600 .42em/1 var(--sans);letter-spacing:-.02em;color:var(--blue);margin-left:4px;vertical-align:baseline}
.stat p{margin-top:10px;font-size:14px;line-height:1.45;color:var(--muted)}
.stat em{font-style:normal;margin-left:6px;letter-spacing:.08em;font-size:10px;color:rgba(18,24,42,.4)}

/* ---------- dark v2 ---------- */
.dark--v2 .h2{max-width:18ch;margin-top:0}

/* ---------- founding firms ---------- */
.founding{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(30px,5vw,80px);align-items:start}
.founding__copy .h2{max-width:16ch}
.founding__copy .lede{max-width:46ch}
.founding__copy .hero__cta{margin-top:28px}
.founding__list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.founding__list li{display:grid;grid-template-columns:minmax(120px,.5fr) 1fr;gap:16px;padding:20px 22px;border-radius:16px;
  background:var(--grey);transition:transform .25s var(--ease),background-color .25s var(--ease)}
.founding__list li:hover{background:#eef1f7;transform:translateX(4px)}
.founding__list b{font:700 15px/1.3 var(--sans);letter-spacing:-.02em}
.founding__list span{font-size:14px;line-height:1.5;color:var(--muted)}
@media (max-width:520px){.founding__list li{grid-template-columns:1fr;gap:6px}}

/* ---------- confidentiality tiles v2 ---------- */
.panel--v2 .h2{max-width:14ch;margin-top:0}
.tiles--v2{margin-top:0;align-self:center;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:420px){.tiles--v2{grid-template-columns:1fr}}
.tiles--v2 div{padding:20px}
.tiles--v2 b{display:block;margin-bottom:6px;font:700 14.5px/1.3 var(--sans);letter-spacing:-.02em;color:var(--navy)}

/* ---------- FAQ v2 (native details, animated marker) ---------- */
.faq--v2{margin-top:0}
.faq__q{border-bottom:1px solid rgba(18,24,42,.14);padding:4px 0}
.faq__q summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:16px 0;font:600 17px/1.3 var(--sans);letter-spacing:-.01em}
.faq__q summary::-webkit-details-marker{display:none}
.faq__q summary::after{content:"+";flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  border:1px solid var(--line);font:400 18px/1 var(--sans);color:var(--blue);transition:transform .35s var(--ease),background-color .25s}
.faq__q[open] summary::after{transform:rotate(45deg);background:var(--blue-tint)}
.faq__q p{padding:0 44px 18px 0;font-size:15px;line-height:1.6;color:rgba(18,24,42,.68)}
.faq__q summary:hover{color:var(--blue)}

/* ---------- misc ---------- */
.cta h2{max-width:22ch}
@media (prefers-reduced-motion:reduce){
  html.mo [data-mo],html.mo [data-split],html.mo .monitor,html.mo .chip{visibility:visible}
}