/* ===========================================================
   Bahía Motors · Zeekr — luxe.css
   Capa compartida de motion premium + infoentretenimiento.
   Vanilla. Degrada en touch y en prefers-reduced-motion.
   No reemplaza el CSS por-página; lo complementa.
   =========================================================== */

:root{
  --ease-lux:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Lenis smooth-scroll ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* ---------- Cursor accent (pointer-fine only) ---------- */
.lx-cursor{position:fixed;top:0;left:0;width:9px;height:9px;border-radius:50%;
  background:var(--jade);pointer-events:none;z-index:9999;mix-blend-mode:screen;
  transform:translate(-50%,-50%);opacity:0;transition:opacity .4s,width .3s var(--ease-lux),height .3s var(--ease-lux),background .3s}
.lx-ring{position:fixed;top:0;left:0;width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(16,184,148,.45);pointer-events:none;z-index:9998;
  transform:translate(-50%,-50%);opacity:0;transition:opacity .5s,width .35s var(--ease-lux),height .35s var(--ease-lux),border-color .35s}
body.lx-has-cursor{cursor:none}
body.lx-has-cursor a,body.lx-has-cursor button,body.lx-has-cursor .lx-mag,body.lx-has-cursor [role=button]{cursor:none}
.lx-cursor.on,.lx-ring.on{opacity:1}
.lx-ring.hot{width:64px;height:64px;border-color:rgba(16,184,148,.8)}
.lx-cursor.hot{width:6px;height:6px}

/* ---------- Magnetic buttons ---------- */
.lx-mag{will-change:transform}
.lx-mag>*{display:inline-flex;align-items:center;will-change:transform}

/* ---------- Tilt cards ---------- */
.lx-tilt{transform-style:preserve-3d;will-change:transform;transition:transform .5s var(--ease-lux)}
.lx-tilt .lx-tilt-deep{transform:translateZ(34px);transition:transform .5s var(--ease-lux)}
.lx-tilt .lx-glare{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.16),transparent 55%);
  transition:opacity .4s}
.lx-tilt:hover .lx-glare{opacity:1}

/* ---------- Reveal: mask + rise + stagger ---------- */
[data-lx]{--lx-dl:0ms}
[data-lx="rise"]{opacity:0;transform:translateY(34px);
  transition:opacity 1s var(--ease-lux) var(--lx-dl),transform 1.1s var(--ease-lux) var(--lx-dl)}
[data-lx="rise"].lx-in{opacity:1;transform:none}
[data-lx="zoom"]{opacity:0;transform:scale(.94) translateY(26px);
  transition:opacity 1.1s var(--ease-lux) var(--lx-dl),transform 1.2s var(--ease-lux) var(--lx-dl)}
[data-lx="zoom"].lx-in{opacity:1;transform:none}
[data-lx="clip"]{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s var(--ease-lux) var(--lx-dl)}
[data-lx="clip"].lx-in{clip-path:inset(0 0 0 0)}

/* line-mask word reveal */
.lx-mask{display:inline-block;overflow:hidden;vertical-align:top}
.lx-mask>span{display:inline-block;transform:translateY(110%);
  transition:transform 1.05s var(--ease-lux) var(--lx-dl)}
.lx-mask.lx-in>span{transform:none}

