/* PrimeOps Boletas · estilos compartidos */
:root{
  --fondo:#f6f5f2; --papel:#ffffff; --tinta:#16140f; --tinta2:#3c3832; --dim:#6e6860; --faint:#9a948b;
  --linea:#e6e2db; --linea2:#d6d1c8; --ok:#1f7a45; --mal:#b3261e; --alerta:#a35f00;
  --acento:#111111; --radio:14px; --sombra:0 1px 2px rgba(22,20,15,.06),0 8px 28px rgba(22,20,15,.07);
  --fuente:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:var(--fuente);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
body.sin-scroll{overflow:hidden}
a{color:inherit;text-underline-offset:3px}
img{max-width:100%;display:block}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(28px,6vw,44px);font-weight:800}
h2{font-size:22px;font-weight:800}
h3{font-size:17px;font-weight:700}
p{margin:0 0 1em}
[hidden]{display:none!important}
.angosto{width:100%;max-width:1040px;margin:0 auto;padding:0 18px}
.dim{color:var(--dim)} .faint{color:var(--faint)} .centro{text-align:center}
.etiqueta{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin:0 0 8px}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;background:var(--tinta);color:#fff;font:600 15px/1 var(--fuente);padding:13px 20px;text-decoration:none;cursor:pointer;transition:transform .08s,opacity .15s,background .15s;min-height:44px}
.btn:active{transform:scale(.98)} .btn:disabled{opacity:.5;cursor:default}
.btn--acento{background:var(--acento)}
.btn--grande{font-size:16px;padding:16px 24px;width:100%;min-height:54px}
.btn--chico{font-size:13.5px;padding:9px 14px;min-height:36px}
.btn--linea{background:transparent;color:var(--tinta);box-shadow:inset 0 0 0 1.5px var(--linea2)}
.btn--texto{background:none;color:var(--dim);text-decoration:underline;padding:8px;min-height:0;font-weight:500}
.btn--full{width:100%}
.btn--peligro{background:var(--mal)}

