:root{
  --rojo:#E8342A;
  --rojo-oscuro:#B01F17;
  --naranja:#FF7A1A;
  --amarillo:#FFB92E;
  --amarillo-claro:#FFD34D;
  --crema:#FFF6E8;
  --negro:#1A1A1A;
  --blanco:#FFFFFF;
  --azul:#2E9BFF;
  --azul-oscuro:#0C447C;
  --magenta:#E040FB;
  --magenta-oscuro:#8A1FA0;
  --verde:#3CCB7F;
}

*{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:'Rubik',system-ui,sans-serif;
  background:var(--crema);
  color:var(--negro);
  min-height:100vh;
}

/* ---------- HEADER ---------- */
.site-header{
  position:relative;
  background:var(--rojo);
  border-bottom:4px solid var(--negro);
  overflow:hidden;
}
.header-rays{
  position:absolute;inset:0;
  background:repeating-conic-gradient(from 0deg at 85% 120%,
    var(--rojo) 0deg 8deg, var(--naranja) 8deg 16deg, var(--amarillo) 16deg 24deg);
  opacity:.35;
  pointer-events:none;
}
.header-inner{
  position:relative;z-index:1;
  max-width:1280px;margin:0 auto;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;
  padding:16px 24px 14px;
}
.logo-top{height:64px;width:auto;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.35))}
.brand-title{
  font-family:'Bungee',cursive;
  font-size:clamp(26px,3.5vw,38px);
  color:var(--blanco);
  text-shadow:3px 3px 0 var(--negro);
  letter-spacing:1px;
  line-height:1;
}
.slogan{
  color:var(--amarillo-claro);
  font-weight:700;
  font-size:13px;
  margin-top:2px;
  text-shadow:1px 1px 0 rgba(0,0,0,.4);
}

/* ---------- BARRA PROMOS ---------- */
.promo-bar{
  background:var(--rojo);
  border-bottom:3px solid var(--negro);
  padding:8px 16px;
  display:flex;align-items:center;justify-content:center;
  gap:10px;flex-wrap:wrap;
  font-size:12.5px;
}
.promo-info{
  font-family:'Bungee',cursive;
  font-size:12px;color:#fff;
  text-shadow:1px 1px 0 var(--negro);
  white-space:nowrap;
}
.promo-cut{color:var(--amarillo);font-weight:700}
.promo-days{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:center}
.promo-day{
  background:rgba(0,0,0,.28);
  border-radius:14px;
  padding:3px 11px;
  color:#fff;white-space:nowrap;
}
.promo-day b{font-weight:700}
.promo-day.today{
  background:var(--amarillo-claro);
  border:2px solid var(--negro);
  color:var(--negro);font-weight:700;
  padding:2px 11px;
}
.promo-day.today b{color:var(--negro)}

/* ---------- LAYOUT ---------- */
.layout{
  max-width:1280px;margin:0 auto;
  display:grid;
  grid-template-columns:minmax(320px,440px) 1fr;
  gap:24px;
  padding:24px;
  align-items:stretch;
}
.torneos-full{grid-column:1/-1}
@media(max-width:900px){
  .layout{grid-template-columns:1fr}
}

