:root {
  --black:  #080808;
  --forest: #1A2E1A;
  --neon:   #7dff6b;
  --green:  #3a7a4e;
  --green2: #5bc94a;
  --cream:  #f0ede6;
  --earth:  #c4a882;
  --muted:  rgba(240,237,230,0.45);
}
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  background:var(--black); color:var(--cream);
  font-family:'DM Sans',sans-serif; font-weight:300;
  overflow-x:hidden; cursor:none;
}

/* ── CURSOR ── */
#cur {
  width:10px; height:10px; background:var(--neon); border-radius:50%;
  position:fixed; pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%); mix-blend-mode:difference;
  transition:width .3s, height .3s;
}
#cur-ring {
  width:36px; height:36px; border:1px solid rgba(125,255,107,.3); border-radius:50%;
  position:fixed; pointer-events:none; z-index:9998; transform:translate(-50%,-50%);
}

/* ── CANVAS ── */
#canvas { position:fixed; inset:0; pointer-events:none; z-index:0; }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:1.4rem 4rem;
  display:flex; align-items:center; justify-content:space-between;
  background:linear-gradient(to bottom, rgba(8,8,8,.95) 0%, transparent 100%);
}
.nav-right { display:flex; align-items:center; gap:2rem; }
.nav-tag {
  font-size:.65rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(125,255,107,.5); border:1px solid rgba(125,255,107,.2);
  padding:.3rem .8rem; border-radius:999px;
}
.nav-cta {
  background:var(--neon); color:var(--forest);
  padding:.55rem 1.4rem; font-size:.75rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; text-decoration:none;
  cursor:none; transition:opacity .2s;
}
.nav-cta:hover { opacity:.85; }

/* ── HERO ── */
.hero {
  min-height:100vh; position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:120px 2rem 80px; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 55% 50% at 65% 35%, rgba(58,122,78,.2) 0%, transparent 65%),
    radial-gradient(ellipse 35% 45% at 20% 75%, rgba(125,255,107,.06) 0%, transparent 55%);
  pointer-events:none;
}
.hero-grid {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(125,255,107,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125,255,107,.03) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%, black 20%, transparent 80%);
  pointer-events:none;
}
.hero-content { position:relative; z-index:2; text-align:center; max-width:860px; width:100%; }
.hero-badge {
  display:inline-flex; align-items:center; gap:.6rem;
  background:rgba(125,255,107,.08); border:1px solid rgba(125,255,107,.2);
  border-radius:999px; padding:.35rem 1.1rem;
  font-size:.68rem; letter-spacing:.25em; text-transform:uppercase;
  color:var(--neon); margin-bottom:2.5rem;
  opacity:0; animation:fadeUp .7s .1s forwards;
}
.badge-dot {
  width:6px; height:6px; background:var(--neon); border-radius:50%;
  animation:pulse 1.8s infinite;
}
.hero-logo { opacity:0; animation:fadeUp .8s .25s forwards; margin-bottom:.5rem; }
.hero-years {
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(1rem,2.5vw,1.4rem); font-weight:700;
  letter-spacing:.3em; text-transform:uppercase; color:rgba(240,237,230,.3);
  opacity:0; animation:fadeUp .8s .45s forwards; margin-bottom:2rem;
}
.hero-years span { color:var(--neon); }
.hero-sub {
  font-size:clamp(1rem,1.8vw,1.2rem); line-height:1.75; color:var(--muted);
  max-width:560px; margin:0 auto 3rem;
  opacity:0; animation:fadeUp .8s .6s forwards;
}
.hero-sub strong { color:var(--cream); font-weight:400; }
.hero-cta {
  display:inline-flex; gap:1rem; flex-wrap:wrap; justify-content:center;
  opacity:0; animation:fadeUp .8s .75s forwards; margin-bottom:4rem;
}
.btn-primary {
  background:var(--neon); color:var(--forest);
  padding:1rem 2.4rem; font-size:.85rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; text-decoration:none;
  cursor:none; transition:opacity .2s, transform .2s;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
}
.btn-primary:hover { opacity:.9; transform:translateY(-2px); }
.btn-ghost {
  background:transparent; color:var(--cream);
  padding:1rem 2.4rem; font-size:.85rem; font-weight:300;
  letter-spacing:.08em; text-transform:uppercase; text-decoration:none;
  border:1px solid rgba(240,237,230,.2); cursor:none;
  transition:border-color .2s, color .2s;
}
.btn-ghost:hover { border-color:var(--neon); color:var(--neon); }

