/* ═══════════════════════════════════════════════════════════════
   ESPACIO TOLTECA — Jimena Camacho
   Dirección: "El faro en la noche".
   Noche violeta profunda + haz de luz dorado. Serif de alto
   contraste sobre geométrica cálida. Una sección clara (crema)
   como amanecer en el medio del recorrido.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --noche:      #14101E;
  --noche-2:    #1B1530;
  --noche-3:    #241B3D;
  --violeta:    #4A2E7A;
  --violeta-2:  #6B47A8;
  --lila:       #C0AAE4;
  --lila-2:     #E6DCF7;
  --dorado:     #D8B26A;
  --dorado-2:   #F2DFB0;
  --dorado-3:   #A8813F;
  --crema:      #FAF5EC;
  --crema-2:    #F1E8DA;
  --tinta:      #241C31;
  --tinta-2:    #5B4F70;
  --wa:         #25D366;
  --wa-dark:    #128C7E;

  --serif: "Cormorant Garamond", Georgia, serif;
  --sans:  "Jost", "Segoe UI", sans-serif;
  --script:"Parisienne", cursive;

  --gutter: clamp(1.15rem, 5vw, 4.5rem);
  --maxw: 1240px;
  --r: 18px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

/* ── reset ── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:80px; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--noche);
  color:var(--lila-2);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(1rem, .96rem + .25vw, 1.12rem);
  line-height:1.72;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.loading{ overflow:hidden; }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; cursor:pointer; }
h1,h2,h3{ font-family:var(--serif); font-weight:400; line-height:1.05; margin:0; letter-spacing:-.01em; }
h1{ font-size:clamp(2.35rem, 1.4rem + 3.5vw, 4.1rem); line-height:1.1; }
h2{ font-size:clamp(2rem, 1.35rem + 2.7vw, 3.5rem); line-height:1.08; }
h3{ font-size:clamp(1.42rem, 1.15rem + .9vw, 1.85rem); }
h1 em,h2 em,h3 em{ font-style:italic; color:var(--dorado-2); }
p{ margin:0 0 1.05em; }
b,strong{ font-weight:500; color:#fff; }
::selection{ background:var(--dorado); color:var(--noche); }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); position:relative; z-index:2; }
.wrap--narrow{ max-width:820px; }
.center{ text-align:center; }

/* ═════════ PRELOADER ═════════ */
.preload{
  position:fixed; inset:0; z-index:10000; display:grid; place-items:center;
  background:radial-gradient(70% 60% at 50% 40%, #241B3D, #14101E 70%);
  transition:opacity .8s var(--ease), visibility .8s;
}
.preload.done{ opacity:0; visibility:hidden; }
.preload__inner{ display:flex; flex-direction:column; align-items:center; gap:1.4rem; }
.preload__faro{ width:74px; height:104px; color:var(--dorado); filter:drop-shadow(0 0 22px rgba(216,178,106,.55)); }
.preload__faro .faro-ray{ animation:rays 1.7s var(--ease) infinite; }
@keyframes rays{ 0%,100%{ opacity:.25 } 50%{ opacity:1 } }
.preload__name{
  font-family:var(--serif); font-size:1.1rem; letter-spacing:.4em; text-transform:uppercase;
  color:var(--lila-2); padding-left:.4em;
}
.preload__bar{ width:130px; height:2px; background:rgba(192,170,228,.2); border-radius:2px; overflow:hidden; }
.preload__bar i{
  display:block; height:100%; width:0; border-radius:2px;
  background:linear-gradient(90deg,var(--dorado-3),var(--dorado-2));
  animation:load 1.5s var(--ease-out) forwards;
}
@keyframes load{ to{ width:100% } }

/* ═════════ CAPAS FX ═════════ */
.grain{
  position:fixed; inset:0; z-index:9000; 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='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
.fx{ position:fixed; inset:0; z-index:0; pointer-events:none; width:100%; height:100%; }
.progress{ position:fixed; top:0; left:0; right:0; height:2px; z-index:960; background:transparent; }
.progress i{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg,var(--violeta-2),var(--dorado));
  box-shadow:0 0 12px rgba(216,178,106,.7);
  transition:width .1s linear;
}

/* ── eyebrow ── */
.eyebrow{
  font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; font-weight:500;
  color:var(--dorado); margin:0 0 1.1rem; display:flex; align-items:center; gap:.85rem;
}
.eyebrow::after{ content:""; height:1px; flex:1; max-width:80px; background:linear-gradient(90deg,var(--dorado-3),transparent); }
.eyebrow--center{ justify-content:center; text-align:center; }
.eyebrow--center::before{ content:""; height:1px; flex:0 0 60px; background:linear-gradient(90deg,transparent,var(--dorado-3)); }
.eyebrow--center::after{ flex:0 0 60px; max-width:none; }

.section-lead{ max-width:640px; margin:1.2rem auto 0; text-align:center; color:var(--lila); font-size:1.08rem; }

/* ── atmósfera ── */
.beam{
  position:absolute; inset:-25% -10% auto -10%; height:130%; pointer-events:none; z-index:0;
  background:
    radial-gradient(58% 44% at 78% 8%, rgba(216,178,106,.20), transparent 62%),
    conic-gradient(from 196deg at 84% 4%, transparent 0deg, rgba(216,178,106,.14) 9deg, transparent 22deg),
    conic-gradient(from 214deg at 84% 4%, transparent 0deg, rgba(192,170,228,.10) 14deg, transparent 30deg);
  filter:blur(2px);
  animation:beam 16s var(--ease) infinite alternate;
}
.beam--soft{ opacity:.55; }
@keyframes beam{ from{ transform:rotate(-1.4deg) scale(1.02); opacity:.75 } to{ transform:rotate(1.4deg) scale(1.06); opacity:1 } }

/* luz que sigue el mouse */
.lightfollow{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%), rgba(216,178,106,.13), transparent 65%);
  transition:opacity .6s var(--ease);
}
.hero:hover .lightfollow{ opacity:1; }

