/* A single editorial type scale: quiet context, clear statements, one accent. */
:root{--statement-size:clamp(42px,5.65vw,68px);--statement-tracking:-.035em}
.intro .statement-title,.approach .statement-title,.principle .statement-title,.contact .statement-title{font-family:inherit;font-size:var(--statement-size);font-weight:600;letter-spacing:var(--statement-tracking);line-height:1.1;max-width:1080px;margin:0 auto;font-optical-sizing:auto}
.statement-title .title-line{display:block;color:var(--ink);background:none}
.statement-title .title-line+ .title-line{margin-top:.035em;color:var(--blue)}
.contact .statement-title .title-line:first-child{color:var(--white)}
.intro,.approach{padding-top:112px;padding-bottom:112px}
.intro .lede,.approach .lede,.principle .lede,.contact .lede{font-size:20px;line-height:1.55;margin-top:32px;max-width:720px;letter-spacing:-.012em}
.eyebrow{font-weight:600;letter-spacing:.13em}
.hero #hero-title{font-size:clamp(64px,8.1vw,106px);font-weight:650;letter-spacing:-.04em;line-height:1.08;max-width:850px}
.hero #hero-title .hero-small{display:block;font-size:.60em;font-weight:500;letter-spacing:-.045em;line-height:1.15;color:var(--white);background:none;-webkit-text-fill-color:currentColor;margin-bottom:8px}
.hero #hero-title .hero-title-art{display:inline-block;font-size:1em;white-space:nowrap}
.hero #hero-title .hero-title-copy{font-size:inherit;line-height:inherit}
.hero-art,.hero-content{transform:none;opacity:1}
.hero-content>*{animation:none;translate:none}
.research-photos{clip-path:none}
.research-photos img,.research-photos figure:hover img,.research-photos .photo-tall img{transform:none}
.nav-inner::before,.lens-navigation::before{animation:none;opacity:.45}
.steps .method-card:hover{translate:none}
@media(max-width:700px){
  :root{--statement-size:clamp(30px,7.9vw,52px);--statement-tracking:-.025em}
  .intro,.approach{padding-top:84px;padding-bottom:84px}
  .intro .lede,.approach .lede,.principle .lede,.contact .lede{font-size:18px;line-height:1.55;margin-top:26px}
  .hero #hero-title{font-size:clamp(38px,11.8vw,78px);letter-spacing:-.035em;line-height:1.1}
  .hero #hero-title .hero-small{font-size:.63em;margin-bottom:10px}
  .hero-slogan{font-size:20px;max-width:370px;margin-top:24px}
}
@media(forced-colors:active){.statement-title .title-line,.statement-title .title-line+ .title-line,.contact .statement-title .title-line:first-child{color:CanvasText}}

/* Keep real, sharp lettering at rest; render the fluid canvas only in response
   to the pointer over this single phrase. No fade through an empty heading. */
.hero-title-art.is-fluid>.hero-title-copy{opacity:1}
.hero-title-art.is-fluid>.fluid-image{opacity:0;transition:none}
.hero-title-art.is-fluid.is-fluid-active>.hero-title-copy{opacity:0}
.hero-title-art.is-fluid.is-fluid-active>.fluid-image{opacity:1}