/* =========================================================
   TUMACO BIKE CHALLENGE · MAR Y FUEGO
   Cinematic dark · fuego (montaña) → mar (Pacífico)
   ========================================================= */

:root{
  /* base navy — tomado del jersey oficial */
  --bg:        #0a0d1e;
  --bg-2:      #11152e;
  --ink:       #f4f1ea;
  --muted:     #9aa2bd;
  --line:      rgba(255,255,255,.10);

  /* espectro del jersey */
  --azul:      #3b57c4;
  --cian:      #17c9c4;
  --verde:     #7fce4a;
  --amarillo:  #ffe500;
  --fuego:     #ff7a1f;
  --fuego-2:   #ff9a3d;
  --rojo:      #e63b46;
  --magenta:   #e5308a;
  --mar:       #17c9c4;

  /* gradiente espectro completo (firma visual = jersey) */
  --grad-jersey: linear-gradient(100deg, #3b57c4 0%, #17c9c4 20%, #7fce4a 38%, #ffe500 54%, #ff8a1f 70%, #e63b46 85%, #e5308a 100%);
  /* gradiente para botones — espectro del jersey (texto oscuro legible) */
  --grad-btn: linear-gradient(100deg, #17c9c4 0%, #ffe500 44%, #ff8a1f 70%, #e5308a 100%);
  /* alias retrocompat */
  --grad-fire-sea: var(--grad-jersey);
  --maxw: 1180px;
  --ease: cubic-bezier(.19,1,.22,1);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Archivo', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size:17px;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ line-height:1.02; letter-spacing:-.01em; }

.section-tag{
  font-size:.78rem; font-weight:800; letter-spacing:.28em; text-transform:uppercase;
  color:var(--fuego-2); margin-bottom:1.1rem;
}
.grad{
  background:var(--grad-fire-sea);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
/* defensive: split text never permanently hidden */
.reveal[data-split]{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-weight:800; font-size:.98rem; letter-spacing:.01em;
  padding:.95rem 1.7rem; border-radius:999px; cursor:pointer;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s, color .3s;
  border:1.5px solid transparent; white-space:nowrap;
}
.btn-solid{
  background:#ffffff; color:#0a0d1e;
  box-shadow:0 6px 20px rgba(0,0,0,.32);
}
.btn-solid:hover{ transform:translateY(-3px); background:#ffffff; box-shadow:0 12px 30px rgba(0,0,0,.45); }
.btn-ghost{ border-color:rgba(255,255,255,.28); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--cian); color:var(--cian); transform:translateY(-3px); }

/* ---------- splash ---------- */
#splash{
  position:fixed; inset:0; z-index:9999; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  animation:splashOut .8s var(--ease) forwards; animation-delay:1.9s;
}
.splash-inner{ text-align:center; animation:splashPulse 1.9s var(--ease); }
.splash-k{
  display:block; font-family:'Anton',sans-serif; font-size:clamp(4rem,16vw,11rem);
  background:var(--grad-fire-sea); -webkit-background-clip:text; background-clip:text; color:transparent;
  letter-spacing:.02em; line-height:.9;
}
.splash-sub{ display:block; letter-spacing:.55em; font-weight:800; font-size:.8rem; color:var(--muted); padding-left:.55em; }
@keyframes splashOut{ to{ opacity:0; visibility:hidden; } }
@keyframes splashPulse{ 0%{ opacity:0; transform:scale(.94);} 30%{opacity:1;} 100%{opacity:1; transform:scale(1);} }
body.loaded #splash{ display:none; }

/* ---------- nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:900;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.1rem clamp(1.1rem,4vw,2.6rem);
  transition:background .4s, backdrop-filter .4s, padding .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(10,13,30,.74); backdrop-filter:blur(14px);
  border-bottom-color:var(--line); padding-top:.75rem; padding-bottom:.75rem;
}
.nav-brand{ display:flex; align-items:center; gap:.6rem; }
.brand-logo{ height:46px; width:auto; transition:height .4s var(--ease); }
.nav.scrolled .brand-logo{ height:38px; }
.nav-links{ display:flex; gap:1.7rem; }
.nav-links a{ font-size:.9rem; font-weight:600; color:var(--muted); transition:color .25s; }
.nav-links a:hover{ color:var(--ink); }
.nav-cta{ padding:.6rem 1.3rem; font-size:.88rem; }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding:7rem clamp(1.1rem,5vw,3rem) 2rem; overflow:hidden; }
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:url('assets/img/foto-hero.webp') center 28%/cover no-repeat;
  filter:saturate(1.02);
}
.hero-bg::before{ content:''; position:absolute; inset:0;
  background:
    radial-gradient(110% 85% at 6% 0%, rgba(59,87,196,.5), transparent 55%),
    radial-gradient(90% 70% at 96% 8%, rgba(255,138,31,.34), transparent 52%),
    radial-gradient(130% 100% at 100% 100%, rgba(229,48,138,.34), transparent 52%),
    radial-gradient(120% 90% at 50% 60%, rgba(23,201,196,.20), transparent 60%);
  mix-blend-mode:overlay; }
.hero-bg::after{ content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,10,22,.52) 0%, rgba(8,10,22,.32) 34%, rgba(8,10,22,.9) 100%); }
.hero-grain{
  position:absolute; inset:0; z-index:1; opacity:.5; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
.hero-inner{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; width:100%; }
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:.6rem; font-weight:700; font-size:.82rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink);
  border:1px solid var(--line); padding:.5rem 1rem; border-radius:999px; margin-bottom:1.6rem;
  background:rgba(255,255,255,.03);
}
.hero-eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--fuego); box-shadow:0 0 12px var(--fuego); }
.hero-title{
  font-family:'Anton',sans-serif; font-weight:400;
  font-size:clamp(3.6rem, 15vw, 12rem); line-height:.86; letter-spacing:.01em;
  text-transform:uppercase; margin-bottom:1.4rem;
}
.hero-title .line{ display:inline-block; }
.hero-title .amp{
  background:var(--grad-fire-sea); -webkit-background-clip:text; background-clip:text; color:transparent;
  padding:0 .1em; font-family:'Archivo Black', sans-serif; font-size:.7em; vertical-align:.06em;
}
.hero-lead{ max-width:44ch; font-size:clamp(1.05rem,2.4vw,1.32rem); color:#d7d3ca; margin-bottom:1.6rem; }
.hero-lead strong{ color:var(--amarillo); font-weight:800; }
.hero-route{
  display:inline-flex; align-items:center; gap:1rem; font-family:'Anton',sans-serif;
  font-size:clamp(1.4rem,4vw,2.4rem); letter-spacing:.04em; text-transform:uppercase; margin-bottom:2.2rem;
}
.hero-route .arrow{ color:var(--fuego); }
.hero-cta{ display:flex; flex-wrap:wrap; gap:1rem; }

.hero-stats{
  position:relative; z-index:2; max-width:var(--maxw); margin:3.4rem auto 0; width:100%;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden;
}
.hstat{ background:rgba(13,17,38,.62); padding:1.4rem 1.3rem; }
.hstat-num{ display:block; font-family:'Anton',sans-serif; font-size:clamp(1.5rem,3.2vw,2.3rem); letter-spacing:.01em; }
.hstat-num .unit{ font-size:.5em; color:var(--mar); }
.hstat-lbl{ display:block; font-size:.82rem; color:var(--muted); margin-top:.3rem; }
.hstat-date .hstat-num{ color:var(--amarillo); }

/* ---------- reto ---------- */
.reto{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); }
.reto-inner{ max-width:var(--maxw); margin:0 auto; }
.reto-head{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2.2rem,6.5vw,5rem); line-height:.98; margin-bottom:2rem; }
.reto-head span{ display:block; }
.reto-copy{ max-width:60ch; font-size:clamp(1.05rem,2vw,1.3rem); color:#cfcbc2; margin-bottom:3rem; }
.reto-copy strong{ color:var(--ink); font-weight:800; }
.reto-figs{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.fig{ border-top:2px solid; border-image:var(--grad-fire-sea) 1; padding-top:1rem; }
.fig-n{ display:block; font-family:'Anton',sans-serif; font-size:clamp(2rem,4vw,3.2rem); }
.fig-l{ display:block; color:var(--muted); font-size:.9rem; }

/* ---------- band (parallax) ---------- */
.band{ position:relative; min-height:70vh; display:flex; align-items:center; overflow:hidden; }
.band-bg{ position:absolute; inset:0; z-index:0;
  background:url('assets/img/foto-band.webp') center 35%/cover no-repeat;
  background-attachment:fixed; }
.band-bg::after{ content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,10,22,.72), rgba(8,10,22,.52) 40%, rgba(8,10,22,.84));
}
.band-inner{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:5rem clamp(1.1rem,5vw,3rem); width:100%; }
.band-quote{ font-family:'Archivo', serif; font-weight:800; font-style:italic;
  font-size:clamp(1.5rem,4.4vw,3rem); line-height:1.15; max-width:22ch; letter-spacing:-.01em; }
.band-quote br{ display:block; }
@supports (-webkit-touch-callout: none){ .band-bg{ background-attachment:scroll; } }
@media (max-width:900px){ .band-bg{ background-attachment:scroll; } }

/* ---------- galeria ---------- */
.galeria{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); }
.galeria-inner{ max-width:var(--maxw); margin:0 auto; }
.galeria h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,6vw,4.2rem); margin-bottom:.8rem; }
.galeria-lead{ color:var(--muted); max-width:46ch; margin-bottom:2.6rem; }
.gal-grid{ display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:200px; gap:12px; }
.gal-item{ margin:0; overflow:hidden; border-radius:14px; border:1px solid var(--line); position:relative; }
.gal-item img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.gal-item:hover img{ transform:scale(1.07); }
.gal-item::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(8,10,22,.4)); pointer-events:none; }
.gal-tall{ grid-row:span 2; }
.gal-wide{ grid-column:span 2; }
@media (max-width:900px){
  .gal-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:160px; }
  .gal-wide{ grid-column:span 2; }
  .gal-tall{ grid-row:span 2; }
}
@media (max-width:620px){
  .gal-grid{ grid-auto-rows:140px; }
}

