/* ════════════════════════════════════════════════════════════════════
   SD-LASH · rediseño RADICAL exclusivo de las 4 landings de extensiones
   (clásicas · húmedas · híbridas · volumen express). Scoped a .sd-lash
   para no afectar a las otras 12 páginas. Se carga DESPUÉS de sd-lux.css.
   Explota: tracking-in · container-text-scroll · ai-image orbit ·
   embla carousel · stats marquee + avatar stack. Vanilla, paleta de marca.
   ════════════════════════════════════════════════════════════════════ */

.sd-lash{ --lx-gold:#C9A24E; --lx-gold-l:#ECD7A4; --lx-gold-d:#9A7B36;
  --lx-wine:#6E0518; --lx-wine-d:#4E0610; --lx-cherry:#7A0712; --lx-ink:#45070C; --lx-paper:#FBF6ED; }

/* ════════ HERO · cinematográfico + tracking-in ════════ */
.sd-lash .sd-hero{ min-height:clamp(560px,92vh,860px); display:flex; align-items:center;
  background:
    radial-gradient(900px circle at 78% 18%, rgba(201,162,78,.16), transparent 55%),
    radial-gradient(130% 120% at 80% -10%, #7A0712 0%, #4E0610 55%, #2C0309 100%); }
.sd-lash .sd-hero-grid{ align-items:center; gap:clamp(2rem,5vw,4.5rem); }
/* entrada controlada: anulamos el reveal del hero y animamos nosotros */
.sd-lash .sd-hero .reveal{ opacity:1 !important; transform:none !important; }
.sd-lash .sd-back{ opacity:0; animation:lx-fade .8s ease .2s forwards; }
.sd-lash .sd-eyebrow{ opacity:0; letter-spacing:.42em; animation:lx-fade .9s ease .35s forwards; color:var(--lx-gold-l); }
.sd-lash .sd-title{ font-size:clamp(2.8rem,7vw,5.6rem); line-height:.98; letter-spacing:-.01em;
  display:inline-block; animation:lx-tracking 1.25s cubic-bezier(.16,1,.3,1) .15s both; }
@keyframes lx-tracking{ 0%{ letter-spacing:.5em; filter:blur(16px); opacity:0; } 55%{ opacity:1; } 100%{ letter-spacing:-.01em; filter:blur(0); opacity:1; } }
.sd-lash .sd-subtitle{ opacity:0; font-size:clamp(1.1rem,2.2vw,1.5rem); animation:lx-rise 1s cubic-bezier(.16,1,.3,1) .7s forwards; }
.sd-lash .sd-meta{ opacity:0; animation:lx-rise 1s cubic-bezier(.16,1,.3,1) .9s forwards; }
.sd-lash .sd-meta-v{ background:linear-gradient(120deg,#fff,var(--lx-gold-l)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.sd-lash .sd-cta-row{ opacity:0; animation:lx-rise 1s cubic-bezier(.16,1,.3,1) 1.05s forwards; }
@keyframes lx-fade{ to{opacity:1;} }
@keyframes lx-rise{ from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:none;} }

/* imagen del hero: doble marco dorado + overlay + glow */
.sd-lash .sd-hero-media{ border-radius:26px; overflow:visible; opacity:0; animation:lx-media 1.3s cubic-bezier(.16,1,.3,1) .5s forwards; }
@keyframes lx-media{ from{opacity:0; transform:translateY(30px) scale(.96);} to{opacity:1; transform:none;} }
.sd-lash .sd-hero-media img{ border-radius:20px; box-shadow:0 50px 100px -40px rgba(0,0,0,.7); }
.sd-lash .sd-hero-media::before{ content:""; position:absolute; inset:-14px; border-radius:30px; pointer-events:none;
  border:1px solid rgba(201,162,78,.4); box-shadow:0 0 80px rgba(201,162,78,.14) inset; }
.sd-lash .sd-hero-media::after{ content:""; position:absolute; inset:0; border-radius:20px; pointer-events:none;
  background:linear-gradient(180deg, transparent 55%, rgba(78,6,16,.5)); }

/* ✦ Proof band (avatar stack + rating) inyectado en el hero */
.lash-proof{ display:flex; align-items:center; gap:1.1rem; margin-top:1.8rem; opacity:0; animation:lx-rise 1s ease 1.25s forwards; flex-wrap:wrap; }
.lash-proof-stack{ display:flex; }
.lash-proof-stack img{ width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid var(--lx-wine-d); margin-left:-12px; box-shadow:0 4px 12px rgba(0,0,0,.4); }
.lash-proof-stack img:first-child{ margin-left:0; }
.lash-proof-txt{ font-family:'Manrope',sans-serif; font-size:.82rem; line-height:1.35; color:rgba(252,251,249,.82); }
.lash-proof-txt b{ color:#fff; font-weight:700; }
.lash-proof-stars{ color:var(--lx-gold-l); letter-spacing:.12em; font-size:.78rem; }

/* ════════════════════════════════════════════════════════════════════
   ✦ LASH-STAGE · showcase 3D que se endereza al hacer scroll
   (inspiración: container-text-scroll)
   ════════════════════════════════════════════════════════════════════ */
.lash-stage{ background:linear-gradient(180deg,#FBF6ED,#F1E6D3); padding:clamp(3rem,6vw,5rem) 0 clamp(4rem,8vw,7rem); overflow:hidden; }
.lash-stage-head{ text-align:center; max-width:680px; margin:0 auto clamp(1.6rem,3vw,2.4rem); padding-inline:1.2rem; }
.lash-stage-persp{ perspective:1600px; max-width:1080px; margin-inline:auto; padding-inline:clamp(1rem,3vw,1.6rem); }
.lash-stage-card{ position:relative; width:100%; aspect-ratio:16/9; border-radius:26px; overflow:hidden;
  border:4px solid rgba(201,162,78,.35); background:#222;
  transform:perspective(1600px) rotateX(calc((1 - var(--p,0)) * 24deg)) scale(calc(.86 + var(--p,0) * .14));
  transform-origin:center bottom; will-change:transform;
  box-shadow:0 60px 120px -50px rgba(78,6,16,.65); }
.lash-stage-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.lash-stage-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(44,3,9,.15) 0%, rgba(44,3,9,.2) 45%, rgba(44,3,9,.78) 100%); }
.lash-stage-cap{ position:absolute; inset:auto 0 0 0; z-index:2; padding:clamp(1.6rem,4vw,3rem); text-align:center; }
.lash-stage-cap .e{ font-family:'Manrope',sans-serif; font-size:.66rem; letter-spacing:.34em; text-transform:uppercase; color:var(--lx-gold-l); }
.lash-stage-cap h3{ font-family:'Italiana',serif; font-weight:400; color:#fff; line-height:1.05; margin:.6rem 0 0; font-size:clamp(1.6rem,4vw,3.2rem); text-wrap:balance; }
.lash-stage-cap h3 em{ font-family:'Cormorant Garamond',serif; font-style:italic;
  background:linear-gradient(115deg,var(--lx-gold-l),var(--lx-gold)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }

/* ════════════════════════════════════════════════════════════════════
   ✦ LASH-ORBIT · galería en órbita 3D (inspiración: ai-image-generator-hero)
   ════════════════════════════════════════════════════════════════════ */
.lash-orbit{ position:relative; overflow:hidden; padding:clamp(3.5rem,7vw,6rem) 0;
  background:
    radial-gradient(700px circle at 50% 30%, rgba(201,162,78,.14), transparent 60%),
    radial-gradient(130% 110% at 50% 0%, #6E0518, #4E0610 60%, #36040C 100%);
  color:#fff; }
.lash-orbit::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.4; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E"); }
.lash-orbit-stage{ position:relative; height:min(64vw,560px); display:flex; align-items:center; justify-content:center;
  perspective:1400px; z-index:1; }
.lash-orbit-ring{ position:absolute; width:300px; height:300px; transform-style:preserve-3d;
  animation:lash-ring 34s linear infinite; will-change:transform; }
.lash-orbit:hover .lash-orbit-ring{ animation-play-state:paused; }
@keyframes lash-ring{ from{ transform:rotateY(0deg); } to{ transform:rotateY(360deg); } }
.lash-orbit-card{ position:absolute; top:50%; left:50%; width:148px; height:196px; margin:-98px 0 0 -74px;
  border-radius:16px; overflow:hidden; border:1px solid rgba(236,215,164,.35); box-shadow:0 24px 50px -20px rgba(0,0,0,.6);
  transform:rotateY(calc(var(--i) * 45deg)) translateZ(330px); backface-visibility:hidden; }
.lash-orbit-card img{ width:100%; height:100%; object-fit:cover; }
.lash-orbit-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(78,6,16,.45)); }
.lash-orbit-core{ position:relative; z-index:3; text-align:center; max-width:440px; padding:1.6rem; pointer-events:none; }
.lash-orbit-core .e{ font-family:'Manrope',sans-serif; font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; color:var(--lx-gold-l); }
.lash-orbit-core h2{ font-family:'Italiana',serif; font-weight:400; font-size:clamp(1.8rem,4.4vw,3rem); line-height:1.05; margin:.6rem 0 0; color:#fff; text-shadow:0 4px 30px rgba(44,3,9,.7); }
.lash-orbit-core h2 em{ font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--lx-gold-l); }
.lash-orbit-core p{ font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.05rem; color:rgba(252,251,249,.8); margin:.8rem auto 0; max-width:340px; }
@media (max-width:640px){ .lash-orbit-card{ width:108px; height:144px; margin:-72px 0 0 -54px; transform:rotateY(calc(var(--i) * 45deg)) translateZ(220px); } .lash-orbit-ring{ animation-duration:42s; } }

/* ════════════════════════════════════════════════════════════════════
   ✦ LASH-RITUAL · carrusel de 4 momentos (inspiración: embla/onboarding)
   ════════════════════════════════════════════════════════════════════ */
.lash-ritual{ background:linear-gradient(180deg,#F1E6D3,#FBF6ED); padding:clamp(3.5rem,7vw,6rem) 0; }
.lash-ritual-head{ text-align:center; max-width:640px; margin:0 auto clamp(2rem,4vw,3rem); padding-inline:1.2rem; }
.lash-ritual-vp{ overflow:hidden; max-width:1180px; margin-inline:auto; padding-inline:clamp(1rem,3vw,1.6rem); }
.lash-ritual-track{ display:flex; gap:clamp(1rem,2vw,1.5rem); scroll-snap-type:x mandatory; overflow-x:auto; scroll-behavior:smooth;
  -ms-overflow-style:none; scrollbar-width:none; padding-bottom:.5rem; }
.lash-ritual-track::-webkit-scrollbar{ display:none; }
.lash-ritual-slide{ position:relative; flex:0 0 86%; max-width:560px; scroll-snap-align:center; border-radius:24px; overflow:hidden;
  aspect-ratio:4/5; min-height:380px; box-shadow:0 34px 70px -38px rgba(78,6,16,.6); }
@media (min-width:760px){ .lash-ritual-slide{ flex-basis:42%; } }
@media (min-width:1100px){ .lash-ritual-slide{ flex-basis:30%; } }
.lash-ritual-slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.16,1,.3,1); }
.lash-ritual-slide:hover img{ transform:scale(1.06); }
.lash-ritual-slide::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(44,3,9,.1) 0%, rgba(44,3,9,.35) 45%, rgba(44,3,9,.9) 100%); }
.lash-ritual-body{ position:absolute; inset:auto 0 0 0; z-index:2; padding:clamp(1.4rem,3vw,2rem); color:#fff; }
.lash-ritual-num{ font-family:'Italiana',serif; font-size:1rem; color:var(--lx-wine-d); width:42px; height:42px; display:grid; place-items:center; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--lx-gold-l), var(--lx-gold) 65%, var(--lx-gold-d)); box-shadow:0 8px 20px -8px rgba(201,162,78,.8); margin-bottom:.9rem; }
.lash-ritual-body h3{ font-family:'Italiana',serif; font-weight:400; font-size:1.5rem; margin:0 0 .5rem; }
.lash-ritual-body p{ font-family:'Manrope',sans-serif; font-size:.92rem; line-height:1.55; color:rgba(252,251,249,.85); }
.lash-ritual-ctrl{ display:flex; align-items:center; justify-content:center; gap:1.4rem; margin-top:1.8rem; }
.lash-ritual-dots{ display:flex; gap:.5rem; }
.lash-ritual-dot{ width:9px; height:9px; border-radius:50%; border:none; cursor:pointer; padding:0; background:rgba(122,7,18,.25); transition:all .35s ease; }
.lash-ritual-dot.is-on{ width:26px; border-radius:5px; background:linear-gradient(90deg,var(--lx-gold),var(--lx-gold-d)); }
.lash-ritual-arrow{ width:46px; height:46px; border-radius:50%; border:1px solid rgba(122,7,18,.3); background:#fff; color:var(--lx-cherry); cursor:pointer;
  display:grid; place-items:center; font-size:1.1rem; transition:all .3s ease; box-shadow:0 10px 24px -14px rgba(78,6,16,.5); }
.lash-ritual-arrow:hover{ background:var(--lx-cherry); color:#fff; transform:translateY(-2px); }

/* ════════ overrides finos para integrar el resto de secciones ════════ */
.sd-lash .sdlx-fit{ background:linear-gradient(180deg,#FFFDF8,#F3E8D6); }
.sd-lash .sd-neuro{ position:relative; }

@media (prefers-reduced-motion:reduce){
  .sd-lash .sd-title, .sd-lash .sd-hero-media, .sd-lash .lash-proof,
  .sd-lash .sd-back, .sd-lash .sd-eyebrow, .sd-lash .sd-subtitle, .sd-lash .sd-meta, .sd-lash .sd-cta-row{ animation:none !important; opacity:1 !important; }
  .lash-orbit-ring{ animation:none !important; }
}
