/* Pantalla de carga "Cargando…" de Parapente La Buitrera.
   Está en el HTML de cada página (primer elemento del <body>) para que se vea desde el primer pintado; la retira
   assets/loader.js al terminar la carga. Sin JavaScript la oculta loader-noscript.css y, si un script falla,
   la animación sl-failsafe la desvanece sola a los 10 s. El texto se muestra en el idioma que marca loader.js. */
.sl{position:fixed;inset:0;z-index:2147483000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin:0;padding:24px 16px;
  background:linear-gradient(180deg,#ffffff 0%,#f3f6fb 60%,#e6edff 100%);color:#0a1327;text-align:center;
  font:600 15px/1.4 Barlow,Arial,sans-serif;opacity:1;visibility:visible;animation:sl-failsafe .4s ease 10s forwards}
.sl-logo{display:block;width:104px;height:104px;border-radius:24px;background:#fff;box-shadow:0 16px 36px rgba(10,19,39,.12);animation:sl-glide 2.4s ease-in-out infinite}
.sl-name{display:block;font:800 28px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;letter-spacing:.01em;text-transform:uppercase}
.sl-name em{font-style:normal;color:#164bff}
.sl-bar{position:relative;display:block;width:min(210px,60vw);height:4px;margin-top:8px;border-radius:4px;background:rgba(22,75,255,.14);overflow:hidden}
.sl-bar i{position:absolute;top:0;bottom:0;left:0;width:40%;border-radius:inherit;background:#164bff;animation:sl-slide 1.15s ease-in-out infinite}
.sl-text{display:none;font-size:14px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#596476}
.sl-text[data-sl=es],html[data-sl-lang=en] .sl-text[data-sl=en],html[data-sl-lang=pt] .sl-text[data-sl=pt]{display:block}
html[data-sl-lang=en] .sl-text[data-sl=es],html[data-sl-lang=pt] .sl-text[data-sl=es]{display:none}
/* Con JavaScript activo, loader.js manda (espera el evento load); la animación de emergencia solo actúa a los 20 s */
html[data-sl-js] .sl{animation-delay:20s}
.sl.sl-out{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s}
@keyframes sl-slide{from{transform:translateX(-100%)}to{transform:translateX(250%)}}
@keyframes sl-glide{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
@keyframes sl-failsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.sl-logo,.sl-bar i{animation:none}.sl-bar i{width:100%;opacity:.5}}