.hero-frame {
  --film-panel: 73%;
  background: #0b1721;
}
.hero-media, .hero-shade {
  left: auto;
  right: 0;
  width: var(--film-panel);
}
.hero-media img, .hero-media video { object-position: 51% center; }
.hero-shade {
  background: linear-gradient(90deg, #0b1721 0%, #0b1721e8 9%, #0b1721af 19%, #0b172140 31%, transparent 48%),
    linear-gradient(0deg, #0b1721e0, transparent 22%);
}
#film-dialog { width: min(92vw, 1140px, 138svh); }
#feature-film { aspect-ratio: 16 / 9; max-height: 78svh; object-fit: contain; }
.hero h1 {
  font-weight: 735;
  letter-spacing: -.068em;
}
.hero h1 em { color: #c4ddeb; }
.section-head h2, .local-inner h2, .contact-band h2 {
  font-weight: 690;
  letter-spacing: -.057em;
}
.in-cover h1, .in-area-hero h1, .in-contact h1 { font-weight: 695; }
.hero-kicker span {
  height: 2px;
  width: 30px;
  background: linear-gradient(90deg, #ff9c5a 0% 45%, #a4cfe7 65% 100%);
}

/* A pair of fine airflow contours grazes the lower edge of the film. */
.airflow-layer {
  --air-rise: 0px;
  position: absolute;
  z-index: -1;
  pointer-events: none;
  right: -3%;
  bottom: 8%;
  width: 55%;
  height: clamp(76px, 14%, 140px);
  mask-image: linear-gradient(90deg, transparent, #000 24%, #000 98%);
}
.airflow-layer span {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.airflow-warm {
  opacity: .49;
  transform: translateY(calc(-1 * var(--air-rise)));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 126' preserveAspectRatio='none' fill='none' stroke='%23ffac76'%3E%3Cpath vector-effect='non-scaling-stroke' d='M-18 108C110 111 149 43 277 57S460 124 656 21'/%3E%3Cpath opacity='.55' vector-effect='non-scaling-stroke' d='M-18 114C109 118 153 50 275 64S467 131 656 30'/%3E%3C/svg%3E");
}
.airflow-cool {
  opacity: .56;
  transform: translateY(var(--air-rise));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 126' preserveAspectRatio='none' fill='none' stroke='%239dd5ef'%3E%3Cpath vector-effect='non-scaling-stroke' d='M-18 113C130 121 183 82 290 63S477 18 656 48'/%3E%3Cpath opacity='.55' vector-effect='non-scaling-stroke' d='M-18 121C132 129 187 90 293 71S480 25 656 57'/%3E%3C/svg%3E");
}
.button:active, .in-button:active { transform: translateY(1px); }
.head-call:focus-visible { outline-offset: 1px; }
@keyframes season-section-enter {
  from { transform: translateY(12px); }
  to { transform: none; }
}
@supports (animation-timeline: view()) and (animation-range: entry 0% cover 20%) {
  @media (prefers-reduced-motion: no-preference) {
    .season-motion :is(.section-head, .contact-band h2, .in-section .in-story, .in-help-layout h2) {
      animation: season-section-enter linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 20%;
    }
  }
}
@media (max-width: 1100px) {
  .head-call {
    display: inline-flex;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    border-radius: 50%;
  }
}
@media (min-width: 601px) and (max-width: 800px) {
  .head-call span { display: inline; }
}
@media (min-width: 601px) and (max-width: 800px) {
  .hero-frame { --film-panel: 67%; }
  .hero h1 { font-size: clamp(49px, 7.25vw, 60px); }
  .hero-intro { max-width: 40vw; }
  .hero-actions { gap: 15px; }
}
@media (max-width: 600px) {
  .hero-frame { --film-window: clamp(212px, 68vw, 390px); }
  .hero-media, .hero-shade { inset: 0 0 auto; width: 100%; height: var(--film-window); }
  .hero-media img, .hero-media video { object-position: 50% center; }
  .hero-shade { background: linear-gradient(0deg, #0b1721, #0b172177 6%, transparent 19%); }
  .hero-message { margin-block: auto; padding: calc(var(--film-window) + 16px) 0 16px; }
  .head-row { gap: 5px; }
  .head-actions { gap: 2px; }
  .hero h1 { letter-spacing: -.062em; }
  .airflow-layer {
    bottom: auto;
    top: calc(var(--film-window) - 56px);
    right: -5%;
    width: 48%;
    height: 60px;
    opacity: .8;
  }
  .menu-toggle { width: 40px; min-height: 44px; }
}
@media (max-width: 414px) {
  .wide-quote { display: none; }
  .short-quote { display: inline; }
}
@media (scripting: none) {
  .film-trigger, .menu-toggle { display: none; }
}
@media (max-width: 800px) and (scripting: none) {
  .head-row { height: auto; flex-wrap: wrap; padding-block: 8px; }
  .navigation { display: flex; position: static; order: 3; width: 100%; flex-wrap: wrap; gap: 0 16px; padding: 0; border: 0; box-shadow: none; }
  .navigation a { padding-block: 5px; }
  body:has(.hero) .header { position: relative; }
}