/* DPS.SBS V5 visual corrections measured against approved 1024x1536 design. */
@media (min-width:801px) {
  .hero {height:min(56vw,745px);min-height:560px;}
  .hero-pin {height:100%;min-height:0;position:relative;}
  .hero-stage {inset:var(--header-h) 0 0;}
  .hero-stage img {object-position:center 50%;}
  .hero-overlay {top:56%;}
  .hero-kicker {font-size:clamp(9px,.85vw,12px);letter-spacing:.25em;}
  .hero-statement {font-size:clamp(15px,1.38vw,20px);margin:7px 0 13px;}
  .hero-actions .button {min-height:41px;padding:13px 16px;}
  .hero-meta {bottom:22px;}
  .scroll-cue {bottom:15px;}
}
@media (max-width:800px) and (min-width:521px) {
  .hero {height: min(100svh,720px);min-height:580px;}
  .hero-pin {height:100%;min-height:0;position:relative;}
  .hero-overlay {top:53%;}
}
@media (max-width:520px) {
  .hero {height: min(100svh,790px);min-height:600px;}
  .hero-pin {position:relative;height:100%;min-height:0;}
  .hero-stage {inset:var(--header-h) 0 0;}
  .hero-stage picture,.hero-stage img {width:100%;height:100%;}
  .hero-stage img {object-position:center 43%;}
  .hero-overlay {top:24%;}
  .mobile-title {font-size:clamp(38px,12vw,56px);margin-bottom:17px;letter-spacing:.16em;text-indent:.16em;}
  .hero-kicker {max-width:320px;margin:auto;font-size:8px;letter-spacing:.12em;}
  .hero-statement {font-size:13px;margin:9px 0 15px;}
  .hero-actions {gap:7px;}
  .hero-actions .button {max-width:169px;font-size:8px;padding:10px 9px;line-height:1.3;}
  .hero-meta {bottom:52px;}
  .scroll-cue {bottom:24px;}
}
/* Prevent tiny navigation links and form legends from dropping below acceptable contrast. */
.destination small {color:#c3d2e3}
.field label {color:#d5e2ed}
.map-disclaimer,.demo-disclosure,.form-note {color:#b3c8dc}
@media(min-width:801px){
  .hero-overlay{top:62.2%}
  .hero-kicker{letter-spacing:.205em}
  .hero-statement{margin:6px 0 12px}
  .hero-actions .button{min-height:37px;padding:11px 14px}
}
.destination img{background:#081a2c;aspect-ratio:1.72}

/* V6 picture-locked kinetic scene: live video beneath all semantic HTML. */
.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 50%;opacity:0;transition:opacity 900ms ease;pointer-events:none;z-index:1}
.hero-film.playing{opacity:1}
.hero-stage picture{position:absolute;inset:0;display:block;z-index:0}
.hero-light,.hero-shadows{z-index:2}
.lens-mask{display:none!important}
@media(max-width:650px){.hero-film{display:none!important}.hero-stage picture{display:block}}
@media(prefers-reduced-motion:reduce){.hero-film{display:none!important}.hero-light{animation:none!important}}