/* COUNTDOWN */
.countdown-wrap { opacity:0; animation:fadeUp .8s .9s forwards; }
.countdown-label {
  font-size:.62rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--muted); margin-bottom:1rem;
}
.countdown { display:flex; justify-content:center; align-items:flex-start; gap:1.5rem; }
.count-block { text-align:center; }
.count-num {
  font-family:'Barlow Condensed',sans-serif;
  font-size:clamp(2.5rem,6vw,4rem); font-weight:900; line-height:1;
  color:var(--cream); display:block; min-width:3ch; transition:transform .15s;
}
.count-num.flip { transform:scaleY(.8); }
.count-unit { font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); display:block; margin-top:.35rem; }
.count-sep { font-family:'Barlow Condensed',sans-serif; font-size:3.5rem; color:rgba(125,255,107,.3); line-height:1; padding-top:.05rem; }
.hero-scroll {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.4rem;
  font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(240,237,230,.25);
  opacity:0; animation:fadeIn 1s 2s forwards;
}
.scroll-line { width:1px; height:44px; background:linear-gradient(to bottom, var(--neon), transparent); animation:scrollPulse 2s infinite; }

/* ── TICKER ── */
.ticker { background:var(--neon); padding:.65rem 0; overflow:hidden; position:relative; z-index:2; }
.ticker-inner { display:inline-flex; gap:2.5rem; animation:ticker 22s linear infinite; white-space:nowrap; }
.ticker-item { font-family:'Barlow Condensed',sans-serif; font-size:.9rem; letter-spacing:.1em; color:var(--forest); display:flex; align-items:center; gap:.8rem; }
.t-dot { width:4px; height:4px; background:rgba(26,46,26,.4); border-radius:50%; flex-shrink:0; }

/* ── SECCIONES ── */
.section { padding:6rem 5vw; position:relative; }
.eyebrow {
  font-size:.68rem; letter-spacing:.25em; text-transform:uppercase; color:var(--neon); margin-bottom:1rem; opacity:.75;
  display:flex; align-items:center; gap:.6rem;
}
.eyebrow::before { content:''; width:24px; height:1px; background:var(--neon); opacity:.5; }
.section-title { font-family:'Playfair Display',serif; font-size:clamp(2rem,4vw,3rem); font-weight:700; line-height:1.15; color:var(--cream); margin-bottom:1rem; }
.section-title em { font-style:italic; color:var(--earth); }
.section-sub { font-size:.95rem; line-height:1.8; color:var(--muted); max-width:520px; margin-bottom:3.5rem; }

