/* =========================================================
   EXPLORE HERO — layered depth reveal
   (drifting clouds · text-between-layers · curtain-open frame)
   Builds on parallax.css (.pl-stage / .pl-scene / .pl-layer)
   ========================================================= */

/* Daytime alpine sky (overrides the default warm/cool sky) */
.pl-sky--day {
  background: linear-gradient(to bottom,
    #1f4a6b 0%, #3f7ba1 28%, #79aecb 52%, #bcd6e6 74%, #ecdfca 100%) !important;
}

/* ---- Drifting motion for clouds/mist (animates the inner img, so it
   never fights the layer's parallax transform) ---- */
.pl-drift-slow { animation: pl-drift 70s ease-in-out infinite alternate; }
.pl-drift-med  { animation: pl-drift 44s ease-in-out infinite alternate; }
@keyframes pl-drift { from { transform: translateX(-5%); } to { transform: translateX(5%); } }

/* Soft cloud fallback until you drop a real clouds.png in */
.pl-cloudscape {
  position: absolute; top: -5%; left: -15%; width: 130%; height: 90%;
  background:
    radial-gradient(46% 32% at 24% 40%, rgba(255,255,255,0.92), transparent 66%),
    radial-gradient(38% 26% at 60% 30%, rgba(255,255,255,0.85), transparent 66%),
    radial-gradient(52% 34% at 84% 48%, rgba(255,255,255,0.82), transparent 66%),
    radial-gradient(42% 30% at 44% 56%, rgba(255,255,255,0.72), transparent 66%);
  background-repeat: no-repeat;
  filter: blur(6px);
}

/* Big word sandwiched between the mountains and the figure */
.pl-bigtext {
  position: absolute; left: 50%; top: 46%;
  transform: translate(-50%, -50%);
  font-family: 'Jost', sans-serif; font-weight: 600;
  font-size: clamp(3rem, 16vw, 15rem);
  letter-spacing: 0.14em;
  color: rgba(255,255,255,0.94);
  white-space: nowrap;
  text-shadow: 0 10px 60px rgba(0,0,0,0.28);
}

/* ---- Curtain-open dark frame (placeholders; swap for PNGs) ---- */
.pl-frame-fill { position: absolute; left: 0; width: 100%; }
.pl-frame-top .pl-frame-fill {
  top: 0; height: 40%;
  background: radial-gradient(150% 110% at 50% 0%, #0b0d10 58%, rgba(11,13,16,0.0) 100%);
}
.pl-frame-bottom .pl-frame-fill {
  bottom: 0; height: 34%;
  background: radial-gradient(170% 130% at 50% 100%, #0b0d10 48%, rgba(11,13,16,0.0) 100%);
}
/* If a real frame PNG is provided, let it cover the fallback */
.pl-frame-top img, .pl-frame-bottom img { z-index: 1; }

/* ---- Thick cloud bank that buries the peaks, then fades/drifts away ---- */
.pl-cloudbank {
  position: absolute; inset: -12%;
  background:
    radial-gradient(55% 42% at 28% 42%, #ffffff 0%, rgba(255,255,255,0.90) 42%, rgba(255,255,255,0) 74%),
    radial-gradient(50% 38% at 68% 52%, #ffffff 0%, rgba(255,255,255,0.88) 46%, rgba(255,255,255,0) 76%),
    radial-gradient(66% 46% at 50% 28%, rgba(255,255,255,0.95), rgba(255,255,255,0) 70%),
    radial-gradient(60% 40% at 84% 36%, #ffffff, rgba(255,255,255,0) 72%),
    radial-gradient(58% 40% at 14% 60%, #ffffff, rgba(255,255,255,0) 72%);
  background-repeat: no-repeat;
  filter: blur(10px);
}

/* ---- Brand name that emerges from the mist ---- */
.pl-brand {
  position: absolute; left: 50%; top: 44%;
  transform: translate(-50%, -50%);
  width: 92%; text-align: center;
}
/* Soft dark scrim so the name reads on bright snow OR dark rock */
.pl-brand::before {
  content: ''; position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 128%; height: 300%; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at center,
    rgba(14,16,22,0.62) 0%, rgba(14,16,22,0.34) 46%, rgba(14,16,22,0) 72%);
  filter: blur(26px);
}
.pl-brand__name {
  font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500;
  font-size: clamp(2.4rem, 8vw, 6.6rem); line-height: 1.04;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: #fff;
  text-shadow: 0 4px 34px rgba(0,0,0,0.6), 0 1px 3px rgba(0,0,0,0.45);
}
.pl-brand__sub {
  font-family: 'Jost', sans-serif; font-weight: 400;
  letter-spacing: 0.34em; text-transform: uppercase;
  font-size: clamp(0.62rem, 1.3vw, 0.9rem); margin-top: 1.4rem;
  color: var(--gold-light, #D4AF7A);
  text-shadow: 0 2px 14px rgba(0,0,0,0.7);
}

/* ---- Utilities to blend band seams / warm the desert ---- */
.pl-soft-top {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 16%, #000 100%);
          mask-image: linear-gradient(to bottom, transparent 0%, #000 16%, #000 100%);
}
.pl-warm { filter: saturate(1.15) sepia(0.22) brightness(1.03) hue-rotate(-6deg); }

@media (prefers-reduced-motion: reduce) {
  .pl-drift-slow, .pl-drift-med { animation: none !important; }
}

/* ---- Home cinematic hero content (emerges from the mist) ---- */
.home-hero__content {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -52%);
  width: min(96%, 1100px); text-align: center; padding: 0 24px;
}
/* Soft scrim behind the hero copy.
   The page vignette is deliberately clear through the middle (transparent 55%),
   so the text would otherwise sit on the brightest part of the snow. This puts a
   feathered cushion under the copy only — the peaks stay bright either side. */
.home-hero__content::before {
  content: ''; position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 155%; height: 215%; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at center,
    rgba(8,12,20,0.74) 0%,
    rgba(8,12,20,0.60) 26%,
    rgba(8,12,20,0.34) 48%,
    rgba(8,12,20,0.12) 66%,
    rgba(8,12,20,0) 80%);
  filter: blur(48px);
}
/* Brand name — huge and prominent */
.home-hero__content .hero__brand-name {
  color: #F5F2ED;
  text-shadow: 0 6px 60px rgba(0,0,0,0.55), 0 2px 18px rgba(0,0,0,0.4);
}
.home-hero__content .hero__brand-name em {
  color: var(--gold-light, #D4AF7A);
  text-shadow: 0 4px 40px rgba(184,150,62,0.35);
}
/* Eyebrow above brand name */
.home-hero__content .hero__eyebrow { justify-content: center; }
.home-hero__content .hero__eyebrow-line { background: rgba(212,175,122,0.5); }
/* Headline — tight shadow for edge definition against snow, plus a wide soft one for lift */
.home-hero__content .hero__headline {
  text-shadow: 0 1px 3px rgba(0,0,0,0.45), 0 4px 34px rgba(0,0,0,0.55);
}
.home-hero__content .hero__headline em {
  text-shadow: 0 1px 3px rgba(0,0,0,0.40), 0 4px 30px rgba(0,0,0,0.45);
}
/* Sub-copy — brighter and with a tight shadow so thin 300-weight strokes stay legible */
.home-hero__content .hero__sub {
  color: rgba(255,255,255,0.94);
  text-shadow: 0 1px 3px rgba(0,0,0,0.72), 0 2px 20px rgba(0,0,0,0.55);
  margin-left: auto; margin-right: auto;
  max-width: 44ch;
}
/* CTAs */
.home-hero__content .hero__ctas { justify-content: center; }
