.hero { position:relative; height:100vh; min-height:640px; overflow:hidden; color:#fff; }
.hero-slide {
  position:absolute; inset:0; opacity:0; transition:opacity 1.1s var(--ease-out);
  background-size:cover; background-position:center;
}
.hero-slide.active { opacity:1; z-index:1; }
.hero-slide::before { content:""; position:absolute; inset:0; background:var(--grad-deep); }

.hero-molecules { position:absolute; inset:0; z-index:2; opacity:.5; pointer-events:none; }

.hero-content { position:relative; z-index:3; height:100%; display:flex; flex-direction:column; justify-content:center; max-width:760px; }
.hero-content h1 { font-size:var(--fs-h1); color:#fff; margin:var(--sp-4) 0 var(--sp-5); }
.hero-content h1 em { font-style:normal; color:var(--color-secondary); }
.hero-content p { font-size:var(--fs-lg); color:#EFE6D8; max-width:560px; margin-bottom:var(--sp-6); }
.hero-actions { display:flex; flex-wrap:wrap; gap:var(--sp-4); }

.hero-dots { position:absolute; z-index:4; bottom:var(--sp-7); left:50%; transform:translateX(-50%); display:flex; gap:var(--sp-3); }
.hero-dots button { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.4); transition:all var(--dur-fast); }
.hero-dots button.active { background:var(--color-secondary); width:28px; border-radius:var(--radius-pill); }

.hero-scroll-cue {
  position:absolute; z-index:4; bottom:var(--sp-6); right:var(--sp-6);
  display:flex; align-items:center; gap:var(--sp-2);
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:#F3E9DA;
}
.hero-scroll-cue .line { width:1px; height:34px; background:rgba(255,255,255,.5); position:relative; overflow:hidden; }
.hero-scroll-cue .line::after { content:""; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--color-secondary); animation:scrollcue 1.8s infinite var(--ease-out); }
@keyframes scrollcue { 0%{top:-100%;} 60%{top:100%;} 100%{top:100%;} }

@media (max-width:720px){
  .hero { min-height:560px; }
  .hero-scroll-cue { display:none; }
}
.hero.hero-photo {
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
}

.hero.hero-photo .hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}


/* =========================
   HERO - CLEAR BACKGROUND
========================= */

.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 680px;
  overflow: hidden;
}

.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 1s ease;
}

/* Active image */
.hero-slide.active {
  opacity: 1;
}

/* Remove molecule / decorative image */
.hero-molecules {
  display: none !important;
}

/* IMPORTANT:
   Remove dark overlay if existing CSS creates one */
.hero::before,
.hero::after,
.hero-slide::before,
.hero-slide::after {
  display: none !important;
  content: none !important;
}

/* Keep text above image */
.hero-content {
  position: relative;
  z-index: 5;
}

/* Mobile */
@media (max-width: 768px) {
  .hero {
    height: 100svh;
    min-height: 620px;
  }

  .hero-slide {
    background-position: center center;
  }
}