/* ── botones ── */
.btn{
  --bg:var(--dorado); --fg:var(--noche);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--sans); font-weight:500; font-size:.98rem; letter-spacing:.02em;
  padding:1.02em 1.85em; border-radius:100px; border:1px solid transparent;
  background:var(--bg); color:var(--fg); position:relative; overflow:hidden;
  transition:transform .4s var(--ease-out), box-shadow .35s var(--ease), background .3s, color .3s;
  box-shadow:0 10px 30px -12px rgba(216,178,106,.55);
  text-align:center; line-height:1.25; will-change:transform;
}
.btn > *{ position:relative; z-index:2; }
.btn::after{
  content:""; position:absolute; inset:0; transform:translateX(-105%); pointer-events:none; z-index:1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transition:transform .8s var(--ease);
}
.btn:hover{ box-shadow:0 18px 44px -14px rgba(216,178,106,.85); }
.btn:hover::after{ transform:translateX(105%); }
.btn:focus-visible{ outline:2px solid var(--dorado-2); outline-offset:3px; }

.btn--gold{ background:linear-gradient(135deg,var(--dorado-2),var(--dorado) 55%,var(--dorado-3)); color:#1A1226; }
.btn--ghost{ background:transparent; color:var(--lila-2); border-color:rgba(192,170,228,.36); box-shadow:none; }
.btn--ghost:hover{ background:rgba(192,170,228,.1); border-color:var(--lila); box-shadow:none; }
.btn--dark{ background:var(--violeta); color:#fff; box-shadow:0 10px 30px -14px rgba(74,46,122,.9); }
.btn--dark:hover{ background:var(--violeta-2); }
.btn--sm{ padding:.66em 1.2em; font-size:.86rem; }
.btn--lg{ padding:1.15em 2.15em; font-size:1.04rem; }
.btn--xl{ padding:1.3em 2.7em; font-size:1.14rem; }
.ico{ width:1.18em; height:1.18em; flex:none; }
.ico--sm{ width:1em; height:1em; }

/* ── reveal + split text ── */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease-out) var(--d,0s), transform .9s var(--ease-out) var(--d,0s); }
.reveal.in{ opacity:1; transform:none; }

/* padding+margin negativo: el overflow:hidden no debe cortar las colas
   de las letras (y, g, p) ni los acentos */
.word{
  display:inline-block; overflow:hidden; vertical-align:bottom;
  padding:.16em .04em .18em; margin:-.16em -.04em -.18em;
}
.word i{
  display:inline-block; font-style:inherit; transform:translateY(105%) rotate(4deg); opacity:0;
  transition:transform .95s var(--ease-out) var(--wd,0s), opacity .7s ease var(--wd,0s);
}
[data-split].in .word i{ transform:none; opacity:1; }

/* ══════════ NAV ══════════ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:900;
  display:flex; align-items:center; gap:1.6rem;
  padding:.95rem var(--gutter);
  transition:background .45s var(--ease), backdrop-filter .45s, border-color .45s, padding .45s, transform .5s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.stuck{
  background:rgba(20,16,30,.88); backdrop-filter:blur(18px) saturate(1.4);
  border-bottom-color:rgba(192,170,228,.14); padding-block:.6rem;
}
.nav.hide{ transform:translateY(-105%); }
.nav__brand{ display:flex; align-items:center; gap:.6rem; margin-right:auto; }
.nav__lotus{ width:34px; height:22px; color:var(--dorado); flex:none; transition:transform .5s var(--ease-out); }
.nav__brand:hover .nav__lotus{ transform:rotate(-8deg) scale(1.1); }
.nav__name{ font-family:var(--serif); font-size:1.16rem; letter-spacing:.11em; text-transform:uppercase; color:var(--lila-2); }
.nav__links{ display:flex; gap:1.75rem; }
.nav__links a{ font-size:.86rem; letter-spacing:.05em; color:var(--lila); position:relative; padding-block:.3rem; transition:color .3s; }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--dorado); transition:width .4s var(--ease-out); }
.nav__links a:hover{ color:#fff; }
.nav__links a:hover::after{ width:100%; }

.burger{
  display:none; width:44px; height:38px; border:0; background:transparent; cursor:pointer;
  padding:0; place-items:center; gap:6px; flex-direction:column;
}
.burger span{ display:block; width:24px; height:1.6px; background:var(--lila-2); border-radius:2px; transition:transform .4s var(--ease-out), opacity .3s; }
.burger[aria-expanded="true"] span:first-child{ transform:translateY(3.8px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.8px) rotate(-45deg); }

.drawer{
  position:fixed; inset:0; z-index:890; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:.4rem;
  background:rgba(16,12,26,.97); backdrop-filter:blur(20px);
  opacity:0; transition:opacity .45s var(--ease);
}
.drawer[hidden]{ display:none; }
.drawer.open{ opacity:1; }
.drawer nav{ display:flex; flex-direction:column; align-items:center; gap:.2rem; margin-bottom:2rem; }
.drawer nav a{
  font-family:var(--serif); font-size:1.85rem; color:var(--lila-2); padding:.45rem 1rem;
  opacity:0; transform:translateY(16px); transition:opacity .5s var(--ease-out) var(--dd,0s), transform .5s var(--ease-out) var(--dd,0s), color .3s;
}
.drawer.open nav a{ opacity:1; transform:none; }
.drawer nav a:hover{ color:var(--dorado-2); }

@media (max-width:1000px){
  .nav__links{ display:none; }
  .burger{ display:flex; }
}
@media (max-width:520px){ .nav__cta{ display:none; } .nav__name{ font-size:1rem; } }

/* ══════════ HERO ══════════ */
.hero{
  position:relative; overflow:hidden;
  padding:clamp(7rem,14vh,9.5rem) 0 3rem;
  background:
    radial-gradient(120% 85% at 80% 0%, #2A1F45 0%, transparent 58%),
    radial-gradient(90% 70% at 8% 100%, #241940 0%, transparent 60%),
    linear-gradient(175deg, var(--noche-2), var(--noche) 62%);
}
.hero__grid{
  width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  position:relative; z-index:2;
  display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(2rem,5vw,4.5rem); align-items:center;
}
.hero__copy h1{ margin-bottom:1.4rem; text-wrap:balance; }
.hero__lead{ font-size:clamp(1.04rem,1rem + .35vw,1.24rem); color:var(--lila); max-width:32em; margin-bottom:2.1rem; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.85rem; }
.hero__micro{ margin-top:1.35rem; font-size:.86rem; color:rgba(192,170,228,.75); letter-spacing:.02em; }

.hero__portrait{ margin:0; position:relative; justify-self:center; max-width:440px; width:100%; }
.portrait__halo{
  position:absolute; inset:-14% -12%; z-index:0; border-radius:50%;
  background:radial-gradient(circle at 50% 42%, rgba(216,178,106,.34), rgba(107,71,168,.2) 45%, transparent 68%);
  filter:blur(28px); animation:halo 9s ease-in-out infinite alternate;
}
@keyframes halo{ from{ transform:scale(.94); opacity:.7 } to{ transform:scale(1.08); opacity:1 } }
.portrait__ring{
  position:absolute; inset:-6%; z-index:0; border-radius:50%;
  border:1px dashed rgba(216,178,106,.28);
  animation:spin 46s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg) } }
