/* ═══════════════════════════════════════════════════════════
   Interpretá tu Sueño · Impulsa Tu Alma
   Estética: noche, luna en órbita, cielo con grilla.
   ═══════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@300;400;500;700&family=Bebas+Neue&display=swap');

:root{
  --cyan:#00f7ff; --cyan-soft:rgba(0,247,255,.09); --cyan-line:rgba(0,247,255,.22); --cyan-deep:#00b8c4;
  --gold:#c9a84c; --gold-soft:#e0c887;
  --ink:#eef8f8; --muted:#8ba6b3; --muted-2:#587382;
  --dark:#050d13; --darker:#020810; --panel:#08151e; --panel-2:#0b1b25;
  --line:rgba(238,248,248,.1);
  --danger:#ff9f96; --success:#7ee2b8; --warn:#e8c37a;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"DM Sans",system-ui,sans-serif;
  --display:"Bebas Neue",Impact,sans-serif;
  --shadow:0 28px 80px rgba(0,0,0,.45);
}
*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{
  margin:0; color:var(--ink); font-family:var(--sans); font-weight:300; line-height:1.65;
  overflow-x:hidden; font-size:17px;
  background:radial-gradient(circle at 74% 6%,rgba(0,247,255,.05),transparent 32rem),var(--darker);
}
body::before{
  position:fixed; inset:0; z-index:-1; content:"";
  background-image:linear-gradient(rgba(255,255,255,.013) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.013) 1px,transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:linear-gradient(to bottom,black,transparent 74%);
  mask-image:linear-gradient(to bottom,black,transparent 74%);
}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.3rem}
.narrow{max-width:680px;margin:0 auto}

.eyebrow{
  font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:.28em;
  text-transform:uppercase; color:var(--cyan); margin:0 0 .8rem;
}
.eyebrow.oro{color:var(--gold-soft)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;margin:0}
h1{font-size:clamp(2.4rem,7vw,4.4rem)}
h2{font-size:clamp(1.9rem,4.6vw,3rem)}
h3{font-size:clamp(1.4rem,3vw,2rem)}
em{font-style:italic;color:var(--cyan)}
em.oro{color:var(--gold-soft)}

/* ─────────── HERO con luna ─────────── */
.hero{
  display:grid; grid-template-columns:1.05fr .95fr; gap:2.5rem; align-items:center;
  padding:4rem 0 2.5rem;
}
.hero-txt p.lead{color:var(--muted);font-size:1.06rem;max-width:34rem;margin:1.3rem 0 0}
.hero-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.badge{
  border:1px solid var(--line); border-radius:2rem; padding:.42rem 1rem;
  font-size:12.5px; color:var(--muted); background:rgba(255,255,255,.02);
}
.badge b{color:var(--ink);font-weight:500}

