/* Full-width film hero (added at launch; content from banners.json → heroFilm, editable from EMS) */
.hero-film { position: relative; margin-top: 110px; height: min(calc(100svh - 110px), 62vw); min-height: 520px; overflow: hidden; background: #171310; color: #F6F1E8; isolation: isolate; }
.hero-film-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 55%; z-index: -2; }
.hero-film-shade { position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(18,14,11,.72) 0%, rgba(18,14,11,.35) 38%, rgba(18,14,11,0) 62%),
              linear-gradient(0deg, rgba(18,14,11,.55) 0%, rgba(18,14,11,0) 35%); }
.hero-film-copy { position: absolute; left: clamp(20px, 6vw, 96px); bottom: clamp(48px, 9vh, 110px); max-width: 560px; }
.hero-film-eyebrow { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #D6B485; margin: 0 0 18px; }
.hero-film-title { font-family: 'Manrope', var(--sans), sans-serif; font-weight: 300; font-size: clamp(40px, 5.6vw, 84px); line-height: .98; letter-spacing: -.02em; margin: 0 0 20px; color: #F6F1E8; }
.hero-film-title em { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-weight: 500; color: #E9D3B0; }
.hero-film-text { font-size: 17px; line-height: 1.6; color: rgba(246,241,232,.86); max-width: 470px; margin: 0 0 30px; }
.hero-film-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-film-btn { display: inline-flex; align-items: center; padding: 15px 26px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; transition: transform .25s ease, background .25s ease; }
.hero-film-btn.primary { background: #F6F1E8; color: #2A2117; }
.hero-film-btn.ghost { border: 1px solid rgba(246,241,232,.55); color: #F6F1E8; }
.hero-film-btn:hover { transform: translateY(-2px); }
.hero-film-piece { position: absolute; right: clamp(20px, 4vw, 56px); bottom: clamp(24px, 5vh, 48px); font-size: 13px; color: rgba(246,241,232,.9); text-decoration: none; border-bottom: 1px solid rgba(246,241,232,.35); padding-bottom: 3px; }
.hero-film-piece span { display: block; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: #D6B485; margin-bottom: 4px; }
.hero-film-toggle { position: absolute; right: clamp(20px, 4vw, 56px); top: 22px; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(246,241,232,.4); background: rgba(18,14,11,.25); color: #F6F1E8; font-size: 11px; cursor: pointer; }
.hero-film[hidden] { display: none; }
.hero-film + .v2-hero { padding-top: 72px !important; }
@media (max-width: 700px) {
  .hero-film { margin-top: 88px; height: calc(100svh - 88px); min-height: 560px; max-height: 760px; }
  .hero-film-video { object-position: 50% 45%; }
  .hero-film-shade { background: linear-gradient(0deg, rgba(18,14,11,.82) 0%, rgba(18,14,11,.45) 45%, rgba(18,14,11,.05) 75%); }
  .hero-film-copy { left: 20px; right: 20px; bottom: 96px; }
  .hero-film-text { font-size: 15px; margin-bottom: 22px; }
  .hero-film-btn { padding: 13px 20px; font-size: 13px; }
  .hero-film-piece { left: 20px; right: auto; bottom: 28px; }
  .hero-film + .v2-hero { padding-top: 48px !important; }
}
@media (prefers-reduced-motion: reduce) { .hero-film-video { display: none; } .hero-film { background: #171310 url(https://aiytftidftjzccdbeoib.supabase.co/storage/v1/object/public/website-media/media/hero-eclipse-poster.webp) 60% 55% / cover no-repeat; } }
/* carousel (hero-film.js) */
.hf-stage { position: absolute; inset: 0; z-index: -2; }
.hf-layer { position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s ease; }
.hf-layer.on { opacity: 1; }
.hf-layer .hero-film-video, .hf-layer picture { position: absolute; inset: 0; width: 100%; height: 100%; z-index: auto; }
.hf-layer picture img { width: 100%; height: 100%; object-fit: cover; }
.hf-layer img.hf-img { object-fit: cover; object-position: center; }
@media (prefers-reduced-motion: no-preference) { .hf-layer.on img.hf-img { animation: hfKen 9s ease-out both; } }
@keyframes hfKen { from { transform: scale(1.06); } to { transform: scale(1); } }
.hero-film-copy.hf-in > * { animation: hfIn .8s cubic-bezier(.16,1,.3,1) both; }
.hero-film-copy.hf-in > *:nth-child(2) { animation-delay: .06s; } .hero-film-copy.hf-in > *:nth-child(3) { animation-delay: .12s; } .hero-film-copy.hf-in > *:nth-child(4) { animation-delay: .18s; }
@keyframes hfIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.hf-dots { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); display: flex; gap: 8px; }
.hf-dots button { width: 28px; height: 3px; border: 0; border-radius: 3px; background: rgba(246,241,232,.35); cursor: pointer; padding: 0; }
.hf-dots button[aria-selected="true"] { background: #F6F1E8; }
.hero-film-piece[hidden] { display: none; }
@media (max-width: 700px) { .hf-dots { bottom: 12px; } }

/* phones: film fills the top 75% of the hero (square/tall mobile files), headline + buttons in the bottom 25% — never over the film */
@media (max-width: 700px) {
  .hero-film { height: calc(100svh - 170px); min-height: 480px; max-height: 720px; display: flex; flex-direction: column; } /* leaves room below for the WhatsApp + chat buttons */
  .hf-stage { position: relative; inset: auto; flex: 0 0 75%; width: 100%; z-index: 0; overflow: hidden; }
  .hero-film > .hero-film-video { position: relative; inset: auto; flex: 0 0 75%; width: 100%; height: auto; z-index: 0; }
  .hero-film-shade { display: none; }
  .hero-film-copy { position: static; flex: 1 1 25%; min-height: 0; padding: 12px 20px 16px; max-width: none; display: flex; flex-direction: column; justify-content: center; }
  .hero-film-eyebrow, .hero-film-text { display: none; }
  .hero-film-title { font-size: 26px; line-height: 1.08; margin: 0 0 12px; }
  .hero-film-ctas { gap: 10px; flex-wrap: nowrap; }
  .hero-film-btn { padding: 11px 16px; font-size: 13px; white-space: nowrap; }
  .hf-dots { top: calc(75% - 16px); bottom: auto; }
  .hero-film-toggle { top: 12px; right: 12px; width: 32px; height: 32px; }
}