/* Inner pages keep readable type and content-led heights at every viewport.
   The homepage's accepted composition is intentionally scoped out. */
body:not([data-page="home"]){
  --body:clamp(1rem,1vw,1.125rem);
  --small:clamp(.8125rem,.875vw,.984375rem);
  --display:clamp(1.75rem,calc(1.25rem + 1.736111vw),3.515625rem);
  --inner-start:clamp(140px,min(23.875vw,32svh),360px);
  --inner-space:clamp(64px,8vw,144px);
  font-size:var(--body);
  line-height:1.85;
}
body:not([data-page="home"]) main :is(h1,h2,h3){overflow-wrap:break-word}
body:not([data-page="home"]) .lead{font-size:clamp(1.0625rem,1.25vw,1.40625rem);line-height:1.8}
body:not([data-page="home"]) .inner-hero{min-height:min(100vw,140svh)}
body:not([data-page="home"]) .approach-hero{
  padding-block:var(--inner-start) clamp(96px,18vw,260px);
}
body:not([data-page="home"]) .approach-introduction{
  width:min(100%,42rem);
  margin-top:clamp(40px,6.875vw,100px);
}
body:not([data-page="home"]) .approach-introduction p{line-height:1.85}
body:not([data-page="home"]) .services-hero{
  padding-block:var(--inner-start) clamp(96px,10vw,180px);
}
body:not([data-page="home"]) .services-heading{width:auto;max-width:max(32rem,45vw)}
body:not([data-page="home"]) .services-heading>p{
  width:auto;max-width:max(28rem,30vw);margin-top:clamp(24px,2.5vw,40px);
}
body:not([data-page="home"]) .about-hero{
  padding-block:var(--inner-start) clamp(96px,12vw,216px);
}
body:not([data-page="home"]) .about-heading>div{
  padding-top:clamp(40px,16.25vw,240px);
}
body:not([data-page="home"]) .contact-hero{padding-top:var(--inner-start)}
body:not([data-page="home"]) .contact-content{
  padding-block:clamp(64px,11.875vw,172px) clamp(96px,15vw,240px);
}
body:not([data-page="home"]) .contact-intro{max-width:min(100%,42rem)}
body:not([data-page="home"]) .contact-destination{padding-block:clamp(24px,3.125vw,48px)}
body:not([data-page="home"]) .contact-destination>p+p{max-width:40rem}
body:not([data-page="home"]) .conversation-notes{margin-top:clamp(40px,6vw,96px)}

/* Long-form sections retain their columns where those columns can be read. */
body:not([data-page="home"]) .service-detail{
  padding-block:var(--inner-space) clamp(96px,16vw,240px);
  row-gap:clamp(40px,8vw,120px);
}
body:not([data-page="home"]) .detail-copy>p{max-width:32rem}
body:not([data-page="home"]) .detail-copy .line-link{margin-top:clamp(32px,5vw,72px)}
body:not([data-page="home"]) .triptych{height:min(34.375vw,calc(100svh - 96px),720px)}
body:not([data-page="home"]) .triptych-track{height:100%}
body:not([data-page="home"]) .triptych-panel{height:100%}
body:not([data-page="home"]) .about-story{
  padding-block:var(--inner-space) clamp(96px,17vw,272px);
}
body:not([data-page="home"]) .about-story-image{width:100%;height:min(50vw,90svh,900px)}
body:not([data-page="home"]) .about-story-copy{padding-top:clamp(40px,10vw,144px)}
body:not([data-page="home"]) .outline{padding-bottom:clamp(96px,15vw,240px)}
body:not([data-page="home"]) .outline dl{max-width:64rem;margin-top:clamp(40px,6vw,96px)}
body:not([data-page="home"]) .outline dl>div{padding-block:clamp(24px,3.125vw,48px)}
body:not([data-page="home"]) .outline dd{max-width:60ch;overflow-wrap:break-word}
body:not([data-page="home"]) .values{padding-block:var(--inner-space) clamp(64px,12vw,192px)}
body:not([data-page="home"]) .values>.label-rail{top:var(--inner-space)}
body:not([data-page="home"]) .value-stage-image{
  width:min(30vw,calc((100svh - 96px)*.685714286));
  height:min(43.75vw,calc(100svh - 96px));
  left:50%;transform:translate(-50%,-50%);
}
body:not([data-page="home"]) .value-number{
  top:calc(50svh - min(21.875vw,calc((100svh - 96px)/2)));
}
body:not([data-page="home"]) .value-copy{padding-block:48px}