/* QUÉ ES */
.what-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(240,237,230,.06); margin-top:3rem; }
.what-card { background:var(--black); padding:2.5rem; transition:background .3s; cursor:none; }
.what-card:hover { background:#111; }
.what-icon { font-size:2.2rem; margin-bottom:1.25rem; display:block; }
.what-num { font-family:'Barlow Condensed',sans-serif; font-size:.8rem; letter-spacing:.2em; color:rgba(240,237,230,.2); margin-bottom:.5rem; }
.what-title { font-family:'Barlow Condensed',sans-serif; font-size:1.6rem; letter-spacing:.04em; color:var(--cream); margin-bottom:.6rem; }
.what-desc { font-size:.85rem; line-height:1.7; color:var(--muted); }
.what-tag { display:inline-block; margin-top:1rem; font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:var(--neon); border:1px solid rgba(125,255,107,.2); padding:.2rem .6rem; border-radius:999px; }

/* HISTORIA */
.history-strip { background:var(--forest); padding:5rem 5vw; display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; align-items:center; }
.big-year { font-family:'Barlow Condensed',sans-serif; font-size:clamp(6rem,14vw,12rem); font-weight:900; line-height:.85; color:rgba(125,255,107,.08); position:absolute; top:-1rem; left:-1rem; pointer-events:none; user-select:none; }
.history-left { position:relative; }
.history-title { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; line-height:1.15; color:var(--cream); margin-bottom:1.25rem; }
.history-title em { font-style:italic; color:var(--neon); }
.history-text { font-size:.95rem; line-height:1.8; color:rgba(240,237,230,.6); }
.stats-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.stat-item { border-top:1px solid rgba(240,237,230,.12); padding-top:1.25rem; }
.stat-num { font-family:'Barlow Condensed',sans-serif; font-size:3.2rem; font-weight:900; color:var(--neon); line-height:1; margin-bottom:.25rem; }
.stat-label { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(240,237,230,.45); }

/* LO QUE VIENE */
.coming-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.coming-card { background:rgba(240,237,230,.04); border:1px solid rgba(240,237,230,.07); border-radius:12px; padding:2rem 1.75rem; cursor:none; }
.coming-card:hover { border-color:rgba(125,255,107,.3); background:rgba(125,255,107,.04); }
.coming-icon { font-size:2rem; margin-bottom:1.25rem; display:block; }
.coming-title { font-family:'Barlow Condensed',sans-serif; font-size:1.4rem; letter-spacing:.04em; color:var(--cream); margin-bottom:.6rem; }
.coming-desc { font-size:.83rem; line-height:1.7; color:var(--muted); }
.coming-soon-tag { display:inline-block; margin-top:1rem; font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:var(--earth); }

/* ALIANZAS */
.alliance-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(240,237,230,.06); margin-top:3rem; }
.alliance-card { background:var(--black); padding:2.5rem 2rem; transition:background .3s; }
.alliance-card:hover { background:#0f0f0f; }
.alliance-card.featured { background:#0a1a0a; }
.alliance-price { font-family:'Barlow Condensed',sans-serif; font-size:2.2rem; font-weight:900; color:var(--neon); line-height:1; margin-bottom:.35rem; }
.alliance-price span { font-size:1rem; color:var(--muted); font-weight:400; font-family:'DM Sans',sans-serif; }
.alliance-name { font-family:'Barlow Condensed',sans-serif; font-size:1.3rem; letter-spacing:.05em; color:var(--cream); margin-bottom:1rem; }
.alliance-features { list-style:none; display:flex; flex-direction:column; gap:.5rem; }
.alliance-features li { font-size:.82rem; color:var(--muted); display:flex; align-items:flex-start; gap:.6rem; line-height:1.5; }
.alliance-features li::before { content:'→'; color:var(--neon); flex-shrink:0; }
.alliance-cta { display:block; text-align:center; margin-top:1.75rem; background:rgba(125,255,107,.1); color:var(--neon); border:1px solid rgba(125,255,107,.2); padding:.75rem; font-size:.78rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; cursor:none; transition:background .2s; }
.alliance-cta:hover { background:rgba(125,255,107,.18); }
.alliance-card.featured .alliance-cta { background:var(--neon); color:var(--forest); border-color:var(--neon); }

/* NEWSLETTER */
.nl-section { padding:6rem 5vw; text-align:center; background:radial-gradient(ellipse 60% 80% at 50% 50%, rgba(58,122,78,.15) 0%, transparent 70%); }
.nl-title { font-family:'Barlow Condensed',sans-serif; font-size:clamp(2.5rem,7vw,5.5rem); font-weight:900; line-height:.9; letter-spacing:.02em; margin-bottom:1.5rem; }
.nl-title span { color:var(--neon); }
.nl-sub { font-size:.95rem; line-height:1.75; color:var(--muted); max-width:440px; margin:0 auto 2.5rem; }
.nl-form { display:inline-flex; overflow:hidden; border:1px solid rgba(240,237,230,.12); max-width:480px; width:100%; }
.nl-input { flex:1; background:rgba(240,237,230,.04); border:none; outline:none; padding:1rem 1.4rem; color:var(--cream); font-family:'DM Sans',sans-serif; font-size:.9rem; }
.nl-input::placeholder { color:rgba(240,237,230,.25); }
.nl-btn { background:var(--neon); color:var(--forest); border:none; padding:1rem 1.8rem; font-family:'DM Sans',sans-serif; font-size:.8rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; cursor:none; transition:opacity .2s; }
.nl-btn:hover { opacity:.88; }
.nl-note { font-size:.7rem; color:rgba(240,237,230,.2); margin-top:.75rem; letter-spacing:.05em; }
.nl-note.success { color:var(--neon); font-size:.85rem; }
.nl-note.error { color:#ff6b6b; font-size:.85rem; }

/* FOOTER */
footer { padding:3rem 5vw; border-top:1px solid rgba(240,237,230,.06); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
footer p { font-size:.75rem; color:rgba(240,237,230,.2); }

/* ANIMATIONS */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.7)} }
@keyframes scrollPulse { 0%,100%{opacity:.3} 50%{opacity:1} }
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity:1; transform:none; }

/* RESPONSIVE */
@media (max-width:900px) {
  nav { padding:1.2rem 2rem; }
  .nav-tag { display:none; }
  .what-grid { grid-template-columns:1fr; }
  .history-strip { grid-template-columns:1fr; gap:3rem; padding:4rem 5vw; }
  .coming-grid { grid-template-columns:1fr 1fr; }
  .alliance-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .coming-grid { grid-template-columns:1fr; }
  .hero-cta { flex-direction:column; align-items:center; }
  .countdown { gap:.8rem; }
  .nl-form { flex-direction:column; }
  .nl-btn { padding:1rem; }
}
