/* Shared image sizing and responsive layouts. Loaded after page styles. */
img{height:auto}
:where(h1,h2,h3,p,a,li,summary,figcaption){overflow-wrap:anywhere}
:where(.hero-grid,.split-hero,.feature-split,.intro-grid,.sector-grid,.value-grid,.steps,.faq-grid,.screen-demo,.project-grid,.contact-layout,.footer-grid,.form-row)>*{min-width:0}

/* Keep the full photograph at its original proportions. */
.hero-visual>img,
.split-hero .hero-photo,
.feature-split>img,
.sector-card .image-box img,
.project-media img{
  width:100%;
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
}
.hero-visual,
.split-hero>figure{
  width:100%;
  max-width:600px;
  justify-self:end;
}
.feature-split>img{max-width:600px}
.feature-split.reverse>img{justify-self:end}
.hero-visual>img,
.split-hero .hero-photo{border-radius:3px 3px 42px 3px}
.hero-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);
  gap:clamp(32px,4vw,60px);
  align-items:start;
}
.hero-copy{padding:0}
.split-hero{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(32px,4vw,56px);
  align-items:start;
}
.page-hero.image-page-hero{padding:32px 0 56px}
.image-page-hero .breadcrumb{margin-bottom:24px}
.image-page-hero>.wrap>.eyebrow{margin-bottom:18px}
.feature-split{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:clamp(32px,5vw,80px)}
.feature-split.reverse{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)}
.screen-demo{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,6vw,100px)}
.contact-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.sector-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-card{width:100%;max-width:640px;justify-self:center}
.sector-card{width:100%;max-width:600px;justify-self:center}
.photo-caption{flex-wrap:wrap;gap:6px 15px;line-height:1.5}
.photo-caption span{min-width:0}
.image-stamp{width:116px;height:116px;left:12px;bottom:48px}
.image-stamp strong{font-size:25px}
.image-stamp span{font-size:8px}
.screen-frame{max-width:min(370px,calc(100% - 24px))}
.button,.text-link{max-width:100%}
.button{min-height:44px}
.chip{min-height:44px}
.screen-buttons button{width:44px;height:44px}
.field input,.field select,.field textarea{min-width:0;max-width:100%}
.brief-form{min-width:0}
.dialog-top h2{min-width:0}
.dialog-top button{flex-shrink:0;min-height:44px}
.dialog-image{height:auto;max-height:72vh;max-height:72dvh;object-fit:contain}

/* Give tablet layouts enough room for both text and images. */
@media(max-width:1100px){
  .steps,.value-grid{gap:28px}
  .intro-grid,.faq-grid{gap:40px}
  .section-heading{gap:32px}
  .hero-copy h1{font-size:clamp(46px,5.6vw,62px)}
}
@media(max-width:1000px){
  .main-nav{max-height:calc(100vh - 120px);max-height:calc(100dvh - 120px)}
  .menu-toggle{min-width:82px;min-height:44px}
}
@media(max-width:960px){
  .hero-grid,
  .page-hero .split-hero,
  .feature-split,
  .feature-split.reverse,
  .screen-demo,
  .contact-layout,
  .intro-grid,
  .faq-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .hero-copy{max-width:700px}
  .hero-copy h1{font-size:clamp(42px,7.5vw,64px)}
  .page-hero .split-hero h1{font-size:clamp(40px,6.5vw,60px)}
  .hero-visual,
  .page-hero .split-hero>figure,
  .feature-split>img,
  .feature-split.reverse>img{justify-self:center}
  .feature-split.reverse>img{order:0}
  .screen-frame{max-width:min(340px,calc(100% - 24px));box-shadow:12px 14px 0 #d9dfd3}
  .screen-demo>div:first-child{max-width:600px}
  .screen-slide h3{font-size:44px}
  .sector-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
  .section-heading{display:block}
  .section-heading>p{max-width:600px;margin-top:22px}
  .brief-form{width:100%;max-width:720px}
  .field input,.field select,.field textarea{font-size:16px}
  .contact-layout h1{font-size:clamp(40px,6vw,60px)}
  .contact-aside{margin-top:25px}
  .cta-inner{flex-wrap:wrap}
}
@media(max-width:760px){
  .home-hero{padding-top:25px}
  .page-hero.image-page-hero{padding:25px 0 44px}
  .image-page-hero .breadcrumb{margin-bottom:18px}
  .hero-copy h1{font-size:clamp(38px,8.5vw,60px)}
  .page-hero .split-hero h1,.wide-title h1,.contact-layout h1{font-size:clamp(36px,7.5vw,52px)}
  .intro-grid h2{font-size:clamp(32px,7vw,38px)}
  .statement{font-size:clamp(34px,7.5vw,52px)}
  .steps,.value-grid{grid-template-columns:minmax(0,1fr)}
  .project-grid{grid-template-columns:minmax(0,1fr)}
  .photo-caption{font-size:10px}
  .image-stamp{width:92px;height:92px;left:10px;bottom:46px;border-width:5px}
  .image-stamp strong{font-size:20px;margin:5px 0}
  .image-stamp span{font-size:7px}
  .button-row{gap:16px}
  .text-link{min-height:44px;align-items:center}
  .brief-form{padding:24px}
}
@media(max-width:700px){
  .sector-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:480px){
  .demo-bar .wrap{flex-wrap:wrap;gap:4px 12px}
  .demo-bar .wrap span:first-child{max-width:none}
  .header-inner{gap:12px;min-height:74px}
  .main-nav{padding:20px}
  .main-nav.open{grid-template-columns:minmax(0,1fr);gap:4px}
  .main-nav>a{white-space:normal;min-height:44px}
  .main-nav .nav-cta{margin-top:8px}
  .screen-slide{padding:28px 20px}
  .screen-slide h3{font-size:clamp(30px,9vw,40px);margin-top:24px}
  .brief-form{padding:20px}
  .brief-result{padding:20px}
  .brief-form h2{font-size:28px}
  .footer nav{gap:12px 20px}
  .footer nav a{min-height:44px;display:flex;align-items:center}
}