/* ═══════════ 1) STRUCTURE (this was missing — caused the collapse) ═══════════ */
.hero3 { position:relative; height:100vh; min-height:640px; overflow:hidden; background:#eaf4fb; }
.hero3-swiper { position:relative; z-index:2; width:100%; height:100%; }
.hero3-swiper .swiper-slide { position:relative; height:100%; overflow:hidden; }
.hero3-bg { position:absolute; inset:0; z-index:0; background-size:cover;
  background-position:center right; background-color:#eaf4fb; transform:scale(1.08); }
.swiper-slide-active .hero3-bg { animation:heroZoom 9s ease-out forwards; }
@keyframes heroZoom { from{transform:scale(1.15);} to{transform:scale(1.02);} }
.hero3-content { position:relative; z-index:3; height:100%; display:flex;
  align-items:center; padding:11rem 0 6.5rem; }
.hero-cta { display:flex; gap:1rem; flex-wrap:wrap; }

/* ═══════════ 2) BRIGHT DIVINE SKIN ═══════════ */
.hero3-overlay { position:absolute; inset:0; z-index:1; background:
  linear-gradient(90deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.78) 34%,
              rgba(255,255,255,.28) 58%, rgba(255,255,255,0) 76%),
  radial-gradient(circle at 16% 58%, rgba(255,255,255,.95), rgba(255,255,255,0) 46%); }
.hero-kicker { font-family:var(--font-body); font-size:22px;
  color:var(--maroon); letter-spacing:.02em; text-transform:none; font-weight:400; text-shadow:none; }
.hero3 h2 { font-family:var(--font-display); font-weight:700; color:#2a2320;
  font-size:clamp(2.4rem,5.4vw,4.4rem); line-height:1.12; text-shadow:none; }
.hero3 h2 span { color:var(--saffron); }
.hero3 .lead { max-width:520px; color:rgba(58,45,38,.78); font-weight:400; text-shadow:none; }
.hero3 .btn-ghost { border:2px solid rgba(138,61,25,.4); color:var(--maroon); }
.hero3 .btn-ghost:hover { background:rgba(255,255,255,.65); color:var(--maroon-deep); }

/* entrance animation + no-swiper fallback */
.hero3 .anim { opacity:0; transform:translateY(32px); transition:.9s cubic-bezier(.22,1,.36,1); }
.swiper-slide-active .anim, .no-swiper .anim { opacity:1; transform:none; }
.swiper-slide-active .d1, .no-swiper .d1 { transition-delay:.15s; }
.swiper-slide-active .d2, .no-swiper .d2 { transition-delay:.3s; }
.swiper-slide-active .d3, .no-swiper .d3 { transition-delay:.45s; }
.no-swiper .swiper-slide { display:none; }
.no-swiper .swiper-slide:first-child { display:block; }

/* ← Prev / Next → text arrows */
.hero3-prev,.hero3-next { position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  display:flex; align-items:center; gap:.5rem; background:transparent; border:none;
  color:#8b8b8b; font-size:.95rem; font-weight:500; cursor:pointer; transition:.3s; }
.hero3-prev { left:26px; } .hero3-next { right:26px; }
.hero3-prev i,.hero3-next i { font-size:1.25rem; transition:.3s; }
.hero3-prev:hover,.hero3-next:hover { color:var(--saffron); }
.hero3-prev:hover i { transform:translateX(-4px); } .hero3-next:hover i { transform:translateX(4px); }

/* bottom elements on bright bg */
#particles { position:absolute; inset:0; z-index:4; overflow:hidden; pointer-events:none; }
#particles span { position:absolute; bottom:-10px; border-radius:50%; background:#fff;
  box-shadow:0 0 10px 3px rgba(255,255,255,.75); opacity:0;
  animation-name:floatUp; animation-timing-function:linear; animation-iteration-count:infinite; }
@keyframes floatUp { 0%{transform:translate3d(0,0,0) scale(1);opacity:0;}
  10%{opacity:var(--p-opacity,.7);} 90%{opacity:var(--p-opacity,.7);}
  100%{transform:translate3d(var(--p-drift,40px),-105vh,0) scale(.3);opacity:0;} }
.hero-caption { position:absolute; bottom:92px; left:50%; transform:translateX(-50%);
  z-index:5; margin:0; color:var(--maroon); letter-spacing:.3em; font-size:16px;
  text-transform:uppercase; max-width:92%; text-shadow:0 1px 6px rgba(255,255,255,.6); }
.hero-pagination { position:absolute; left:0; right:0; bottom:60px; z-index:5;
  display:flex; justify-content:center; gap:7px; }
.hero-pagination .swiper-pagination-bullet { width:9px; height:9px; border-radius:50px;
  background:rgba(128,0,32,.3); opacity:1; transition:.4s; }
.hero-pagination .swiper-pagination-bullet-active { width:28px;
  background:linear-gradient(90deg,var(--saffron),var(--gold)); }
.scroll-indicator { position:absolute; bottom:18px; left:50%; color:var(--saffron);
  font-size:1.4rem; z-index:5; animation:bob 2s ease-in-out infinite; text-decoration:none; }
@keyframes bob { 0%,100%{transform:translate(-50%,0);} 50%{transform:translate(-50%,9px);} }

/* ═══════════ 3) HEADER readable on bright hero ═══════════ */
.site-header .nav-link:hover { color:var(--saffron); }
.site-header .brand-text { color:var(--maroon); }
.site-header .brand-sub { color:var(--saffron); }
.site-header .login-link { color:var(--maroon); }
.site-header .toggler-bar { background:#cb3928; }
/*.top-bar { background:rgba(255,255,255,.55); border-bottom:1px solid rgba(212,175,55,.35); }
.top-tagline { color:rgba(58,45,38,.85); }
.top-tagline i { color:var(--saffron); }
.top-social a { color:var(--saffron); border-color:rgba(212,175,55,.6); }
.top-social a:hover { background:var(--gold); color:#fff; }*/

/* ═══════════ 4) RESPONSIVE ═══════════ */
@media (max-width:991px){ .hero3 { height:88vh; } .hero3-content { padding:10rem 20px 7rem; }.hero3 h2 span {color:var(--maroon)}.hero3 .lead{color:#2a2320} }
@media (max-width:768px){
  .hero3 { height:82vh; min-height:560px; }
  .hero3-prev span,.hero3-next span { display:none; }
  .hero3-overlay { background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.6) 48%, rgba(255,255,255,.12) 78%); }
  .hero-caption { font-size:.58rem; letter-spacing:.2em; bottom:86px; }
}

/* ═══════════ RESPONSIVE SLIDER WRAPPERS (structure only) ═══════════ */
.slider-wrap { position:absolute; inset:0; z-index:2; }
.slider-wrap .hero3-swiper { height:100%; }
.t-slider, .m-slider { display:none; }
@media (max-width:991.98px){ .d-slider{display:none;} .t-slider{display:block;} }
@media (max-width:767.98px){ .t-slider{display:none;} .m-slider{display:block;} }

/* mobile: centered text + top-down bright overlay */
.m-slider .hero3-content { text-align:center; }
.m-slider .hero-cta { justify-content:center; }
.m-slider .hero3-overlay { background:
  linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.6) 45%, rgba(255,255,255,.12) 80%); }
.t-slider .hero3-bg, .m-slider .hero3-bg { background-position:center top; }