/* Light pass (2026-10-01), after the features bank: white pages, pale grey panels with a
   hairline, interfaces shown on white, square corners, almost no shadow. Loaded last.
   Device and browser mockups, and the eight client designs, keep their own shapes. */

:root{--lt-panel:#f4f5f7;--lt-edge:#e5e7ec;--lt-ink:#101014;--lt-mut:#5b5d68}

/* ---------- square corners: everything but mockups */
:is(a,button,input,select,textarea,img,figure,article,aside,form,table,.card,.btn,.box,.panel,.tg,.chip,.cs-shot,.lv-shot,.ct-demo,.hz-box,.hv-box,.fx-card,.fx-page,.dm-formcard,.wt,.mat,.val,.navcta,.fp-send,.fp-field input,.fp-field textarea,.fp-field select,.e-ask,.e-task,.m-f span,.k-btns span,.rt-mk,.nd-im,.inc,.kind .im,.plx-it img,.plx-dz,.plx-lens,.mx-crop,.mx-page,.wd-card,.wd-mini)
  :not(.wd *):not(.dev):not(.dev *):not(.wd-mini):not(.wd-frame):not(.wd-frame *){border-radius:0!important}
/* mockups keep their device shape */
.rt-mk,.wf-get .shot,.wd-mini{border-radius:8px!important}

/* ---------- shadows: gone, except on device mockups */
:not(.wd *):not(.dev):not(.dev *):not(.wd-frame):not(.wd-mini){box-shadow:none!important;text-shadow:none!important}
.dev.desk img,.dev.tab img,.dev.mob img{box-shadow:0 30px 50px -40px rgba(20,25,60,.35)!important}
/* books and scans read as objects against the page with a hairline instead */
.hb-it,.fx-page,.kind .im,.plx-it img,.t-main img,.wt-im img,.p-row img,.pilot-shelf .bk,.orig-wall img,.nd-im img,.hz-t,.c-scatter img,.sc-books img,.sc-page,.ct-books img,.dm-vis .pg{outline:1px solid rgba(16,16,20,.08);outline-offset:0}

/* ---------- home hero: the light ground */
.hgrid:not(.dark){background:#fff!important}
.hgrid:not(.dark) .hg-scrim{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.96) 26%,rgba(255,255,255,.55) 42%,rgba(255,255,255,0) 56%)!important}
.hgrid:not(.dark) .hb-it{filter:saturate(.9)!important;opacity:.95}
.hgrid:not(.dark) .hb-cols{-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent)}
.hgrid:not(.dark) .hg-copy h1{color:var(--lt-ink)}
.hgrid:not(.dark) .hg-copy p{color:var(--lt-mut)}
.hgrid:not(.dark) .btn.ghost{color:var(--lt-ink)!important;border-color:var(--lt-ink)!important;background:#fff!important}
/* the reading: an interface on white */
.hgrid:not(.dark) .fx-card{background:#fff!important;border:1px solid var(--lt-edge)!important;color:var(--lt-ink)!important;backdrop-filter:none!important}
.hgrid:not(.dark) .fx-head{color:var(--lt-mut);border-bottom-color:var(--lt-edge)}
.hgrid:not(.dark) .fx-title b{color:var(--lt-ink)}
.hgrid:not(.dark) .fx-steps i{color:#c4c7d0}
.hgrid:not(.dark) .fx.s1 .fx-steps [data-s="1"]{color:#2742c9}
.hgrid:not(.dark) .fx.s2 .fx-steps [data-s="2"]{color:var(--lt-ink)}
.hgrid:not(.dark) .fx.s3 .fx-steps [data-s="3"]{color:#a8650a}
.hgrid:not(.dark) .fx-k{color:#2742c9}
.hgrid:not(.dark) .r2 .fx-k{color:var(--lt-ink)}
.hgrid:not(.dark) .r3 .fx-k{color:#a8650a}
.hgrid:not(.dark) .fx-orig{color:#4a4d58}
.hgrid:not(.dark) .fx-en{color:var(--lt-ink)}
.hgrid:not(.dark) .tg{color:var(--lt-ink);border-right-color:var(--lt-edge)!important}
.hgrid:not(.dark) .tg em{color:#a8650a}.hgrid:not(.dark) .tg.k-plate em{color:#14603c}.hgrid:not(.dark) .tg.k-subject em{color:#2742c9}
.hgrid:not(.dark) .fx-lead line{stroke:#2742c9}
@media (max-width:820px){ .hgrid.home:not(.dark){background:#fff!important} .hgrid.home:not(.dark) .hb-cols{-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);mask-image:linear-gradient(180deg,#000 60%,transparent)} }

/* ---------- panels that were dark become light */
.wt-im,.mat .im.mx,.who .w .pl.sc{background:var(--lt-panel)!important}
.wt{background:#fff;border:1px solid var(--lt-edge)}
/* closing band: stays dark */

/* Books page */
.rd-scholar{background:var(--lt-panel)!important;color:var(--lt-ink)!important;border:1px solid var(--lt-edge)!important}
.rd-scholar h3{color:var(--lt-ink)!important}
.rd-scholar p,.rd-facts li{color:var(--lt-mut)!important}
.rd-facts li{border-top-color:var(--lt-edge)!important}
.rd-facts li b{color:var(--lt-ink)!important}
.rd-scholar .f-label{color:#2742c9!important}

/* Getting started */
.wh{background:#fff!important;color:var(--lt-ink)!important;border-bottom:1px solid var(--lt-edge)}
.wh h1{color:var(--lt-ink)}
.wh-copy p{color:var(--lt-mut)!important}
.wh .btn.ghost{border-color:var(--lt-ink)!important;color:var(--lt-ink)!important}
.wf figcaption{color:var(--lt-mut)!important}
.wf figcaption b{color:var(--lt-ink)!important}
.wf:not(:last-child)::after{border-color:#2742c9!important}
.pile img{filter:none!important}
.made-lines{background:#fff!important;border:1px solid var(--lt-edge)!important}
.made-lines i{color:#4a4d58!important}.made-lines b{color:var(--lt-ink)!important}
.own{background:var(--lt-panel)!important;color:var(--lt-ink)!important;border-top:1px solid var(--lt-edge);border-bottom:1px solid var(--lt-edge)}
.own h2{color:var(--lt-ink)!important}
.own-copy p{color:var(--lt-mut)!important}
.fmts{background:var(--lt-edge)!important;border-color:var(--lt-edge)!important}
.fmts li{background:#fff!important}
.fmts b{color:var(--lt-ink)!important}.fmts span{color:var(--lt-mut)!important}
.rev{background:var(--lt-panel)!important;color:var(--lt-ink)!important;border:1px solid var(--lt-edge)}
.rev-steps li{background:#fff!important}
.rev-steps p{color:var(--lt-ink)}
.rev-steps em{color:var(--lt-mut)!important}
.rev-steps ins{color:#8a5208!important}
.rev-steps .s1 .st{color:#2742c9!important}.rev-steps .s2 .st{color:#a8650a!important}.rev-steps .s3 .st{color:#14603c!important}
.sec.play .rev-steps .s1{border-color:#2742c9!important}.sec.play .rev-steps .s2{border-color:#d29a2b!important}.sec.play .rev-steps .s3{border-color:#2b9a63!important}

/* Contact and Book a demo: the side panel stays dark */
.dm-formcard{border:1px solid var(--lt-edge)!important}

/* the hero box keeps its form, on a light ground */
.hgrid:not(.dark) .hz-box,.hgrid:not(.dark) .hv-box{background:#fff!important;border:1px solid var(--lt-edge)!important;color:var(--lt-ink)!important}
@media (max-width:820px){.hgrid.home:not(.dark) .hg-wrap{margin-top:-6px}}

/* no serif type in Folium's own pages (2026-10-01): the serif token now resolves to the sans.
   The mock client websites set their own typefaces by name and keep them. */
:root,:root[style]{--fo-serif:var(--fo-sans,Inter,system-ui,sans-serif)!important;--serif:var(--fo-sans,Inter,system-ui,sans-serif)!important}
/* small labels read as sentence case, not spaced capitals */
.f-label,.rd-col .f-label,.rd-scholar .f-label,.hd{text-transform:none!important;letter-spacing:0!important;font-size:12.5px!important;font-weight:600!important}

/* the wordmark, "Balanced" (2026-10-01): disk = 1.75 × the cap height of the capitals beside it,
   centred on the capitals (line-height 1 puts Inter's cap middle on the box middle), semibold
   capitals opened to .06em, gap = .38 × the disk. Sized in em so it scales with the text. */
header.topbar .wordmark,.sitefoot .wm{gap:.485em!important;font-weight:650!important;letter-spacing:.06em!important;line-height:1!important}
header.topbar .wordmark{font-size:16px!important}
.sitefoot .wm{font-size:15px!important}
header.topbar .wordmark .fm,.sitefoot .wm .fm{width:1.272em!important;height:1.272em!important}
@media (max-width:760px){header.topbar .wordmark{font-size:15px!important}}

/* no numbers in the corners of boxes (2026-10-02) */
.mcard::after,.fstep::before{content:none!important;display:none!important}