/* ---------- altimetria ---------- */
.alti{ padding:clamp(4rem,10vw,8rem) clamp(1.1rem,5vw,3rem); background:
  linear-gradient(180deg, transparent, rgba(255,106,43,.04) 20%, rgba(31,224,207,.05) 80%, transparent); }
.alti-inner{ max-width:var(--maxw); margin:0 auto; }
.alti-head h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,6vw,4.2rem); margin-bottom:2.4rem; }
.alti-metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2.4rem; }
.am{ background:var(--bg-2); border:1px solid var(--line); border-radius:14px; padding:1.3rem; }
.am-n{ display:block; font-family:'Anton',sans-serif; font-size:clamp(1.4rem,3vw,2.1rem); color:var(--amarillo); }
.am-l{ display:block; color:var(--muted); font-size:.85rem; margin-top:.25rem; }
.alti-chart{ background:linear-gradient(180deg,#0e1230,#0a0d1e); border:1px solid var(--line);
  border-radius:20px; padding:1.4rem 1rem .8rem; }
.alti-chart svg{ width:100%; height:auto; overflow:visible; }
.alti-fill{ opacity:0; transition:opacity 1.2s ease .3s; }
.alti-fill.in{ opacity:1; }
.alti-line{ stroke-dasharray:2600; stroke-dashoffset:2600; }
.alti-line.in{ transition:stroke-dashoffset 2.4s var(--ease); stroke-dashoffset:0; }
.alti-marks circle{ fill:#fff; stroke:var(--bg); stroke-width:2; }
.alti-marks .mk-sea circle{ fill:var(--mar); }
.alti-marks text{ fill:#e7e3da; font-size:13px; font-weight:700; }
.alti-marks .mk{ opacity:0; transition:opacity .6s ease; }
.alti-marks .mk.in{ opacity:1; }
.alti-chart figcaption{ text-align:center; color:var(--muted); font-size:.86rem; margin-top:1rem; }

/* ---------- ruta / timeline ---------- */
.ruta{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); }
.ruta-inner{ max-width:var(--maxw); margin:0 auto; }
.ruta h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,6vw,4.2rem); margin-bottom:3rem; }
.timeline{ list-style:none; position:relative; margin-bottom:4.5rem; padding-left:0; }
.timeline::before{ content:''; position:absolute; left:8.5rem; top:.4rem; bottom:.4rem; width:2px;
  background:var(--grad-fire-sea); opacity:.55; }
