/* Natural document scrolling: every section stays readable at the visitor's pace. */
html:has(body.gr-audience),html:has(body.gr-service){
  --gr-chapter-header:76px;
  scroll-snap-type:none;
  scroll-padding-top:var(--gr-chapter-header,76px);
}
body.gr-audience,body.gr-service{
  min-height:100vh;
}
.gr-audience .head{
  position:sticky;top:0;z-index:20;
  border-bottom-color:rgba(255,255,255,.18);
}
.gr-audience main >.hero,
.gr-audience .gr-story-row,
.gr-audience main >.gr-packages,
.gr-service main >section{
  box-sizing:border-box;
  min-height:0;
  scroll-snap-align:none;
  scroll-snap-stop:normal;
  scroll-margin-top:0;
}
.gr-audience main >.hero,
.gr-audience main >.gr-packages,
.gr-service main >section{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.gr-audience main >.hero{padding-block:clamp(26px,5svh,85px)}
.gr-audience main >.hero>.wrap{width:min(1260px,calc(100% - 80px))}
.gr-audience .hero-layout{align-items:center}
.gr-audience .hero-image{
  height:clamp(320px,60svh,720px);
  max-height:none;
  aspect-ratio:auto;
}
.gr-audience .cinematic-gallery-controls{display:none!important}
.gr-audience .gr-story{padding:0!important}
.gr-audience .gr-story .wrap{gap:0}
.gr-audience .gr-story-row{
  padding-block:clamp(40px,7svh,110px);
}
.gr-audience .gr-story-visual img,
.gr-audience .gr-story-visual video{
  height:clamp(320px,62svh,760px);
}
.gr-audience main>.gr-packages{
  padding-block:clamp(44px,7svh,100px);
}
.gr-service main>section{padding-block:clamp(42px,7svh,110px)}
.gr-service main>section>.wrap{width:min(var(--max,1180px),calc(100% - 2*var(--pad,40px)))}
.gr-service main>.compact-offer{padding-block:clamp(42px,7svh,110px)}
/* Footer is a real destination too: allow the visitor to reach the bottom
   without the last content chapter pulling the view back up. */
.gr-audience footer,.gr-service footer{scroll-snap-align:none}
@media(max-width:850px){
  html:has(body.gr-audience),html:has(body.gr-service){--gr-chapter-header:70px}
  .gr-audience .hero-image{height:clamp(290px,47svh,560px)}
  .gr-audience .gr-story-visual img,
  .gr-audience .gr-story-visual video{height:clamp(280px,48svh,510px)}
}
@media(max-width:650px){
  html:has(body.gr-audience),html:has(body.gr-service){--gr-chapter-header:65px}
  .gr-audience .head-row{min-height:65px;padding-block:12px}
  .gr-audience .hero-layout{gap:18px}
  .gr-audience main>.hero>.wrap{width:calc(100% - 40px)}
  .gr-audience .hero-image{height:clamp(245px,39svh,390px);max-height:none;aspect-ratio:auto}
  .gr-audience .gr-story-row{padding-block:clamp(26px,5svh,60px);gap:16px}
  .gr-audience .gr-story-visual img,
  .gr-audience .gr-story-visual video{height:clamp(240px,42svh,420px)}
  .gr-audience .gr-story-copy h2{font-size:clamp(1.6rem,6vw,2.2rem)}
  .gr-audience main>.gr-packages{padding-block:40px}
  .gr-service main>section{padding-block:36px}
}
/* Respect reduced-motion preferences: remove snapping completely. */
@media(prefers-reduced-motion:reduce){
  html:has(body.gr-audience),html:has(body.gr-service){scroll-behavior:auto!important;scroll-snap-type:none!important}
}