/* ---------- CARTA ---------- */
.carta-card{
  background:var(--blanco);
  border:3px solid var(--negro);
  border-radius:16px;
  box-shadow:6px 6px 0 rgba(26,26,26,.85);
  padding:20px;
  height:100%;
  display:flex;flex-direction:column;
}
.carta-title{
  font-family:'Bungee',cursive;
  color:var(--rojo);
  font-size:26px;
  border-bottom:3px dashed var(--amarillo);
  padding-bottom:8px;
  margin-bottom:10px;
}
.carta-tabs{display:flex;gap:8px;margin-bottom:6px}
.ctab{
  font-family:'Bungee',cursive;font-size:13px;
  border:2px solid var(--negro);border-radius:20px;
  padding:6px 16px;cursor:pointer;
  background:#fff;color:var(--negro);
  transition:all .15s;
}
.ctab:hover{background:var(--amarillo-claro)}
.ctab.active{background:var(--negro);color:var(--amarillo-claro)}
.carta-panels{flex:1;min-height:0;overflow-y:auto;padding-right:6px}
.carta-panels::-webkit-scrollbar{width:8px}
.carta-panels::-webkit-scrollbar-thumb{background:var(--amarillo);border-radius:8px}
.carta-loading{padding:20px 0;color:#888;font-size:15px}
.cat-block{margin-top:16px}
.cat-name{
  display:inline-block;
  font-family:'Bungee',cursive;
  font-size:15px;
  background:var(--negro);
  color:var(--amarillo-claro);
  padding:4px 14px;
  border-radius:20px;
  margin-bottom:10px;
}
.item{
  display:flex;align-items:center;gap:12px;
  padding:8px 4px;
  border-bottom:1px dashed #e3d9c8;
}
.item:last-child{border-bottom:none}
.item-foto{
  width:44px;height:44px;flex:none;
  border-radius:10px;
  border:2px solid var(--negro);
  object-fit:cover;
  background:var(--crema);
}
.item-foto.placeholder{
  display:flex;align-items:center;justify-content:center;
  font-size:20px;
}
.item-main{flex:1;min-width:0}
.item-nombre{font-weight:700;font-size:15px}
.item-detalle{font-size:12.5px;color:#7a6f5d;margin-top:1px}
.item-precio{
  flex:none;
  font-weight:700;font-size:14px;
  background:var(--amarillo-claro);
  border:2px solid var(--negro);
  color:#6b3a00;
  padding:3px 12px;
  border-radius:20px;
  white-space:nowrap;
}

/* ---------- PLANO ---------- */
.plano-card{
  background:var(--blanco);
  border:3px solid var(--negro);
  border-radius:16px;
  box-shadow:6px 6px 0 rgba(26,26,26,.85);
  padding:20px;
  overflow:hidden;
}
.plano-title{
  font-family:'Bungee',cursive;
  color:var(--rojo);
  font-size:26px;
}
.plano-hint{font-size:13px;color:#7a6f5d;margin:4px 0 12px}
.plano-controls{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  margin-bottom:8px;
}
.btn-toggle{
  font-family:'Bungee',cursive;
  font-size:13px;
  background:var(--rojo);color:#fff;
  border:2px solid var(--negro);
  border-radius:24px;
  padding:8px 18px;
  cursor:pointer;
  box-shadow:3px 3px 0 var(--negro);
  transition:transform .1s;
}
.btn-toggle:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--negro)}
.level-pills{display:flex;gap:8px}
.pill{
  font-family:'Rubik',sans-serif;font-weight:700;font-size:12.5px;
  border:2px solid var(--negro);border-radius:20px;
  padding:6px 12px;cursor:pointer;background:#fff;
  transition:all .15s;
}
.pill-l1{color:#993C1D}
.pill-l2{color:var(--azul-oscuro)}
.pill-l3{color:var(--magenta-oscuro)}
.pill.active.pill-l1,.pill-l1:hover{background:var(--naranja);color:#fff}
.pill.active.pill-l2,.pill-l2:hover{background:var(--azul);color:#fff}
.pill.active.pill-l3,.pill-l3:hover{background:var(--magenta);color:#fff}

/* ---------- PLANO CARRUSEL ---------- */
.plano-card{height:100%;display:flex;flex-direction:column}
.plano-carousel{flex:1;min-height:0;overflow:hidden;margin-top:6px;position:relative}
.plano-track{display:flex;width:300%;height:100%;transition:transform .45s ease}
.plano-slide{width:33.3333%;flex:none;height:100%;display:flex;align-items:center;justify-content:center}
.plano-slide svg{max-width:100%;max-height:100%;height:100%;width:auto}
.plano-svg g.itm:hover{filter:brightness(1.14)}
.plano-svg text{user-select:none}
.plano-tooltip{
  position:absolute;display:none;z-index:30;
  background:var(--negro);color:#fff;
  border:2px solid var(--amarillo-claro);border-radius:12px;
  padding:7px 12px;font-size:12.5px;line-height:1.35;
  pointer-events:none;max-width:200px;
  box-shadow:3px 3px 0 rgba(26,26,26,.45);
}
.plano-tooltip .tt-title{display:block;font-family:'Bungee',cursive;font-size:12px;color:var(--amarillo-claro);margin-bottom:1px}
@media(max-width:900px){.plano-carousel{height:340px;flex:none}}

.level-info{
  margin-top:10px;
  font-size:14px;
  text-align:center;
  background:var(--crema);
  border:2px dashed var(--negro);
  border-radius:12px;
  padding:8px 14px;
}
.level-info strong{font-family:'Bungee',cursive;font-weight:400}

/* ---------- TORNEOS ---------- */
.torneos-card{
  margin-top:20px;
  background:#672575;
  border:3px solid var(--negro);
  border-radius:16px;
  box-shadow:6px 6px 0 rgba(74,26,85,.9);
  padding:20px;
  position:relative;
}
.torneos-title{
  font-family:'Bungee',cursive;
  color:var(--amarillo-claro);
  font-size:22px;
}
.torneos-text{color:#e8dbec;font-size:14px;margin-top:8px}
.torneos-link{
  display:flex;align-items:center;gap:22px;
  text-decoration:none;
  transition:transform .15s, box-shadow .15s;
}
.torneos-link:hover{
  transform:translate(-2px,-2px);
  box-shadow:8px 8px 0 rgba(74,26,85,.9);
}
.torneos-logo{
  height:74px;width:74px;flex:none;
  object-fit:contain;
  background:#fff;
  border:2px solid #f9b725;
  border-radius:14px;
  padding:6px;
}
.torneos-main{min-width:0}
@media(max-width:600px){
  .torneos-link{flex-direction:column;text-align:center;gap:12px}
}

/* ---------- FOOTER ---------- */
.site-footer{
  margin-top:20px;
  background:var(--negro);
  border-top:4px solid var(--rojo);
}
.partners-band{
  overflow:hidden;
  background:#fff;
  border-bottom:3px solid var(--rojo);
  padding:12px 0;
}
.partners-track{
  display:flex;align-items:center;gap:46px;
  width:max-content;
  animation:marquee 22s linear infinite;
}
.partners-track img{
  height:36px;width:auto;object-fit:contain;
}
@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.footer-inner{
  max-width:1280px;margin:0 auto;
  display:flex;align-items:center;justify-content:center;gap:18px;
  flex-wrap:wrap;
  padding:14px 24px 22px;
}
.logo-footer{height:56px;width:auto}
.footer-slogan{color:var(--amarillo-claro);font-weight:500;font-size:14px}
.ig-link{
  display:inline-flex;align-items:center;gap:7px;
  color:var(--amarillo-claro);font-weight:700;font-size:14px;
  text-decoration:none;
  border:2px solid var(--amarillo-claro);border-radius:20px;
  padding:5px 14px;
  transition:all .15s;
}
.ig-link:hover{background:var(--rojo);color:#fff;border-color:#fff}

/* movil */
@media(max-width:600px){
  .logo-top{max-width:70vw;height:auto;max-height:64px}
  .header-inner{padding:14px 16px}
}
