/**
 * BONITA & CO - PRELOADER / ENTRANCE EXPERIENCE (PHASE 1)
 * Pure solid Light Pink curtains (#F7B1C1) with zero shading
 */

.preloader {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: var(--z-preloader);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  pointer-events: all;
  background-color: transparent;
  transition: visibility var(--duration-curtain) ease;
}

/* Elegant Curtains for Split Reveal (Pure solid light pink, zero visible seam) */
.preloader__curtain {
  position: absolute;
  left: 0;
  right: 0;
  height: 50.5%; /* Slight overlap ensures zero pixel gap */
  background-color: var(--color-blush-base);
  background-image: none; /* Pure solid light pink - no shades or gradients */
  z-index: 2;
  transition: transform var(--duration-curtain) var(--ease-curtain);
  will-change: transform;
}

.preloader__curtain--top {
  top: 0;
  transform-origin: top center;
}

.preloader__curtain--bottom {
  bottom: 0;
  transform-origin: bottom center;
}

/* Center Content Stage */
.preloader__inner {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-xl);
  max-width: 90vw;
  transition: opacity 0.6s var(--ease-editorial),
              transform 0.6s var(--ease-editorial);
}

/* Typographic Entrance - Minimal, Editorial, High-Fashion */
.preloader__brand-wrap {
  position: relative;
  margin-bottom: 8px;
}

.preloader__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.5rem + 2.5vw, 3.8rem);
  font-weight: 500;
  color: var(--color-burgundy-deep);
  letter-spacing: 0.28em;
  text-indent: 0.28em;
  text-transform: uppercase;
  margin: 0;
  line-height: 1.1;
  animation: preloaderTitleBreath 3.5s ease-in-out infinite alternate;
}

/* Slender Horizontal Progress Bar */
.preloader__progress-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: 26px;
  opacity: 1;
}

.preloader__progress-track {
  width: clamp(190px, 34vw, 290px);
  height: 2px;
  background-color: rgba(167, 21, 70, 0.2);
  position: relative;
  overflow: hidden;
  border-radius: 1px;
}

.preloader__progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0%;
  background-color: var(--color-burgundy-base);
  box-shadow: 0 0 6px rgba(167, 21, 70, 0.35);
  border-radius: 1px;
  transition: width 40ms linear;
  will-change: width;
}

/* Minimal Percentage Readout */
.preloader__percentage {
  font-family: var(--font-sans);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-indent: 0.22em;
  color: var(--color-burgundy-base);
  margin-top: 14px;
  font-variant-numeric: tabular-nums;
  opacity: 0.9;
}

@keyframes preloaderTitleBreath {
  0% {
    letter-spacing: 0.28em;
    opacity: 1;
  }
  100% {
    letter-spacing: 0.32em;
    opacity: 0.92;
  }
}

/* ----------------------------------------------------
 * PRELOADER EXIT / REVEAL PHASES
 * ---------------------------------------------------- */
.preloader.is-completed .preloader__progress-bar {
  width: 100% !important;
}

.preloader.is-revealing {
  pointer-events: none;
}

.preloader.is-revealing .preloader__inner {
  opacity: 0;
  transform: translateY(-16px) scale(0.97);
  transition: opacity 0.55s var(--ease-editorial), transform 0.55s var(--ease-editorial);
}

.preloader.is-revealing .preloader__curtain--top {
  transform: translateY(-100%);
}

.preloader.is-revealing .preloader__curtain--bottom {
  transform: translateY(100%);
}

.preloader.is-dismissed {
  visibility: hidden;
  pointer-events: none;
  display: none;
}
