/* =========================================================
   Équora · secciones nuevas (06-10-2026)
   «Dónde te pesa», sesiones con precio, «Así es una sesión»,
   «Regala calma», el botón fijo de reservar y la luz que sigue
   al puntero. Usa los tokens de styles.css y demo.css, así que
   vale para el tema claro y el oscuro.
   ========================================================= */

.rotulo{display:flex; align-items:center; justify-content:center; gap:1rem; margin-bottom:1.1rem;
        font-size:.68rem; letter-spacing:.38em; text-transform:uppercase; color:var(--oro);}
.rotulo::before,.rotulo::after{content:""; width:2.4rem; height:1px; background:var(--oro-suave);}
.rotulo--izq{justify-content:flex-start;}
.rotulo--izq::after{display:none;}

/* ---------- La luz que sigue al puntero ---------- */
.luz{position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:0; transition:opacity 1.2s ease;
     background:radial-gradient(34vmax 34vmax at var(--mx,50%) var(--my,30%), var(--aura-1), transparent 60%);}
.luz.on{opacity:1;}

/* ---------- Botón fijo de reservar ---------- */
.cta-fija{position:fixed; right:1.4rem; bottom:1.4rem; z-index:90; display:inline-flex; align-items:center; gap:.7rem;
  padding:1rem 1.7rem; border-radius:999px; background:var(--accent); color:var(--accent-ink); text-decoration:none;
  font-size:.74rem; letter-spacing:.24em; text-transform:uppercase; box-shadow:0 18px 40px -18px rgba(30,50,48,.65);
  opacity:0; transform:translateY(24px) scale(.96); pointer-events:none;
  transition:opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);}
.cta-fija::before{content:""; width:.5rem; height:.5rem; border-radius:50%; background:var(--accent-ink); opacity:.85;
  box-shadow:0 0 0 0 rgba(255,255,255,.6); animation:eq-latido 2.4s ease-out infinite;}
.cta-fija.on{opacity:1; transform:none; pointer-events:auto;}
.cta-fija:hover{transform:translateY(-2px);}
@keyframes eq-latido{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55);} 100%{box-shadow:0 0 0 12px rgba(255,255,255,0);}}
@media (max-width:640px){
  .footer{padding-bottom:6.5rem;}
  .consejo__cta{letter-spacing:.12em; padding-inline:1.2rem;}
  .rotulo--izq{justify-content:center;} .regalo .section__title,.regalo__lead{text-align:center; margin-inline:auto;}
  .regalo__opciones{justify-content:center;} .regalo__txt{text-align:center;}
  .cta-fija{left:1rem; right:1rem; bottom:max(1rem, env(safe-area-inset-bottom)); justify-content:center; padding:1.05rem 1.4rem;}
}

/* ---------- ¿Dónde te pesa? ---------- */
.zonas{overflow-x:clip;}
.zonas__cuerpo{display:grid; grid-template-columns:minmax(0,1fr); gap:2.4rem; align-items:center; max-width:58rem; margin:0 auto;}
@media (min-width:820px){.zonas__cuerpo{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:4rem;}}
.figura{position:relative; width:min(100%,300px); aspect-ratio:200/420; margin:0 auto;}
.figura__svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;
  fill:var(--card-solid); stroke:var(--oro); stroke-width:1.1; stroke-linejoin:round;}
.anim .figura__svg circle,.anim .figura__svg path{stroke-dasharray:1400; stroke-dashoffset:1400; transition:stroke-dashoffset 2.6s cubic-bezier(.65,0,.35,1);}
.anim .figura.visto .figura__svg circle,.anim .figura.visto .figura__svg path{stroke-dashoffset:0;}
.figura__luz{position:absolute; left:50%; top:var(--ly,22%); width:150%; aspect-ratio:1; translate:-50% -50%; border-radius:50%; pointer-events:none;
  background:radial-gradient(closest-side, color-mix(in srgb, var(--sage) 38%, transparent), transparent 70%);
  transition:top .9s cubic-bezier(.22,1,.36,1); filter:blur(4px);}
.punto{position:absolute; left:var(--x); top:var(--y); width:2.6rem; height:2.6rem; translate:-50% -50%; padding:0; border:0; border-radius:50%;
  background:transparent; cursor:pointer; display:grid; place-items:center;}