.hero-art{position:relative;justify-self:center;width:min(38vw,460px);aspect-ratio:1;min-width:300px}
.hero-art::before{
  position:absolute;inset:8%;border-radius:50%;content:"";filter:blur(10px);
  background:radial-gradient(circle,rgba(0,247,255,.09),transparent 66%);
}
.orbit{position:absolute;inset:12%;border:1px solid var(--cyan-line);border-radius:50%}
.orbit-one::before,.orbit-two::before,.orbit-three::before{
  position:absolute;width:7px;height:7px;border-radius:50%;content:"";
  background:var(--cyan);box-shadow:0 0 14px var(--cyan);
}
.orbit-one{animation:spin 22s linear infinite}
.orbit-one::before{top:9%;right:16%}
.orbit-two{inset:22%;border-color:rgba(201,168,76,.26);animation:spin 17s linear infinite reverse}
.orbit-two::before{bottom:8%;left:20%;width:5px;height:5px;background:var(--gold);box-shadow:0 0 14px var(--gold)}
.orbit-three{inset:2%;border-color:rgba(238,248,248,.07);animation:spin 34s linear infinite}
.orbit-three::before{top:47%;left:-3px;width:4px;height:4px;background:rgba(238,248,248,.6);box-shadow:0 0 10px rgba(238,248,248,.6)}
@keyframes spin{to{transform:rotate(360deg)}}
.moon{
  position:absolute;inset:30%;border:1px solid rgba(238,248,248,.2);border-radius:50%;overflow:hidden;
  background:
    radial-gradient(circle at 34% 29%,rgba(255,255,255,.82) 0 2%,transparent 3%),
    radial-gradient(circle at 60% 63%,rgba(0,0,0,.13) 0 6%,transparent 7%),
    radial-gradient(circle at 42% 72%,rgba(0,0,0,.09) 0 3%,transparent 4%),
    linear-gradient(135deg,#f5ffff,#74bec7);
  box-shadow:0 0 62px rgba(0,247,255,.24);
  animation:moon-float 6s ease-in-out infinite;
}
.moon-shadow{position:absolute;inset:-12% -28% -12% 38%;border-radius:50%;background:var(--darker);box-shadow:-12px 0 25px rgba(2,8,16,.5)}
@keyframes moon-float{50%{transform:translateY(-12px)}}
.star{position:absolute;color:var(--cyan);text-shadow:0 0 12px rgba(0,247,255,.8);animation:twinkle 3.5s ease-in-out infinite}
.star-a{top:20%;left:7%;font-size:1.2rem}
.star-b{top:29%;right:11%;font-size:2rem;animation-delay:1.2s}
.star-c{right:21%;bottom:15%;color:var(--gold);animation-delay:.6s}
.star-d{bottom:26%;left:13%;font-size:.9rem;animation-delay:2s}
@keyframes twinkle{50%{opacity:.25;transform:scale(.7)}}
.hero-art-label{position:absolute;right:4%;bottom:1%;display:flex;flex-direction:column;align-items:flex-end}
.hero-art-label small{color:var(--muted-2);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase}
.hero-art-label strong{font-family:var(--serif);font-size:1.9rem;font-weight:400;color:var(--gold-soft)}

/* ─────────── Paneles genéricos ─────────── */
.panel{
  background:linear-gradient(160deg,var(--panel),var(--panel-2));
  border:1px solid var(--line); border-radius:1.4rem; padding:1.7rem 1.5rem;
  box-shadow:var(--shadow);
}
.seccion{padding:3.2rem 0 1rem}
.seccion-intro{max-width:44rem;margin:0 auto 2.2rem;text-align:center}
.seccion-intro p{color:var(--muted);margin:.9rem 0 0}

/* ─────────── Progreso y pasos ─────────── */
.progreso{display:flex;gap:.45rem;max-width:560px;margin:0 auto 1.8rem}
.progreso span{flex:1;height:3px;border-radius:3px;background:rgba(238,248,248,.12);transition:background .4s}
.progreso span.on{background:var(--cyan);box-shadow:0 0 12px rgba(0,247,255,.5)}
.paso{display:none;animation:step-in .5s ease}
.paso.activo{display:block}
@keyframes step-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.paso-num{font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft)}
.paso h2{margin:.5rem 0 .6rem}
.paso .ayuda{color:var(--muted);font-size:14.5px;margin:0 0 1.4rem}

/* ─────────── Preguntas ─────────── */
.regla{border:1px solid var(--line);border-radius:1.1rem;padding:1.1rem 1.2rem;margin:0 0 .8rem;background:rgba(255,255,255,.022);transition:border-color .25s}
.regla.resp{border-color:var(--cyan-line)}
.regla .rt{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft)}
.regla .rq{font-size:15.5px;margin:.4rem 0 .85rem;color:var(--ink);font-weight:400}
.regla .ropts{display:flex;gap:.5rem;flex-wrap:wrap}
.regla .ropt{
  flex:1;min-width:190px;text-align:left;background:rgba(255,255,255,.04);
  border:1px solid var(--line);color:var(--muted);border-radius:.8rem;
  padding:.7rem .95rem;font-size:13.5px;cursor:pointer;line-height:1.45;transition:all .2s;
}
.regla .ropt:hover{border-color:var(--cyan-line);color:var(--ink)}
.regla .ropt.sel{background:var(--cyan-soft);border-color:var(--cyan);color:var(--ink)}

.campo{margin:0 0 1.2rem}
.campo label{display:block;font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:.55rem}
input[type=date],input[type=text],textarea{
  width:100%;padding:.95rem 1.05rem;border-radius:.85rem;border:1px solid var(--cyan-line);
  background:rgba(255,255,255,.045);color:var(--ink);font-size:16px;font-family:var(--sans);outline:none;transition:border-color .2s;
}
input:focus,textarea:focus{border-color:var(--cyan)}
textarea{min-height:200px;line-height:1.65;resize:vertical}
textarea::placeholder{color:var(--muted-2)}
.opciones{display:flex;flex-wrap:wrap;gap:.5rem}
.opt{background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);border-radius:2rem;padding:.6rem 1.1rem;font-size:14px;cursor:pointer;transition:all .2s}
.opt:hover{border-color:var(--cyan-line);color:var(--ink)}
.opt.sel{background:var(--cyan-soft);border-color:var(--cyan);color:var(--ink);font-weight:500}
.contador{font-size:12.5px;color:var(--muted-2);text-align:right;margin-top:.5rem}
.contador.ok{color:var(--success)}

.guia{background:rgba(255,255,255,.028);border:1px solid var(--line);border-radius:1rem;padding:1rem 1.2rem;margin:1rem 0 0;font-size:13.5px;color:var(--muted)}
.guia b{color:var(--cyan);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;display:block;margin-bottom:.6rem;font-weight:700}
.guia ul{margin:0;padding-left:1.1rem}
.guia li{margin:.3rem 0}
.guia strong{color:var(--ink);font-weight:500}

/* ─────────── Botones ─────────── */
.nav{display:flex;gap:.6rem;margin-top:1.8rem;align-items:center;flex-wrap:wrap}
.btn{
  flex:1;min-width:200px;background:linear-gradient(120deg,var(--cyan-deep),var(--cyan));
  border:none;color:#02202a;font-weight:700;font-size:13.5px;text-transform:uppercase;letter-spacing:.06em;
  border-radius:100px;padding:1.1rem 1.5rem;cursor:pointer;text-align:center;text-decoration:none;
  box-shadow:0 8px 30px rgba(0,247,255,.22);transition:transform .18s,box-shadow .18s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 38px rgba(0,247,255,.32)}
.btn:disabled{opacity:.3;cursor:not-allowed;transform:none}
.btn-ghost{
  flex:0 0 auto;background:none;border:1px solid var(--line);color:var(--muted);
  font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  border-radius:100px;padding:1.1rem 1.4rem;cursor:pointer;text-decoration:none;
}
.btn-ghost:hover{border-color:var(--cyan-line);color:var(--ink)}
.btn-wa{
  display:block;text-align:center;background:#25D366;color:#053b1c;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;font-size:13px;border-radius:100px;
  padding:1.05rem 1.4rem;text-decoration:none;margin:.9rem 0 0;
}
.btn-wa:hover{background:#1fb857}
.btn-oro{
  display:inline-block;background:linear-gradient(120deg,#a8873a,var(--gold));color:#1a1405;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;font-size:13px;border-radius:100px;
  padding:1.05rem 1.8rem;text-decoration:none;box-shadow:0 8px 30px rgba(201,168,76,.22);
}
.aviso-min{font-size:13px;color:var(--danger);margin-top:.8rem;min-height:1.2em;text-align:center}

/* ─────────── Veredicto ─────────── */
.veredicto-card{border-radius:1.5rem;padding:2rem 1.7rem;margin:0 0 1.3rem;border:1px solid var(--line);position:relative;overflow:hidden}
.veredicto-card.si{background:linear-gradient(160deg,rgba(0,247,255,.09),rgba(8,21,30,.9));border-color:var(--cyan-line)}
.veredicto-card.mixto{background:linear-gradient(160deg,rgba(201,168,76,.09),rgba(8,21,30,.9));border-color:rgba(201,168,76,.3)}
.veredicto-card.no{background:linear-gradient(160deg,rgba(139,166,179,.07),rgba(8,21,30,.9))}
.marcador{display:flex;align-items:baseline;gap:.6rem;margin-bottom:.9rem}
.marcador .n{font-family:var(--display);font-size:3.4rem;line-height:1;color:var(--cyan)}
.veredicto-card.mixto .marcador .n{color:var(--gold-soft)}
.veredicto-card.no .marcador .n{color:var(--muted)}
.marcador .d{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.veredicto-card h3{margin:0 0 .7rem}
.veredicto-card p{color:var(--muted);font-size:15px;margin:.6rem 0}
.veredicto-card p strong{color:var(--ink);font-weight:500}
.senales-lista{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 0}
.senal{font-size:12px;border-radius:2rem;padding:.32rem .85rem;border:1px solid var(--line);color:var(--muted)}
.senal.si{border-color:rgba(126,226,184,.4);color:var(--success)}
.senal.no{border-color:rgba(139,166,179,.25);color:var(--muted-2)}

/* ─────────── Resultado ─────────── */
.bloque{margin:0 0 1.5rem}
.bloque h4{margin:0 0 .7rem;font-size:10.5px;text-transform:uppercase;letter-spacing:.18em;color:var(--cyan);font-weight:700}
.pill{display:inline-block;border:1px solid var(--cyan-line);background:var(--cyan-soft);color:var(--ink);border-radius:2rem;padding:.34rem .9rem;font-size:13px;margin:0 .35rem .4rem 0}
.pill.duro{background:rgba(255,159,150,.09);border-color:rgba(255,159,150,.35);color:var(--danger)}
.pill.bueno{background:rgba(126,226,184,.09);border-color:rgba(126,226,184,.35);color:var(--success)}
.pill.atencion{background:rgba(232,195,122,.09);border-color:rgba(232,195,122,.35);color:var(--warn)}
.simb{border:1px solid var(--line);border-radius:1.1rem;padding:1.2rem 1.3rem;margin:0 0 .8rem;background:rgba(255,255,255,.022)}
.simb .sn{font-family:var(--serif);font-size:1.35rem;color:var(--cyan);margin-bottom:.7rem}
.simb .se{font-size:14.5px;margin:.55rem 0;padding-left:1rem;border-left:2px solid var(--cyan-line);color:var(--muted)}
.simb .se b{color:var(--ink);font-weight:500}
.nota-tiempo{background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.28);border-radius:1.1rem;padding:1.1rem 1.2rem;font-size:14.5px;color:var(--muted);margin:0 0 1rem;line-height:1.65}
.nota-tiempo .nt{font-size:10.5px;text-transform:uppercase;letter-spacing:.18em;color:var(--gold-soft);display:block;margin-bottom:.5rem;font-weight:700}
.nota-tiempo strong{color:var(--ink);font-weight:500}
.fecha-heb{font-family:var(--serif);font-size:1.5rem;color:var(--ink);margin:.3rem 0 .8rem}
.fecha-heb b{color:var(--cyan);font-weight:500}

/* ─────────── Candados ─────────── */
.locked{position:relative;border:1px dashed rgba(238,248,248,.18);border-radius:1.1rem;padding:1.2rem 1.3rem;margin:.7rem 0;overflow:hidden;background:rgba(255,255,255,.015)}
.locked h4{margin:0 0 .45rem;font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--gold-soft);padding-right:2.2rem;font-weight:700}
.locked .fake{filter:blur(5.5px);user-select:none;pointer-events:none;color:var(--muted-2);font-size:14.5px;margin:0}
.locked .lockico{position:absolute;right:1rem;top:1rem;color:var(--gold);font-size:15px}

/* ─────────── Paywall ─────────── */
.paybox{background:linear-gradient(160deg,rgba(0,247,255,.08),rgba(8,21,30,.95));border:1px solid var(--cyan-line);border-radius:1.4rem;padding:1.8rem 1.5rem;text-align:center;margin-top:1.8rem}
.paybox .precio{font-family:var(--display);font-size:3.2rem;line-height:1;color:var(--cyan);margin:.3rem 0}
.paybox .precio small{font-family:var(--sans);font-size:13px;color:var(--muted);letter-spacing:.1em}
.paybox h3{margin:0 0 .5rem}
.paybox .que-incluye{text-align:left;max-width:420px;margin:1.2rem auto;font-size:14px;color:var(--muted)}
.paybox .que-incluye li{margin:.42rem 0;list-style:none;padding-left:1.5rem;position:relative}
.paybox .que-incluye li::before{content:"✦";position:absolute;left:0;color:var(--cyan)}
.paybox .que-incluye ul{padding:0;margin:0}
.trust{font-size:12px;color:var(--muted-2);margin-top:.8rem}

.medios{border-top:1px solid var(--line);margin-top:1.4rem;padding-top:1.2rem;text-align:left}
.medios summary{cursor:pointer;font-size:13.5px;color:var(--cyan);list-style:none;text-align:center}
.medios summary::-webkit-details-marker{display:none}
.medios summary::before{content:"▸ ";transition:transform .2s}
.medios[open] summary::before{content:"▾ "}
.medios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.5rem;margin:1rem 0 .8rem}
.medio{border:1px solid var(--line);border-radius:.8rem;padding:.7rem .85rem;font-size:12.5px;color:var(--muted);background:rgba(255,255,255,.02)}
.medio b{display:block;color:var(--ink);font-weight:500;font-size:13px}
.medio i{font-style:normal;font-size:11.5px;color:var(--muted-2)}

/* ─────────── Aviso "no compres" ─────────── */
.aviso-no{background:rgba(255,159,150,.06);border:1px solid rgba(255,159,150,.3);border-radius:1.4rem;padding:1.8rem 1.5rem}
.aviso-no .tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--danger);border:1px solid rgba(255,159,150,.45);border-radius:2rem;padding:.28rem .85rem}
.aviso-no h3{margin:.9rem 0 .6rem}
.aviso-no p{font-size:15px;color:var(--muted);margin:.6rem 0}
.aviso-no strong{color:var(--ink);font-weight:500}

/* ─────────── Método / pasos explicativos ─────────── */
.metodo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem;padding:0;margin:0;list-style:none;counter-reset:m}
.metodo-grid li{border:1px solid var(--line);border-radius:1.2rem;padding:1.3rem 1.2rem;background:rgba(255,255,255,.022)}
.metodo-grid li span{font-family:var(--display);font-size:1.5rem;color:var(--cyan);display:block;margin-bottom:.4rem}
.metodo-grid li h3{font-size:1.2rem;margin:0 0 .4rem}
.metodo-grid li p{font-size:13.5px;color:var(--muted);margin:0}

/* ─────────── Índice de símbolos ─────────── */
.lista-simbolos{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center}
.lista-simbolos button{background:rgba(255,255,255,.035);border:1px solid var(--line);color:var(--muted);border-radius:2rem;padding:.42rem .95rem;font-size:12.5px;cursor:pointer;transition:all .2s}
.lista-simbolos button:hover{border-color:var(--cyan);color:var(--ink)}