/* Tablet columns need more room than the original scaled desktop layout. */
@media(min-width:768px) and (max-width:1100px){
  body:not([data-page="home"]) .about-heading{display:block;max-width:42rem}
  body:not([data-page="home"]) .about-heading>div{padding-top:clamp(40px,6vw,72px)}
  body:not([data-page="home"]) .about-story{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);
    padding-inline:12.5vw 5vw;
  }
  body:not([data-page="home"]) .about-story-copy{padding-top:0}
  body:not([data-page="home"]) .about-story-copy .display{font-size:clamp(28px,3vw,34px)}
  body:not([data-page="home"]) .service-detail,
  body:not([data-page="home"]) .service-detail.reverse{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);
    padding-inline:12.5vw 5vw;
  }
  body:not([data-page="home"]) .detail-copy{padding-left:0}
  body:not([data-page="home"]) .triptych{width:100%}
  body:not([data-page="home"]) .detail-copy .display{font-size:clamp(28px,3vw,34px)}
  body:not([data-page="home"]) .contact-content{padding-inline:12.5vw}
}

/* A brand in the document flow cannot cover paragraphs as a narrow page scrolls.
   Keep the footer's return control fixed and usable independently of the brand. */
@media(max-width:1100px){
  body:not([data-page="home"]) .header{position:absolute}
  body:not([data-page="home"]) .header .wordmark{translate:none}
  body:not([data-page="home"]) .header .footer-top{position:fixed}
}
@media(max-width:1100px),(max-height:700px){
  body:not([data-page="home"]) .edge-details{display:none}
}

/* Viewport-timed sticky artwork is only used where an entire reading panel fits.
   Existing per-article images provide ordinary flow without changing its timing. */
@media(max-width:1100px),(max-height:700px),(prefers-reduced-motion:reduce){
  body:not([data-page="home"]) .values-layout{
    display:block;max-width:70rem;margin-inline:clamp(24px,6vw,72px) auto;
  }
  body:not([data-page="home"]) .values-visual{display:none}
  body:not([data-page="home"]) .values-list{display:block}
  body:not([data-page="home"]) .value,
  body:not([data-page="home"]) .value:last-child{
    display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    align-items:start;column-gap:clamp(32px,6vw,96px);row-gap:24px;
    min-height:0;padding:0 0 clamp(80px,12vw,176px);
  }
  body:not([data-page="home"]) .value:last-child{padding-bottom:0}
  body:not([data-page="home"]) .value-number{
    position:static;grid-column:1/-1;margin:0;
  }
  body:not([data-page="home"]) .value>.value-image{
    display:block;position:relative;grid-column:1;grid-row:2;top:auto;
    width:100%;height:auto;aspect-ratio:24/35;max-height:min(80svh,640px);
  }
  body:not([data-page="home"]) .value-copy{
    grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:flex-start;
    height:auto;min-height:0;gap:24px;margin:0;padding:0;
  }
  body:not([data-page="home"]) .value-copy .display{margin:0;font-size:clamp(28px,2.5vw,40px)}
  body:not([data-page="home"]) .value-copy .lead{margin-bottom:24px}
}

@media(max-width:767px){
  body:not([data-page="home"]) .about-heading>div{padding-top:clamp(40px,10vw,72px)}
  body:not([data-page="home"]) .triptych{height:min(99.502vw,80svh,680px)}
  body:not([data-page="home"]) .about-story-image{height:min(92.289vw,80svh,680px)}
  body:not([data-page="home"]) .service-detail>.label-rail{
    top:calc(var(--inner-space) + min(99.502vw,80svh,680px) + clamp(40px,8vw,120px));
    bottom:clamp(96px,16vw,240px);
  }
  body:not([data-page="home"]) .values-layout{margin-left:var(--copy-indent)}
  body:not([data-page="home"]) .inner-hero>.label-rail{top:clamp(100px,20vw,144px)}
  body:not([data-page="home"]) .contact-hero>.label-rail{top:clamp(100px,20vw,144px)}
}

@media(max-width:599px){
  body:not([data-page="home"]) .value,
  body:not([data-page="home"]) .value:last-child{display:block}
  body:not([data-page="home"]) .value-number{margin-bottom:24px}
  body:not([data-page="home"]) .value>.value-image{max-width:28rem}
  body:not([data-page="home"]) .value-copy{margin-top:32px}
}

/* Cap long lines and decorative spacing after the normal desktop composition. */
@media(min-width:1800px){
  body:not([data-page="home"]) .services-heading{max-width:52rem}
  body:not([data-page="home"]) .services-heading>p{max-width:40rem}
  body:not([data-page="home"]) .about-heading{
    grid-template-columns:minmax(0,585px) minmax(0,540px);gap:90px;
  }
  body:not([data-page="home"]) .about-heading>div{padding-top:144px}
  body:not([data-page="home"]) .about-story{
    grid-template-columns:minmax(0,450px) minmax(0,630px);gap:180px;
    justify-content:center;padding-inline:var(--gutter);
  }
  body:not([data-page="home"]) .service-detail{
    grid-template-columns:minmax(0,585px) minmax(0,720px);column-gap:180px;
    justify-content:center;padding-inline:var(--gutter);
  }
  body:not([data-page="home"]) .service-detail.reverse{grid-template-columns:minmax(0,720px) minmax(0,585px)}
  body:not([data-page="home"]) .triptych{width:100%}
  body:not([data-page="home"]) .outline dl>div{grid-template-columns:270px minmax(0,1fr)}
}