/* spinit-es.org — negro carbón y verde lima */
:root{
  --carbon:#0a0f0a;--carbon2:#0d130d;--placa:#131b13;--placa2:#1a241a;--veta:#283a26;
  --claro:#f1f5ee;--gris:#9cab98;
  --lima:#80ff00;--lima2:#a8ff4d;--lima3:#5cc000;--menta:#1f3d1a;
  --r:12px;
  --neon:0 12px 30px rgba(3,10,3,.6);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--carbon);color:var(--claro);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:16.5px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--lima)}
.st-pista{max-width:1160px;margin:0 auto;padding:0 22px}
h1,h2,h3{color:#fff;line-height:1.24;font-weight:800}
h2{font-size:clamp(22px,3vw,29px);margin:0 0 12px}
h2 b{color:var(--lima)}
h2::after{content:" ●";color:var(--lima);font-size:.55em;vertical-align:middle}
.st-h3{font-size:19px;margin:32px 0 16px;color:var(--lima2)}
.st-abre{color:var(--gris);margin:0 0 24px;max-width:830px}
.st-letra{font-size:12.5px;color:var(--gris);margin:14px 0 0}
.st-medio{text-align:center;margin-top:26px}
.st-banda{padding:50px 0}
.st-banda-negra{background:var(--carbon2);border-top:1px solid var(--veta);border-bottom:1px solid var(--veta)}
.st-banda p{color:#d7dfd3}

/* Botones */
.st-go{display:inline-block;font-weight:800;font-size:14px;padding:12px 26px;cursor:pointer;user-select:none;text-decoration:none;text-align:center;border-radius:var(--r);transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}
.st-go-lima{background:linear-gradient(165deg,var(--lima2),var(--lima) 55%,var(--lima3));color:#0c1602;box-shadow:0 5px 18px rgba(128,255,0,.25)}
.st-go-lima:hover{transform:translateY(-2px);box-shadow:0 9px 26px rgba(128,255,0,.4)}
.st-go-linea{background:transparent;border:2px solid var(--veta);color:var(--claro)}
.st-go-linea:hover{border-color:var(--lima);color:var(--lima2)}
.st-go-xl{padding:15px 32px;font-size:15.5px}

/* Cabecera */
.st-cielo{position:sticky;top:0;z-index:60;background:rgba(10,15,10,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--veta)}
.st-cielo-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:70px}
.st-marca img{display:block;height:26px;width:auto}
.st-menu{display:flex;gap:20px}
.st-menu a{color:var(--gris);font-weight:700;font-size:13.5px;text-decoration:none;transition:color .15s}
.st-menu a:hover{color:var(--lima2)}
.st-cielo-cta{display:flex;gap:10px}

/* Héroe con doble pantalla */
.st-arranque{background:radial-gradient(70% 110% at 88% -10%,rgba(128,255,0,.09),transparent 58%);border-bottom:1px solid var(--veta);padding:52px 0 46px;overflow:hidden}
.st-arranque-in{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:center}
.st-eco{color:var(--lima);font-weight:800;font-size:12.5px;letter-spacing:2.5px;text-transform:uppercase;margin:0 0 12px}
.st-arranque h1{font-size:clamp(26px,4vw,41px);margin:0 0 16px}
.st-arranque-texto{color:var(--gris);font-size:17.5px;margin:0 0 24px;max-width:640px}
.st-arranque-texto strong{color:var(--lima2)}
.st-arranque-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.st-nota{display:inline-flex;align-items:center;gap:10px;background:var(--placa);border:1px solid var(--veta);border-radius:99px;padding:8px 18px}
.st-nota b{color:var(--lima);font-size:19px}
.st-nota span{color:var(--gris);font-size:13px}
.st-duplex{position:relative;min-height:380px}
.st-duplex-desk{position:absolute;top:0;right:0;width:88%;border-radius:12px;border:1px solid var(--veta);box-shadow:var(--neon);transform:rotate(1.5deg)}
.st-duplex-mov{position:absolute;bottom:0;left:0;width:34%;border-radius:16px;border:1px solid var(--lima3);box-shadow:var(--neon);transform:rotate(-4deg)}

/* Sello de ventajas */
.st-checks{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.st-check{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:14px 16px;display:flex;gap:10px;align-items:center;font-size:13.5px;color:#dfe6db}
.st-check::before{content:"✔";color:var(--lima);font-weight:800}

/* Bono principal */
.st-bono{background:linear-gradient(115deg,var(--placa2),var(--placa));border:1px solid var(--lima3);border-radius:var(--r);padding:28px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.st-bono-cifra{font-size:clamp(28px,4vw,44px);font-weight:800;color:var(--lima);line-height:1.1}
.st-bono-cifra small{display:block;font-size:17px;color:#fff;font-weight:700;margin-top:6px}
.st-bono p{margin:10px 0 0;color:#d7dfd3;font-size:14.5px;max-width:640px}
.st-terminos{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:20px}
.st-termino{background:var(--carbon);border:1px solid var(--veta);border-radius:10px;padding:12px 10px;text-align:center}
.st-termino b{display:block;color:var(--lima2);font-size:16px}
.st-termino span{color:var(--gris);font-size:11.5px;line-height:1.4;display:block}

/* Promos habituales */
.st-ritmo{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.st-compas{background:var(--placa);border-top:4px solid var(--lima);border-radius:var(--r);padding:18px}
.st-compas i{font-style:normal;font-size:24px;display:block;margin-bottom:8px}
.st-compas h3{margin:0 0 8px;font-size:15px;color:#fff}
.st-compas p{margin:0;color:var(--gris);font-size:12.5px}
.st-compas p b{color:var(--lima2)}

/* Juegos */
.st-rejilla{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.st-rodillo{position:relative;display:block;background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:border-color .2s,transform .2s}
.st-rodillo:hover{border-color:var(--lima);transform:translateY(-4px)}
.st-rodillo img{display:block;width:100%}
.st-rodillo-velo{position:absolute;inset:0;background:rgba(10,15,10,.7);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .18s}
.st-rodillo:hover .st-rodillo-velo{opacity:1}
.st-rodillo-btn{background:linear-gradient(165deg,var(--lima2),var(--lima3));color:#0c1602;font-weight:800;font-size:12.5px;padding:9px 20px;border-radius:99px}
.st-filtros{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.st-filtros span{background:var(--placa);border:1px solid var(--veta);border-radius:99px;padding:7px 16px;font-size:13px;color:#dfe6db}
.st-filtros .st-filtro-on{border-color:var(--lima);color:var(--lima2)}

/* Categorías mesa */
.st-paños{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.st-paño{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:20px}
.st-paño h3{margin:0 0 8px;font-size:16.5px;color:var(--lima2)}
.st-paño p{margin:0;color:var(--gris);font-size:13.5px}

/* Deportes strip */
.st-cancha{background:linear-gradient(100deg,var(--menta),var(--placa));border:1px solid var(--lima3);border-radius:var(--r);padding:22px 26px;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;margin-top:24px}
.st-cancha-icono{font-size:32px}
.st-cancha h3{margin:0 0 4px;font-size:17px;color:var(--lima2)}
.st-cancha p{margin:0;color:#d7dfd3;font-size:14px}

/* Pantallazos con marco */
.st-vitrina{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.st-cristal{background:var(--placa);border:1px solid var(--veta);border-radius:12px;padding:8px}
.st-cristal img{display:block;width:100%;border-radius:8px}
.st-cristal figcaption{color:var(--gris);font-size:12.5px;text-align:center;padding:8px 4px 4px}

/* Firmas */
.st-firmas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.st-firmas img{height:54px;width:auto;border-radius:9px}

/* Pagos doble lista */
.st-cajas{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.st-caja{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:20px 22px}
.st-caja h3{margin:0 0 6px;font-size:16.5px;color:var(--lima2)}
.st-caja>small{display:block;color:var(--gris);font-size:12.5px;margin-bottom:14px}
.st-metodos{display:flex;flex-wrap:wrap;gap:8px}
.st-metodos span{background:var(--carbon);border:1px solid var(--veta);border-radius:99px;padding:6px 14px;font-size:12.5px;color:#dfe6db}
.st-plazos{margin-top:22px;border:1px solid var(--veta);border-radius:var(--r);overflow:hidden}
.st-plazo{display:grid;grid-template-columns:220px 1fr auto;gap:16px;align-items:center;padding:12px 18px;background:var(--placa);font-size:13.5px}
.st-plazo:nth-child(even){background:var(--placa2)}
.st-plazo b{color:#fff}
.st-plazo span{color:var(--gris)}
.st-plazo em{font-style:normal;color:var(--lima2);font-weight:800;white-space:nowrap}
.st-limites{margin-top:18px;background:linear-gradient(120deg,var(--placa2),var(--placa));border:1px dashed var(--lima3);border-radius:var(--r);padding:18px 22px;color:#d7dfd3;font-size:13.5px}
.st-limites b{color:var(--lima2)}

/* Consejos */
.st-consejos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;counter-reset:tip}
.st-consejos li{counter-increment:tip;background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:14px 16px 14px 52px;position:relative;color:#d7dfd3;font-size:13.5px}
.st-consejos li::before{content:counter(tip);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:50%;background:var(--lima);color:#0c1602;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.st-consejos b{color:var(--lima2)}

/* Soporte / seguridad */
.st-triple{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.st-celda{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:20px;text-align:center}
.st-celda i{font-style:normal;font-size:26px;display:block;margin-bottom:8px}
.st-celda b{display:block;color:#fff;font-size:15px;margin-bottom:4px}
.st-celda span{color:var(--gris);font-size:13px}

/* Opiniones */
.st-eco-voces{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.st-voz{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);padding:20px}
.st-voz header{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.st-bola{width:42px;height:42px;border-radius:50%;background:linear-gradient(165deg,var(--lima2),var(--lima3));color:#0c1602;font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center;flex:none}
.st-voz header b{display:block;font-size:15px;color:#fff}
.st-voz header small{color:var(--gris);font-size:12.5px}
.st-puntos{margin-left:auto;color:var(--lima);font-size:13px;letter-spacing:1px}
.st-voz p{margin:0;color:var(--gris);font-size:14.5px;font-style:italic}

/* FAQ */
.st-faqs{display:flex;flex-direction:column;gap:10px;max-width:880px;margin:0 auto}
.st-faq{background:var(--placa);border:1px solid var(--veta);border-radius:var(--r);overflow:hidden}
.st-faq[open]{border-color:var(--lima3)}
.st-faq summary{cursor:pointer;padding:15px 44px 15px 20px;font-weight:700;font-size:16px;color:#fff;list-style:none;position:relative}
.st-faq summary::-webkit-details-marker{display:none}
.st-faq summary::after{content:"❯";position:absolute;right:18px;top:50%;transform:translateY(-50%) rotate(90deg);color:var(--lima);font-size:13px;transition:transform .2s}
.st-faq[open] summary::after{transform:translateY(-50%) rotate(-90deg)}
.st-faq p{margin:0;padding:0 20px 16px;color:var(--gris);font-size:14.5px}
.st-cierre{margin-top:30px;background:linear-gradient(120deg,var(--placa2),var(--placa));border:1px solid var(--lima3);border-radius:var(--r);padding:28px;text-align:center}
.st-cierre p{margin:0 0 16px;font-size:17px;color:#e8eee4}

/* Pie */
.st-raiz{background:#060b06;border-top:1px solid var(--veta);padding:38px 0 20px}
.st-raiz-escudos{display:flex;gap:20px;flex-wrap:wrap;align-items:center;justify-content:center;padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--veta)}
.st-raiz-escudos img{height:32px;width:auto;opacity:.75;transition:opacity .15s}
.st-raiz-escudos a:hover img{opacity:1}
.st-raiz-nota{color:#89987f;font-size:13px;line-height:1.7;max-width:920px;margin:0 auto 14px;text-align:center}
.st-raiz-nota a{color:var(--lima)}
.st-raiz-firma{color:#89987f;font-size:12.5px;text-align:center;margin:0}

/* Responsive */
@media(max-width:1060px){
  .st-menu{display:none}
  .st-arranque-in{grid-template-columns:1fr}
  .st-duplex{max-width:560px;margin:0 auto;width:100%}
  .st-checks{grid-template-columns:1fr 1fr}
  .st-bono{grid-template-columns:1fr}
  .st-terminos{grid-template-columns:repeat(3,1fr)}
  .st-ritmo{grid-template-columns:1fr 1fr}
  .st-rejilla{grid-template-columns:repeat(3,1fr)}
  .st-paños{grid-template-columns:1fr}
  .st-cancha{grid-template-columns:1fr;text-align:center}
  .st-vitrina{grid-template-columns:1fr}
  .st-cajas{grid-template-columns:1fr}
  .st-consejos{grid-template-columns:1fr}
  .st-triple{grid-template-columns:1fr}
  .st-eco-voces{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  body{font-size:15.5px}
  .st-pista{padding:0 14px}
  .st-cielo-in{min-height:62px}
  .st-marca img{height:20px}
  .st-go{font-size:12.5px;padding:10px 18px}
  .st-go-xl{width:100%;padding:14px 22px}
  .st-go-linea{display:none}
  .st-arranque{padding:30px 0 26px}
  .st-arranque-cta{flex-direction:column}
  .st-banda{padding:32px 0}
  .st-duplex{min-height:300px}
  .st-checks{grid-template-columns:1fr}
  .st-terminos{grid-template-columns:1fr 1fr}
  .st-ritmo{grid-template-columns:1fr}
  .st-rejilla{grid-template-columns:1fr 1fr;gap:11px}
  .st-plazo{grid-template-columns:1fr;gap:4px}
  .st-eco-voces{grid-template-columns:1fr}
}