/* Page loader, shared with the docs page (copied from site.css). */
/* ── Page loader (inner pages) ─────────────────────── */
.velora-preloader {
  position: fixed; inset: 0; z-index: 100000;
  display: grid; place-items: center; overflow: hidden;
  background:
    radial-gradient(circle at 50% 46%, rgba(122, 108, 201, .28), transparent 30%),
    radial-gradient(circle at 50% 54%, rgba(76, 232, 255, .12), transparent 42%),
    var(--bg);
  transition: opacity .75s ease, visibility .75s ease, filter .75s ease;
}
.velora-preloader::before {
  content: ""; position: absolute; width: 360px; height: 360px; border-radius: 50%;
  border: 1px solid rgba(122, 108, 201, .18); box-shadow: 0 0 70px rgba(122, 108, 201, .18);
  animation: loaderRing 1.8s ease-in-out infinite;
}
.velora-loader-logo {
  width: clamp(82px, 12vw, 132px); height: clamp(82px, 12vw, 132px);
  border-radius: 50%; object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 0 42px rgba(122, 108, 201, .42), 0 0 90px rgba(76, 232, 255, .18);
  animation: logoIntro 1.65s cubic-bezier(.18, .82, .18, 1) forwards;
  will-change: transform, filter, opacity;
}
.velora-loader-word {
  position: absolute; top: calc(50% + 96px);
  color: rgba(236, 243, 255, .78); font: 500 .75rem var(--mono);
  letter-spacing: .22em; text-transform: uppercase;
  animation: loaderText 1.3s ease both;
}
.velora-preloader.hide { opacity: 0; visibility: hidden; filter: blur(18px); pointer-events: none; }
/* Slow page: hold the logo on screen with a soft pulse, then burst away once loaded. */
.velora-preloader.waiting .velora-loader-logo { animation: logoHold 1.6s ease-in-out infinite; }
.velora-preloader.waiting .velora-loader-word { animation: none; opacity: .78; }
.velora-preloader.waiting .velora-loader-logo.burst { animation: logoBurst .45s ease-in forwards; }
@keyframes logoHold { 0%, 100% { transform: scale(1) rotate(0deg); opacity: 1; } 50% { transform: scale(1.06) rotate(180deg); opacity: .9; } }
@keyframes logoBurst { to { transform: scale(2.35) rotate(360deg); opacity: 0; } }
@keyframes logoIntro {
  0% { transform: scale(.58) rotate(-180deg); filter: blur(16px); opacity: 0; }
  45% { transform: scale(1.08) rotate(28deg); filter: blur(0); opacity: 1; }
  72% { transform: scale(.98) rotate(190deg); filter: blur(0); opacity: 1; }
  100% { transform: scale(2.35) rotate(360deg); filter: blur(18px); opacity: 0; }
}
@keyframes loaderText {
  0%, 20% { opacity: 0; transform: translateY(10px); }
  55% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-6px); }
}
@keyframes loaderRing {
  0%, 100% { transform: scale(.9) rotate(0deg); opacity: .36; }
  50% { transform: scale(1.08) rotate(180deg); opacity: .82; }
}
/* Hold the page's own entrance animations until the loader lifts. */
html.preloading header *, html.preloading main * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .velora-preloader { display: none !important; } }
/* Flower intro: petals fly in, centre pops, then the flower grows and fades (1.8s total). */
.velora-flower {
  position: relative; border-radius: 0 !important; box-shadow: none !important; filter: none !important;
  will-change: transform, opacity; backface-visibility: hidden;
  animation: flowerOut 1.8s cubic-bezier(.4, 0, .2, 1) forwards !important;
}
.velora-flower img { position: absolute; inset: 0; width: 100%; height: 100%; }
.velora-flower .vp { opacity: 0; will-change: transform, opacity; animation: petalIn .7s cubic-bezier(.16, .84, .3, 1) forwards; }
.velora-flower .vp0 { --dx: 0;      --dy: -1;     animation-delay: 0s; }
.velora-flower .vp1 { --dx: .951;   --dy: -.309;  animation-delay: .05s; }
.velora-flower .vp2 { --dx: .588;   --dy: .809;   animation-delay: .1s; }
.velora-flower .vp3 { --dx: -.588;  --dy: .809;   animation-delay: .15s; }
.velora-flower .vp4 { --dx: -.951;  --dy: -.309;  animation-delay: .2s; }
.velora-flower .vp-centre { opacity: 0; transform: scale(.4); animation: centreIn .45s cubic-bezier(.3, 1.5, .5, 1) .5s forwards; }
@keyframes petalIn {
  from { opacity: 0; transform: translate(calc(var(--dx) * 70%), calc(var(--dy) * 70%)) scale(.85); }
  to   { opacity: 1; transform: translate(0, 0) scale(1); }
}
@keyframes centreIn { to { opacity: 1; transform: scale(1); } }
@keyframes flowerOut {
  0%, 58% { transform: translateZ(0) scale(1); opacity: 1; }
  100%    { transform: translateZ(0) scale(2.35); opacity: 0; }
}
.velora-preloader.waiting .velora-flower { animation: logoHold 1.6s ease-in-out infinite !important; }
.velora-preloader.waiting .velora-flower.burst { animation: logoBurst .45s ease-in forwards !important; }

/* Smoother exit: fade the overlay without blurring the whole screen. */
.velora-preloader { transition: opacity .75s ease, visibility .75s ease; will-change: opacity; }
.velora-preloader.hide { filter: none; }

/* Blur on the way out without live filters: cross-fade into a pre-blurred copy. */
.velora-flower .vp-sharp { position: absolute; inset: 0; animation: sharpOut 1.8s linear forwards; will-change: opacity; }
.velora-flower .vp-blur { position: absolute; inset: -18.75%; width: 137.5%; height: 137.5%; opacity: 0; animation: blurIn 1.8s linear forwards; will-change: opacity; }
@keyframes sharpOut { 0%, 60% { opacity: 1; } 85%, 100% { opacity: 0; } }
@keyframes blurIn { 0%, 58% { opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; } }
.velora-preloader.waiting .velora-flower .vp-sharp { animation: none; opacity: 1; }
.velora-preloader.waiting .velora-flower .vp-blur { animation: none; opacity: 0; }
.velora-preloader.waiting .velora-flower.burst .vp-sharp { animation: sharpOutFast .45s linear forwards; }
.velora-preloader.waiting .velora-flower.burst .vp-blur { animation: blurInFast .45s linear forwards; }
@keyframes sharpOutFast { to { opacity: 0; } }
@keyframes blurInFast { to { opacity: 1; } }