/* Hub · why now — scroll-lit statement, a 21:9 photograph, four shifts. */
.bdh-why__lbl{margin-bottom:28px}
.bdh-why__h{max-width:22ch;font-size:var(--t-d2);font-weight:500;line-height:1.08;letter-spacing:-.03em;color:var(--ink)}
.bdh-why__w{color:var(--ink);transition:color .4s var(--e)}
.bdh-why__h .g .bdh-why__w{color:var(--faint)}
/* why-now.js adds .is-lit-js, then lights words as the statement scrolls through the viewport */
.is-lit-js .bdh-why__w{color:var(--ghost)}
.is-lit-js .bdh-why__w.is-lit{color:var(--ink)}
.is-lit-js .bdh-why__h .g .bdh-why__w.is-lit{color:var(--faint)}

.bdh-why__img{margin-top:var(--bdh-block)}
.bdh-why__img img{object-position:50% 55%}
.bdh-why__chip{position:absolute;left:20px;bottom:20px}

.bdh-why__shifts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--bdh-gap);margin-top:clamp(48px,5vw,72px)}
.bdh-why__shifts>li{position:relative;min-width:0;padding-top:24px}
.bdh-why__shifts>li::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line-3);transform:scaleX(0);transform-origin:left center;transition:transform .9s var(--e)}
.bdh-why__shifts.is-in>li::before{transform:none}
.bdh-why__shifts>li:nth-child(2)::before{transition-delay:90ms}
.bdh-why__shifts>li:nth-child(3)::before{transition-delay:180ms}
.bdh-why__shifts>li:nth-child(4)::before{transition-delay:270ms}
.bdh-why__t{margin-top:14px}
.bdh-why__d{margin-top:10px;max-width:36ch}
.bdh-why__more{margin-top:clamp(36px,4vw,48px)}

@media (max-width:1279px){.bdh-why__shifts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:clamp(32px,4vw,44px)}}
@media (max-width:860px){
  .bdh-why__h{max-width:none}
  .bdh-why__img{aspect-ratio:16/9}
  .bdh-why__shifts{grid-template-columns:minmax(0,1fr);row-gap:28px}
}
@media (max-width:600px){
  .bdh-why__h{font-size:clamp(1.7rem,7.4vw,2.1rem)}
  .bdh-why__img{aspect-ratio:4/3}
  .bdh-why__chip{left:12px;right:12px;bottom:12px}
}
@media (prefers-reduced-motion:reduce){.bdh-why__shifts>li::before{transform:none;transition:none}}