/* styles/entrance.css — Entrance overlay. Shown once, then hands control to the hero.
   Extracted from the former single-file monolith. */

/* ── Loading screen ── */
    /* ═══ OPENING EXPERIENCE ══════════════════════════════════════ */
    #page-loader {
      position: fixed;
      inset: 0;
      background: #0a0806;
      z-index: 9999;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0;
      overflow: hidden;
    }

/* Cinematic fade-out transition */
    #page-loader.loaded {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 1.6s cubic-bezier(0.4,0,0.2,1), visibility 1.6s;
    }

#page-loader.hiding { pointer-events: none; }

/* Warm gold glow behind crest */
    .intro-glow {
      position: absolute;
      width: 500px;
      height: 500px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(212,174,82,0.12) 0%, rgba(212,174,82,0.04) 40%, transparent 70%);
      animation: glowPulse 4s ease-in-out infinite;
      pointer-events: none;
    }

/* Crest */
    .intro-crest-wrap {
      position: relative;
      z-index: 2;
      opacity: 0;
      animation: introFadeUp 1.2s cubic-bezier(0.22,1,0.36,1) 0.4s forwards;
    }

.intro-crest {
      width: 120px;
      height: 120px;
      border-radius: 50%;
      object-fit: cover;
      display: block;
      box-shadow: 0 0 60px rgba(212,174,82,0.2), 0 0 0 1px rgba(212,174,82,0.12);
    }

/* Name + tagline */
    .intro-identity {
      text-align: center;
      margin-top: 28px;
      opacity: 0;
      animation: introFadeUp 1s ease 1.2s forwards;
    }

.intro-name {
      font-family: var(--font-display, Georgia, serif);
      font-size: clamp(1.1rem, 2.5vw, 1.6rem);
      font-weight: 400;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: #f0ece2;
      margin: 0 0 10px;
    }

.intro-tagline-line {
      font-family: var(--font-body, sans-serif);
      font-size: clamp(0.55rem, 1.2vw, 0.72rem);
      letter-spacing: 0.38em;
      text-transform: uppercase;
      color: #d4ae52;
      margin: 0;
    }

/* Welcome lines */
    .intro-welcome-wrap {
      text-align: center;
      margin-top: 36px;
      opacity: 0;
      animation: introFadeUp 1s ease 2.0s forwards;
      position: relative;
      height: 2.4rem;
    }

.intro-welcome-word {
      font-family: var(--font-display, Georgia, serif);
      font-size: clamp(1rem, 2vw, 1.3rem);
      font-weight: 300;
      font-style: italic;
      letter-spacing: 0.3em;
      color: rgba(240,236,226,0.55);
      margin: 0;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      white-space: nowrap;
      transition: opacity 0.8s ease, transform 0.8s ease;
    }

.intro-welcome-word.hidden {
      opacity: 0;
      transform: translateX(-50%) translateY(-8px);
    }

.intro-welcome-full {
      font-family: var(--font-display, Georgia, serif);
      font-size: clamp(0.8rem, 1.6vw, 1.05rem);
      font-weight: 300;
      font-style: italic;
      letter-spacing: 0.18em;
      color: rgba(240,236,226,0.7);
      margin: 0;
      position: absolute;
      left: 50%;
      transform: translateX(-50%) translateY(8px);
      white-space: nowrap;
      opacity: 0;
      transition: opacity 0.8s ease, transform 0.8s ease;
    }

.intro-welcome-full.visible {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

/* Enter button */
    .intro-enter-wrap {
      margin-top: 44px;
      text-align: center;
      opacity: 0;
      animation: introFadeUp 1s ease 3.0s forwards;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
    }

.intro-enter-btn {
      font-family: var(--font-body, sans-serif);
      font-size: clamp(0.65rem, 1.3vw, 0.78rem);
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: #0a0806;
      background: #d4ae52;
      border: none;
      padding: 16px 40px;
      border-radius: 0;
      cursor: pointer;
      transition: background 0.25s, box-shadow 0.25s, transform 0.2s;
      box-shadow: 0 4px 24px rgba(212,174,82,0.25);
    }

.intro-enter-btn:hover {
      background: #ead48a;
      box-shadow: 0 8px 36px rgba(212,174,82,0.4);
      transform: translateY(-2px);
    }

.intro-enter-note {
      font-family: var(--font-body, sans-serif);
      font-size: 0.6rem;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: rgba(240,236,226,0.28);
      margin: 0;
    }

/* Loader background — slightly warm black */
    #page-loader { background: #100e0c; }

/* Reduced-motion path: the entrance still appears, but nothing is choreographed.
   Every timed reveal resolves immediately so the Enter control is usable at once. */
#page-loader.no-choreography .intro-glow,
#page-loader.no-choreography .intro-crest-wrap,
#page-loader.no-choreography .intro-crest,
#page-loader.no-choreography .intro-identity,
#page-loader.no-choreography .intro-name,
#page-loader.no-choreography .intro-tagline-line,
#page-loader.no-choreography .intro-welcome-wrap,
#page-loader.no-choreography .intro-welcome-word,
#page-loader.no-choreography .intro-enter-wrap {
  animation: none !important;
  transition: none !important;
  opacity: 1;
  transform: none;
}
#page-loader.no-choreography .intro-welcome-full { display: none; }
#page-loader.loaded { transition-duration: 1.6s; }

@media (prefers-reduced-motion: reduce) {
  #page-loader.loaded { transition-duration: 0.01ms; }
}