/* ═══════════════════════════════════════
   IA Masters — iamasters.eskeia.com
   Basado en el estilo de crecetusredes
═══════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;600;700&display=swap');

:root {
  --accent:        #00e5ff;
  --accent-2:      #7c3aed;
  --accent-glow:   rgba(0,229,255,0.28);
  --accent-dim:    rgba(0,229,255,0.08);
  --bg:            #050810;
  --bg-raised:     #0c1120;
  --bg-card:       #0f1628;
  --ink:           #f0f4ff;
  --ink-soft:      rgba(240,244,255,0.72);
  --ink-faint:     rgba(240,244,255,0.38);
  --line:          rgba(240,244,255,0.1);
  --line-strong:   rgba(240,244,255,0.18);
  --green:         #22c55e;
  --font-display:  'Space Grotesk', system-ui, sans-serif;
  --font-mono:     'JetBrains Mono', monospace;
  --ease-out:      cubic-bezier(0.16,1,0.3,1);
  --ease-in-out:   cubic-bezier(0.87,0,0.13,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-display);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font: inherit; }
ul { list-style: none; }

/* ── Custom cursor ── */
.cursor, .cursor-ring {
  position: fixed; border-radius: 50%; pointer-events: none;
  z-index: 9999; opacity: 0; transition: opacity .3s var(--ease-out);
  will-change: transform;
}
.cursor { width:8px;height:8px;background:var(--accent);transform:translate(-50%,-50%); }
.cursor-ring { width:36px;height:36px;border:1.5px solid rgba(0,229,255,0.4);transform:translate(-50%,-50%);transition:opacity .3s,width .2s var(--ease-out),height .2s var(--ease-out); }
.cursor.is-ready, .cursor-ring.is-ready { opacity:1; }
@media (hover:none) { .cursor,.cursor-ring { display:none; } }

/* ── Utility ── */
.section-inner { max-width:1120px;margin:0 auto;padding:0 clamp(1.5rem,5vw,4rem); }
.section-kicker {
  font-family:var(--font-mono);font-size:.72rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:1.25rem;
}
.section-title {
  font-family:var(--font-display);font-size:clamp(2rem,5vw,3.8rem);font-weight:700;
  line-height:1.08;letter-spacing:-.02em;margin-bottom:clamp(3rem,6vw,5rem);color:var(--ink);
}
.section-title em { color:var(--accent);font-style:normal; }

/* ── Reveals ── */
.reveal { opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out); }
.reveal.is-visible { opacity:1;transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }

/* ── Buttons ── */
.btn-primary {
  display:inline-flex;align-items:center;gap:.5rem;padding:1rem 2rem;
  background:var(--accent);color:#050810;font-family:var(--font-display);
  font-weight:700;font-size:1rem;border-radius:100px;
  transition:transform .2s var(--ease-out),box-shadow .2s var(--ease-out),background .2s;
  white-space:nowrap;
}
.btn-primary:hover { transform:translateY(-2px);box-shadow:0 16px 48px var(--accent-glow);background:#00f5ff; }
.btn-primary .btn-arrow { transition:transform .2s var(--ease-out); }
.btn-primary:hover .btn-arrow { transform:translateX(4px); }
.btn-primary.btn-full { width:100%;justify-content:center;font-size:1.1rem;padding:1.2rem 2rem; }
.btn-primary.btn-xl { padding:1.25rem 2.5rem;font-size:1.15rem; }
.btn-ghost {
  display:inline-flex;align-items:center;padding:1rem 1.75rem;
  border:1px solid var(--line-strong);color:var(--ink-soft);
  font-family:var(--font-display);font-weight:500;font-size:1rem;border-radius:100px;
  transition:border-color .2s,color .2s,background .2s;
}
.btn-ghost:hover { border-color:var(--accent);color:var(--ink);background:var(--accent-dim); }

/* ── NAV ── */
.nav {
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:.9rem 0;transition:background .3s,backdrop-filter .3s,border-bottom .3s;
}
.nav.scrolled {
  background:rgba(5,8,16,.85);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.nav-inner {
  max-width:1120px;margin:0 auto;padding:0 clamp(1.5rem,5vw,4rem);
  display:flex;align-items:center;justify-content:space-between;
}
.nav-logo { display:flex;align-items:center;gap:.6rem; }
.nav-logo-mark {
  width:34px;height:34px;border-radius:8px;background:var(--accent);
  color:#050810;font-family:var(--font-mono);font-weight:700;font-size:.75rem;
  display:flex;align-items:center;justify-content:center;letter-spacing:.05em;
}
.nav-logo-text { font-weight:600;font-size:.95rem;color:var(--ink); }
.nav-cta {
  font-family:var(--font-mono);font-size:.78rem;font-weight:600;
  color:var(--accent);border:1px solid rgba(0,229,255,.35);
  padding:.45rem 1.1rem;border-radius:100px;
  transition:background .2s,color .2s;cursor:pointer;
}
.nav-cta:hover { background:var(--accent);color:#050810; }
@media (max-width:600px) { .nav-cta { font-size:.7rem;padding:.4rem .85rem; } }

/* ── HERO ── */
.hero {
  min-height:100dvh;display:flex;align-items:center;
  position:relative;overflow:hidden;padding:7rem 0 5rem;
}
.hero-gradient {
  position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 60% 30%,rgba(0,229,255,.07) 0%,transparent 65%),
             radial-gradient(ellipse 60% 50% at 20% 80%,rgba(124,58,237,.06) 0%,transparent 65%);
  pointer-events:none;
}
.hero-grid {
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(240,244,255,.025) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(240,244,255,.025) 1px,transparent 1px);
  background-size:60px 60px;pointer-events:none;
}
.hero-inner { position:relative;max-width:1120px;margin:0 auto;padding:0 clamp(1.5rem,5vw,4rem); }
.hero-kicker {
  display:inline-block;font-family:var(--font-mono);font-size:.7rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--accent);
  border:1px solid rgba(0,229,255,.3);padding:.35rem .9rem;border-radius:100px;
  background:rgba(0,229,255,.06);margin-bottom:2rem;
}
.hero-title {
  font-size:clamp(2.8rem,7vw,5.5rem);font-weight:700;
  line-height:1.04;letter-spacing:-.03em;color:var(--ink);margin-bottom:1.75rem;
}
.hero-title em { color:var(--accent);font-style:normal; }
.hero-sub {
  font-size:clamp(1rem,2.2vw,1.25rem);color:var(--ink-soft);
  max-width:580px;line-height:1.7;margin-bottom:2.5rem;
}
.hero-actions { display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:3rem; }
.hero-badges { display:flex;flex-wrap:wrap;gap:.75rem; }
.hero-badge {
  font-family:var(--font-mono);font-size:.68rem;font-weight:600;
  color:var(--ink-faint);border:1px solid var(--line);
  padding:.3rem .8rem;border-radius:100px;
}
.hero-scroll { position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:.65rem;color:var(--ink-faint);letter-spacing:.12em;text-transform:uppercase; }

/* ── STATS ── */
.stats-bar { background:var(--bg-raised);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:2rem 0; }
.stats-inner { max-width:1120px;margin:0 auto;padding:0 clamp(1.5rem,5vw,4rem);display:flex;align-items:center;justify-content:space-around;flex-wrap:wrap;gap:1.5rem; }
.stat { text-align:center; }
.stat-num { font-family:var(--font-mono);font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;color:var(--accent);display:block; }
.stat-icon { font-family:var(--font-mono);font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;color:var(--accent);display:block; }
.stat-label { font-size:.8rem;color:var(--ink-soft);margin-top:.25rem;font-family:var(--font-mono); }
.stat-divider { width:1px;height:40px;background:var(--line);flex-shrink:0; }
@media (max-width:600px) { .stat-divider { display:none; } }

/* ── BENEFICIOS ── */
.beneficios { padding:clamp(5rem,10vw,8rem) 0; }
.beneficios-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem; }
.beneficio {
  padding:2rem;border:1px solid var(--line);border-radius:16px;
  background:var(--bg-card);transition:border-color .2s,transform .2s;
}
.beneficio:hover { border-color:rgba(0,229,255,.3);transform:translateY(-4px); }
.beneficio-num { font-family:var(--font-mono);font-size:.75rem;color:var(--accent);margin-bottom:1rem;display:block; }
.beneficio-title { font-size:1.1rem;font-weight:700;color:var(--ink);margin-bottom:.75rem; }
.beneficio-desc { font-size:.9rem;color:var(--ink-soft);line-height:1.65; }

