:root {
  --navy: #0b2f5e;
  --navy-dark: #071d3d;
  --gold: #d4a94f;
  --gold-light: #f2d497;
}

* { scroll-behavior: smooth; }

body { font-family: 'Poppins', 'Segoe UI', sans-serif; }
.font-display { font-family: 'Playfair Display', serif; }

/* ---------- Fade / slide utility animations ---------- */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; } to { opacity: 1; }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: scale(1); }
}
@keyframes floatY {
  0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); }
}
@keyframes shimmer {
  0% { background-position: -400px 0; } 100% { background-position: 400px 0; }
}
@keyframes marquee {
  0% { transform: translateX(0); } 100% { transform: translateX(-50%); }
}

.animate-fade-up { animation: fadeInUp .8s ease both; }
.animate-fade { animation: fadeIn .8s ease both; }
.animate-scale-in { animation: scaleIn .6s ease both; }
.animate-float { animation: floatY 4s ease-in-out infinite; }
.animate-marquee { animation: marquee 28s linear infinite; }

.delay-1 { animation-delay: .15s; }
.delay-2 { animation-delay: .3s; }
.delay-3 { animation-delay: .45s; }
.delay-4 { animation-delay: .6s; }

/* Reveal-on-scroll (JS toggles .in-view) */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in-view { opacity: 1; transform: translateY(0); }

/* ---------- Hero slider ---------- */
.hero-slide {
  position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease;
  background-size: cover; background-position: center;
}
.hero-slide.active { opacity: 1; z-index: 1; }
.hero-slide::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(7,29,61,.55) 0%, rgba(7,29,61,.35) 45%, rgba(7,29,61,.85) 100%);
}

/* ---------- Glassmorphism ---------- */
.glass {
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.25);
}
.glass-light {
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ---------- Cards ---------- */
.card-hover { transition: transform .4s ease, box-shadow .4s ease; }
.card-hover:hover { transform: translateY(-8px); box-shadow: 0 24px 48px -12px rgba(11,47,94,0.25); }

.img-zoom { overflow: hidden; }
.img-zoom img { transition: transform .6s ease; }
.img-zoom:hover img { transform: scale(1.1); }

/* ---------- Buttons ---------- */
.btn-gold {
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  transition: all .3s ease;
}
.btn-gold:hover { filter: brightness(1.08); transform: translateY(-2px); box-shadow: 0 10px 24px -6px rgba(212,169,79,.55); }

.btn-navy { background: linear-gradient(135deg, #12417f, var(--navy)); transition: all .3s ease; }
.btn-navy:hover { filter: brightness(1.1); transform: translateY(-2px); box-shadow: 0 10px 24px -6px rgba(11,47,94,.55); }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: var(--navy); border-radius: 8px; }

/* ---------- Carousel track ---------- */
.carousel-track { display: flex; gap: 1.5rem; transition: transform .5s ease; }

/* ---------- Countdown box ---------- */
.countdown-box { background: white; border-radius: 12px; min-width: 64px; text-align: center; box-shadow: 0 8px 20px -6px rgba(0,0,0,.15); }

/* ---------- Loader ---------- */
.skeleton { background: linear-gradient(90deg, #eef2f7 25%, #f8fafc 37%, #eef2f7 63%); background-size: 400px 100%; animation: shimmer 1.4s ease infinite; }

/* ---------- Toast ---------- */
.toast { transition: transform .4s ease, opacity .4s ease; }

/* ---------- Line clamp ---------- */
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }