:root{
  --azul:#0a2a5e;--azul2:#123f86;--azul-claro:#e8eef8;
  --rojo:#d7261e;--rojo2:#b01c15;--naranja:#f28c00;--naranja-claro:#fff4e5;
  --texto:#16202e;--gris:#5d6878;--borde:#dbe2ec;--fondo:#f5f7fb;--blanco:#fff;--ok:#16834a;--mal:#c0261e;
  --sombra:0 6px 24px rgba(10,42,94,.10);--radio:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--fondo);color:var(--texto);line-height:1.45}
a{color:inherit}
.oculto{display:none!important}

/* Barra superior */
.top{position:sticky;top:0;z-index:20;background:var(--azul);color:#fff;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.top .in{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:12px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none}
.marca b{font-size:1.5rem;letter-spacing:2px}
.marca small{display:block;font-size:.7rem;opacity:.8;letter-spacing:1px;text-transform:uppercase}
.top nav{display:flex;gap:18px;font-size:.92rem}.top nav a{text-decoration:none;opacity:.9}
.top .cta{background:var(--rojo);padding:9px 16px;border-radius:30px;font-weight:700;text-decoration:none}
@media(max-width:760px){.top nav{display:none}}

/* Portada */
.hero{background:radial-gradient(circle at 85% 20%,rgba(242,140,0,.45),transparent 45%),linear-gradient(135deg,var(--azul) 0%,#0d1f45 55%,var(--rojo2) 130%);color:#fff;padding:64px 16px 90px;position:relative;overflow:hidden}
.hero .in{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.08;margin:0 0 14px}
.hero h1 em{font-style:normal;color:var(--naranja)}
.hero p{font-size:1.1rem;opacity:.9;max-width:560px}
.hero .botones{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero .franja{position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(-45deg,var(--naranja) 0 22px,#111 22px 44px)}
.hero-logo{justify-self:center;width:min(320px,80vw);background:#fff;border-radius:28px;padding:28px 24px 24px;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.hero-logo img{width:70%;height:auto;display:block;margin:0 auto}
.hero-logo b{display:block;font-size:3.4rem;line-height:1;color:#e1251b;font-weight:800;letter-spacing:2px;margin-top:6px}
.hero-logo span{display:block;color:#e1251b;font-weight:600;font-size:1rem;margin-top:6px}
.eyebrow{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:6px 14px;border-radius:30px;font-size:.8rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:14px}
.logo-chico{display:grid;place-items:center;width:42px;height:42px;background:#fff;border-radius:12px}
@media(max-width:760px){.hero .in{grid-template-columns:1fr}.hero-logo{width:220px;order:-1;padding:18px}.hero-logo b{font-size:2.4rem}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;text-decoration:none;transition:.15s}
.btn.rojo{background:var(--rojo);color:#fff}.btn.rojo:hover{background:var(--rojo2)}
.btn.blanco{background:#fff;color:var(--azul)}
.btn.sec{background:var(--azul-claro);color:var(--azul)}
.btn.azul{background:var(--azul);color:#fff}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* Ventajas */
.ventajas{max-width:1100px;margin:-50px auto 0;padding:0 16px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;z-index:2}
.ventajas div{background:#fff;border-radius:var(--radio);padding:18px;box-shadow:var(--sombra);border-top:4px solid var(--naranja)}
.ventajas div:nth-child(2){border-color:var(--rojo)}.ventajas div:nth-child(3){border-color:var(--azul2)}
.ventajas b{display:block;font-size:1.02rem;margin-bottom:4px}.ventajas span{color:var(--gris);font-size:.9rem}
@media(max-width:860px){.ventajas{grid-template-columns:1fr 1fr}}

/* Reservar */
.seccion{max-width:1100px;margin:0 auto;padding:56px 16px 0}
.titulo{font-size:1.8rem;margin:0 0 6px;color:var(--azul)}
.sub{color:var(--gris);margin:0 0 24px}
.reserva{display:grid;grid-template-columns:1fr 320px;gap:22px;align-items:start}
@media(max-width:900px){.reserva{grid-template-columns:1fr}}
.panel{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra);padding:22px}
.pasos{display:flex;gap:4px;margin-bottom:20px;overflow-x:auto}
.pasos div{flex:1;min-width:64px;text-align:center;font-size:.72rem;color:var(--gris);font-weight:600}
.pasos div i{display:block;height:6px;border-radius:3px;background:var(--borde);margin-bottom:6px}
.pasos div.hecho i{background:var(--azul2)}.pasos div.act i{background:var(--rojo)}.pasos div.act{color:var(--rojo)}
.paso h2{margin:0 0 4px;font-size:1.3rem}.paso>p{margin:0 0 16px;color:var(--gris)}

.cursos{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.curso{border:2px solid var(--borde);border-radius:14px;padding:14px;cursor:pointer;transition:.15s;position:relative;background:#fff}
.curso:hover{border-color:var(--naranja)}
.curso.sel{border-color:var(--rojo);box-shadow:0 0 0 4px rgba(215,38,30,.12)}
.curso.off{opacity:.55;cursor:not-allowed;background:#fafbfd}
.curso .ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:1.4rem;background:var(--naranja-claro);margin-bottom:8px}
.curso h3{margin:0 0 4px;font-size:1rem}.curso small{color:var(--gris);display:block}
.curso .precio{margin-top:10px;font-weight:800;color:var(--rojo);font-size:1.15rem}
.etq{position:absolute;top:10px;right:10px;font-size:.68rem;font-weight:700;padding:3px 8px;border-radius:20px;background:var(--azul);color:#fff}
.etq.nar{background:var(--naranja)}

.contador{display:flex;align-items:center;gap:18px;border:2px solid var(--borde);border-radius:14px;padding:16px;max-width:380px}
.contador button,.mini button{border:none;border-radius:50%;cursor:pointer;font-weight:700}
.contador button{width:48px;height:48px;background:var(--azul);color:#fff;font-size:1.5rem}
.contador b{font-size:2rem;min-width:56px;text-align:center}
.mini{display:flex;align-items:center;gap:8px}
.mini button{width:34px;height:34px;background:var(--azul-claro);color:var(--azul);font-size:1.1rem}
.mini b{min-width:26px;text-align:center}

input,select,textarea{width:100%;padding:12px;border:2px solid var(--borde);border-radius:10px;font-size:1rem;background:#fff;font-family:inherit}
input:focus,select:focus{outline:none;border-color:var(--azul2)}
label.campo{display:block;font-size:.85rem;font-weight:600;color:var(--gris);margin-bottom:4px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.f2 .todo{grid-column:1/-1}
@media(max-width:600px){.f2{grid-template-columns:1fr}}

.horas{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.hora{border:2px solid var(--borde);border-radius:12px;padding:12px;cursor:pointer;text-align:center}
.hora.sel{border-color:var(--rojo);background:#fff5f4}.hora.llena{opacity:.4;cursor:not-allowed}
.hora small{display:block;color:var(--gris);font-size:.8rem}
.barra{height:6px;background:#edf0f5;border-radius:3px;margin-top:8px;overflow:hidden}.barra i{display:block;height:100%;background:var(--ok)}

.opcion{display:flex;gap:10px;align-items:flex-start;border:2px solid var(--borde);border-radius:12px;padding:12px 14px;margin-bottom:10px;cursor:pointer}
.opcion input{width:auto;margin-top:3px}
.opcion.sel{border-color:var(--azul2);background:var(--azul-claro)}
.item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--borde)}
.item small{color:var(--gris);display:block}
.cat{margin:22px 0 4px;font-size:1rem;color:var(--azul);display:flex;align-items:center;gap:8px}
.cat:first-child{margin-top:0}

.aviso{background:var(--naranja-claro);border-left:4px solid var(--naranja);padding:11px 14px;border-radius:8px;font-size:.9rem;margin:14px 0}
.aviso.azul{background:var(--azul-claro);border-color:var(--azul2)}
.aviso.mal{background:#fdecea;border-color:var(--mal)}
.nav{display:flex;justify-content:space-between;margin-top:24px;gap:10px}

/* Resumen lateral */
.carrito{position:sticky;top:80px}
.carrito h3{margin:0 0 12px;color:var(--azul)}
.carrito .fila{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;padding:5px 0}
.carrito .fila span:last-child{white-space:nowrap}
.carrito .total{border-top:2px solid var(--borde);margin-top:10px;padding-top:10px;font-weight:800;font-size:1.25rem;color:var(--rojo)}
.carrito .vacio{color:var(--gris);font-size:.9rem}

/* Participantes */
.part{border:2px solid var(--borde);border-radius:14px;margin-bottom:12px;overflow:hidden}
.part summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px 16px;cursor:pointer;font-weight:700;background:#fafbfd}
.part summary::-webkit-details-marker{display:none}
.part .cuerpo{padding:16px}
.estado{font-size:.75rem;padding:4px 10px;border-radius:20px;background:#fdecea;color:var(--mal)}
.estado.ok{background:#e5f5ec;color:var(--ok)}
.salud{columns:2;font-size:.88rem;color:var(--gris);margin:6px 0 10px;padding-left:18px}
@media(max-width:600px){.salud{columns:1}}
.check{display:flex;gap:8px;align-items:flex-start;font-size:.9rem;margin:6px 0}
.check input{width:auto;margin-top:3px}
.firma{border:2px dashed var(--azul2);border-radius:12px;background:#fff;width:100%;height:160px;touch-action:none;display:block}
.firma-pie{display:flex;justify-content:space-between;font-size:.8rem;color:var(--gris);margin-top:4px}
.responsiva{max-height:260px;overflow-y:auto;border:1px solid var(--borde);border-radius:10px;padding:14px;font-size:.85rem;background:#fafbfd}
.responsiva h4{margin:12px 0 4px;color:var(--azul)}.responsiva h4:first-child{margin-top:0}
.responsiva p,.responsiva li{margin:0 0 6px}
.subida{display:flex;gap:10px}.subida label{flex:1;border:2px dashed var(--borde);border-radius:10px;padding:12px;text-align:center;cursor:pointer;font-size:.85rem;color:var(--gris)}
.subida label.ok{border-color:var(--ok);color:var(--ok);background:#f2faf5}
.subida input{display:none}

.folio{font-size:2.2rem;font-weight:800;color:var(--rojo);letter-spacing:3px}

/* Secciones informativas */
.como{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;counter-reset:n}
.como div{background:#fff;border-radius:var(--radio);padding:18px;box-shadow:var(--sombra)}
.como div::before{counter-increment:n;content:counter(n);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--rojo);color:#fff;font-weight:800;margin-bottom:10px}
@media(max-width:860px){.como{grid-template-columns:1fr 1fr}}
.reglas{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.reglas div{background:#fff;border-radius:var(--radio);padding:18px;box-shadow:var(--sombra);border-left:5px solid var(--rojo)}
.reglas div:nth-child(even){border-color:var(--azul2)}
@media(max-width:760px){.reglas{grid-template-columns:1fr}}
footer{margin-top:60px;background:var(--azul);color:#cfd8e8;padding:30px 16px;text-align:center;font-size:.9rem}
footer b{color:#fff}

/* Aviso de sitio en construcción */
.obra{background:repeating-linear-gradient(-45deg,#f28c00 0 18px,#ffb347 18px 36px);color:#1b1206;text-align:center;font-size:.92rem;padding:9px 16px;font-weight:600}