/* velo oscuro al pie: la firma dorada tiene que leerse sobre la camisa clara */
.hero__portrait picture{ display:block; position:relative; z-index:1; }
.hero__portrait picture::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:34%;
  border-radius:0 0 26px 26px; pointer-events:none;
  background:linear-gradient(0deg, rgba(16,12,26,.92) 8%, rgba(16,12,26,.55) 45%, transparent);
}
.hero__portrait img{
  width:100%; border-radius:280px 280px 26px 26px;
  border:1px solid rgba(216,178,106,.42);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9), 0 0 0 8px rgba(192,170,228,.06);
  will-change:transform;
}
.hero__portrait figcaption{
  position:relative; z-index:2; margin-top:-2.6rem; text-align:center;
  display:flex; flex-direction:column; gap:.15rem;
}
.sig{ font-family:var(--script); font-size:2.1rem; color:var(--dorado-2); line-height:1; text-shadow:0 4px 18px rgba(20,16,30,.9); }
.hero__portrait figcaption span:last-child{ font-size:.74rem; letter-spacing:.17em; text-transform:uppercase; color:var(--lila); }

.trustbar{
  list-style:none; margin:clamp(3rem,7vh,4.5rem) auto 0; padding:1.6rem var(--gutter);
  width:100%; max-width:var(--maxw); position:relative; z-index:2;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  border-top:1px solid rgba(192,170,228,.15); border-bottom:1px solid rgba(192,170,228,.15);
}
.trustbar li{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.2rem; }
.trustbar b{ font-family:var(--serif); font-size:1.42rem; color:var(--dorado-2); font-weight:500; letter-spacing:.04em; }
.trustbar span{ font-size:.76rem; letter-spacing:.09em; text-transform:uppercase; color:var(--lila); }

.scrollcue{
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
  margin:2.6rem auto 0; position:relative; z-index:2; width:max-content;
}
.scrollcue__line{ width:1px; height:46px; background:linear-gradient(180deg,transparent,var(--dorado)); position:relative; overflow:hidden; }
.scrollcue__line::after{
  content:""; position:absolute; left:0; top:0; width:100%; height:14px; background:var(--dorado-2);
  animation:cue 2.2s var(--ease) infinite;
}
@keyframes cue{ 0%{ transform:translateY(-16px); opacity:0 } 40%{opacity:1} 100%{ transform:translateY(48px); opacity:0 } }
.scrollcue__txt{ font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:rgba(192,170,228,.6); }

@media (max-width:900px){
  /* Todo el hero se compacta: el CTA de WhatsApp tiene que verse SIN scrollear */
  .hero{ padding-top:5rem; text-align:center; }
  .hero__grid{ grid-template-columns:1fr; gap:1.2rem; }
  .hero__portrait{ order:-1; max-width:182px; }
  .hero__portrait figcaption{ margin-top:-1.7rem; }
  .sig{ font-size:1.45rem; }
  .hero__portrait figcaption span:last-child{ font-size:.58rem; letter-spacing:.09em; }
  .hero .eyebrow{ font-size:.64rem; letter-spacing:.2em; margin-bottom:.75rem; }
  .hero__copy h1{ margin-bottom:.9rem; }
  .hero__lead{ font-size:.98rem; margin-bottom:1.3rem; }
  .hero__micro{ margin-top:1rem; font-size:.78rem; }
  .trustbar{ margin-top:2.4rem; }
  .eyebrow{ justify-content:center; }
  .eyebrow::after{ display:none; }
  .hero__lead{ margin-inline:auto; }
  .hero__cta{ justify-content:center; }
  .trustbar{ grid-template-columns:repeat(2,1fr); gap:1.5rem 1rem; }
  .scrollcue{ display:none; }
}
/* pantallas bajas (Android chicos): apretar todavía un poco más
   para que "Agendá tu sesión" no caiga debajo del fold */
