.studio-page{overflow:clip;background:#fff;color:var(--ink)}
.studio-page .eyebrow{display:block;color:var(--gold);font-size:clamp(.8rem,.9vw,1rem);letter-spacing:.1em;text-transform:uppercase}
.studio-page .rich-text,.studio-page .rich-text p{color:inherit}
.studio-page h1,.studio-page h2{box-sizing:content-box;padding-bottom:.24em;overflow:visible}
.studio-page h3{box-sizing:content-box;padding-bottom:.2em;overflow:visible}

.studio-hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:78svh;overflow:hidden;background:var(--ink);color:#fff}
.studio-hero__media,.studio-hero__shade{position:absolute;inset:0}
.studio-hero__media{z-index:-2;overflow:hidden;background:var(--ink)}
.studio-hero__media img{position:absolute;inset:-6%;display:block;width:112%;height:112%;max-width:none;object-fit:cover;object-position:center;filter:grayscale(.22)}
.studio-hero__shade{z-index:-1;background:linear-gradient(90deg,rgba(5,21,42,.92) 0%,rgba(5,21,42,.55) 58%,rgba(5,21,42,.25) 100%)}
.studio-hero__inner{position:relative;width:100%;padding-top:clamp(9rem,16vh,12rem);padding-bottom:clamp(3.5rem,6vw,5.5rem)}
.studio-hero__copy{position:relative;z-index:1;width:min(1120px,88%)}
.studio-hero h1{margin:.85rem 0 0;color:#fff;font-size:clamp(4rem,7vw,8rem);line-height:.94}
.studio-hero__copy p{width:min(680px,100%);margin:1.4rem 0 0;color:rgba(255,255,255,.76);font-size:clamp(1.05rem,1.35vw,1.45rem);line-height:1.55}
.studio-hero__line{position:absolute;right:var(--container-pad);bottom:clamp(2rem,4vw,4rem);width:clamp(80px,12vw,190px);height:1px;background:var(--gold);transform-origin:right;animation:studio-line-in 1.2s .45s var(--ease) both}
@keyframes studio-line-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.studio-intro{padding:clamp(4.5rem,7vw,8rem) 0;background:#fff}
.studio-intro__layout{display:grid;grid-template-columns:minmax(160px,.27fr) minmax(0,1fr);gap:clamp(2.5rem,8vw,10rem);align-items:start}
.studio-intro__content{min-width:0}
.studio-intro h2{max-width:1200px;margin:0;color:var(--ink);font-size:clamp(3.1rem,5vw,5.8rem);line-height:.96}
.studio-intro .rich-text{width:100%;max-width:860px;margin:clamp(1.5rem,2.5vw,2.7rem) 0 0;color:rgba(12,35,65,.7);font-size:clamp(1.05rem,1.25vw,1.3rem);line-height:1.7}
.studio-intro .rich-text p{font:inherit}

.studio-story{padding:0 0 clamp(4rem,7vw,8rem)}
.studio-story__item{display:grid;grid-template-columns:minmax(360px,1.05fr) minmax(320px,.95fr);gap:clamp(2.5rem,6vw,7rem);align-items:center;min-height:clamp(560px,58vw,760px);padding:clamp(3rem,5vw,5.5rem) 0;border-top:1px solid rgba(12,35,65,.16)}
.studio-story__item--reverse .studio-story__media{grid-column:2;grid-row:1}
.studio-story__item--reverse .studio-story__copy{grid-column:1;grid-row:1}
.studio-story__media{--studio-tilt-x:0deg;--studio-tilt-y:0deg;position:relative;margin:0;overflow:hidden;aspect-ratio:4/5;background:var(--paper);transform:perspective(1200px) rotateX(var(--studio-tilt-x)) rotateY(var(--studio-tilt-y));transform-style:preserve-3d;transition:transform .65s var(--ease)}
.studio-story__media::after{content:"";position:absolute;inset:1.2rem;border:1px solid rgba(255,255,255,.42);pointer-events:none;transition:inset .5s var(--ease)}
.studio-story__media:hover::after{inset:.8rem}
.studio-story__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),filter .6s ease;filter:grayscale(.22)}
.studio-story__media:hover img{transform:scale(1.035);filter:grayscale(0)}
.studio-story__media figcaption{position:absolute;right:1.75rem;bottom:1.75rem;left:1.75rem;color:#fff;font-size:.7rem;letter-spacing:.05em;text-shadow:0 2px 15px rgba(0,0,0,.55)}
.studio-story__copy{position:relative;min-width:0;padding:clamp(1rem,3vw,3rem) 0}
.studio-story__number{position:absolute;right:0;top:-.2em;box-sizing:content-box;padding-bottom:.16em;color:transparent;font:400 clamp(7rem,12vw,14rem)/1.08 var(--serif);letter-spacing:-.06em;-webkit-text-stroke:1px rgba(12,35,65,.13);overflow:visible;pointer-events:none}
.studio-story__copy .eyebrow{position:relative;margin-bottom:1.1rem}
.studio-story__copy h2{position:relative;margin:0 0 clamp(1.35rem,2vw,2rem);color:var(--ink);font-size:clamp(2.8rem,4vw,4.8rem);line-height:.97}
.studio-story__copy .rich-text{position:relative;color:rgba(12,35,65,.68);font-size:clamp(1rem,1.12vw,1.2rem);line-height:1.7}
.studio-story__copy .rich-text p{font:inherit}

.studio-timeline{position:relative;padding:clamp(4.5rem,7vw,8rem) 0;background:var(--ink);color:#fff}
.studio-timeline__layout{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(420px,1.25fr);gap:clamp(4rem,9vw,12rem);align-items:start}
.studio-timeline__head{position:sticky;top:150px}
.studio-timeline__head h2{margin:1rem 0 1.7rem;color:#fff;font-size:clamp(3rem,4.6vw,5.5rem);line-height:.96}
.studio-timeline__head .rich-text{color:rgba(255,255,255,.66);font-size:clamp(1rem,1.12vw,1.2rem);line-height:1.65}
.studio-timeline__head .rich-text p{font:inherit}
.studio-timeline__track{position:relative;padding-left:clamp(2.5rem,4vw,5rem)}
.studio-timeline__track::before,.studio-timeline__rail{content:"";position:absolute;top:.8rem;bottom:.8rem;left:0;width:1px}
.studio-timeline__track::before{background:rgba(255,255,255,.18)}
.studio-timeline__rail{background:var(--gold);transform:scaleY(var(--studio-progress,0));transform-origin:top;will-change:transform}
.studio-timeline__item{position:relative;display:grid;grid-template-columns:minmax(95px,.28fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);min-height:165px;padding:0 0 clamp(2.5rem,3.5vw,4rem)}
.studio-timeline__item::before{content:"";position:absolute;top:.68rem;left:calc(clamp(2.5rem,4vw,5rem) * -1 - 5px);width:11px;height:11px;border:1px solid var(--gold);border-radius:50%;background:var(--ink);transition:background-color .35s ease,transform .4s var(--ease)}
.studio-timeline__item.is-visible::before{background:var(--gold);transform:scale(1.2)}
.studio-timeline__item time{box-sizing:content-box;padding-bottom:.12em;color:var(--gold);font:400 clamp(1.6rem,2.3vw,2.7rem)/1.18 var(--serif);overflow:visible}
.studio-timeline__item h3{margin:0 0 .85rem;padding-bottom:.06em;color:#fff;font-size:clamp(1.7rem,2.5vw,3rem);line-height:1}
.studio-timeline__item p{max-width:620px;margin:0;color:rgba(255,255,255,.62);font-size:clamp(.98rem,1.05vw,1.12rem);line-height:1.6}

.studio-manifesto{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(620px,58vw,760px);overflow:hidden;background:var(--ink);color:#fff}
.studio-manifesto__media,.studio-manifesto__shade{position:absolute;inset:0}
.studio-manifesto__media{z-index:-2;overflow:hidden}
.studio-manifesto__media img{position:absolute;inset:-7%;display:block;width:114%;height:114%;max-width:none;object-fit:cover;filter:grayscale(.42)}
.studio-manifesto__shade{z-index:-1;background:linear-gradient(100deg,rgba(5,21,42,.94),rgba(5,21,42,.68) 54%,rgba(5,21,42,.38))}
.studio-manifesto__layout{display:grid;grid-template-columns:minmax(340px,1fr) minmax(320px,.8fr);gap:clamp(4rem,9vw,11rem);align-items:end;padding-top:clamp(4.5rem,7vw,7rem);padding-bottom:clamp(4.5rem,7vw,7rem)}
.studio-manifesto__copy h2{margin:1rem 0 2rem;color:#fff;font-size:clamp(3rem,4.8vw,5.7rem);line-height:.96}
.studio-manifesto__copy .rich-text{width:min(680px,100%);color:rgba(255,255,255,.7);font-size:clamp(1rem,1.13vw,1.2rem);line-height:1.65}
.studio-manifesto__copy .rich-text p{font:inherit}
.studio-manifesto blockquote{position:relative;margin:0;padding:clamp(2rem,4vw,4rem) 0 clamp(1rem,2vw,2rem);border-top:1px solid var(--gold);color:#fff;font:400 clamp(2rem,3.5vw,4.5rem)/1.03 var(--serif)}
.studio-manifesto blockquote::before{content:"“";display:block;margin-bottom:.25em;color:var(--gold);font-size:1.7em;line-height:.45}

.motion-enabled .studio-story__item:not(.is-visible) .studio-story__media{clip-path:inset(8% 0 8% 100%);opacity:.45;transform:translate3d(-35px,0,0)}
.motion-enabled .studio-story__item--reverse:not(.is-visible) .studio-story__media{clip-path:inset(8% 100% 8% 0);transform:translate3d(35px,0,0)}
.motion-enabled .studio-story__item.is-visible .studio-story__media{clip-path:inset(0);opacity:1;transform:perspective(1200px) rotateX(var(--studio-tilt-x)) rotateY(var(--studio-tilt-y));transition:clip-path 1.05s var(--ease),opacity .8s ease,transform .9s var(--ease)}

@media(max-width:900px){
  .studio-intro__layout,.studio-timeline__layout,.studio-manifesto__layout{grid-template-columns:1fr}
  .studio-story__item{grid-template-columns:1fr;min-height:0}
  .studio-story__media{width:min(690px,100%);aspect-ratio:5/4}
  .studio-story__item--reverse .studio-story__media,.studio-story__item--reverse .studio-story__copy{grid-column:1;grid-row:auto}
  .studio-story__item--reverse .studio-story__copy{grid-row:2}
  .studio-timeline__head{position:static}
  .studio-manifesto__layout{align-items:start}
}
@media(max-width:600px){
  .studio-hero{min-height:72svh}
  .studio-hero__copy{width:100%}
  .studio-hero h1{font-size:clamp(3.8rem,17vw,5.8rem);line-height:.91}
  .studio-page h1,.studio-page h2{padding-bottom:.2em}
  .studio-intro{padding:3.75rem 0}
  .studio-intro h2,.studio-story__copy h2,.studio-timeline__head h2,.studio-manifesto__copy h2{font-size:clamp(2.8rem,12vw,4rem);line-height:.94}
  .studio-story__item{gap:2rem;min-height:0;padding:3.25rem 0}
  .studio-story__media{aspect-ratio:4/5}
  .studio-story__number{font-size:8rem}
  .studio-timeline{padding:4rem 0}
  .studio-timeline__track{padding-left:2rem}
  .studio-timeline__item{grid-template-columns:1fr;gap:.75rem;min-height:0;padding-bottom:4rem}
  .studio-timeline__item::before{left:calc(-2rem - 5px)}
  .studio-manifesto{min-height:680px}
  .studio-manifesto__layout{gap:3rem;padding-block:4rem}
}
@media(prefers-reduced-motion:reduce){
  .studio-hero__line{animation:none}
  .studio-story__media,.studio-story__media img{transition:none!important;transform:none!important}
  .motion-enabled .studio-story__media{clip-path:none!important;opacity:1!important;transform:none!important}
}

/* Keep the font's ascenders and descenders inside every title box. */
.studio-page h1,.studio-page h2{padding-bottom:.24em}
.studio-page h3{padding-bottom:.2em}
@media(max-width:600px){.studio-page h1,.studio-page h2{padding-bottom:.26em}}