/* image cover-reveal */
.lx-cover{position:relative;overflow:hidden}
.lx-cover::after{content:"";position:absolute;inset:0;z-index:6;background:var(--bg,#05090c);
  transform:translateY(0);transition:transform 1.15s var(--ease-lux)}
.lx-cover.lx-in::after{transform:translateY(-101%)}

/* ---------- Animated meter bars ---------- */
.lx-meter{--val:0;position:relative;height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.lx-meter::after{content:"";position:absolute;inset:0;width:0;border-radius:3px;
  background:linear-gradient(90deg,var(--jade-d,#0a7a66),var(--jade,#10b894));
  transition:width 1.4s var(--ease-lux)}
.lx-meter.lx-in::after{width:calc(var(--val)*1%)}

/* ---------- Page transition veil ---------- */
.lx-veil{position:fixed;inset:0;z-index:9990;pointer-events:none;
  background:linear-gradient(180deg,#06100c,#040b08);
  transform:translateY(100%);will-change:transform}
.lx-veil.in{transform:translateY(0);transition:transform .62s var(--ease-lux)}
.lx-veil.out{transform:translateY(-100%);transition:transform .72s var(--ease-lux)}
.lx-veil .lx-veil-mark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-family:Sora,sans-serif;font-weight:700;letter-spacing:.5em;font-size:14px;
  color:var(--jade,#10b894);opacity:0;transition:opacity .4s}
.lx-veil.in .lx-veil-mark{opacity:1}

/* ---------- Lightbox ---------- */
.lx-lb{position:fixed;inset:0;z-index:9970;display:flex;align-items:center;justify-content:center;
  background:rgba(3,7,5,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease-lux),visibility .45s}
.lx-lb.open{opacity:1;visibility:visible}
.lx-lb-stage{position:relative;max-width:92vw;max-height:84vh;transform:scale(.96);
  transition:transform .55s var(--ease-lux)}
.lx-lb.open .lx-lb-stage{transform:none}
.lx-lb-stage img{max-width:92vw;max-height:84vh;border-radius:6px;display:block;
  box-shadow:0 40px 120px rgba(0,0,0,.6)}
.lx-lb-cap{position:absolute;left:0;bottom:-34px;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:#94a8a2}
.lx-lb-x{position:absolute;top:22px;right:24px;width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.2);background:rgba(8,18,13,.6);color:#eef3f1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s;z-index:2}
.lx-lb-x:hover{border-color:var(--jade,#10b894);color:var(--jade,#10b894)}
.lx-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;
  border:1px solid rgba(255,255,255,.18);background:rgba(8,18,13,.5);color:#eef3f1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s;z-index:2}
.lx-lb-nav:hover{border-color:var(--jade,#10b894);color:var(--jade,#10b894)}
.lx-lb-prev{left:18px}.lx-lb-next{right:18px}
.lx-lb-count{position:absolute;top:26px;left:26px;font-family:Sora,sans-serif;font-size:13px;
  letter-spacing:.2em;color:#94a8a2;z-index:2}
.lx-lb-count b{color:#eef3f1}
@media(max-width:600px){.lx-lb-nav{width:42px;height:42px}.lx-lb-cap{bottom:-30px;font-size:11px}}

/* ---------- Scroll progress rail ---------- */
.lx-prog{position:fixed;top:0;left:0;height:2px;width:0;z-index:9995;
  background:linear-gradient(90deg,var(--jade-d,#0a7a66),var(--jade,#10b894));
  box-shadow:0 0 12px rgba(16,184,148,.5)}

/* ---------- Comparator (gama slider) ---------- */
.lx-comp{position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--line,rgba(255,255,255,.09));
  aspect-ratio:16/9;user-select:none;touch-action:pan-y}
@media(max-width:600px){.lx-comp{aspect-ratio:4/5}}
.lx-comp .lx-layer{position:absolute;inset:0;background-size:cover;background-position:center}
.lx-comp .lx-top{clip-path:inset(0 0 0 var(--sx,50%))}
.lx-comp .lx-veilg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,9,12,.05),rgba(5,9,12,.6))}
.lx-comp .lx-handle{position:absolute;top:0;bottom:0;left:var(--sx,50%);width:2px;
  background:rgba(255,255,255,.85);transform:translateX(-1px);z-index:4;box-shadow:0 0 18px rgba(0,0,0,.5)}
.lx-comp .lx-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.7);
  background:rgba(5,12,9,.45);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;
  cursor:ew-resize}
.lx-comp .lx-knob svg{width:24px;height:24px;color:#fff}
.lx-comp .lx-cl{position:absolute;bottom:18px;z-index:5;font-family:Sora,sans-serif;font-weight:600;
  font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#fff;
  background:rgba(5,12,9,.5);backdrop-filter:blur(5px);padding:8px 13px;border:1px solid var(--line2,rgba(255,255,255,.16));border-radius:3px}
.lx-comp .lx-cl-l{left:18px}.lx-comp .lx-cl-r{right:18px}

/* ---------- "Of another planet" aurora / grain (sober, dark) ---------- */
.lx-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.lx-aurora i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5;will-change:transform}
.lx-aurora i:nth-child(1){width:46vw;height:46vw;left:-8vw;top:-12vw;
  background:radial-gradient(circle,rgba(16,184,148,.16),transparent 70%)}
.lx-aurora i:nth-child(2){width:40vw;height:40vw;right:-10vw;bottom:-14vw;
  background:radial-gradient(circle,rgba(10,122,102,.14),transparent 70%)}
.lx-grain{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- reduced motion / touch fallbacks ---------- */
@media(prefers-reduced-motion:reduce){
  [data-lx]{opacity:1 !important;transform:none !important;clip-path:none !important}
  .lx-mask>span{transform:none !important}
  .lx-cover::after{display:none}
  .lx-meter::after{transition:none;width:calc(var(--val)*1%)}
  .lx-aurora i{animation:none !important}
}