.tl{ position:relative; display:grid; grid-template-columns:8.5rem 1fr; gap:2rem; padding:1.3rem 0; }
.tl-km{ font-family:'Anton',sans-serif; font-size:1.15rem; color:var(--fuego-2); text-align:right; padding-right:1.4rem; padding-top:.15rem; }
.tl::after{ content:''; position:absolute; left:calc(8.5rem - 6px); top:1.55rem; width:14px; height:14px; border-radius:50%;
  background:var(--bg); border:3px solid var(--amarillo); box-shadow:0 0 0 4px rgba(255,210,63,.12); }
.tl-final::after{ background:var(--mar); border-color:var(--mar); box-shadow:0 0 0 5px rgba(31,224,207,.18); }
.tl-body h3{ font-size:1.55rem; font-weight:800; margin-bottom:.35rem; display:flex; align-items:baseline; gap:.8rem; flex-wrap:wrap; }
.tl-alt{ font-family:'Anton',sans-serif; font-size:1rem; color:var(--muted); letter-spacing:.02em; }
.tl-body p{ color:#c3bfb6; max-width:52ch; }

/* hidratacion */
.hidra h3{ font-size:clamp(1.3rem,3vw,1.9rem); font-weight:800; margin-bottom:1.6rem; }
.hidra-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-bottom:1.4rem; }
.hcard{ background:var(--bg-2); border:1px solid var(--line); border-radius:14px; padding:1.4rem; transition:transform .35s var(--ease), border-color .35s; }
.hcard:hover{ transform:translateY(-5px); border-color:rgba(255,210,63,.4); }
.hcard-i{ font-family:'Anton',sans-serif; color:var(--fuego); font-size:1.1rem; }
.hcard h4{ font-size:1.15rem; font-weight:800; margin:.5rem 0 .2rem; }
.hcard p{ color:var(--muted); font-size:.9rem; }
.hidra-note{ color:var(--muted); font-size:.95rem; }

