/* ==========================================================
   Nalapad Group – Preloader + page entrance (component)
   Loaded on every page by layouts/app.blade.php, after header.css.

   How it runs (classes on <html>):
     .has-preloader  the loading screen exists (added by the inline script in <head>)
     .is-intro       the loading screen covers the page; the hero waits underneath
     .intro-reveal   the curtain is lifting and the hero is animating in (about 2.6s)
   assets/js/preloader.js moves between these. Without JS, none of this applies.
   ========================================================== */

/* ---------------- Loading screen ---------------- */
.preloader { display: none; }

.has-preloader .preloader {
  position: fixed;
  inset: 0;
  z-index: 1000;                     /* above the header (100) */
  display: grid;
  place-items: center;
  background: var(--color-white);
  transform: translateY(0);
  transition: transform .9s cubic-bezier(.76, 0, .24, 1);
}

/* Curtain: lifts up and off the screen once the page is ready */
.has-preloader:not(.is-intro) .preloader { transform: translateY(-100%); }

.preloader__logo {
  width: clamp(160px, 18vw, 240px);
  height: auto;
  /* Flickers on like a sign being switched on, then breathes gently while the page loads */
  animation:
    logo-flicker 1.4s steps(1, end) both,
    logo-breathe 2.4s ease-in-out 1.4s infinite;
}
/* The logo stops flickering and rides up with the curtain */
.has-preloader:not(.is-intro) .preloader__logo { animation: none; opacity: 1; }

@keyframes logo-flicker {
  0%   { opacity: 0; }
  8%   { opacity: .9; }
  11%  { opacity: .1; }
  15%  { opacity: 1; }
  18%  { opacity: .2; }
  21%  { opacity: .85; }
  24%  { opacity: 0; }
  30%  { opacity: 1; }
  44%  { opacity: .55; }
  47%  { opacity: 1; }
  100% { opacity: 1; }
}
@keyframes logo-breathe {
  0%, 100% { opacity: 1; }
  50%      { opacity: .72; }
}

/* No scrolling while the loading screen is up */
.is-intro,
.is-intro body { overflow: hidden; }

/* ---------------- Header joins last ---------------- */
.is-intro .site-header { transform: translateY(-100%); }
.intro-reveal .site-header { transition: transform .8s var(--ease) 1.1s; }

/* ---------------- Home hero entrance ----------------
   The title lines (.hero__line) rise on their own whenever a slide becomes active.
   During the intro they wait below their mask, then rise just after the curtain starts. */
.intro-reveal { --intro-delay: .3s; }
.is-intro .hero__slide.is-active .hero__line > span { transform: translateY(110%); }
.is-intro .hero__slide.is-active .btn-pill { opacity: 0; transform: translateY(16px); }

/* The photo settles from a slight zoom as it is uncovered */
.is-intro .hero__slide.is-active .hero__img { transform: scale(1.12); }
.intro-reveal .hero__slide.is-active .hero__img { transition: transform 2.4s cubic-bezier(.2, .7, .2, 1); }