.punto::before{content:""; width:.8rem; height:.8rem; border-radius:50%; background:var(--accent); transition:transform .4s cubic-bezier(.34,1.56,.64,1);}
.punto::after{content:""; position:absolute; inset:.35rem; border-radius:50%; border:1px solid var(--accent); animation:eq-onda 2.6s ease-out infinite;}
.punto span{position:absolute; left:calc(100% + .4rem); white-space:nowrap; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-soft);
  opacity:0; transform:translateX(-6px); transition:opacity .35s, transform .35s; pointer-events:none;}
.punto:hover span,.punto[aria-pressed="true"] span{opacity:1; transform:none;}
.punto[aria-pressed="true"]::before{transform:scale(1.5); background:var(--oro);}
.punto[aria-pressed="true"]::after{border-color:var(--oro);}
@keyframes eq-onda{0%{transform:scale(.6); opacity:.9;} 100%{transform:scale(1.8); opacity:0;}}

.consejo{padding:clamp(1.6rem,4vw,2.6rem); border:1px solid var(--line); border-radius:26px; background:var(--card); backdrop-filter:blur(8px);}
.consejo > *{transition:opacity .45s ease, transform .55s cubic-bezier(.22,1,.36,1);}
.consejo.cambia > *{opacity:0; transform:translateY(10px);}
.consejo__zona{font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; color:var(--oro); margin-bottom:.8rem;}
.consejo__titulo{font-family:var(--display); font-weight:300; font-size:clamp(2rem,4vw,2.8rem); line-height:1.08; margin-bottom:.9rem;}
.consejo__txt{color:var(--text-soft); margin-bottom:1.8rem; max-width:40ch;}
.consejo__sesion{display:grid; gap:.25rem; padding:1.1rem 1.3rem; border-radius:16px; border:1px solid var(--line-strong);}
.consejo__et{font-size:.64rem; letter-spacing:.28em; text-transform:uppercase; color:var(--text-soft);}
.consejo__sesion b{font-family:var(--display); font-weight:400; font-size:1.55rem; line-height:1.2;}
.consejo__meta{font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent);}
.consejo__cta{margin-top:1.4rem;}
.consejo__cta span{transition:transform .35s ease;}
.consejo__cta:hover span{transform:translateX(4px);}

/* ---------- Sesiones: precio y botón propio ---------- */
.card__pie{margin-top:auto; padding-top:.9rem; width:100%; display:flex; align-items:center; justify-content:space-between; gap:.8rem; flex-wrap:wrap;}
.card__pie .card__meta{margin:0; padding:0;}
.card__cta{background:none; border:0; padding:.35rem 0; cursor:pointer; font:inherit; font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--text); border-bottom:1px solid var(--oro-suave); transition:color .3s, border-color .3s;}
.card__cta span{display:inline-block; transition:transform .35s ease;}
.card__cta:hover{color:var(--accent); border-color:var(--accent);}
.card__cta:hover span{transform:translateX(4px);}
@media (hover:hover) and (pointer:fine){
  .card__cta{opacity:.6; transition:opacity .4s, color .3s, border-color .3s;}
  .card:hover .card__cta,.card:focus-within .card__cta{opacity:1;}
}

/* ---------- Así es una sesión ---------- */
.ritual{position:relative;}
.ritual__pasos{list-style:none; margin:0 auto; padding:0 0 0 3.6rem; max-width:40rem; display:grid; gap:3rem; position:relative;}
.ritual__pasos::before{content:""; position:absolute; left:1.1rem; top:.6rem; bottom:.6rem; width:1px; background:var(--line);}
.ritual__pasos::after{content:""; position:absolute; left:1.1rem; top:.6rem; width:1px; height:calc((100% - 1.2rem) * var(--p,0)); background:var(--oro);}
.ritual__paso{position:relative; display:grid; gap:.4rem;}
.ritual__n{position:absolute; left:-3.6rem; top:0; width:2.3rem; height:2.3rem; border-radius:50%; display:grid; place-items:center;
  font-size:.7rem; letter-spacing:.06em; color:var(--text-soft); background:var(--bg); border:1px solid var(--line-strong);
  transition:background .5s, color .5s, border-color .5s, transform .6s cubic-bezier(.34,1.56,.64,1);}
