/* Lenis smooth scrolling (as on yodezeen.com) */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* Manifesto: words rise out of a mask, the paragraph fills in as you scroll */
.mf-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.mf-word{display:inline-block;transform:translateY(105%);transition:transform 1.1s cubic-bezier(.19,1,.22,1);transition-delay:calc(var(--i) * 70ms)}
[data-motion=manifesto].mf-in .mf-word{transform:none}
[data-motion=manifesto] .eyebrow{opacity:0;letter-spacing:.9em;transition:opacity 1.2s ease,letter-spacing 1.6s cubic-bezier(.19,1,.22,1)}
[data-motion=manifesto].mf-in .eyebrow{opacity:1;letter-spacing:.1em}
.mf-fill{color:rgba(35,35,33,.18);transition:color .25s linear}
.mf-fill.on{color:var(--ink)}

/* Portrait + brief (after Yodezeen's main-info): a 4-screen section pinned for its length. As you scroll,
   the photo panel grows from the left edge to full width while its image settles from 1.2x to 1x; the text
   column rides on the panel's right edge and rises from below; its lines slide up once the section pins. */
.about-split{position:relative;height:400vh}
.as-sticky{position:sticky;top:0;height:100vh;overflow:hidden}
.as-media{position:absolute;left:0;top:0;height:100%;width:calc(var(--p,0) * 100%);margin:0;overflow:hidden;will-change:width}
.as-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 45%;transform:scale(calc(1.2 - .2 * var(--p,0)));will-change:transform}
.as-copy{position:absolute;top:0;left:calc(var(--p,0) * 100%);width:50%;padding:0 8px 0 32px;transform:translateY(calc((1 - var(--p,0)) * 100vh));will-change:transform}
.as-title{font-size:clamp(20px,1.67vw,32px);line-height:1;letter-spacing:.01em;text-transform:uppercase;font-weight:400;margin:0 0 48px;max-width:590px}
.as-sub{max-width:285px}
.as-sub p{font-size:13px;line-height:1.44;letter-spacing:.02em;text-transform:uppercase;margin:0 0 16px}
.as-more{font-size:12px;text-transform:uppercase;padding:7px 14px}
.as-line{display:block;opacity:0;transform:translateY(90px)}
.as-copy.in .as-line{opacity:1;transform:none;transition:opacity 1s cubic-bezier(.19,1,.22,1),transform 1.2s cubic-bezier(.19,1,.22,1);transition-delay:calc(var(--i) * 90ms)}
.as-more{opacity:0;transition:opacity .8s ease .6s}
.as-copy.in .as-more{opacity:1}
@media(max-width:900px){
 .about-split{height:auto}
 .as-sticky{position:relative;height:auto;overflow:visible}
 .as-media{position:relative;width:100%;aspect-ratio:4/3}
 .as-media img{transform:none}
 .as-copy{position:relative;left:0;width:auto;transform:none;padding:48px 18px 80px}
}
@media(prefers-reduced-motion:reduce){
 .mf-word,[data-motion=manifesto] .eyebrow{transition:none;transform:none;opacity:1;letter-spacing:.1em}
 .mf-fill{color:var(--ink)}
 .about-split{height:auto}.as-sticky{position:relative;height:auto;display:grid;grid-template-columns:60% 40%}
 .as-media,.as-copy{position:relative;width:auto;left:0;transform:none}.as-media{min-height:70vh}.as-media img{transform:none}
 .as-line,.as-more{opacity:1;transform:none}
}