/* Binfield layout layer (v16). Loads last. Uses the theme variables so light and dark both work. */
.home .bf-statement{padding:clamp(64px,10vw,128px) 0 clamp(40px,6vw,72px)}
.home .bf-statement p{margin:0;max-width:21em;font:700 clamp(28px,4.6vw,54px)/1.12 "Schibsted Grotesk",system-ui,sans-serif;letter-spacing:-.03em;color:var(--brand-ink)}
.bf-rows{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--brand-grey)}
.bf-row{display:grid;gap:10px 40px;padding:30px 0;border-top:1px solid var(--brand-grey);grid-template-columns:minmax(0,1fr)}
.bf-row h3{margin:0;font-size:clamp(22px,2.4vw,28px)}
.bf-row p{margin:0;max-width:40em;color:var(--brand-slate)}
@media(min-width:860px){.bf-row{grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);align-items:baseline}}
.bf-spec{display:grid;gap:36px 64px;grid-template-columns:minmax(0,1fr)}
.bf-spec-h h2{margin:0 0 14px}
@media(min-width:900px){.bf-spec{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);align-items:start}.bf-spec-h{position:sticky;top:96px}}
.bf-dl{margin:0;border-bottom:1px solid var(--brand-grey)}
.bf-dl>div{display:grid;gap:4px 24px;padding:16px 0;border-top:1px solid var(--brand-grey);grid-template-columns:minmax(0,1fr)}
.bf-dl dt{font-weight:700;color:var(--brand-ink)}
.bf-dl dd{margin:0;color:var(--brand-slate)}
@media(min-width:620px){.bf-dl>div{grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr)}}
.bf-dl-wide>div{padding:20px 0}
.bf-steps{list-style:none;counter-reset:b;margin:0;padding:0;display:grid;gap:30px 28px;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.bf-steps li{counter-increment:b;border-top:3px solid var(--brand-ink);padding-top:16px}
.bf-steps li::before{content:counter(b);display:block;font:800 40px/1 "Schibsted Grotesk",system-ui,sans-serif;letter-spacing:-.04em;color:var(--brand-orange);margin-bottom:14px}
.bf-steps h3{margin:0 0 8px}
.bf-steps p{margin:0;color:var(--brand-slate)}
@media(prefers-reduced-motion:no-preference){.bf-row{transition:background-color .2s}.bf-row:hover{background:var(--surface-soft)}}

/* hero name box and field motion (kept from the previous skin) */
/* name box */
.namebox{margin:26px 0 4px;max-width:440px}
.namebox input{width:100%;font:600 19px "Schibsted Grotesk",system-ui,sans-serif;padding:15px 24px;border-radius:99px;border:2px solid #fff;background:rgba(255,255,255,.12);color:#fff;outline-offset:3px}
.namebox input::placeholder{color:#cfe8da}
.namebox input:focus-visible{outline:3px solid #fff;background:rgba(255,255,255,.2)}
.nbnote{min-height:1.5em;margin:10px 4px 0;color:#d9efe3;font-size:17px}
.msgrow{margin-top:22px}
/* field motion */
.bitfield i{transition:color .45s ease;transform:scale(calc(1 + var(--h,0)*.55));color:color-mix(in srgb,#8fe3ff calc(var(--h,0)*100%),#0f5233)}
.bitfield i.on{color:color-mix(in srgb,#8fe3ff calc(var(--h,0)*100%),#fff)}
.bitfield{cursor:crosshair;touch-action:pan-y}
/* measured figures */
.proof{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin:0;padding:0;list-style:none}
.proof b{display:block;font:800 clamp(40px,6vw,68px)/1 "Schibsted Grotesk",sans-serif;letter-spacing:-.04em;color:var(--brand-teal-deep)}
.proof span{display:block;margin-top:8px;color:var(--brand-slate);font-size:17px}
@media(max-width:800px){.proof{grid-template-columns:1fr 1fr}}

/* keep soft sections readable in dark mode */
.home .section.soft{background:var(--surface)}