/* Contact R41 convergence.
   Page-local optical correction: Contact is a utility/destination page, so the
   brief should arrive quickly without sacrificing the documentary frame. */
body.page-contact #route{
  scroll-margin-top:calc(var(--global-nav-height,64px) + 14px);
}

@media (max-width:980px){
  body.page-contact .contact-hero{
    min-height:0!important;
    height:auto!important;
    padding:clamp(68px,9vw,88px) 0 22px!important;
  }
  body.page-contact .contact-hero .hero-content{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:clamp(14px,3vw,22px)!important;
    align-items:start!important;
    min-height:0!important;
    transform:none!important;
  }
  body.page-contact .contact-hero-copy{
    max-width:640px;
  }
  body.page-contact .contact-hero .hero-title{
    max-width:9ch!important;
    font-size:clamp(2.65rem,8vw,4rem)!important;
    line-height:.94!important;
  }
  body.page-contact .contact-hero .hero-copy{
    max-width:31ch!important;
    margin-top:10px!important;
  }
  /* The page itself is already the action. Keep one route, not a duplicate CTA. */
  body.page-contact .contact-hero .hero-actions{
    display:none!important;
  }
  body.page-contact .hero-media-banner{
    display:grid!important;
    grid-template-rows:auto auto;
    align-content:start!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
  }
  body.page-contact .hero-media-banner>.hero-photo-frame{
    width:100%;
    height:clamp(150px,32vw,220px)!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
  }
  body.page-contact .hero-media-banner>.hero-photo-frame img{
    object-position:center 52%!important;
  }
  body.page-contact .hero-media-banner>figcaption.image-caption{
    margin:0!important;
    padding-top:7px!important;
  }
  body.page-contact .simple-contact-section{
    padding:clamp(24px,4vw,38px) 0 62px!important;
  }
  body.page-contact .simple-contact-intro{
    grid-template-columns:1fr!important;
    gap:7px!important;
    margin-bottom:18px!important;
  }
  body.page-contact .simple-contact-intro .section-kicker{
    margin-bottom:3px!important;
  }
  body.page-contact .simple-contact-intro .section-title{
    max-width:12ch!important;
    margin:0!important;
    font-size:clamp(1.9rem,6.4vw,2.9rem)!important;
    line-height:.98!important;
    letter-spacing:-.04em!important;
  }
  body.page-contact .simple-contact-intro .section-copy{
    justify-self:start!important;
    max-width:32ch!important;
    margin:0!important;
    font-size:.92rem!important;
  }
  body.page-contact .simple-brief-grid{
    grid-template-columns:1fr!important;
    gap:32px!important;
    padding-top:16px!important;
  }
}

/* Tablet gets the same compact two-column logic as desktop instead of a
   near-full-screen stacked preamble. */
@media (min-width:700px) and (max-width:980px){
  body.page-contact .contact-hero{
    padding:78px 0 30px!important;
  }
  body.page-contact .contact-hero .hero-content{
    grid-template-columns:minmax(0,1fr) minmax(280px,.92fr)!important;
    gap:clamp(26px,4vw,44px)!important;
    align-items:center!important;
  }
  body.page-contact .contact-hero-copy{
    max-width:none!important;
  }
  body.page-contact .contact-hero .hero-title{
    max-width:8.6ch!important;
    font-size:clamp(3rem,6.2vw,3.75rem)!important;
  }
  body.page-contact .hero-media-banner>.hero-photo-frame{
    height:clamp(210px,28vw,250px)!important;
  }
  body.page-contact .simple-contact-section{
    padding-top:30px!important;
  }
  body.page-contact .simple-contact-intro{
    grid-template-columns:minmax(0,1.15fr) minmax(220px,.85fr)!important;
    align-items:end!important;
    gap:28px!important;
  }
  body.page-contact .simple-contact-intro .section-title{
    font-size:clamp(2.3rem,5vw,3.15rem)!important;
  }
  body.page-contact .simple-contact-intro .section-copy{
    justify-self:end!important;
  }
}

@media (max-width:420px){
  body.page-contact .contact-hero{
    padding:62px 0 16px!important;
  }
  body.page-contact .contact-hero .hero-content{
    gap:12px!important;
  }
  body.page-contact .contact-hero .hero-title{
    font-size:clamp(2.5rem,11vw,3rem)!important;
  }
  body.page-contact .contact-hero .hero-copy{
    font-size:.98rem!important;
  }
  body.page-contact .hero-media-banner>.hero-photo-frame{
    height:128px!important;
  }
  body.page-contact .hero-media-banner>figcaption.image-caption span{
    display:none!important;
  }
  body.page-contact .hero-media-banner>figcaption.image-caption{
    min-height:0!important;
    padding-top:6px!important;
  }
  body.page-contact .simple-contact-section{
    padding:22px 0 56px!important;
  }
  body.page-contact .simple-contact-intro{
    gap:5px!important;
    margin-bottom:14px!important;
  }
  body.page-contact .simple-contact-intro .section-title{
    max-width:none!important;
    font-size:clamp(1.85rem,8vw,2.25rem)!important;
  }
  body.page-contact .simple-contact-intro .section-copy{
    font-size:.88rem!important;
  }
  body.page-contact .simple-brief-grid{
    padding-top:12px!important;
  }
}

body.page-contact .simple-brief-form .form-field label span{
  color:rgba(17,22,17,.62)!important;
}
body.page-contact .simple-brief-form :is(input,textarea)::placeholder{
  color:rgba(17,22,17,.55)!important;
}

@media (max-width:820px){
  body.page-contact .simple-brief-form textarea{
    min-height:168px!important;
  }
}

@media (max-width:420px){
  body.page-contact .simple-brief-form textarea{
    min-height:150px!important;
  }
}