/* September refinements: faster hero, cleaner facilities, simpler catalogue. */

.hero-story {
  z-index:0;
  transform:scale(1.045);
  transition: opacity 2.15s cubic-bezier(.25,.46,.2,1), filter 2.15s ease !important;
}
.hero-story.is-active { z-index:2; animation-duration:6.1s !important; animation-timing-function:cubic-bezier(.18,.52,.22,1) !important; }
.hero-story.is-active.is-leaving {
  z-index:1;
  opacity:0;
  transition-duration:2.45s !important;
  animation-play-state:running !important;
}
.hero-stories .hero-grade { transition:filter .9s ease,opacity .9s ease; }
.hero-stories.is-scene-blending .hero-grade { animation:hero-grade-blend 2.35s cubic-bezier(.25,.46,.2,1) both; }
.hero-story:nth-child(1).is-active { animation-name:hero-camera-right !important; }
.hero-story:nth-child(2).is-active { animation-name:hero-camera-left !important; }
.hero-story:nth-child(3).is-active { animation-name:hero-camera-rise !important; }
.hero-story:nth-child(4).is-active { animation-name:hero-camera-right !important; }
.hero-story:nth-child(5).is-active { animation-name:hero-camera-close !important; }
.hero-stories .hero-summary { transition:opacity .28s ease,transform .34s ease; }
.hero-stories .hero-summary.is-changing { opacity:0; transform:translateY(5px); }
.hero-stories .hero-headline-parallax { top:56%; }
.hero-stories .hero-headline-text { font-size:clamp(3.05rem,4.45vw,4.7rem); }
.hero-story::after {
  content:"";
  position:absolute;
  inset:-12% -18%;
  opacity:0;
  background:linear-gradient(108deg,transparent 34%,rgba(211,235,227,.12) 49%,transparent 64%);
  transform:translateX(-25%);
  pointer-events:none;
}
.hero-story.is-active::after { animation:hero-scene-sheen 6.1s cubic-bezier(.2,.6,.2,1) both; }
@keyframes hero-camera-right {
  from { transform:scale(1.045) translate3d(-.6%,0,0); }
  to { transform:scale(1.155) translate3d(1.05%,-.55%,0); }
}
@keyframes hero-camera-left {
  from { transform:scale(1.055) translate3d(.7%,.15%,0); }
  to { transform:scale(1.16) translate3d(-1.1%,-.55%,0); }
}
@keyframes hero-camera-rise {
  from { transform:scale(1.045) translate3d(0,.65%,0); }
  to { transform:scale(1.155) translate3d(-.45%,-1%,0); }
}
@keyframes hero-camera-close {
  from { transform:scale(1.04) translate3d(.35%,.2%,0); }
  to { transform:scale(1.17) translate3d(-.65%,-.45%,0); }
}
@keyframes hero-scene-sheen {
  0%,15% { opacity:0; transform:translateX(-28%); }
  36% { opacity:.55; }
  70%,100% { opacity:0; transform:translateX(28%); }
}
@keyframes hero-grade-blend {
  0%,100% { opacity:1; filter:saturate(1) brightness(1); }
  42% { opacity:.94; filter:saturate(.93) brightness(1.035); }
}

/* The guide now follows the clear top-navigation composition in the reference. */
.service-guide { display:block; min-height:0; border-radius:12px; }
.service-guide-nav {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-right:0;
  border-bottom:1px solid rgba(170,224,215,.14);
}
.service-guide-nav li { border-right:1px solid rgba(170,224,215,.1); border-bottom:0; }
.service-guide-nav li:last-child { border-right:0; }
.service-guide-nav li::before { top:auto; right:0; bottom:0; width:auto; height:2px; transform:scaleX(0); }
.service-guide-nav li.is-active::before { transform:scaleX(1); }
.service-guide-nav button { grid-template-columns:1fr; min-height:142px; padding:25px 28px; }
.service-guide-nav button:hover,
.service-guide-nav button:focus-visible,
.service-guide-nav li.is-active button { padding-left:28px; background:linear-gradient(180deg,color-mix(in srgb,var(--guide-accent) 8%,transparent),transparent 82%); }
.service-guide-nav button > span { grid-row:auto; }
.service-guide-nav strong { margin-top:7px; font-size:clamp(1rem,1.65vw,1.45rem); }
.service-guide-stage { min-height:720px; transform:none !important; }
.service-guide-stage:hover { transform:none !important; }
.service-guide-copy { max-width:58%; }

/* Catalogue information replaces the previous enlarged/rotating valve view. */
.valve-explorer { border-radius:20px; }
.valve-stage { min-height:clamp(300px,30vw,430px); background:linear-gradient(180deg,#071721,#06131d); }
.valve-stage::after { content:"SELECT A FAMILY TO VIEW CATALOGUE DETAILS"; }
.valve-stage-lineup {
  transform:scale(.98) !important;
  filter:saturate(.92) contrast(1.02) brightness(1.01);
  transition:filter .35s ease;
}
.valve-stage-grid,.valve-stage-scan,.valve-detail-view { display:none !important; }
.valve-family-tab:hover,.valve-family-tab:focus-visible { transform:none; }
.valve-spec-panel { grid-template-columns:minmax(230px,1.1fr) minmax(390px,1.55fr) auto; }

/* Smaller, continuous reveals feel less like separate presentation slides. */
.reveal { transform:translateY(10px); transition-duration:.48s; }
main > section { scroll-margin-top:76px; }

@media (max-width:900px) {
  .service-guide-nav { display:flex; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .service-guide-nav li { flex:0 0 72%; scroll-snap-align:center; }
  .service-guide-nav button { min-height:116px; padding:20px; }
  .service-guide-nav button:hover,.service-guide-nav button:focus-visible,.service-guide-nav li.is-active button { padding-left:20px; }
  .service-guide-stage { min-height:890px; }
  .service-guide-copy { max-width:none; }
  .valve-spec-panel { grid-template-columns:1fr; }
}

@media (max-width:700px) {
  .hero-stories .hero-headline-parallax { top:auto; bottom:94px; }
  .hero-stories .hero-headline-text { font-size:clamp(2.45rem,10.8vw,3.45rem); }
}

@media (prefers-reduced-motion:reduce) {
  .hero-story.is-active::after { animation:none !important; }
}