/* Barra superior */
.barra{background:var(--papel);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20}
.barra__in{display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px}
.barra__org{font-weight:800;letter-spacing:-.01em;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra__ig{font-size:14px;color:var(--dim);text-decoration:none}
.marca{display:flex;align-items:center;gap:9px;font-weight:800;font-size:16px}

/* Evento */
.evento{padding-top:18px;padding-bottom:40px}
.evento__grid{display:grid;gap:22px}
@media(min-width:860px){.evento__grid{grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:40px;align-items:start}.cartel{position:sticky;top:76px}}
.cartel{margin:0;border-radius:var(--radio);overflow:hidden;background:#000;box-shadow:var(--sombra);aspect-ratio:4/5}
.cartel img{width:100%;height:100%;object-fit:cover}
.cartel--sin{background:var(--acento);display:grid;place-items:center;aspect-ratio:16/10}
@media(min-width:860px){.cartel--sin{aspect-ratio:4/5}}
.cartel__titulo{padding:28px;color:#fff;font-weight:800;font-size:clamp(28px,7vw,40px);line-height:1.05;letter-spacing:-.03em;text-align:left}
.info__titulo{margin-top:2px}
.datos{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:14px}
.datos li{display:flex;gap:12px;align-items:flex-start}
.datos .ic{flex:none;width:38px;height:38px;border-radius:11px;background:var(--papel);border:1px solid var(--linea);display:grid;place-items:center;color:var(--tinta2)}
.datos b{display:block;font-weight:700}
.datos small{display:block;color:var(--dim);font-size:14px}
.compra{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio);padding:18px;box-shadow:var(--sombra);margin-bottom:22px}
.compra__fila{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}
.compra__precio{display:block;font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1}
.compra__nota{display:block;font-size:13px;color:var(--dim);margin-top:5px}
.compra__quedan{font-size:13.5px;font-weight:700;color:var(--alerta);margin:-4px 0 10px}
.compra__seguro{font-size:13px;color:var(--dim);margin:12px 0 0}
.contador{display:flex;align-items:center;border:1.5px solid var(--linea2);border-radius:999px;flex:none}
.contador button{width:44px;height:44px;border:0;background:none;font-size:22px;cursor:pointer;color:var(--tinta);border-radius:999px}
.contador button:disabled{color:var(--linea2);cursor:default}
.contador output{min-width:28px;text-align:center;font-weight:800;font-size:18px}
.estado-venta{border-radius:12px;background:var(--fondo);padding:16px;text-align:center;font-weight:700;color:var(--tinta2)}
.estado-venta--agotada{background:var(--tinta);color:#fff;letter-spacing:.06em;text-transform:uppercase}
.descripcion{color:var(--tinta2);margin-bottom:22px;white-space:normal}
.legal{margin:0;border-top:1px solid var(--linea);padding-top:14px;display:grid;gap:10px;font-size:13.5px}
.legal div{display:grid;grid-template-columns:130px 1fr;gap:10px}
.legal dt{color:var(--dim)} .legal dd{margin:0}
.aviso{background:#fff4dd;border:1px solid #f0d9a6;color:#6b4a00;border-radius:12px;padding:12px 14px;margin:0 0 16px;font-size:14.5px}
.aviso--borrador{background:#eef2ff;border-color:#cfd7ff;color:#2b3a8a}

/* Barra pegada */
.pegado{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--papel);border-top:1px solid var(--linea);padding:10px 0 calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(0,0,0,.06)}
.pegado__in{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pegado b{display:block;font-size:18px} .pegado small{display:block;color:var(--dim);font-size:12.5px}

/* Hoja (modal desde abajo) */
.hoja{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center}
.hoja__fondo{position:absolute;inset:0;background:rgba(15,13,10,.5);animation:aparecer .18s ease}
.hoja__caja{position:relative;background:var(--papel);width:100%;max-width:520px;max-height:92vh;overflow:auto;border-radius:20px 20px 0 0;padding:22px 18px calc(22px + env(safe-area-inset-bottom));animation:subir .22s ease}
@media(min-width:620px){.hoja{align-items:center}.hoja__caja{border-radius:20px;max-height:88vh}}
@keyframes subir{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes aparecer{from{opacity:0}to{opacity:1}}
.hoja__x{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;background:var(--fondo);border-radius:999px;font-size:24px;line-height:1;cursor:pointer;color:var(--dim)}
.paso{display:grid;gap:14px}
.paso h2{margin:0;padding-right:40px}
.campo{display:grid;gap:6px;font-size:14px;font-weight:600;color:var(--tinta2)}
.campo input,.campo select,.campo textarea{font:400 16px var(--fuente);color:var(--tinta);background:var(--papel);border:1.5px solid var(--linea2);border-radius:12px;padding:12px 13px;width:100%;min-height:48px}
.campo textarea{min-height:110px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--tinta);box-shadow:0 0 0 3px rgba(22,20,15,.08)}
.campo small{font-weight:400;color:var(--dim);font-size:12.5px}
.metodos{border:0;padding:0;margin:4px 0 0;display:grid;gap:10px}
.metodos legend{font-size:14px;font-weight:600;color:var(--tinta2);margin-bottom:8px}
.metodo{display:block;cursor:pointer}
.metodo input{position:absolute;opacity:0;pointer-events:none}
.metodo__caja{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:10px;border:1.5px solid var(--linea2);border-radius:13px;padding:13px 14px;transition:border-color .12s,box-shadow .12s}
.metodo__caja b{font-size:15px} .metodo__caja small{grid-column:1;color:var(--dim);font-size:12.5px}
.metodo__total{grid-row:1/3;grid-column:2;align-self:center;font-weight:800}
.metodo input:checked+.metodo__caja{border-color:var(--acento);box-shadow:0 0 0 3px color-mix(in srgb,var(--acento) 18%,transparent)}
.metodo input:focus-visible+.metodo__caja{outline:2px solid var(--tinta)}
.desglose{background:var(--fondo);border-radius:12px;padding:12px 14px;font-size:14px;display:grid;gap:4px}
.desglose div{display:flex;justify-content:space-between;gap:10px;color:var(--tinta2)}
.desglose__total{border-top:1px solid var(--linea2);padding-top:7px;margin-top:3px;font-weight:800;color:var(--tinta)!important;font-size:15.5px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--tinta2)}
.check input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--acento)}
.error{background:#fdecea;color:var(--mal);border-radius:10px;padding:10px 12px;font-size:14px;margin:0}
.qr{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:14px;display:grid;place-items:center}
.qr img{width:100%;max-width:280px;aspect-ratio:1;image-rendering:pixelated}
.pista{font-size:13px;color:var(--dim);margin:0}
.esperando{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600;padding:8px}
.esperando.grande{font-size:20px;margin:30px 0 14px}
.punto{width:10px;height:10px;border-radius:50%;background:var(--acento);animation:latir 1.2s infinite ease-in-out}
@keyframes latir{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1.15);opacity:1}}
.listo{width:72px;height:72px;margin:6px auto 4px;border-radius:50%;background:var(--ok);color:#fff;font-size:38px;display:grid;place-items:center}

/* Mis boletas */
.boletas{padding-top:26px;padding-bottom:40px;max-width:620px}
.tiquetes{display:grid;gap:14px;margin:16px 0 26px}
.tiquete{background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:16px;display:grid;gap:14px;box-shadow:var(--sombra)}
@media(min-width:520px){.tiquete{grid-template-columns:auto 1fr;align-items:center}}
.tiquete__qr{background:#fff;border-radius:12px;display:grid;place-items:center}
.tiquete__qr img{width:240px;height:240px;image-rendering:pixelated}
.tiquete__info{display:grid;gap:3px}
.tiquete__info code{font-size:13px;color:var(--dim);letter-spacing:.06em}
.tiquete--usada{opacity:.55}
.pill{display:inline-block;background:var(--fondo);border-radius:999px;padding:3px 10px;font-size:12.5px;font-weight:700;justify-self:start}

/* Lista de funciones del organizador */
.lista-funciones{padding-top:24px;padding-bottom:40px;max-width:720px}
.tarjeta-funcion{display:grid;grid-template-columns:72px 1fr auto;gap:14px;align-items:center;background:var(--papel);border:1px solid var(--linea);border-radius:16px;padding:12px;text-decoration:none;margin-bottom:12px;box-shadow:var(--sombra)}
.tarjeta-funcion img,.tarjeta-funcion__sin{width:72px;height:90px;border-radius:10px;object-fit:cover}
.tarjeta-funcion__sin{display:grid;place-items:center;background:var(--acento);color:#fff;font-weight:800;font-size:28px}
.tarjeta-funcion__txt{display:grid;gap:2px;min-width:0}
.tarjeta-funcion__txt small{color:var(--dim);font-size:13.5px}
.tarjeta-funcion__estado{font-weight:800;font-size:14px;white-space:nowrap}
.tarjeta-funcion__estado.no{color:var(--dim)}

/* Inicio */
.barra--inicio{position:static}
.heroe{padding-top:56px;padding-bottom:48px;max-width:860px}
.heroe h1{font-size:clamp(34px,7vw,58px)}
.heroe__sub{font-size:clamp(17px,2.4vw,19px);color:var(--tinta2);max-width:640px}
.heroe__btns{display:grid;gap:10px;max-width:420px;margin-top:22px}
@media(min-width:640px){.heroe__btns{grid-template-columns:auto auto;max-width:none;justify-content:start}.heroe__btns .btn{width:auto}}
.franja{background:var(--papel);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.pasos3{display:grid;gap:22px;padding-top:36px;padding-bottom:36px}
@media(min-width:760px){.pasos3{grid-template-columns:repeat(3,1fr);gap:30px}}
.pasos3 p{color:var(--dim);margin:0}
.num{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--tinta);color:#fff;font-weight:800;font-size:14px;margin-bottom:12px}
.bloque{padding-top:40px;padding-bottom:40px}
.incluye{list-style:none;padding:0;margin:0;display:grid;gap:12px;max-width:760px}
.incluye li{padding-left:28px;position:relative;color:var(--tinta2)}
.incluye li::before{content:"";position:absolute;left:2px;top:7px;width:14px;height:8px;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg)}
.incluye b{color:var(--tinta)}
.precio-plan{display:grid;gap:18px;margin-bottom:18px}
@media(min-width:760px){.precio-plan{grid-template-columns:1fr 1fr}}
.precio-plan>div{border:1px solid var(--linea);border-radius:var(--radio);padding:20px;background:var(--fondo)}
.precio-plan .grande{font-size:40px;font-weight:800;letter-spacing:-.03em;display:block;margin-bottom:6px}
.precio-plan p{margin:0;color:var(--tinta2)}
details{border-bottom:1px solid var(--linea);padding:14px 0;max-width:760px}
summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
summary::after{content:"+";font-weight:400;font-size:22px;line-height:1;color:var(--dim)}
details[open] summary::after{content:"−"}
details p{margin:10px 0 0;color:var(--tinta2)}
.cierre{margin-top:30px;max-width:420px}
.vacio{padding-top:70px;padding-bottom:70px;text-align:center;max-width:560px}
.vacio .btn{margin-top:10px}

/* Pie */
.pie{border-top:1px solid var(--linea);padding:22px 0 calc(90px + env(safe-area-inset-bottom));font-size:13px;color:var(--dim)}
.pie .angosto{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
.pie a{color:var(--dim)}

/* Texto legal */
.texto-legal{padding-top:30px;padding-bottom:50px;max-width:760px}
.texto-legal h2{font-size:19px;margin-top:28px}
.texto-legal p,.texto-legal li{color:var(--tinta2)}