/* ─────────── Upsell ─────────── */
.upsell{background:linear-gradient(160deg,rgba(201,168,76,.09),rgba(8,21,30,.95));border:1px solid rgba(201,168,76,.28);border-radius:1.5rem;padding:2.2rem 1.7rem;text-align:center;margin:2.5rem 0}
.upsell h3{margin:.6rem 0 .8rem}
.upsell p{color:var(--muted);max-width:38rem;margin:0 auto 1.4rem;font-size:15px}

/* ─────────── Pacto y disclaimer ─────────── */
.pacto{background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.3);border-radius:1.1rem;padding:1.2rem 1.3rem;font-size:14px;color:var(--muted);line-height:1.7}
.pacto strong{color:var(--gold-soft);font-weight:500}
.pacto em{color:var(--gold-soft)}
.disclaimer{font-size:12.5px;color:var(--muted-2);background:rgba(255,255,255,.022);border:1px solid var(--line);border-radius:1rem;padding:1rem 1.2rem;margin:2rem 0}
.bienvenida{background:linear-gradient(160deg,rgba(126,226,184,.09),rgba(8,21,30,.95));border:1px solid rgba(126,226,184,.3);border-radius:1.4rem;padding:1.7rem 1.5rem;margin:0 0 1.5rem}
.bienvenida h3{color:var(--success);margin:0 0 .7rem}
.bienvenida p{color:var(--muted);font-size:14.5px;margin:.6rem 0}

/* ─────────── Pie ─────────── */
.about{max-width:640px;margin:3rem auto 0;text-align:center;border-top:1px solid var(--line);padding-top:2.4rem}
.about p{color:var(--muted);font-size:14.5px;margin:.8rem auto}
.about .links{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:1.2rem}
.about .links a{border:1px solid var(--cyan-line);border-radius:100px;padding:.7rem 1.35rem;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--cyan)}
.about .links a:hover{background:var(--cyan-soft)}
.foot{text-align:center;color:var(--muted-2);font-size:12px;padding:2rem 0 3.5rem}
.foot a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;gap:2rem;padding:2.6rem 0 1.5rem;text-align:center}
  .hero-txt p.lead{margin-left:auto;margin-right:auto}
  .hero-badges{justify-content:center}
  .hero-art{width:min(72vw,340px);min-width:260px}
}
@media (max-width:540px){
  body{font-size:16px}
  .regla .ropt{min-width:100%}
  .btn{min-width:100%}
  .nav{flex-direction:column-reverse}
  .btn-ghost{width:100%}
  .panel{padding:1.3rem 1.1rem}
}
@media (prefers-reduced-motion:reduce){
  .orbit-one,.orbit-two,.orbit-three,.moon,.star{animation:none}
}
@media print{
  body{background:#fff;color:#111}
  .locked,.paybox,.upsell,.nav,.progreso,.hero-art,.medios{display:none!important}
  .panel,.simb,.nota-tiempo{border-color:#ccc;background:#fff;box-shadow:none}
  .simb .sn,em,.pill{color:#0a6570}
}