/* ---------- jersey ---------- */
.jersey{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); }
.jersey-inner{ max-width:var(--maxw); margin:0 auto; display:grid;
  grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.jersey-media{ position:relative; border-radius:22px; overflow:hidden;
  border:1px solid var(--line); background:var(--bg-2); aspect-ratio:1/1; }
.jersey-media img{ width:100%; height:100%; object-fit:cover; }
.jersey-ph{ display:none; position:absolute; inset:0; flex-direction:column;
  align-items:center; justify-content:center; gap:.9rem; text-align:center; padding:2rem;
  background:var(--grad-jersey); }
.jersey-ph::before{ content:''; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='48' viewBox='0 0 56 48'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-opacity='.25' stroke-width='1.5' d='M14 0l14 8v16l-14 8L0 24V8zM42 0l14 8v16l-14 8-14-8V8zM28 24l14 8v16l-14 8-14-8V32z'/%3E%3C/svg%3E");
  background-size:44px 38px; }
.jersey-media.no-img img{ display:none; }
.jersey-media.no-img .jersey-ph{ display:flex; }
.jersey-ph-k,.jersey-ph-t{ position:relative; z-index:1; }
.jersey-ph-k{ font-family:'Anton',sans-serif; font-size:clamp(2rem,5vw,3.4rem); color:#0a0d1e;
  letter-spacing:.03em; text-shadow:0 2px 20px rgba(255,255,255,.25); }
.jersey-ph-t{ font-weight:800; font-size:.9rem; letter-spacing:.05em; color:rgba(10,13,30,.8);
  background:rgba(255,255,255,.6); padding:.4rem .9rem; border-radius:999px; }
.jersey-body h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,5.5vw,3.8rem); margin-bottom:1.2rem; }
.jersey-copy{ color:#cfcbc2; font-size:1.08rem; margin-bottom:1.6rem; max-width:52ch; }
.jersey-copy strong{ color:var(--ink); }
.jersey-specs{ list-style:none; display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.jersey-specs li{ position:relative; padding-left:1.7rem; color:#d7d3ca; }
.jersey-specs li::before{ content:''; position:absolute; left:0; top:.5em; width:9px; height:9px;
  border-radius:50%; background:var(--grad-jersey); }
.jersey-specs strong{ color:var(--ink); }
@media (max-width:820px){
  .jersey-inner{ grid-template-columns:1fr; gap:2rem; }
  .jersey-media{ max-width:440px; margin:0 auto; width:100%; }
}

/* ---------- incluye ---------- */
.incluye{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); background:var(--bg-2); }
.incluye-inner{ max-width:var(--maxw); margin:0 auto; }
.incluye h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,6vw,4.2rem); margin-bottom:.8rem; }
.incluye-lead{ color:var(--muted); max-width:48ch; margin-bottom:2.6rem; }
.perks{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1rem; }
.perk{ position:relative; display:flex; align-items:center; gap:1rem; overflow:hidden;
  padding:1.15rem 1.25rem; background:rgba(255,255,255,.028);
  border:1px solid var(--line); border-radius:16px;
  transition:transform .35s var(--ease), border-color .35s, background .35s; }
