/* from v7 03b-focus.css:1 */
/* ===================== v4 FOCUS: bold index strip ===================== */
.focus{padding:var(--s7) 0 var(--s6);border-top:0;overflow-x:clip}
.focus .container{z-index:1}
.fx-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:clamp(26px,3vw,44px)}
.fx-head .eyebrow{margin:0}
.fx-head .fx-c{color:var(--mute)}
.focus ol.fx{display:block}
.fx-i{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:0 clamp(16px,2vw,32px);align-items:start;border-top:1px solid var(--line);padding:clamp(18px,2.2vw,30px) 0;transition:padding .7s var(--ease);isolation:isolate}
.fx-i:last-child{border-bottom:1px solid var(--line)}
.fx-i::before{content:"";position:absolute;left:calc(var(--pad) * -1);right:calc(var(--pad) * -1);top:-1px;bottom:-1px;background:var(--blue-deep);transform:scaleY(0);transform-origin:bottom;transition:transform .7s var(--ease);z-index:-1}
.fx-n{grid-column:1/2;align-self:start;font-family:var(--mo);font-weight:var(--tw-label);font-size:var(--fs-label);line-height:1;letter-spacing:var(--ls-label);color:var(--mute);padding-top:var(--fx-cap,.35em);font-variant-numeric:tabular-nums;transition:color .4s var(--ease)}
.focus .fx-h{grid-column:2/5;font-family:var(--d);font-variation-settings:"wdth" var(--dw),"wght" var(--dwg);text-transform:uppercase;font-size:var(--fd-m);line-height:.88;margin:0;transition:transform .8s var(--ease)}
.focus .fx-p{grid-column:5/7;color:var(--mute);font-size:var(--fs-l);line-height:1.4;max-width:30ch;transition:color .5s}
.fx-arr{position:absolute;right:0;top:clamp(18px,2.2vw,30px);font-family:var(--mo);font-weight:var(--tw-label);font-size:var(--fs-label);color:var(--mute);transition:transform .6s var(--ease),color .4s}
/* reveal, scrubbed: the rule draws, then number, title and line follow one another by scroll position */
.fx-i::after{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--paper);transform-origin:left}
.fx-i.rv-a::after{transform:scaleX(var(--rv))}
.fx-i.rv-a .fx-n{opacity:clamp(0,calc(var(--rv) * 1.6),1);translate:0 calc((1 - min(1,var(--rv) * 1.6)) * 14px)}
.fx-i.rv-a .fx-h{opacity:clamp(0,calc(var(--rv) * 1.6 - .2),1);translate:0 calc((1 - clamp(0,var(--rv) * 1.6 - .2,1)) * 14px)}
.fx-i.rv-a .fx-p{opacity:clamp(0,calc(var(--rv) * 1.6 - .5),1);translate:0 calc((1 - clamp(0,var(--rv) * 1.6 - .5,1)) * 14px)}
@media (max-width:899.98px){
  .fx-i{grid-template-columns:1fr;gap:8px;align-items:start;padding:22px 0 26px}
  .fx-n{grid-column:1/-1;padding:0 0 4px}
  .focus .fx-h{grid-column:1/-1;font-size:var(--fd-m);line-height:.95}
  .focus .fx-p{grid-column:1/-1;font-size:var(--fs-s)}
  .fx-arr{display:none}
}