@media (max-width:900px) and (max-height:800px){
  .hero{ padding-top:4.4rem; }
  .hero__portrait{ max-width:152px; }
  .hero__portrait figcaption{ margin-top:-1.4rem; }
  .sig{ font-size:1.25rem; }
  .hero__copy h1{ font-size:clamp(1.95rem,1.2rem + 3vw,2.4rem); }
  .hero__lead{ font-size:.92rem; margin-bottom:1.15rem; }
  .hero__micro{ margin-top:.8rem; }
}
@media (max-width:400px){ .hero__cta .btn{ width:100%; } }

/* ══════════ MARQUEE ══════════ */
.marquee{
  overflow:hidden; padding:1.1rem 0; position:relative; z-index:2;
  background:linear-gradient(90deg,#1B1530,#241B3D,#1B1530);
  border-block:1px solid rgba(216,178,106,.2);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee__track{
  display:flex; align-items:center; gap:2.2rem; width:max-content;
  animation:marq 42s linear infinite;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee span{
  font-family:var(--serif); font-size:clamp(1.15rem,1rem + .7vw,1.7rem); font-style:italic;
  color:var(--lila-2); white-space:nowrap; letter-spacing:.02em;
}
.marquee i{ color:var(--dorado); font-style:normal; font-size:.8rem; }
@keyframes marq{ to{ transform:translateX(-50%) } }

/* ══════════ ESPEJO ══════════ */
.mirror{ padding:clamp(4.5rem,10vh,7.5rem) 0; background:var(--noche); position:relative; }
.mirror h2{ margin-bottom:2.8rem; text-wrap:balance; }
.mirror__list{
  list-style:none; margin:0 auto 3rem; padding:0; max-width:880px;
  display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem;
}
.mirror__list li{
  padding:1.2rem 1.35rem 1.2rem 3.1rem; position:relative; overflow:hidden;
  background:linear-gradient(135deg, rgba(74,46,122,.24), rgba(27,21,48,.5));
  border:1px solid rgba(192,170,228,.15); border-radius:var(--r);
  font-size:1rem; color:var(--lila-2);
  transition:border-color .4s, transform .45s var(--ease-out), background .4s, box-shadow .4s;
}
.mirror__list li::before{
  content:""; position:absolute; left:1.25rem; top:1.55rem; width:9px; height:9px; border-radius:50%;
  background:var(--dorado); box-shadow:0 0 12px 2px rgba(216,178,106,.6);
  transition:transform .45s var(--ease-out), box-shadow .4s;
}
.mirror__list li:hover{
  border-color:rgba(216,178,106,.45); transform:translateX(6px);
  background:linear-gradient(135deg, rgba(74,46,122,.4), rgba(27,21,48,.5));
  box-shadow:0 18px 40px -24px rgba(216,178,106,.5);
}
.mirror__list li:hover::before{ transform:scale(1.35); box-shadow:0 0 20px 4px rgba(216,178,106,.85); }

.pullquote{
  margin:0 auto 2.8rem; max-width:760px; text-align:center; padding:2.4rem 1.5rem 0;
  border-top:1px solid rgba(216,178,106,.28); position:relative;
}
.pullquote::before{
  content:"❝"; position:absolute; top:-.15em; left:50%; transform:translateX(-50%);
  font-family:var(--serif); font-size:3.4rem; color:var(--dorado); background:var(--noche); padding-inline:.35em; line-height:1;
}
.pullquote p{ font-family:var(--serif); font-size:clamp(1.42rem,1.1rem + 1.2vw,2.05rem); font-style:italic; color:#fff; line-height:1.35; margin-bottom:.7rem; }
.pullquote cite{ font-family:var(--script); font-size:1.65rem; color:var(--dorado-2); font-style:normal; }

@media (max-width:760px){ .mirror__list{ grid-template-columns:1fr; } }

/* ══════════ SERVICIOS ══════════ */
.services{
  padding:clamp(4.5rem,10vh,7.5rem) 0;
  background:linear-gradient(180deg,var(--noche),#1A1430 40%,var(--noche));
}
.services h2{ text-wrap:balance; }
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; margin-top:3.2rem; perspective:1400px; }
.card{
  position:relative; padding:3.4rem 1.85rem 2rem; border-radius:22px; overflow:hidden;
  background:linear-gradient(165deg, rgba(36,27,61,.95), rgba(20,16,30,.95));
  border:1px solid rgba(192,170,228,.16);
  display:flex; flex-direction:column;
  transform-style:preserve-3d; will-change:transform;
  transition:border-color .45s, box-shadow .45s, transform .5s var(--ease-out);
}
.card::before{
  content:""; position:absolute; inset:0 0 auto; height:2px; z-index:3;
  background:linear-gradient(90deg,transparent,var(--dorado),transparent);
  opacity:0; transition:opacity .45s;
}
.card__glow{
  position:absolute; inset:0; z-index:0; opacity:0; pointer-events:none;
  background:radial-gradient(340px circle at var(--gx,50%) var(--gy,50%), rgba(216,178,106,.16), transparent 70%);
  transition:opacity .45s;
}
/* el glow va detrás; num y badge conservan su posicionamiento absoluto */
.card > *:not(.card__glow):not(.card__num):not(.card__badge){ position:relative; z-index:1; }
.card:hover{ border-color:rgba(216,178,106,.45); box-shadow:0 40px 80px -38px rgba(0,0,0,.95), 0 0 40px -20px rgba(216,178,106,.4); }
.card:hover::before, .card:hover .card__glow{ opacity:1; }
.card--feat{ background:linear-gradient(165deg, rgba(74,46,122,.5), rgba(20,16,30,.97)); border-color:rgba(216,178,106,.3); }
.card__badge{
  position:absolute; top:1.2rem; left:1.85rem; z-index:3;
  font-size:.63rem; letter-spacing:.18em; text-transform:uppercase; font-weight:500;
  color:#1A1226; background:linear-gradient(135deg,var(--dorado-2),var(--dorado));
  padding:.36em .9em; border-radius:100px; white-space:nowrap;
}
.card__num{
  position:absolute; top:1.1rem; right:1.6rem; z-index:1;
  font-family:var(--serif); font-size:3.2rem; font-weight:300;
  color:rgba(216,178,106,.18); line-height:1; transition:color .45s, transform .5s var(--ease-out);
}
.card:hover .card__num{ color:rgba(216,178,106,.34); transform:translateY(-4px); }
.card__ico{ width:44px; height:44px; color:var(--dorado); margin-bottom:1.15rem; transition:transform .55s var(--ease-out); }
.card:hover .card__ico{ transform:translateZ(30px) scale(1.08) rotate(-4deg); }
.card h3{ margin-bottom:.55rem; color:#fff; }
.card__claim{ font-family:var(--serif); font-style:italic; font-size:1.14rem; color:var(--dorado-2); margin-bottom:.9rem; }
.card p{ font-size:.97rem; color:var(--lila); }
.card__for{ list-style:none; margin:.4rem 0 1.6rem; padding:0; display:grid; gap:.5rem; }
.card__for li{ position:relative; padding-left:1.5rem; font-size:.9rem; color:rgba(230,220,247,.82); line-height:1.5; }
.card__for li::before{
  content:""; position:absolute; left:.15rem; top:.62em; width:7px; height:7px; rotate:45deg;
  border:1px solid var(--dorado); border-width:0 1px 1px 0;
}
.card__cta{
  margin-top:auto; font-weight:500; font-size:.93rem; color:var(--dorado-2);
  display:inline-flex; align-items:center; gap:.5em; padding-top:1.1rem;
  border-top:1px solid rgba(192,170,228,.16); transition:color .3s, gap .35s var(--ease-out);
}
.card__cta:hover{ color:#fff; gap:.95em; }
.services__note{ text-align:center; margin-top:2.6rem; color:var(--lila); font-size:.98rem; }
.services__note a{ color:var(--dorado-2); border-bottom:1px solid rgba(216,178,106,.4); transition:color .3s, border-color .3s; }
.services__note a:hover{ color:#fff; border-color:#fff; }
@media (max-width:940px){ .cards{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; } }

/* ══════════ MÉTODO FARO ══════════ */
.faro{
  position:relative; overflow:hidden; padding:clamp(4.5rem,10vh,7.5rem) 0;
  background:radial-gradient(100% 70% at 90% 0%, #2C2050, transparent 60%), var(--noche);
}
.faro__grid{ display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.faro__triad{
  font-family:var(--serif); font-size:clamp(1.3rem,1.1rem + .9vw,1.85rem); color:var(--dorado-2);
  letter-spacing:.1em; margin:1rem 0 1.5rem; display:flex; flex-wrap:wrap; gap:.55em; align-items:center;
}
.faro__triad i{ color:var(--violeta-2); font-style:normal; }
.faro__copy > p{ color:var(--lila); max-width:34em; }

.steps{ list-style:none; margin:2.3rem 0; padding:0; display:grid; gap:1.15rem; counter-reset:s; }
.steps li{
  counter-increment:s; position:relative; padding-left:3.6rem;
  display:flex; flex-direction:column; gap:.15rem;
  opacity:.34; transform:translateY(14px);
  transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
.steps li.lit{ opacity:1; transform:none; }
.steps li::before{
  content:counter(s,decimal-leading-zero); position:absolute; left:0; top:.05rem;
  width:2.5rem; height:2.5rem; display:grid; place-items:center; border-radius:50%;
  font-family:var(--serif); font-size:.95rem; color:var(--dorado-2);
  border:1px solid rgba(216,178,106,.4); background:rgba(216,178,106,.07);
  transition:box-shadow .6s, background .6s, transform .6s var(--ease-out);
}
.steps li.lit::before{
  background:rgba(216,178,106,.2); box-shadow:0 0 22px -4px rgba(216,178,106,.75); transform:scale(1.06);
}
.steps li::after{
  content:""; position:absolute; left:1.25rem; top:2.8rem; bottom:-1.15rem; width:1px;
  background:linear-gradient(180deg,rgba(216,178,106,.45),transparent);
  transform:scaleY(0); transform-origin:top; transition:transform .8s var(--ease-out) .15s;
}
.steps li.lit::after{ transform:scaleY(1); }
.steps li:last-child::after{ display:none; }
.steps b{ font-family:var(--serif); font-size:1.25rem; font-weight:500; color:#fff; }
.steps span{ font-size:.96rem; color:var(--lila); line-height:1.6; }

.faro__img{ margin:0; position:relative; overflow:hidden; border-radius:20px; }
.faro__img img{
  width:100%; border-radius:20px; border:1px solid rgba(216,178,106,.32);
  box-shadow:0 40px 90px -45px rgba(0,0,0,.95); will-change:transform;
}
@media (max-width:940px){
  .faro__grid{ grid-template-columns:1fr; }
  .faro__img{ order:-1; max-width:400px; margin-inline:auto; }
  .faro .eyebrow{ justify-content:center; } .faro .eyebrow::after{ display:none; }
  .faro__copy{ text-align:center; } .faro__copy > p{ margin-inline:auto; }
  .faro__triad{ justify-content:center; }
  .steps li{ text-align:left; }
  .steps{ max-width:440px; margin-inline:auto; }
}

/* ══════════ SOBRE JIMENA (amanecer) ══════════ */
.about{
  padding:clamp(4.5rem,10vh,7.5rem) 0; color:var(--tinta);
  background:
    radial-gradient(70% 50% at 15% 0%, #FFF9EF, transparent 60%),
    linear-gradient(180deg,var(--crema),var(--crema-2));
  position:relative; z-index:2;
}
.about::before,.about::after{
  content:""; position:absolute; left:0; right:0; height:90px; pointer-events:none;
}
.about::before{ top:0; background:linear-gradient(180deg,var(--noche),transparent); }
.about::after{ bottom:0; background:linear-gradient(0deg,#100C1C,transparent); }
.about__grid{ display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(2rem,5vw,4.2rem); align-items:start; }
.about .eyebrow{ color:var(--dorado-3); }
.about .eyebrow::after{ background:linear-gradient(90deg,var(--dorado-3),transparent); }
.about h2{ color:var(--tinta); margin-bottom:1.5rem; }
.about h2 em{ color:var(--violeta); }
.about p{ color:var(--tinta-2); }
.about b{ color:var(--tinta); }

.about__img{ margin:0; position:sticky; top:96px; }
.about__img img{
  width:100%; border-radius:200px 200px 20px 20px;
  border:1px solid rgba(168,129,63,.3);
  box-shadow:0 34px 70px -36px rgba(36,28,49,.55);
  transition:transform .8s var(--ease-out);
}
.about__img:hover img{ transform:scale(1.02); }
.about__img figcaption{
  margin-top:1rem; font-family:var(--serif); font-style:italic; font-size:1.04rem;
  color:var(--violeta); text-align:center; line-height:1.45;
}

.proof{
  display:grid; grid-template-columns:96px 1fr; gap:1.25rem; align-items:center;
  margin:2rem 0 2.2rem; padding:1.25rem; border-radius:16px;
  background:rgba(255,255,255,.62); border:1px solid rgba(168,129,63,.24);
  transition:transform .5s var(--ease-out), box-shadow .5s;
}
.proof:hover{ transform:translateY(-4px); box-shadow:0 22px 44px -26px rgba(36,28,49,.5); }
.proof__img{ margin:0; }
.proof__img img{ width:96px; height:96px; object-fit:cover; object-position:50% 22%; border-radius:12px; }
.proof__label{
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--dorado-3);
  margin-bottom:.25rem; font-weight:500;
}
.proof p:last-child{ margin-bottom:0; font-size:.95rem; }
@media (max-width:940px){
  .about__grid{ grid-template-columns:1fr; }
  .about__img{ position:static; max-width:330px; margin-inline:auto; }
  .about .eyebrow{ justify-content:center; } .about .eyebrow::after{ display:none; }
  .about__copy{ text-align:center; }
  .proof{ grid-template-columns:1fr; justify-items:center; text-align:center; }
}

/* ══════════ LATENCIA ══════════ */
.latencia{
  position:relative; overflow:hidden; padding:clamp(5rem,11vh,8rem) 0; z-index:2;
  background:
    radial-gradient(85% 60% at 50% 0%, #2E1D52, transparent 62%),
    radial-gradient(70% 55% at 15% 100%, #3A2264, transparent 60%),
    #100C1C;
}
.latencia__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.latencia__title{
  letter-spacing:.16em; margin-bottom:1.4rem;
  background:linear-gradient(100deg,var(--dorado-2),#fff 35%,var(--dorado) 60%,var(--dorado-2));
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shimmer 7s linear infinite;
}
@keyframes shimmer{ to{ background-position:220% 0 } }
.latencia__title .sub{
  display:block; font-size:.24em; letter-spacing:.5em; color:var(--dorado); margin-top:.7rem;
  font-family:var(--sans); font-weight:400;
  -webkit-text-fill-color:var(--dorado);
}
.latencia__hook{
  font-family:var(--serif); font-style:italic; font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);
  color:var(--dorado-2); margin-bottom:1rem;
}
.latencia__copy > p{ color:var(--lila); }
.latencia__feat{ list-style:none; margin:1.9rem 0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
.latencia__feat li{
  padding:.85rem 1.05rem; border-radius:12px; font-size:.93rem; color:var(--lila-2);
  background:rgba(216,178,106,.06); border:1px solid rgba(216,178,106,.22);
  transition:background .4s, border-color .4s, transform .45s var(--ease-out);
}
.latencia__feat li:hover{ background:rgba(216,178,106,.13); border-color:rgba(216,178,106,.5); transform:translateY(-3px); }
.latencia__feat b{ color:var(--dorado-2); font-weight:500; }
.latencia__scarcity{
  display:flex; gap:.75rem; align-items:flex-start; padding:1.1rem 1.3rem; border-radius:14px;
  background:rgba(74,46,122,.35); border:1px solid rgba(192,170,228,.24);
  font-size:.95rem; color:var(--lila-2); margin-bottom:1.7rem; text-align:left;
}
.latencia__scarcity .ico{ color:var(--dorado); margin-top:.28em; flex:none; }
.latencia__foot{
  margin-top:1.5rem; font-family:var(--serif); font-style:italic; font-size:1.02rem;
  color:rgba(192,170,228,.72); letter-spacing:.04em;
}
.latencia__img{ margin:0; overflow:hidden; border-radius:20px; }
.latencia__img img{
  width:100%; border-radius:20px; border:1px solid rgba(216,178,106,.34);
  box-shadow:0 45px 100px -45px #000; will-change:transform;
}
@media (max-width:940px){
  .latencia__grid{ grid-template-columns:1fr; }
  .latencia__img{ order:-1; max-width:420px; margin-inline:auto; }
  .latencia .eyebrow{ justify-content:center; } .latencia .eyebrow::after{ display:none; }
  .latencia__copy{ text-align:center; }
}
@media (max-width:520px){ .latencia__feat{ grid-template-columns:1fr; } }

/* ══════════ VOZ / CITAS ══════════ */
.voice{ padding:clamp(4.5rem,10vh,7rem) 0; background:var(--noche); position:relative; z-index:2; }
.voice h2{ margin-bottom:3rem; }
.quotes{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; max-width:1000px; margin-inline:auto; }
.quotes blockquote{
  margin:0; padding:2rem 1.8rem 1.8rem; border-radius:18px; position:relative; overflow:hidden;
  background:linear-gradient(160deg,rgba(36,27,61,.9),rgba(20,16,30,.9));
  border:1px solid rgba(192,170,228,.16);
  transition:border-color .45s, transform .5s var(--ease-out), box-shadow .45s;
}
.quotes blockquote::before{
  content:"❞"; position:absolute; top:.5rem; right:1.2rem; font-family:var(--serif);
  font-size:2.6rem; color:rgba(216,178,106,.24); line-height:1; transition:color .45s, transform .5s var(--ease-out);
}
.quotes blockquote:hover{ border-color:rgba(216,178,106,.42); transform:translateY(-6px); box-shadow:0 30px 60px -34px rgba(0,0,0,.95); }
.quotes blockquote:hover::before{ color:rgba(216,178,106,.5); transform:scale(1.15) rotate(-6deg); }
.quotes p{
  margin:0; font-family:var(--serif); font-style:italic; font-size:clamp(1.14rem,1rem + .5vw,1.35rem);
  color:var(--lila-2); line-height:1.45;
}
@media (max-width:760px){ .quotes{ grid-template-columns:1fr; } }

/* ══════════ TESTIMONIOS ══════════ */
.testimonios{
  padding:clamp(4.5rem,10vh,7.5rem) 0; position:relative; z-index:2;
  background:
    radial-gradient(75% 55% at 50% 0%, #251A44, transparent 60%),
    linear-gradient(180deg,#171128,var(--noche));
}
.testimonios h2{ text-wrap:balance; }

/* masonry con columns: los mensajes tienen largos muy distintos */
.testis{ columns:3 300px; column-gap:1.2rem; margin-top:3rem; }
.testi{
  break-inside:avoid; margin:0 0 1.2rem; padding:2.2rem 1.7rem 1.5rem;
  border-radius:18px; position:relative; overflow:hidden;
  background:linear-gradient(165deg, rgba(74,46,122,.32), rgba(20,16,30,.92));
  border:1px solid rgba(216,178,106,.22);
  transition:border-color .45s, transform .5s var(--ease-out), box-shadow .45s;
}
.testi::before{
  content:"❝"; position:absolute; top:.35rem; left:1.3rem;
  font-family:var(--serif); font-size:2.8rem; line-height:1;
  color:rgba(216,178,106,.34); transition:color .45s;
}
.testi:hover{
  border-color:rgba(216,178,106,.5); transform:translateY(-5px);
  box-shadow:0 30px 60px -34px rgba(0,0,0,.95);
}
.testi:hover::before{ color:rgba(216,178,106,.6); }
.testi blockquote{
  margin:0 0 1.2rem; font-size:.98rem; color:var(--lila-2); line-height:1.68;
}
.testi figcaption{
  display:flex; align-items:center; gap:.55rem;
  border-top:1px solid rgba(192,170,228,.16); padding-top:.9rem;
}
.testi figcaption::before{
  content:""; width:22px; height:1px; background:var(--dorado); flex:none;
}
.testi figcaption span{
  font-size:.76rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dorado-2);
}
.testimonios .btn{ margin-top:1.4rem; }
@media (max-width:900px){ .testis{ columns:1; max-width:560px; margin-inline:auto; } }

/* ══════════ FAQ ══════════ */
.faq{ padding:clamp(4.5rem,10vh,7rem) 0; background:linear-gradient(180deg,var(--noche),#191330); position:relative; z-index:2; }
.faq h2{ margin-bottom:2.8rem; }
.acc{ display:grid; gap:.75rem; }
.acc details{
  border-radius:14px; border:1px solid rgba(192,170,228,.17); overflow:hidden;
  background:rgba(36,27,61,.5); transition:border-color .4s, background .4s, box-shadow .4s;
}
.acc details[open]{
  border-color:rgba(216,178,106,.45); background:rgba(36,27,61,.9);
  box-shadow:0 20px 44px -30px rgba(216,178,106,.5);
}
.acc summary{
  list-style:none; cursor:pointer; padding:1.15rem 3.2rem 1.15rem 1.4rem; position:relative;
  font-family:var(--serif); font-size:clamp(1.08rem,1rem + .35vw,1.28rem); color:#fff; line-height:1.35;
  transition:color .3s;
}
.acc summary::-webkit-details-marker{ display:none; }
.acc summary::after{
  content:""; position:absolute; right:1.4rem; top:50%; width:11px; height:11px;
  border-right:1.5px solid var(--dorado); border-bottom:1.5px solid var(--dorado);
  transform:translateY(-70%) rotate(45deg); transition:transform .45s var(--ease-out);
}
.acc details[open] summary::after{ transform:translateY(-20%) rotate(-135deg); }
.acc summary:hover{ color:var(--dorado-2); }
.acc details > div{ padding:0 1.4rem 1.35rem; animation:accIn .5s var(--ease-out); }
@keyframes accIn{ from{ opacity:0; transform:translateY(-8px) } }
.acc details > div p{ margin:0; color:var(--lila); font-size:.98rem; }

/* ══════════ CIERRE ══════════ */
.final{
  position:relative; overflow:hidden; padding:clamp(5rem,12vh,8.5rem) 0; z-index:2;
  background:radial-gradient(90% 70% at 50% 110%, #3A2264, transparent 62%), #191330;
}
.final__faro{ width:64px; height:90px; color:var(--dorado); margin:0 auto 1.6rem; display:block; filter:drop-shadow(0 0 20px rgba(216,178,106,.4)); }
.final__faro .faro-ray{ animation:rays 3.4s var(--ease) infinite; }
.final h2{ margin-bottom:1.3rem; text-wrap:balance; }
.final__lead{ max-width:34em; margin:0 auto 2.2rem; color:var(--lila); font-size:1.08rem; }
.final__micro{ margin-top:1.3rem; font-size:.88rem; color:rgba(192,170,228,.72); letter-spacing:.05em; }

/* ══════════ FOOTER ══════════ */
.foot{ background:#0E0A18; padding:clamp(3rem,7vh,4.5rem) 0 1.5rem; border-top:1px solid rgba(192,170,228,.1); position:relative; z-index:2; }
.foot__grid{ display:grid; grid-template-columns:1.25fr 1fr 1.25fr; gap:2.5rem; }
.foot__brand{ display:flex; align-items:center; gap:.6rem; margin-bottom:.9rem; }
.foot__brand span{ font-family:var(--serif); font-size:1.2rem; letter-spacing:.11em; text-transform:uppercase; color:var(--lila-2); }
.foot__h{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--dorado); margin-bottom:1rem; font-weight:500; }
.foot__tag{ font-size:.9rem; color:rgba(192,170,228,.66); line-height:1.6; }
.foot nav a, .foot__grid > div a:not(.foot__brand){
  display:block; font-size:.93rem; color:var(--lila); padding-block:.3rem; transition:color .3s, padding-left .35s var(--ease-out);
}
.foot nav a:hover, .foot__grid > div a:not(.foot__brand):hover{ color:var(--dorado-2); padding-left:.4rem; }
.foot__legal{
  margin-top:2.8rem; padding-top:1.5rem; border-top:1px solid rgba(192,170,228,.1);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center;
}
.foot__legal p{ margin:0; font-size:.78rem; color:rgba(192,170,228,.5); max-width:56ch; line-height:1.6; }
@media (max-width:840px){ .foot__grid{ grid-template-columns:1fr; gap:2rem; } .foot__legal{ flex-direction:column; text-align:center; } }

/* ══════════ WHATSAPP FLOTANTE ══════════ */
.wafloat{
  position:fixed; right:clamp(1rem,3vw,1.9rem); bottom:clamp(1rem,3vw,1.9rem); z-index:950;
  width:60px; height:60px; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(145deg,#3BE07A,var(--wa) 45%,var(--wa-dark));
  color:#fff; box-shadow:0 12px 34px -8px rgba(37,211,102,.65), 0 4px 12px rgba(0,0,0,.4);
  transition:transform .45s var(--ease-out), box-shadow .35s;
}
.wafloat svg{ width:31px; height:31px; position:relative; z-index:2; }
.wafloat:hover{ transform:scale(1.1) rotate(-7deg); box-shadow:0 20px 50px -8px rgba(37,211,102,.9); }
.wafloat:focus-visible{ outline:3px solid var(--dorado-2); outline-offset:4px; }
.wafloat__pulse{
  position:absolute; inset:0; border-radius:50%; background:var(--wa); z-index:0;
  animation:pulse 2.8s var(--ease) infinite;
}
.wafloat__pulse--2{ animation-delay:1.4s; }
@keyframes pulse{ 0%{ transform:scale(1); opacity:.55 } 70%,100%{ transform:scale(1.9); opacity:0 } }
.wafloat__tip{
  position:absolute; right:calc(100% + 14px); top:50%; transform:translateY(-50%) translateX(10px);
  background:var(--crema); color:var(--tinta); font-size:.86rem; font-weight:500;
  padding:.55em 1em; border-radius:100px; white-space:nowrap; pointer-events:none;
  opacity:0; transition:opacity .4s var(--ease), transform .4s var(--ease-out);
  box-shadow:0 8px 22px -8px rgba(0,0,0,.6);
}
.wafloat__tip::after{
  content:""; position:absolute; left:100%; top:50%; transform:translateY(-50%);
  border:6px solid transparent; border-left-color:var(--crema);
}
.wafloat:hover .wafloat__tip, .wafloat.peek .wafloat__tip{ opacity:1; transform:translateY(-50%) translateX(0); }

/* ══════════ STICKY BAR MOBILE ══════════ */
.stickybar{
  position:fixed; left:0; right:0; bottom:0; z-index:940; display:none;
  align-items:center; justify-content:space-between; gap:1rem;
  padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(20,16,30,.94); backdrop-filter:blur(14px);
  border-top:1px solid rgba(216,178,106,.28);
  transform:translateY(115%); transition:transform .5s var(--ease-out);
}
.stickybar.show{ transform:none; }
.stickybar__txt{ display:flex; flex-direction:column; line-height:1.25; }
.stickybar__txt b{ font-family:var(--serif); font-size:1.06rem; color:#fff; font-weight:500; }
.stickybar__txt span{ font-size:.76rem; color:var(--lila); }
@media (max-width:760px){
  .stickybar{ display:flex; }
  .wafloat{ bottom:1.2rem; width:54px; height:54px; }
  /* solo se corre hacia arriba cuando la barra inferior está a la vista */
  body.barup .wafloat{ bottom:5.6rem; }
  .wafloat svg{ width:28px; height:28px; }
  .wafloat__tip{ display:none; }
}

/* ══════════ ACCESIBILIDAD: menos movimiento ══════════ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal{ opacity:1; transform:none; }
  .word i{ transform:none; opacity:1; }
  .steps li{ opacity:1; transform:none; }
  html{ scroll-behavior:auto; }
  .fx{ display:none; }
}
