/* ============================================================
   HERO
   ============================================================ */
.hero { position:relative; min-height:0; height:clamp(420px,33.9vw,650px); display:flex; align-items:center; justify-content:center; overflow:hidden; background:linear-gradient(135deg,#013D74 0%,#012F59 100%); }
.hero-media { position:absolute; inset:0; z-index:0; }
.hero-slider { background:#012F59; }
.hero-slide { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center center; opacity:0; transform:scale(1.035); transition:opacity .9s ease, transform 5.5s ease; will-change:opacity,transform; }
.hero-slide--active { opacity:1; transform:scale(1); }
.hero-overlay { display:none; }
.hero-grid { display:none; }
.hero-content { position:relative; z-index:2; text-align:center; padding-top:var(--header-h); }
.hero-slider + .hero-grid + .hero-content { display:none; }
.hero-tagline { margin-bottom:24px; }
.tagline-row { display:flex; justify-content:center; gap:0.25em; flex-wrap:wrap; }
.word {
  font-family:var(--ff-display); font-weight:900;
  font-size:clamp(52px,10vw,120px);
  color:var(--clr-white); letter-spacing:-0.03em; line-height:1;
  display:inline-block;
  opacity:0; transform:translateY(40px);
  animation:wordUp .7s var(--ease-out-expo) forwards;
  /* MODIFICATION: Increased base delay so words appear after page settles */
  animation-delay:calc(0.6s + var(--i) * 0.12s);
}
.row-2 .word:last-child { color:var(--clr-red); }
@keyframes wordUp { to{opacity:1;transform:translateY(0)} }
.hero-sub {
  font-family:var(--ff-body); font-size:clamp(16px,2vw,20px); color:rgba(255,255,255,.75); margin-bottom:36px;
  opacity:0;
  animation:wordUp .7s var(--ease-out-expo) calc(1.1s + var(--i)*0.12s) forwards;
}
.hero-sub strong { color:var(--clr-white); font-weight:600; }
.hero-actions {
  display:flex; gap:16px; justify-content:center; flex-wrap:wrap;
  opacity:0;
  animation:wordUp .7s var(--ease-out-expo) calc(1.1s + var(--i)*0.12s) forwards;
}
.hero-dots { position:absolute; bottom:36px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:3; }
.dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3); border:none; transition:all .35s; }
.dot--active { background:var(--clr-red); transform:scale(1.4); }
.scroll-indicator { display:none; }
.scroll-line { width:1.5px; height:48px; background:linear-gradient(to bottom,rgba(255,255,255,.6),transparent); animation:scrollBounce 2s ease infinite; }
@keyframes scrollBounce { 0%,100%{transform:translateY(0);opacity:.5} 50%{transform:translateY(8px);opacity:1} }

@media (max-width: 768px) {
  .hero { height:clamp(360px,58vw,520px); }
  .hero-slide { object-position:center center; }
}