/* Preserve the panoramic framing and use the shared hero animation. */
/* The transparent menu also needs local contrast against the bright sky. */
@media (min-width:992px) {
  .water-detail:has(#home.hess-hero) #site-header .custom-navbar:not(.top-nav-collapse) .nav li a {
    text-shadow:0 1px 2px rgba(0,0,0,.95), 0 0 6px rgba(0,0,0,.85);
  }
}
#home.hess-hero #carousel-1 .item img {
  object-fit:cover; object-position:50% 50%; transform-origin:50% 50%; filter:none; opacity:1;
}
#home.hess-hero #carousel-1 .item::after { content:none; display:none; }
#home.hess-hero h1,
#home.hess-hero .waters-hero-lead,
#home.hess-hero .waters-eyebrow { text-shadow:0 2px 5px rgba(0,0,0,.75); }
@media (min-width:992px) {
  #home.hess-hero #carousel-1,
  #home.hess-hero #carousel-1 .carousel-inner,
  #home.hess-hero #carousel-1 .item,
  #home.hess-hero #carousel-1 picture { height:clamp(620px,48vw,800px); min-height:0; }
}
@media (max-width:991px) {
  #home.hess-hero { overflow:visible; background:var(--waters-paper); }
  #home.hess-hero #carousel-1 { height:auto; min-height:0; }
  #home.hess-hero #carousel-1 .carousel-inner { height:auto; min-height:0; aspect-ratio:480/231; }
  #home.hess-hero #carousel-1 .item,
  #home.hess-hero #carousel-1 picture { height:100%; min-height:0; }
  #home.hess-hero .waters-hero-overlay { display:block; position:static; background:var(--waters-paper); }
  #home.hess-hero .waters-hero-copy { padding:32px 0 28px; max-width:none; }
  #home.hess-hero .waters-hero-copy .waters-eyebrow { color:#826514; }
  #home.hess-hero h1 { color:var(--waters-forest); }
  #home.hess-hero h1 span { color:#826514; }
  #home.hess-hero .waters-hero-lead { color:var(--waters-muted); }
  #home.hess-hero h1,
  #home.hess-hero .waters-hero-lead,
  #home.hess-hero .waters-eyebrow { text-shadow:none; }
  #home.hess-hero .waters-hero-actions { position:static; }
  #home.hess-hero .waters-button-ghost { border-color:var(--waters-forest); color:var(--waters-forest); }
  #home.hess-hero .waters-button-ghost:hover,
  #home.hess-hero .waters-button-ghost:focus { background:var(--waters-forest); color:#fff; }
  #home.hess-hero #carousel-1 .hero-navigation { position:absolute; inset:0 0 auto; height:auto; aspect-ratio:480/231; background:transparent; pointer-events:none; }
  #home.hess-hero .hero-navigation button { pointer-events:auto; }
  #home.hess-hero .hero-discover { display:none; }
}

/* Local contrast follows the letters; the photograph keeps its original light. */
@media (min-width:992px) {
  .water-detail #home.hess-hero .waters-hero-copy h1 {
    text-shadow:0 1px 2px rgba(0,0,0,.95), 0 0 5px rgba(0,0,0,.8), 0 3px 14px rgba(0,0,0,.7);
  }
  .water-detail #home.hess-hero .waters-hero-copy h1 span,
  .water-detail #home.hess-hero .waters-hero-copy .water-hero-tagline {
    text-shadow:0 1px 2px #000, 0 0 4px rgba(0,0,0,.95), 0 3px 12px rgba(0,0,0,.85);
  }
  .water-detail #home.hess-hero .waters-hero-copy .waters-eyebrow,
  .water-detail #home.hess-hero .waters-hero-copy .waters-hero-lead {
    text-shadow:0 1px 2px #000, 0 0 4px #000, 0 0 10px rgba(0,0,0,.95), 0 2px 16px rgba(0,0,0,.7);
  }
  .water-detail #home.hess-hero .waters-hero-copy .waters-hero-lead { color:#fff; }
  .water-detail #home.hess-hero .waters-hero-actions .waters-button-ghost,
  .water-detail #home.hess-hero .hero-discover {
    text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.9);
  }
}

.water-detail #home.hess-hero .waters-hero-copy h1 { text-wrap:balance; }

/* Contrast is limited to the transparent header lettering and logo. */
@media (min-width:768px) {
  .water-detail:has(#home.hess-hero) #site-header .custom-navbar:not(.top-nav-collapse) .nav li a {
    text-shadow:0 1px 2px rgba(0,0,0,.95), 0 0 6px rgba(0,0,0,.85);
  }
  .water-detail:has(#home.hess-hero) #site-header .custom-navbar:not(.top-nav-collapse) #logo img {
    filter:drop-shadow(0 1px 2px rgba(0,0,0,.8)) drop-shadow(0 0 5px rgba(0,0,0,.6));
  }
}

/* Preserve the landscape within the shorter tablet frame throughout the motion. */
@media (min-width:768px) and (max-width:991px) {
  #home.hess-hero #carousel-1 .item.active img { animation-name:hessResponsiveDrift; }
}
@keyframes hessResponsiveDrift {
  from { transform:scale(1); }
  to { transform:scale(1.02); }
}
