
/* V3.4.6 — Smart Render / adaptive visual density
   Goal: preserve the same institutional density across laptops,
   desktop monitors, ultrawide displays and large 4K screens. */

:root{
  --sr-section-top:clamp(44px,4.6vmin,74px);
  --sr-section-bottom:clamp(52px,5.2vmin,86px);
  --sr-section-indent:clamp(28px,3.5vmin,58px);
  --sr-title-gap:clamp(28px,2.8vmin,42px);
  --sr-grid-gap:clamp(32px,3.8vmin,52px);
  --sr-page-top:clamp(66px,6vmin,90px);
  --sr-page-bottom:clamp(68px,6.5vmin,96px);
}

/* Global section rhythm */
.section-body{
  padding:
    var(--sr-section-top)
    0
    var(--sr-section-bottom)
    var(--sr-section-indent) !important;
  container-type:inline-size;
}
.section-rail{
  padding-top:clamp(24px,2.4vmin,34px) !important;
  padding-bottom:clamp(24px,2.4vmin,34px) !important;
}
.section-title{
  margin-bottom:var(--sr-title-gap) !important;
}
.lead{
  margin-bottom:clamp(20px,2vmin,28px) !important;
}
.copy p{
  margin-bottom:clamp(16px,1.7vmin,22px) !important;
}
.hero-actions{
  margin-top:clamp(28px,3.4vmin,44px) !important;
}

/* Hero remains premium, but no longer scales into excessive empty space */
.hero{
  min-height:clamp(600px,86vh,860px) !important;
}
.hero-main{
  min-height:0 !important;
  padding:
    clamp(68px,8vmin,110px)
    clamp(28px,4vmin,58px)
    clamp(34px,4vmin,52px)
    0 !important;
}
.hero-side{
  padding:
    clamp(68px,8vmin,110px)
    0
    clamp(34px,4vmin,52px)
    clamp(24px,2.8vmin,44px) !important;
}
.wordmark{
  margin-top:clamp(22px,2.5vmin,30px) !important;
  margin-bottom:clamp(20px,2.4vmin,28px) !important;
}
.capabilities{
  margin-top:clamp(24px,2.8vmin,34px) !important;
}

/* Grids follow content density */
.meta-grid{
  margin-top:clamp(34px,3.6vmin,48px) !important;
}
.meta-cell{
  min-height:84px !important;
  height:auto !important;
  padding:12px 14px !important;
}
.meta-cell strong{
  margin-top:clamp(14px,1.5vmin,20px) !important;
}
.sectors{
  margin-top:clamp(34px,3.8vmin,46px) !important;
}
.sector{
  height:clamp(82px,7.6vmin,96px) !important;
  min-height:82px !important;
  padding:10px 14px !important;
}
.disclosure{
  margin-top:clamp(20px,2.4vmin,28px) !important;
}

/* Governance and supporting UI */
.status-row{
  padding:clamp(13px,1.4vmin,17px) clamp(16px,1.8vmin,20px) !important;
}
.dispatch-card{
  padding-top:clamp(20px,2.2vmin,26px) !important;
  padding-bottom:clamp(24px,2.8vmin,34px) !important;
}
.contact-grid{
  gap:clamp(34px,4.8vmin,66px) !important;
}

/* Standalone pages */
.page-hero{
  padding:
    var(--sr-page-top)
    0
    clamp(48px,4.8vmin,70px) !important;
}
.page-hero h1{
  margin-top:clamp(18px,2vmin,24px) !important;
  margin-bottom:clamp(20px,2.4vmin,28px) !important;
}
.page-body{
  padding:
    clamp(48px,4.8vmin,68px)
    0
    var(--sr-page-bottom) !important;
}
.prose h2{
  margin-top:clamp(38px,4vmin,54px) !important;
  margin-bottom:clamp(14px,1.6vmin,17px) !important;
}

