/* from v7 04-mid.css:1 */
/* ===================== v6 BELIEFS (paper, pinned, scroll-scrubbed) =====================
   Final states live in CSS; in pinned mode JS writes transform / opacity / clip-path directly
   on each element (no inherited custom properties, so a scroll frame restyles only what moves). */
.beliefs{padding:var(--s7) 0 var(--s6)}
.eyebrow{color:inherit;display:flex;align-items:center;gap:14px;margin-bottom:clamp(40px,5vw,72px)}
.eyebrow::before{content:"";width:10px;height:10px;background:var(--blue)}
.beliefs .container{z-index:1}
.bf-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:clamp(40px,5vw,72px)}
.bf-top .eyebrow{margin:0}
.bf-hud{display:flex;align-items:center;gap:12px;color:var(--mute)}
.bf-hud .bf-idx{color:var(--ink)}
.bf-seg{display:flex;gap:4px}
.bf-seg i{position:relative;width:clamp(28px,4vw,64px);height:2px;background:var(--ink-line);overflow:hidden}
.bf-seg b{position:absolute;inset:0;background:var(--blue);transform-origin:left}
.belief{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:0 clamp(16px,2vw,32px);border-top:2px solid var(--ink);padding:clamp(22px,2.4vw,34px) 0 clamp(54px,6vw,96px)}
.bf-rule{display:none}
.belief-num{grid-column:1/2;color:var(--mute)}
.belief-title{grid-column:1/-1;font-size:var(--fd-l);line-height:.86;margin-top:18px;letter-spacing:var(--ls-d)}
.belief-body{grid-column:4/7;margin-top:clamp(20px,2.4vw,34px)}
.belief-body p{font-size:var(--fs-xl);line-height:1.35;letter-spacing:var(--ls-text);color:var(--ink-text-2);max-width:30ch}
.bw{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em 0 .14em;margin:-.04em 0 -.14em}
.bw>span{display:inline-block}
/* 01 built: blueprint construction lines, then the bar is laid */
.built{position:relative;display:inline-block}
.built .bw{overflow:visible}
.built .bl{display:inline-block}
.bp{position:absolute;pointer-events:none;display:block}
.bp-base{left:-.12em;right:-.1em;bottom:-.075em;height:0;border-top:2px dashed var(--blue-line);transform-origin:left}
.bp-cap{left:-.12em;right:-.1em;top:.08em;height:0;border-top:1px dashed var(--blue-line);transform-origin:right}
.bp-l,.bp-r{top:-.02em;bottom:-.16em;width:0;border-left:1px dashed var(--blue-line);transform-origin:bottom}
.bp-l{left:-.04em}.bp-r{right:.22em}
.bp-bar{left:0;right:.25em;bottom:-.1em;height:.06em;background:var(--blue);transform-origin:left}
/* 02 face: the word turns from ink to blue (one layer, colour only) and the trace draws */
.accent{position:relative;display:inline-block;color:var(--blue)}
.accent .bw{overflow:hidden} /* masked like every other word, so it rises out of its own line (it used to show below the line) */
.ecg{position:absolute;left:-.05em;right:-.05em;bottom:-.2em;height:.42em;width:calc(100% + .1em);overflow:visible;pointer-events:none}
.ecg path{fill:none;stroke:var(--blue);stroke-width:3;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
/* 03 recede: the instance falls back into depth (transform + opacity only) */
.recede{display:inline-block;transform-origin:0 60%;transform:perspective(900px) translateZ(-320px) translateY(-.04em);opacity:.5}
.recede .bw{overflow:visible;clip-path:inset(-.2em -1em -.2em -1em)}
@media (max-width:899.98px){.belief-body{grid-column:1/-1}.belief-title{font-size:var(--fd-l)}}

/* pinned mode */
.bf-scroll.beliefs{padding:0}
.bf-scroll .bf-track{height:310vh;height:310svh}
.bf-scroll .bf-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column}
.bf-scroll .bf-stage>.container{width:100%;flex:1;display:flex;flex-direction:column;padding-top:clamp(28px,5vh,60px);padding-bottom:clamp(28px,5vh,60px)}
.bf-scroll .bf-list{position:relative;flex:1}
.bf-scroll .belief{position:absolute;left:0;right:0;top:50%;margin-top:-1px;border-top-color:transparent;padding-bottom:0;will-change:transform,opacity;transform:translate3d(0,-50%,0)}
.bf-scroll .belief .bf-slot{display:block}
.bf-scroll .bf-rule{display:block;position:absolute;left:0;right:0;top:-2px;height:2px;background:var(--ink);transform-origin:left}
@media (max-width:899.98px){.bf-scroll .bf-track{height:300vh;height:300svh}}

/* from v7 05b-v6.css:43 */