.ritual__paso.on .ritual__n{background:var(--oro); border-color:var(--oro); color:var(--bg); transform:scale(1.08);}
.ritual__paso h3{font-family:var(--display); font-weight:400; font-size:1.8rem; line-height:1.15;}
.ritual__paso p{color:var(--text-soft); max-width:46ch;}
.anim .ritual__paso{opacity:.35; transition:opacity .8s ease;}
.anim .ritual__paso.on{opacity:1;}

/* ---------- Regala calma ---------- */
.regalo{display:grid; grid-template-columns:minmax(0,1fr); gap:3rem; align-items:center; max-width:64rem;}
@media (min-width:820px){.regalo{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4.5rem;}}
.regalo .section__title{text-align:left;}
.regalo__lead{color:var(--text-soft); margin-bottom:1.8rem; max-width:40ch;}
.regalo__tarjeta{perspective:1200px;}
.tarjeta{position:relative; aspect-ratio:1.586; width:min(100%,430px); margin:0 auto; border-radius:22px; overflow:hidden; padding:1.8rem 2rem;
  display:flex; flex-direction:column; color:#f6f3ec;
  background:radial-gradient(120% 90% at 85% 10%, rgba(213,184,120,.55), transparent 55%), linear-gradient(140deg,#3f7169 0%,#2c4f4a 55%,#1d3532 100%);
  box-shadow:0 50px 90px -50px rgba(20,40,38,.8), inset 0 0 0 1px rgba(255,255,255,.14);
  transform:rotateX(var(--rx,8deg)) rotateY(var(--ry,-14deg)); transition:transform .8s cubic-bezier(.22,1,.36,1);}
.tarjeta__marca{font-family:var(--display); font-size:2.4rem; font-weight:300; line-height:1;}
.tarjeta__tipo{margin-top:.5rem; font-size:.62rem; letter-spacing:.34em; text-transform:uppercase; opacity:.75;}
.tarjeta__para{margin-top:auto; font-family:var(--display); font-style:italic; font-size:1.45rem; transition:opacity .4s;}
.tarjeta__sello{position:absolute; right:-1.6rem; bottom:-1.6rem; width:9rem; fill:none; stroke:rgba(246,243,236,.28); stroke-width:1;}
.tarjeta__sello .lleno{fill:rgba(246,243,236,.4); stroke:none;}
.tarjeta__brillo{position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.28) 47%, transparent 62%); transform:translateX(-120%);}
.anim .tarjeta__brillo{animation:eq-brillo 5s ease-in-out 1s infinite;}
@keyframes eq-brillo{0%,55%{transform:translateX(-120%);} 80%,100%{transform:translateX(120%);}}
.anim .tarjeta{animation:eq-flota 8s ease-in-out infinite;}
@keyframes eq-flota{0%,100%{translate:0 0;} 50%{translate:0 -10px;}}
.regalo__cta{width:auto; margin-top:1.6rem; padding-inline:2.4rem;}
.regalo__nota{margin-top:1.2rem; padding:1rem 1.2rem; border-radius:14px; border:1px dashed var(--line-strong); font-size:.88rem; color:var(--text-soft);}
.regalo__nota b{color:var(--text); font-weight:500;}

/* ---------- Pétalos al confirmar la reserva ---------- */
.petalo{position:fixed; z-index:120; width:12px; height:16px; border-radius:60% 0 60% 0; pointer-events:none;
  background:var(--c); opacity:.9; animation:eq-petalo var(--t,2.6s) cubic-bezier(.2,.6,.4,1) forwards;}
@keyframes eq-petalo{
  0%{transform:translate(0,0) rotate(0deg) scale(.6); opacity:0;}
  10%{opacity:.95;}
  100%{transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1); opacity:0;}
}

@media (prefers-reduced-motion:reduce){
  .punto::after,.cta-fija::before{animation:none;}
  .tarjeta{transform:none;}
}

/* =========================================================
   Chakras y círculos vivos (06-10-2026)
   ========================================================= */