.perk::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--c,var(--cian)); opacity:0; transition:opacity .35s; }
.perk:hover{ transform:translateY(-5px); background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.2); }
.perk:hover::before{ opacity:1; }
.perk-ic{ flex:none; width:46px; height:46px; border-radius:13px; display:grid; place-items:center;
  background:var(--c-bg, rgba(23,201,196,.16));
  border:1px solid var(--c-bd, rgba(23,201,196,.4)); }
.perk-ic svg{ width:23px; height:23px; color:var(--c,var(--cian)); }
.perk:hover .perk-ic{ transform:scale(1.06); transition:transform .35s var(--ease); }
.perk-txt{ font-weight:700; font-size:1rem; line-height:1.22; }
/* tinte por color del espectro del jersey */
.perk:nth-child(7n+1){ --c:#8fa2ff; --c-bg:rgba(59,87,196,.18); --c-bd:rgba(59,87,196,.45); }
.perk:nth-child(7n+2){ --c:#3ce6df; --c-bg:rgba(23,201,196,.16); --c-bd:rgba(23,201,196,.42); }
.perk:nth-child(7n+3){ --c:#a6e86a; --c-bg:rgba(127,206,74,.16); --c-bd:rgba(127,206,74,.42); }
.perk:nth-child(7n+4){ --c:#ffe500; --c-bg:rgba(255,229,0,.14); --c-bd:rgba(255,229,0,.4); }
.perk:nth-child(7n+5){ --c:#ff9a3d; --c-bg:rgba(255,138,31,.16); --c-bd:rgba(255,138,31,.42); }
.perk:nth-child(7n+6){ --c:#ff6b74; --c-bg:rgba(230,59,70,.16); --c-bd:rgba(230,59,70,.42); }
.perk:nth-child(7n){   --c:#ff6bb0; --c-bg:rgba(229,48,138,.16); --c-bd:rgba(229,48,138,.42); }

/* ---------- precios ---------- */
.precios{ padding:clamp(5rem,12vw,9rem) clamp(1.1rem,5vw,3rem); }
.precios-inner{ max-width:var(--maxw); margin:0 auto; text-align:center; }
.precios h2{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2rem,6vw,4.2rem); }
.precios-lead{ color:var(--muted); margin:1rem 0 3rem; }
.plans{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; max-width:820px; margin:0 auto; text-align:left; }
.plan{ position:relative; background:var(--bg-2); border:1px solid var(--line); border-radius:20px; padding:2.2rem; display:flex; flex-direction:column; }
.plan-feature{ border-color:transparent; background:
  linear-gradient(var(--bg-2),var(--bg-2)) padding-box,
  var(--grad-fire-sea) border-box; border:1.5px solid transparent;
  box-shadow:0 20px 60px rgba(255,106,43,.14); }
.plan-flag{ position:absolute; top:-.9rem; left:2.2rem; background:var(--grad-fire-sea); color:#0a0c10;
  font-weight:800; font-size:.75rem; letter-spacing:.04em; padding:.35rem .9rem; border-radius:999px; }
.plan h3{ font-size:1.5rem; font-weight:800; margin-bottom:.6rem; }
.plan-price{ font-family:'Anton',sans-serif; font-size:clamp(2.6rem,6vw,3.6rem); line-height:1; margin-bottom:1.4rem; }
.plan-price .cur{ font-size:.5em; vertical-align:.5em; color:var(--muted); margin-right:.1em; }
.plan-list{ list-style:none; display:flex; flex-direction:column; gap:.7rem; margin-bottom:1.8rem; flex:1; }
.plan-list li{ position:relative; padding-left:1.6rem; color:#cfcbc2; font-size:.98rem; }
.plan-list li::before{ content:'✓'; position:absolute; left:0; color:var(--mar); font-weight:800; }
.plan-cta{ width:100%; }

/* ---------- detalles ---------- */
.detalles{ padding:0 clamp(1.1rem,5vw,3rem) clamp(4rem,10vw,7rem); }
.detalles-inner{ max-width:var(--maxw); margin:0 auto; display:grid;
  grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.det{ background:var(--bg-2); padding:1.6rem 1.3rem; }
.det-l{ display:block; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fuego-2); font-weight:800; margin-bottom:.5rem; }
.det-v{ display:block; font-weight:700; font-size:1.02rem; }

/* ---------- footer ---------- */
.footer{ border-top:1px solid var(--line); padding:clamp(3.5rem,8vw,5.5rem) clamp(1.1rem,5vw,3rem) 3rem; background:#070a17; }
.footer-inner{ max-width:var(--maxw); margin:0 auto; }
.footer-brand{ display:flex; align-items:baseline; gap:1rem; flex-wrap:wrap; margin-bottom:2.6rem; }
.footer-k{ font-family:'Anton',sans-serif; font-size:2.4rem; background:var(--grad-fire-sea);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.footer-tag{ color:var(--muted); font-weight:600; }
.footer-cols{ display:grid; grid-template-columns:1.2fr 1.2fr 1fr; gap:2rem; padding-bottom:2.6rem; border-bottom:1px solid var(--line); }
.fcol h4{ font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--fuego-2); margin-bottom:.9rem; }
.fcol p{ margin-bottom:.4rem; }
.fcol a:hover{ color:var(--mar); }
.fcol .muted{ color:var(--muted); font-size:.9rem; }
.org-row{ display:flex; align-items:center; gap:1rem; }
.org-badge{ width:64px; height:64px; object-fit:contain; flex:none;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.5)); }
.footer-legal{ color:var(--muted); font-size:.82rem; margin-top:2rem; }
.dev-by{ margin-top:1.6rem; padding-top:1.4rem; border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; gap:.6rem; }
.dev-by span{ font-size:.78rem; color:var(--muted); }
.dev-by img{ height:20px; width:auto; object-fit:contain; opacity:.6; transition:opacity .3s var(--ease); }
.dev-by a:hover img{ opacity:1; }

/* ---------- whatsapp float ---------- */
.wa-float{ position:fixed; right:1.2rem; bottom:1.2rem; z-index:800; width:56px; height:56px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:#25d366; color:#0a0c10; box-shadow:0 10px 30px rgba(37,211,102,.4);
  transition:transform .3s var(--ease); }
.wa-float:hover{ transform:scale(1.08) translateY(-2px); }

/* ---------- responsive ---------- */
@media (max-width: 900px){
  .nav-links{ display:none; }
  .hero-stats, .alti-metrics, .reto-figs{ grid-template-columns:repeat(2,1fr); }
  .hidra-grid{ grid-template-columns:repeat(2,1fr); }
  .detalles-inner{ grid-template-columns:repeat(2,1fr); }
  .footer-cols{ grid-template-columns:1fr; gap:1.6rem; }
}
@media (max-width: 620px){
  body{ font-size:16px; }
  .plans{ grid-template-columns:1fr; }
  .timeline::before{ left:5.5rem; }
  .tl{ grid-template-columns:5.5rem 1fr; gap:1.1rem; }
  .tl::after{ left:calc(5.5rem - 6px); }
  .hidra-grid{ grid-template-columns:1fr 1fr; }
  .hero-stats{ grid-template-columns:1fr 1fr; }
  .detalles-inner{ grid-template-columns:1fr; }
  .nav-cta{ display:none; }
}