/* Footer density */
.footer{
  padding-top:clamp(28px,3vmin,38px) !important;
  padding-bottom:clamp(22px,2.4vmin,28px) !important;
}
.footer-grid{
  padding-bottom:clamp(24px,2.8vmin,34px) !important;
}

/* Wide / short displays: compress vertical rhythm, never horizontal structure */
@media (min-width:1440px) and (min-aspect-ratio:16/9){
  :root{
    --sr-section-top:clamp(38px,4vmin,62px);
    --sr-section-bottom:clamp(44px,4.4vmin,70px);
    --sr-title-gap:clamp(24px,2.3vmin,34px);
    --sr-page-top:clamp(58px,5vmin,76px);
    --sr-page-bottom:clamp(58px,5.4vmin,82px);
  }
  .hero{
    min-height:clamp(560px,78vh,760px) !important;
  }
  .hero-main,
  .hero-side{
    padding-top:clamp(58px,6.8vmin,88px) !important;
    padding-bottom:clamp(30px,3.5vmin,44px) !important;
  }
  .section-title{
    font-size:clamp(44px,5.1vw,86px) !important;
  }
  .lead{
    font-size:clamp(20px,1.8vw,30px) !important;
  }
}

/* Extra-wide / 4K desktop: hold density instead of scaling with screen width */
@media (min-width:2200px){
  :root{
    --sr-section-top:54px;
    --sr-section-bottom:62px;
    --sr-section-indent:52px;
    --sr-title-gap:30px;
    --sr-page-top:68px;
    --sr-page-bottom:72px;
  }
  .hero{
    min-height:680px !important;
  }
  .hero-main,
  .hero-side{
    padding-top:78px !important;
    padding-bottom:40px !important;
  }
  .section-title{
    font-size:82px !important;
  }
  .lead{
    font-size:29px !important;
  }
  .sector{
    height:90px !important;
  }
}

/* Component-level intelligence */
@container (max-width:760px){
  .meta-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@container (max-width:540px){
  .meta-grid{
    grid-template-columns:1fr !important;
  }
}

/* Keep existing tablet/mobile behavior intentionally roomy and readable */
@media (max-width:1020px){
  :root{
    --sr-section-top:54px;
    --sr-section-bottom:76px;
    --sr-section-indent:30px;
  }
  .hero{
    min-height:auto !important;
  }
}

@media (max-width:760px){
  :root{
    --sr-section-top:50px;
    --sr-section-bottom:72px;
    --sr-section-indent:0px;
    --sr-title-gap:28px;
    --sr-page-top:68px;
    --sr-page-bottom:76px;
  }
  .section-body{
    padding-left:0 !important;
  }
  .sector{
    height:82px !important;
  }
}

/* Fluid page-fill layout: Space 1 (outer gutter) and Space 2 (content
   indent) shrink before content. Space A (rail) remains fixed. */
.topbar-inner.shell{
  width:100%;
  max-width:none;
  position:relative;
}
.topbar-inner .brand{
  justify-self:start;
}
.topbar-inner .nav{
  position:absolute;
  right:max(var(--gutter), calc((100% - var(--max))/2 + var(--gutter)));
}
.section.shell{
  width:100%;
  max-width:none;
  grid-template-columns:210px minmax(0,1fr);
}
.section-body{
  min-width:0;
  padding-left:clamp(20px,2.6vw,52px) !important;
}
.section-title,
.contact-grid,
.contact-grid > *{
  min-width:0;
  max-width:100%;
}

@media (min-width:1021px){
  .contact-grid{
    grid-template-columns:minmax(240px,.72fr) minmax(360px,1.28fr);
    gap:clamp(24px,3vw,52px) !important;
  }
}

@media (max-width:1020px){
  .section.shell{
    grid-template-columns:118px minmax(0,1fr);
  }
  .section-body{
    padding-left:clamp(20px,3vw,30px) !important;
  }
}

@media (max-width:760px){
  .section.shell{display:block}
  .section-body{padding-left:0 !important}
  .page-hero h1{font-size:clamp(40px,14vw,56px)}
}
