/* ============================================================
   Weblikon — Animations-Layer für die Content-Seiten
   Lädt NACH styles.css → überschreibt gezielt. Non-destruktiv.
   Loader-Vorhang, kinetische Reveals, Fortschrittsbalken.
============================================================ */

/* Scrollsperre, solange der Loader-Vorhang steht */
.pa-loading{overflow:hidden!important}

/* ---- LOADER / Vorhang ---- */
.pa-loader{position:fixed;inset:0;z-index:100000;background:var(--fg);color:#fff;
  display:flex;align-items:flex-end;justify-content:space-between;padding:6vw clamp(20px,5vw,56px);will-change:transform}
.pa-loader .pa-count{font-family:'Syne','Inter',sans-serif;font-weight:700;
  font-size:clamp(4rem,16vw,13rem);line-height:.82;letter-spacing:-.02em}
.pa-loader .pa-llabel{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;opacity:.6;padding-bottom:1.5rem}
.pa-lbar{position:fixed;left:0;bottom:0;height:2px;width:0;background:var(--primary);z-index:100001}

/* ---- Hero-Inhalt bleibt über dem Hintergrund ---- */
.hero>.container{position:relative;z-index:2}

/* ---- Reveal-Motion deutlich kräftiger (app.js schaltet weiterhin .in) ---- */
.fade-up{opacity:0;transform:translateY(38px);filter:blur(4px);
  transition:opacity .8s var(--ease), transform .9s var(--ease), filter .8s var(--ease)}
.fade-up.in{opacity:1;transform:none;filter:blur(0)}
.s1{transition-delay:.06s}.s2{transition-delay:.13s}.s3{transition-delay:.2s}

/* Hero-Headline + Wasserzeichen vor dem JS-Reveal verstecken */
.pa-prep main h1{opacity:0}
.pa-prep .hero-watermark{opacity:0}

/* Scroll-Fortschrittsbalken */
.pa-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;
  background:var(--primary);z-index:9999;pointer-events:none}

/* ---- Reduzierte Bewegung: alles ruhig & sofort sichtbar ---- */
@media (prefers-reduced-motion: reduce){
  .fade-up{opacity:1;transform:none;filter:none}
  .pa-prep main h1,.pa-prep .hero-watermark{opacity:1}
  .pa-loader,.pa-lbar,.pa-progress{display:none!important}
}