/* ── TEMARIO ── */
.temario-section { padding:clamp(5rem,10vw,8rem) 0;background:var(--bg-raised); }
.temario-list { display:flex;flex-direction:column;gap:.5rem;margin-top:2rem; }
.modulo {
  border:1px solid var(--line);border-radius:12px;overflow:hidden;
  background:var(--bg-card);transition:border-color .2s;
}
.modulo:hover { border-color:rgba(0,229,255,.25); }
.modulo-header {
  width:100%;display:flex;align-items:center;gap:1.5rem;padding:1.25rem 1.5rem;
  text-align:left;cursor:pointer;transition:background .2s;
}
.modulo-header:hover { background:rgba(0,229,255,.04); }
.modulo-header[aria-expanded="true"] { background:rgba(0,229,255,.04); }
.modulo-meta { display:flex;flex-direction:column;gap:.2rem;min-width:60px;flex-shrink:0; }
.modulo-num { font-family:var(--font-mono);font-size:.75rem;color:var(--accent);font-weight:700; }
.modulo-lecciones { font-family:var(--font-mono);font-size:.65rem;color:var(--ink-faint); }
.modulo-titulo { flex:1;font-size:.95rem;font-weight:600;color:var(--ink); }
.modulo-badge { font-family:var(--font-mono);font-size:.6rem;background:var(--accent);color:#050810;font-weight:700;padding:.2rem .6rem;border-radius:100px;white-space:nowrap; }
.modulo-icon { font-size:1.1rem;color:var(--ink-faint);transition:transform .3s var(--ease-out);flex-shrink:0; }
.modulo-header[aria-expanded="true"] .modulo-icon { transform:rotate(45deg); }
.modulo-body { padding:0 1.5rem 1.25rem 1.5rem;padding-left:calc(1.5rem + 60px + 1.5rem); }
.modulo-body ul { display:flex;flex-direction:column;gap:.5rem; }
.modulo-body li { font-size:.88rem;color:var(--ink-soft);padding-left:1rem;position:relative; }
.modulo-body li::before { content:'—';position:absolute;left:0;color:var(--accent);font-family:var(--font-mono); }

/* ── INSTRUCTOR ── */
.instructor { padding:clamp(5rem,10vw,8rem) 0; }
.instructor-inner { display:grid;grid-template-columns:340px 1fr;gap:4rem;align-items:start; }
@media (max-width:800px) { .instructor-inner { grid-template-columns:1fr; } }
.instructor-photo-wrap { position:relative; }
.instructor-photo-bg {
  position:absolute;inset:-12px;border-radius:24px;
  background:linear-gradient(135deg,rgba(0,229,255,.12),rgba(124,58,237,.08));
  filter:blur(20px);
}
.instructor-photo {
  position:relative;width:100%;border-radius:16px;
  aspect-ratio:3/4;object-fit:cover;object-position:top center;
  border:1px solid var(--line);
}
.instructor-name { font-size:clamp(2rem,4vw,3rem);font-weight:700;letter-spacing:-.02em;margin-bottom:1rem; }
.instructor-tags { display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem; }
.instructor-tags li {
  font-family:var(--font-mono);font-size:.68rem;color:var(--accent);
  border:1px solid rgba(0,229,255,.3);padding:.3rem .75rem;border-radius:100px;
}
.instructor-bio { font-size:.95rem;color:var(--ink-soft);line-height:1.75;margin-bottom:1rem; }
.instructor-cta { margin-top:2rem; }
.eskeia-badge {
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:.68rem;color:var(--ink-faint);
  margin-bottom:1.25rem;
}
.eskeia-dot { width:6px;height:6px;border-radius:50%;background:var(--accent); }

/* ── PRECIO ── */
.precio { padding:clamp(5rem,10vw,8rem) 0;position:relative;overflow:hidden; }
.precio-gradient {
  position:absolute;top:-100px;left:50%;transform:translateX(-50%);
  width:800px;height:800px;
  background:radial-gradient(ellipse,rgba(0,229,255,.07) 0%,transparent 65%);
  pointer-events:none;
}
.precio-card {
  max-width:560px;margin:0 auto;
  background:var(--bg-card);border:1px solid rgba(0,229,255,.2);
  border-radius:24px;padding:2.5rem;
  box-shadow:0 0 80px rgba(0,229,255,.05),0 32px 64px rgba(0,0,0,.4);
}
.precio-badge {
  font-family:var(--font-mono);font-size:.68rem;font-weight:700;
  color:var(--accent);background:rgba(0,229,255,.1);border:1px solid rgba(0,229,255,.25);
  padding:.35rem 1rem;border-radius:100px;display:inline-block;margin-bottom:1.5rem;
}
.precio-amount { display:flex;align-items:flex-start;gap:.25rem;margin-bottom:.5rem; }
.precio-currency { font-family:var(--font-mono);font-size:1.5rem;color:var(--ink-soft);margin-top:.5rem; }
.precio-value { font-family:var(--font-mono);font-size:clamp(3rem,8vw,4.5rem);font-weight:700;color:var(--ink);line-height:1; }
.precio-periodo { font-family:var(--font-mono);font-size:.75rem;color:var(--ink-faint);margin-bottom:2rem; }
.precio-features { display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem; }
.precio-features li { display:flex;align-items:flex-start;gap:.75rem;font-size:.9rem;color:var(--ink-soft); }
.precio-features .check { color:var(--accent);font-family:var(--font-mono);font-weight:700;flex-shrink:0; }
.precio-trust { text-align:center;font-size:.78rem;color:var(--ink-faint);margin-top:1rem; }

/* ── FAQ ── */
.faq-section { padding:clamp(5rem,10vw,8rem) 0;background:var(--bg-raised); }
.faq-list { max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:.5rem; }
.faq-item { border:1px solid var(--line);border-radius:12px;background:var(--bg-card);transition:border-color .2s;overflow:hidden; }
.faq-item:hover { border-color:rgba(0,229,255,.2); }
.faq-header {
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.25rem 1.5rem;text-align:left;cursor:pointer;font-size:.95rem;font-weight:600;color:var(--ink);
  transition:color .2s;
}
.faq-icon { font-size:1.2rem;color:var(--ink-faint);transition:transform .3s var(--ease-out);flex-shrink:0; }
.faq-header[aria-expanded="true"] .faq-icon { transform:rotate(45deg); }
.faq-body { padding:0 1.5rem 1.25rem;font-size:.9rem;color:var(--ink-soft);line-height:1.7; }

/* ── FOOTER ── */
.footer { padding:4rem 0 3rem;border-top:1px solid var(--line);text-align:center; }
.footer-logo { font-family:var(--font-mono);font-size:1rem;color:var(--accent);font-weight:700;margin-bottom:.5rem; }
.footer-tagline { font-size:.8rem;color:var(--ink-faint);margin-bottom:1.5rem; }
.footer-links { display:flex;justify-content:center;gap:1.5rem;font-size:.8rem;color:var(--ink-faint); }
.footer-links a:hover { color:var(--accent); }
.footer-copy { font-family:var(--font-mono);font-size:.7rem;color:var(--ink-faint);margin-top:1.5rem;opacity:.6; }

/* ── MODAL ── */
.modal-overlay {
  position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  background:rgba(5,8,16,.88);backdrop-filter:blur(12px);
  opacity:0;transition:opacity .25s;
}
.modal-overlay[hidden] { display:none; }
.modal-overlay.is-open { opacity:1; }
.modal-box {
  background:var(--bg-card);border:1px solid rgba(0,229,255,.2);border-radius:20px;
  padding:2.25rem;width:100%;max-width:440px;margin:1rem;
  transform:scale(.97) translateY(12px);transition:transform .25s var(--ease-out);
  position:relative;
}
.modal-overlay.is-open .modal-box { transform:scale(1) translateY(0); }
.modal-close {
  position:absolute;top:1rem;right:1rem;width:32px;height:32px;border-radius:50%;
  background:var(--line);color:var(--ink-soft);font-size:1rem;
  display:flex;align-items:center;justify-content:center;transition:background .2s;
}
.modal-close:hover { background:rgba(0,229,255,.15); }
.modal-title { font-size:1.3rem;font-weight:700;margin-bottom:.4rem;color:var(--ink); }
.modal-sub { font-size:.85rem;color:var(--ink-soft);margin-bottom:1.75rem; }
.modal-label { display:block;font-size:.8rem;color:var(--ink-soft);font-weight:600;margin-bottom:.4rem; }
.modal-input {
  width:100%;background:var(--bg-raised);border:1px solid var(--line-strong);
  border-radius:10px;padding:.8rem 1rem;color:var(--ink);font-size:.95rem;
  font-family:var(--font-display);transition:border-color .2s;margin-bottom:1rem;
}
.modal-input:focus { outline:none;border-color:var(--accent); }
.modal-input::placeholder { color:var(--ink-faint); }
.modal-error { font-size:.82rem;color:#f87171;margin-bottom:1rem;padding:.6rem 1rem;background:rgba(248,113,113,.08);border-radius:8px;border-left:3px solid #f87171; }
.modal-submit {
  width:100%;padding:1rem;border-radius:12px;background:var(--accent);color:#050810;
  font-size:1rem;font-weight:700;cursor:pointer;transition:opacity .2s,transform .2s;
  display:flex;align-items:center;justify-content:center;gap:.75rem;
  font-family:var(--font-display);
}
.modal-submit:disabled { opacity:.6;cursor:not-allowed; }
.modal-spinner { width:18px;height:18px;border:2px solid rgba(5,8,16,.3);border-top-color:#050810;border-radius:50%;animation:spin .6s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.modal-trust { text-align:center;font-size:.75rem;color:var(--ink-faint);margin-top:1rem; }
.modal-redirect-state { text-align:center;padding:1rem 0; }
.modal-redirect-state p { font-size:.9rem;color:var(--ink-soft);margin-top:.75rem; }

/* ── TOAST COMPRA RECIENTE ── */
.toast-compra-box {
  background:var(--bg-card);border:1px solid rgba(0,229,255,.2);border-radius:12px;
  padding:.85rem 1rem;display:flex;align-items:center;gap:.75rem;
  box-shadow:0 8px 32px rgba(0,0,0,.5),0 0 20px rgba(0,229,255,.07);
  font-size:.82rem;
}
.toast-compra-icon {
  width:36px;height:36px;border-radius:50%;background:rgba(0,229,255,.1);
  border:1.5px solid rgba(0,229,255,.3);display:flex;align-items:center;
  justify-content:center;font-size:.9rem;flex-shrink:0;
}
.toast-compra-name { font-weight:700;color:var(--ink);font-size:.85rem; }
.toast-compra-detail { color:var(--ink-faint);font-size:.78rem;margin-top:.1rem; }
.toast-compra-pulse {
  width:8px;height:8px;border-radius:50%;background:#22c55e;
  animation:pulse-green 1.5s ease-in-out infinite;flex-shrink:0;
}
@keyframes pulse-green { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(1.4)} }

/* ── PAGO OK BANNER ── */
.pago-ok-banner {
  position:fixed;top:0;left:0;right:0;z-index:200;
  padding:1rem;display:flex;align-items:flex-start;justify-content:center;gap:1rem;
  background:rgba(5,8,16,.95);border-bottom:1px solid rgba(0,229,255,.2);
}
.pago-ok-banner[hidden] { display:none; }
.pago-ok-inner {
  max-width:600px;text-align:center;border:1px solid rgba(34,197,94,.3);
  background:rgba(34,197,94,.07);border-radius:12px;padding:1.25rem 2rem;
}
.pago-ok-icon { font-size:1.5rem;display:block;margin-bottom:.4rem; }
.pago-ok-inner h3 { font-size:1rem;font-weight:700;margin-bottom:.3rem; }
.pago-ok-inner p { font-size:.85rem;color:var(--ink-soft); }
.pago-ok-close {
  flex-shrink:0;font-size:1.1rem;color:var(--ink-faint);
  padding:.25rem .5rem;transition:color .2s;
}
.pago-ok-close:hover { color:var(--ink); }

/* ── HISTORIA (story section) ── */
.historia { padding:clamp(5rem,10vw,8rem) 0;background:var(--bg-raised); }
.historia-inner { max-width:820px;margin:0 auto; }
.historia-quote {
  font-size:clamp(1rem,2vw,1.15rem);color:var(--ink-soft);line-height:1.85;
  border-left:3px solid var(--accent);padding-left:1.5rem;margin:2rem 0;
}
.historia-firma { font-family:var(--font-mono);font-size:.8rem;color:var(--ink-faint);margin-top:.5rem; }

/* ── PARA QUIENES ── */
.para-quien { padding:clamp(5rem,10vw,8rem) 0; }
.pq-grid { display:grid;grid-template-columns:1fr 1fr;gap:2rem; }
@media (max-width:700px) { .pq-grid { grid-template-columns:1fr; } }
.pq-col { background:var(--bg-card);border:1px solid var(--line);border-radius:16px;padding:2rem; }
.pq-col.si { border-color:rgba(34,197,94,.25); }
.pq-col.no { border-color:rgba(248,113,113,.2); }
.pq-label { font-family:var(--font-mono);font-size:.75rem;font-weight:700;margin-bottom:1.25rem; }
.pq-col.si .pq-label { color:var(--green); }
.pq-col.no .pq-label { color:#f87171; }
.pq-list { display:flex;flex-direction:column;gap:.85rem; }
.pq-list li { display:flex;align-items:flex-start;gap:.75rem;font-size:.9rem;color:var(--ink-soft);line-height:1.55; }
.pq-icon { flex-shrink:0;font-size:.9rem;margin-top:.05rem; }
