/* ─── Page Loader — dark cinematic cover ────────────────────────────────── */
#page-loader {
  position: fixed;
  inset: 0;
  background-color: #0C1A1F;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  pointer-events: none;
}

#page-loader .loader-name {
  font-family: var(--font-serif);
  font-size: clamp(1.25rem, 3.5vw, 2rem);
  font-weight: 300;
  font-style: italic;
  letter-spacing: 0.22em;
  color: var(--color-gold);
  opacity: 0;
  animation: loaderFadeIn 0.95s var(--ease-out) 0.1s forwards;
}

#page-loader .loader-line {
  width: 0;
  height: 1px;
  background-color: rgba(184,150,90,0.45);
  margin-top: 1.25rem;
  animation: loaderLine 1.0s var(--ease-out) 0.45s forwards;
}

@keyframes loaderFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes loaderLine {
  from { width: 0; }
  to   { width: 5rem; }
}

/* ─── Scroll-reveal base states ──────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
  will-change: opacity, transform;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-48px);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
  will-change: opacity, transform;
}

.reveal-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(48px);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
  will-change: opacity, transform;
}

.reveal-right.visible {
  opacity: 1;
  transform: translateX(0);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
  will-change: opacity, transform;
}

.reveal-scale.visible {
  opacity: 1;
  transform: scale(1);
}

.reveal-clip {
  clip-path: inset(100% 0 0 0);
  transition: clip-path 0.9s var(--ease-out);
  will-change: clip-path;
}

.reveal-clip.visible {
  clip-path: inset(0% 0 0 0);
}

/* Stagger delays */
.stagger-1 { transition-delay: 0.08s; }
.stagger-2 { transition-delay: 0.16s; }
.stagger-3 { transition-delay: 0.24s; }
.stagger-4 { transition-delay: 0.32s; }
.stagger-5 { transition-delay: 0.40s; }
.stagger-6 { transition-delay: 0.48s; }

/* ─── Hero elements — hidden before GSAP timeline runs ──────────────────── */
/* GSAP sets initial opacity/transform, so these just hide until GSAP fires  */
.hero__stamp,
.hero__eyebrow,
.hero__title,
.hero__tagline,
.hero__actions,
.hero__bar {
  opacity: 0;
}

/* ─── Scroll chevron bounce ──────────────────────────────────────────────── */
@keyframes chevronBounce {
  0%, 100% { transform: translateY(0); opacity: 0.7; }
  50%       { transform: translateY(8px); opacity: 1; }
}

.scroll-indicator {
  animation: chevronBounce 2s ease-in-out infinite;
}

/* ─── Gold pulse (CTA highlight) ──────────────────────────────────────────── */
@keyframes pulseGold {
  0%, 100% { box-shadow: 0 4px 20px rgba(184, 150, 90, 0.25); }
  50%       { box-shadow: 0 4px 40px rgba(184, 150, 90, 0.5); }
}

/* ─── Nav slide-down ─────────────────────────────────────────────────────── */
@keyframes navSlideDown {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}

.nav--visible {
  animation: navSlideDown 0.35s var(--ease-out) forwards;
}

/* ─── Lightbox ───────────────────────────────────────────────────────────── */
@keyframes lightboxIn {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

@keyframes lightboxOut {
  from { opacity: 1; transform: scale(1); }
  to   { opacity: 0; transform: scale(0.95); }
}

/* ─── Mobile menu ────────────────────────────────────────────────────────── */
@keyframes menuSlideIn {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}

@keyframes menuSlideOut {
  from { transform: translateX(0); }
  to   { transform: translateX(100%); }
}

/* ─── Marquee (decorative text strip) ───────────────────────────────────── */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee 28s linear infinite;
}