.chakras svg{touch-action:manipulation;}
.chakra{cursor:pointer;}
.chakra__onda{fill:none; stroke:var(--c); stroke-width:1.2; transform-box:fill-box; transform-origin:center; animation:eq-onda-chakra 1.4s cubic-bezier(.22,1,.36,1) forwards;}
@keyframes eq-onda-chakra{from{transform:scale(.6); opacity:.9;} to{transform:scale(3); opacity:0;}}
.chakra.toca .seed{animation:eq-toca .9s cubic-bezier(.34,1.56,.64,1);}
@keyframes eq-toca{40%{opacity:1; transform:scale(1.9);} 100%{transform:none;}}
.chakra .seed{transform-box:fill-box; transform-origin:center;}
.chakra__nombre{font-family:var(--display); font-style:italic; font-size:15px; fill:var(--text-soft); opacity:0; transition:opacity .6s ease; pointer-events:none;}
.chakra__nombre.on{opacity:1;}
.anim .footer .mandala{animation:eq-gira 60s linear infinite; cursor:pointer; transform-origin:center;}
.anim .tarjeta__sello{animation:eq-gira 40s linear infinite;}
@keyframes eq-gira{to{rotate:360deg;}}
.mandala.toca circle{animation:eq-mandala .9s cubic-bezier(.34,1.56,.64,1);}
@keyframes eq-mandala{40%{stroke-width:2.4; opacity:1;}}

/* =========================================================
   Reserva más pequeña y por pasos (06-10-2026)
   Primero la sesión; después se despliega el día; después la
   hora; y entonces «Siguiente». Mismo contenido, más sutil.
   ========================================================= */
.section--booking{max-width:40rem;}
.section--booking .section__lead{margin-bottom:1.6rem; font-size:.95rem;}
.schedule-note{margin-bottom:2rem; font-size:.68rem; letter-spacing:.2em; gap:.7rem;}
.booking{padding:clamp(1.4rem,3.4vw,2.2rem); border-radius:22px; box-shadow:none; background:color-mix(in srgb,var(--card) 70%,transparent);}
.fases{margin-bottom:1.8rem; font-size:.62rem; letter-spacing:.24em;}
.fases__paso span{width:1.45rem; height:1.45rem; font-size:.66rem;}
.fases__paso + .fases__paso::before{width:1.8rem;}

.step{margin-bottom:1.5rem;}
.step legend{font-size:.64rem; letter-spacing:.26em; margin-bottom:.85rem; gap:.6rem;}
.step__n{width:20px; height:20px; font-size:.62rem; background:transparent; border:1px solid var(--line-strong);}
.plegado{display:none !important;}
.despliega{animation:eq-despliega .8s cubic-bezier(.22,1,.36,1) both;}
@keyframes eq-despliega{from{opacity:0; transform:translateY(-10px); clip-path:inset(0 0 100% 0);} to{opacity:1; transform:none; clip-path:inset(0 0 -20% 0);}}

.booking .chip{padding:.5rem 1rem; font-size:.8rem; border-color:var(--line);}
.booking .chips{gap:.45rem;}
.day{min-width:58px; padding:.5rem .4rem; border-radius:12px; background:transparent;}
.day b{font-size:1.15rem; line-height:1.15;}
.day small{font-size:.58rem;}
.days{gap:.4rem; padding-bottom:.5rem;}
.slots{grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:.4rem;}
.slot{padding:.45rem .3rem; font-size:.8rem; border-radius:10px; background:transparent; border-color:var(--line);}
.summary{font-size:1rem; min-height:0;}
.booking .btn--wa{padding:.9rem 1.6rem; font-size:.72rem; margin-top:1.2rem;}

.fields{gap:.9rem 1.4rem;}
.field > span{font-size:.62rem; letter-spacing:.22em;}
.field :is(input,textarea){padding:.55rem 0; border:0; border-bottom:1px solid var(--line-strong); border-radius:0; background:transparent; font-size:.92rem;}
.field :is(input,textarea):focus{box-shadow:none; border-bottom-color:var(--accent);}
.consent{font-size:.8rem;}
.elegida{padding:.75rem 1rem; margin-bottom:1.6rem;}
.elegida__txt{font-size:1.05rem;}
.disclaimer{font-size:.72rem;}
@media (max-width:560px){.fields{grid-template-columns:1fr;}}