[hidden] {
  display: none !important;
}

:root {
  --color-bg: #F8F9FA;
  --color-bg-alt: #EEF0F6;
  --color-surface: #FFFFFF;
  --color-text: #12173F;
  --color-text-muted: #535A79;
  --color-primary: #2A36C2;
  --color-primary-hover: #212B9E;
  --color-secondary: #D47A30;
  --color-cta: #2A36C2;
  --color-cta-hover: #212B9E;
  --color-cta-text: #FFFFFF;
  --azul-claro: #E5E8FB;
  --azul-luz: #A9B1F3;
  --naranja-claro: #FBE7D5;
  --naranja-t: #8E4616;
  --noche: #12173F;
  --noche-2: #1C2358;
  --niebla: #EEF0F8;
  --niebla-muted: #BFC4E2;
  --linea: rgba(18, 23, 63, .12);
  --linea-fuerte: rgba(18, 23, 63, .22);
  --libre-bg: #E1F1E6;
  --libre-borde: #A8D3B6;
  --libre-t: #1B6338;
  --libre: #2E9B5F;
  --res-bg: #F5B57E;
  --res-t: #57290A;
  --reservado: #E08A3E;
  --vendido: #B23A31;
  --font-display: "Unbounded", "Onest", system-ui, sans-serif;
  --font-body: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-h1: clamp(2rem, 1.4rem + 1.9vw, 2.75rem);
  --fs-h2: clamp(1.45rem, 1.05rem + 1.5vw, 2.2rem);
  --fs-h3: clamp(1.02rem, .95rem + .35vw, 1.2rem);
  --fs-body: clamp(1rem, .97rem + .12vw, 1.0625rem);
  --fs-wm: clamp(1.45rem, .9rem + 1.9vw, 2.2rem);
  --section-pad-y: clamp(2.75rem, 5.5vw, 4.5rem);
  --gutter: clamp(16px, 4vw, 40px);
  --container: 1240px;
  --header-h: 76px;
  --radius: 14px;
  --radius-lg: 22px;
  --sp-1: 8px; --sp-2: 16px; --sp-3: 24px; --sp-4: 32px; --sp-5: 40px; --sp-6: 48px; --sp-7: 56px; --sp-8: 64px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-pop: cubic-bezier(0.34, 1.3, 0.64, 1);
  --ease-out: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-rev: cubic-bezier(0.32, 0.72, 0, 1);
  --shadow-lg: 0 26px 64px rgba(18, 23, 63, .24);
  --contorno: drop-shadow(0 0 1px rgba(18, 23, 63, .3)) drop-shadow(0 16px 30px rgba(18, 23, 63, .08));
  --cruce: clamp(72px, 9vw, 120px);
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; max-width: 100vw; -webkit-text-size-adjust: 100%; scrollbar-color: color-mix(in srgb, var(--color-primary) 45%, transparent) var(--color-bg-alt); }
body {
  margin: 0; overflow-x: clip; max-width: 100vw;
  background: var(--color-bg); color: var(--color-text);
  font-family: var(--font-body); font-size: var(--fs-body); line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
button, select, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
svg { flex: none; }
.ico { width: 20px; height: 20px; }
::selection { background: var(--azul-claro); color: var(--color-text); }
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }
body.no-scroll { overflow: hidden; }
[id] { scroll-margin-top: 16px; }
body.m1 [id] { scroll-margin-top: calc(var(--header-h) + 14px); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.container { width: 100%; max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
main > section { padding-block: var(--section-pad-y); position: relative; }
.sec-head { margin-bottom: clamp(20px, 3vw, 34px); max-width: 62ch; }
.sec-head h2, .bases__intro h2 { font: 800 var(--fs-h2)/1.12 var(--font-display); letter-spacing: -.02em; text-wrap: balance; }
.sec-head p { margin-top: .6rem; color: var(--color-text-muted); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 50px; padding: 0 1.4rem; border-radius: 999px; border: 1px solid transparent;
  font: 600 1rem/1.1 var(--font-body); text-decoration: none; white-space: nowrap;
  transition: background-color .25s, color .25s, border-color .25s, translate .3s var(--ease), transform .15s;
}
.btn .ico { width: 20px; height: 20px; }
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .6; cursor: progress; }
.btn--cta { background: var(--color-cta); color: var(--color-cta-text); }
.btn--cta:hover { background: var(--color-cta-hover); translate: 0 -1px; }
.btn--ghost { background: transparent; border-color: var(--linea-fuerte); color: var(--color-text); }
.btn--ghost:hover { border-color: var(--color-primary); color: var(--color-primary); }
.btn--tinta { background: var(--noche); color: #fff; }
.btn--tinta:hover { background: var(--noche-2); translate: 0 -1px; }
.btn--claro { background: var(--color-bg); color: var(--noche); }
.btn--claro .ico { color: var(--color-primary); }
.btn--claro:hover { background: #fff; translate: 0 -1px; }
.btn--ghost-claro { border-color: rgba(238, 240, 248, .38); color: #fff; }
.btn--ghost-claro:hover { border-color: #fff; color: #fff; background: rgba(255, 255, 255, .06); }
.btn--azar { background: var(--azul-claro); color: var(--color-primary); }
.btn--azar:hover { background: #D8DCF8; }
.btn--sm { min-height: 44px; padding: 0 1.05rem; font-size: .94rem; }
.btn--xs { min-height: 44px; padding: 0 .9rem; font-size: .87rem; gap: .4rem; }
.btn--xs .ico { width: 17px; height: 17px; }
.btn--full { width: 100%; }
.link { background: none; border: 0; padding: .55rem 0; min-height: 44px; color: var(--color-primary); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.link:hover { color: var(--color-primary-hover); }

.chip {
  min-height: 44px; padding: 0 .95rem; border-radius: 999px; border: 1px solid var(--linea-fuerte);
  background: var(--color-surface); color: var(--color-text); font-weight: 600; font-size: .9rem;
  transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.chip:hover { border-color: var(--color-primary); }
.chip:active { transform: scale(.97); }
.chip[aria-pressed="true"] { background: var(--noche); border-color: var(--noche); color: #fff; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: none; }
.dot--libre { background: var(--libre); }
.dot--reservado { background: var(--reservado); }
.dot--vendido { background: var(--vendido); }
.dot--tuyo { background: var(--color-primary); }

.wm { display: inline-flex; align-items: center; gap: .28em; font: 800 var(--fs-wm)/1 var(--font-display); letter-spacing: -.03em; white-space: nowrap; }
.wm__a { color: var(--color-text); }
.wm__b {
  background: var(--color-primary); color: #fff; padding: .16em .44em .18em; border-radius: .2em;
  -webkit-mask: radial-gradient(circle .15em at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle .15em at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle .15em at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle .15em at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
}
.wm--mini { font-size: 1rem; }
.wm--grande { font-size: clamp(2rem, 1.2rem + 3.2vw, 3.6rem); }

.site-header { position: relative; z-index: 15; overflow: visible; }
.site-header--m1 { position: sticky; top: 0; background: var(--color-bg); border-bottom: 1px solid var(--linea); }
.site-header--m2 { background: var(--noche); color: var(--niebla); }
.site-header--m2 .wm__a { color: #fff; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: clamp(12px, 2vw, 28px); min-height: var(--header-h); }
.brand { position: relative; z-index: 100; overflow: visible; text-decoration: none; display: inline-flex; align-items: center; min-height: 48px; }
.main-nav { display: flex; align-items: center; gap: clamp(14px, 1.5vw, 26px); margin-left: auto; }
.main-nav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; font-weight: 600; font-size: .96rem; transition: color .2s; }
.main-nav a:hover { color: var(--color-primary); }
.nav-panel { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: 0 .95rem; border-radius: 999px; border: 1px solid var(--linea-fuerte); background: transparent; font-weight: 600; font-size: .92rem; transition: border-color .2s, color .2s; }
.nav-panel .ico { width: 18px; height: 18px; }
.nav-panel:hover { border-color: var(--color-primary); color: var(--color-primary); }
.site-header--m2 .main-nav a:hover { color: var(--azul-luz); }
.site-header--m2 .nav-panel { border-color: rgba(238, 240, 248, .32); }
.site-header--m2 .nav-panel:hover { border-color: #fff; color: #fff; }
.header-acciones { display: flex; align-items: center; gap: 8px; }
.site-header--m2 .header-cta { background: var(--color-bg); color: var(--noche); }
.site-header--m2 .header-cta .ico { color: var(--color-primary); }
.nav-close { display: none; }
.menu-toggle { display: none; }
@media (max-width: 1200px) {
  .main-nav { position: fixed; top: 0; right: 0; max-height: 100dvh; overflow-y: auto; width: 76%; max-width: 330px; background: #fff; color: var(--color-text); display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .15rem; padding: 1.2rem 1.4rem calc(1.5rem + env(safe-area-inset-bottom)); transform: translateX(100%); visibility: hidden; transition: transform .38s var(--ease-rev), visibility 0s .38s, box-shadow 0s .38s; z-index: 120; box-shadow: none; margin-left: 0; border-radius: 22px 0 0 22px; }
  .main-nav.open { transform: translateX(0); visibility: visible; box-shadow: var(--shadow-lg); transition: transform .38s var(--ease-rev); }
  .main-nav a { padding: .8rem .2rem; font-size: 1.05rem; border-bottom: 1px solid var(--linea); color: var(--color-text); }
  .site-header--m2 .main-nav a:hover { color: var(--color-primary); }
  .main-nav .nav-panel, .site-header--m2 .main-nav .nav-panel { margin-top: 1rem; justify-content: center; border-color: var(--linea-fuerte); color: var(--color-text); }
  .nav-close { display: flex; align-items: center; justify-content: center; align-self: flex-end; width: 44px; height: 44px; margin-bottom: .3rem; border-radius: 50%; border: 0; background: var(--color-bg-alt); color: var(--color-text); }
  .nav-close .ico { width: 20px; height: 20px; }
  .menu-toggle { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 12px; background: transparent; color: inherit; }
  .menu-toggle svg { width: 24px; height: 24px; }
}
.nav-backdrop { position: fixed; inset: 0; background: rgba(12, 15, 40, .45); opacity: 0; visibility: hidden; transition: opacity .3s var(--ease-out), visibility 0s .3s; z-index: 110; }
.nav-backdrop.open { opacity: 1; visibility: visible; transition: opacity .3s var(--ease-out); }
@media (max-width: 560px) {
  .header-cta { display: none; }
}

.hero--m1 {
  padding-block: clamp(1.4rem, 3vw, 2.6rem) 0;
  background:
    radial-gradient(48% 38% at 0% 0%, rgba(42, 54, 194, .08), transparent 70%),
    radial-gradient(34% 30% at 100% 8%, rgba(212, 122, 48, .07), transparent 70%),
    var(--color-bg);
}
.hero-grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: clamp(24px, 3.4vw, 52px); align-items: start; }
.hero-col { display: grid; gap: clamp(18px, 2.4vw, 26px); }
.hero-eyebrow { display: inline-flex; align-items: center; gap: .55rem; font-weight: 600; font-size: .92rem; color: var(--color-text-muted); margin-bottom: .9rem; }
.hero h1 { font: 800 var(--fs-h1)/1.06 var(--font-display); letter-spacing: -.028em; text-wrap: balance; }
.swoosh { display: block; width: min(230px, 56%); height: 18px; color: var(--color-secondary); margin-top: .5rem; }
.hero-lead { margin-top: .9rem; color: var(--color-text-muted); max-width: 46ch; font-size: clamp(1.02rem, .98rem + .25vw, 1.15rem); }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 1.4rem; }
.hero-app { display: grid; gap: clamp(16px, 2vw, 24px); }
.hero--m1 .hero-grid { position: relative; z-index: 2; }
.hero--m1 + .pasos { margin-top: calc(var(--cruce) * -1); }

.visor { display: grid; gap: 10px; }
.visor__main { position: relative; width: 100%; aspect-ratio: 1; border-radius: var(--radius-lg); overflow: hidden; background: var(--fondo, #E9EAEE); }
.visor__main img, .visor__video { width: 100%; height: 100%; object-fit: cover; display: block; }
.visor__video { object-fit: contain; background: var(--fondo, #EEE); }
.visor__main img.cambia { animation: visor-cambia .45s var(--ease) both; }
@keyframes visor-cambia { from { opacity: .25; scale: 1.035; } }
.visor__cap { position: absolute; left: 12px; bottom: 12px; padding: .4rem .75rem; border-radius: 999px; background: rgba(18, 23, 63, .8); color: #fff; font-size: .82rem; font-weight: 600; pointer-events: none; }
.visor__tira { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); gap: 8px; }
.visor__thumb { position: relative; padding: 0; aspect-ratio: 1; border-radius: 12px; overflow: hidden; border: 1px solid var(--linea); background: var(--color-surface); opacity: .7; transition: opacity .25s; min-height: 44px; }
.visor__thumb img { width: 100%; height: 100%; object-fit: cover; }
.visor__thumb::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: 6px; height: 3px; border-radius: 3px; background: var(--color-primary); transform: scaleX(0); transition: transform .3s var(--ease); }
.visor__thumb:hover { opacity: 1; }
.visor__thumb[aria-pressed="true"] { opacity: 1; }
.visor__thumb[aria-pressed="true"]::after { transform: scaleX(1); }
.visor__play { position: absolute; inset: 0; display: grid; place-items: center; }
.visor__play .ico { width: 30px; height: 30px; padding: 7px; border-radius: 50%; background: rgba(18, 23, 63, .82); color: #fff; box-sizing: content-box; }
.visor__editar { justify-self: start; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0; border: 0; background: none; color: var(--color-text-muted); font-size: .88rem; font-weight: 600; transition: color .2s; }
.visor__editar .ico { width: 18px; height: 18px; }
.visor__editar:hover { color: var(--color-primary); }

.hero-datos { display: flex; flex-wrap: wrap; gap: 8px; }
.dato { background: var(--color-surface); border: 1px solid var(--linea); border-radius: 12px; padding: .5rem .8rem; }
.dato dt { font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); }
.dato dd { font-weight: 600; font-size: .95rem; }

.tablero { container-type: inline-size; position: relative; background: var(--color-surface); border: 1px solid var(--linea); border-radius: var(--radius-lg); padding: clamp(16px, 2.4vw, 26px); }
.tablero__head { display: grid; gap: .55rem; }
.tablero__head h2 { font: 800 clamp(1.2rem, 1.05rem + .6vw, 1.5rem)/1.15 var(--font-display); letter-spacing: -.02em; }
.tablero__resumen { display: flex; flex-wrap: wrap; gap: 4px 16px; color: var(--color-text-muted); font-size: .94rem; }
.tablero__resumen b { color: var(--color-text); font-family: var(--font-display); font-weight: 600; }
.leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .86rem; color: var(--color-text-muted); }
.leyenda li { display: inline-flex; align-items: center; gap: .45rem; }
.tablero__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.buscar { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border: 1px solid var(--linea-fuerte); border-radius: 999px; background: #fff; flex: 1 1 170px; min-width: 0; color: var(--color-text-muted); transition: border-color .2s, box-shadow .2s; }
.buscar .ico { width: 18px; height: 18px; }
.buscar input { border: 0; outline: 0; background: transparent; width: 100%; min-width: 0; height: 100%; color: var(--color-text); }
.buscar input::placeholder { color: #767C98; }
.buscar:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--azul-claro); }
.filtros { display: flex; flex-wrap: wrap; gap: 6px; }
.tablero__grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px; margin-top: 16px; }
@container (min-width: 500px) {
  .tablero__grid { grid-template-columns: repeat(10, minmax(0,1fr)); gap: 7px; }
}
.num {
  display: grid; place-items: center; aspect-ratio: 5 / 4; min-height: 44px; padding: 0; border-radius: 10px; border: 1px solid transparent;
  font: 600 .98rem/1 var(--font-display); font-variant-numeric: tabular-nums; letter-spacing: -.02em;
  transition: background-color .2s, color .2s, border-color .2s, translate .25s var(--ease), box-shadow .25s;
}
@container (min-width: 500px) {
  .num { aspect-ratio: 1; }
}
.tablero__grid--3 .num { font-size: .8rem; }
.num--libre { background: var(--libre-bg); border-color: var(--libre-borde); color: var(--libre-t); }
.num--libre:hover { translate: 0 -2px; border-color: var(--libre-t); box-shadow: 0 8px 18px rgba(27, 99, 56, .16); }
.num--reservado { background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .3) 0 5px, transparent 5px 10px), var(--res-bg); color: var(--res-t); cursor: not-allowed; }
.num--vendido { background: var(--vendido); color: #fff; cursor: not-allowed; }
.num.is-sel { background: var(--color-primary); border-color: var(--color-primary); color: #fff; box-shadow: 0 8px 20px rgba(42, 54, 194, .3); }
.num.ruleta { background: var(--noche); border-color: var(--noche); color: #fff; scale: 1.1; }
.tablero.girando .num { pointer-events: none; }
.tablero.in .tablero__grid.anima .num { animation: num-in .5s var(--ease-pop) backwards; animation-delay: calc(.12s + var(--d) * 22ms); }
@keyframes num-in { from { opacity: 0; scale: .6; } }
.tablero .tablero__grid .num.pop, .tablero.in .tablero__grid.anima .num.pop { animation: num-pop .42s var(--ease-pop); animation-delay: 0s; }
@keyframes num-pop { 0% { scale: .82; } 60% { scale: 1.12; } 100% { scale: 1; } }
.tablero__vacio { margin-top: 16px; padding: 1rem; border-radius: 14px; background: var(--color-bg-alt); color: var(--color-text-muted); }
.tablero__pager { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; }
.tablero__pag-info { font-weight: 600; font-size: .9rem; color: var(--color-text-muted); text-align: center; }
.tablero__pager .btn:disabled { opacity: .35; cursor: default; }
.eleccion {
  position: sticky; bottom: calc(76px + env(safe-area-inset-bottom)); z-index: 5; margin-top: 16px;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 8px 8px 16px; border-radius: 16px; background: var(--noche); color: #fff;
  box-shadow: 0 16px 36px rgba(18, 23, 63, .28);
}
.eleccion__txt { display: grid; min-width: 0; line-height: 1.25; }
.eleccion__nums { font: 600 .92rem/1.25 var(--font-display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eleccion__txt b { font-size: .86rem; font-weight: 600; color: var(--niebla-muted); }

.compra { container-type: inline-size; filter: var(--contorno); }
.ticket {
  --m: 13px; --cx: 210px; --cy: 156px;
  display: grid; grid-template-columns: var(--cx) minmax(0,1fr); background: var(--color-surface); border-radius: var(--radius-lg); overflow: hidden;
  -webkit-mask: radial-gradient(circle var(--m) at var(--cx) 0, #0000 97%, #000) top / 100% 51% no-repeat, radial-gradient(circle var(--m) at var(--cx) 100%, #0000 97%, #000) bottom / 100% 51% no-repeat;
  mask: radial-gradient(circle var(--m) at var(--cx) 0, #0000 97%, #000) top / 100% 51% no-repeat, radial-gradient(circle var(--m) at var(--cx) 100%, #0000 97%, #000) bottom / 100% 51% no-repeat;
}
.ticket__talon { background: var(--noche); color: var(--niebla); padding: 24px 20px; display: flex; flex-direction: column; gap: 10px; border-right: 1px dashed rgba(238, 240, 248, .4); }
.ticket__talon .wm__a { color: #fff; }
.ticket__label { font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--niebla-muted); }
.ticket__nums { display: flex; flex-wrap: wrap; gap: 6px; min-height: 40px; align-content: flex-start; }
.ticket__vacio { font-size: .88rem; color: var(--niebla-muted); }
.chip-num { display: inline-grid; place-items: center; min-width: 2.6em; padding: .42rem .5rem; border-radius: 8px; background: #fff; color: var(--noche); font: 800 .98rem/1 var(--font-display); font-variant-numeric: tabular-nums; }
.chip-num.sellado { animation: sello .55s var(--ease-pop) both; }
@keyframes sello { 0% { opacity: 0; scale: 1.7; rotate: -12deg; } 60% { opacity: 1; scale: .94; rotate: 3deg; } 100% { scale: 1; rotate: 0deg; } }
.chip-num--mini { min-width: 2.3em; padding: .3rem .4rem; font-size: .8rem; background: var(--color-bg-alt); }
.ticket__total { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 10px; border-top: 1px dashed rgba(238, 240, 248, .28); font-size: .88rem; color: var(--niebla-muted); }
.ticket__total b { font: 800 1.15rem/1 var(--font-display); color: #fff; }
.ticket__premio { font-size: .8rem; color: var(--niebla-muted); }
.ticket__cuerpo { padding: clamp(18px, 2.6vw, 28px); min-width: 0; }
.ticket--compra {
  --cy: 134px;
  grid-template-columns: minmax(0,1fr); grid-template-rows: var(--cy) auto;
  -webkit-mask: radial-gradient(circle var(--m) at 0 var(--cy), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% var(--cy), #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle var(--m) at 0 var(--cy), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% var(--cy), #0000 97%, #000) right / 51% 100% no-repeat;
}
.ticket--compra .ticket__talon { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto minmax(0,1fr); gap: 6px 12px; padding: 16px clamp(18px, 2.6vw, 28px) 14px; border-right: 0; border-bottom: 1px dashed rgba(238, 240, 248, .4); overflow: hidden; }
.ticket--compra .ticket__marca { grid-column: 1; grid-row: 1; }
.ticket--compra .ticket__label { grid-column: 2; grid-row: 1; align-self: center; }
.ticket--compra .ticket__nums { grid-column: 1 / -1; grid-row: 2; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; min-height: 34px; }
.ticket--compra .ticket__total { grid-column: 1 / -1; grid-row: 3; align-self: end; }
.ticket--compra .ticket__premio { display: none; }
.form-compra { display: grid; gap: 14px; }
.form-compra h2, .compra-ok h3 { font: 800 clamp(1.15rem, 1.05rem + .4vw, 1.35rem)/1.2 var(--font-display); letter-spacing: -.02em; }
.campo { display: grid; gap: 6px; }
.campo label { font-weight: 600; font-size: .9rem; }
.opcional { font-weight: 400; color: var(--color-text-muted); }
.campo input, .campo select, .campo textarea { width: 100%; min-height: 48px; padding: .7rem .9rem; border: 1px solid var(--linea-fuerte); border-radius: 12px; background: #fff; color: var(--color-text); transition: border-color .2s, box-shadow .2s; }
.campo textarea { resize: vertical; min-height: 88px; line-height: 1.45; }
.campo input::placeholder, .campo textarea::placeholder { color: #767C98; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 0; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--azul-claro); }
.campo input[aria-invalid="true"], .check input[aria-invalid="true"] { border-color: var(--vendido); box-shadow: 0 0 0 3px rgba(178, 58, 49, .12); }
.campo__error { color: #9A2C24; font-size: .85rem; font-weight: 600; }
.campo__error--sel { padding: .6rem .8rem; border-radius: 10px; background: #FBE5E2; }
.check { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.check input { width: 22px; height: 22px; accent-color: var(--color-primary); flex: none; }
.check label { font-size: .93rem; }
.check a { color: var(--color-primary); font-weight: 600; }
.form-nota { display: flex; align-items: flex-start; gap: .5rem; font-size: .85rem; color: var(--color-text-muted); }
.form-nota .ico { width: 18px; height: 18px; color: var(--libre); margin-top: 1px; }
.compra-ok { display: grid; gap: 14px; outline: 0; }
.compra-ok__kicker { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .88rem; color: var(--libre-t); }
.compra-ok__kicker .ico { width: 18px; height: 18px; }
.compra-ok__nums { display: flex; flex-wrap: wrap; gap: 6px; }
.compra-ok__nums .chip-num { background: var(--res-bg); color: var(--res-t); }
.compra-ok__pasos { display: grid; gap: 12px; }
.compra-ok__pasos li { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 10px; }
.compra-ok__pasos li > div { display: grid; gap: 8px; justify-items: start; }
.compra-ok__pasos b { font-weight: 600; }
.compra-ok__pasos .btn { white-space: normal; text-align: left; }
.compra-ok__n { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--azul-claro); color: var(--color-primary); font: 800 .85rem/1 var(--font-display); }
.compra-ok__nota { font-size: .88rem; color: var(--color-text-muted); }

.pasos { background: var(--color-bg-alt); }
main > .pasos { padding-top: calc(var(--section-pad-y) + var(--cruce)); }
.pasos__lista { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; counter-reset: paso; }
.paso {
  --m: 11px;
  display: grid; grid-template-columns: auto minmax(0,1fr); gap: 14px; align-items: start;
  padding: 22px 20px; background: var(--color-surface); border-radius: 18px;
}
.pasos__lista:not(.pasos__lista--v) .paso {
  -webkit-mask: radial-gradient(circle var(--m) at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle var(--m) at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
}
.paso__n { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--noche); color: #fff; font: 800 1.05rem/1 var(--font-display); }
.paso:nth-child(2) .paso__n { background: var(--res-bg); color: var(--res-t); }
.paso:nth-child(3) .paso__n { background: var(--color-primary); }
.paso:nth-child(4) .paso__n { background: var(--vendido); }
.paso h3 { font: 600 var(--fs-h3)/1.25 var(--font-display); letter-spacing: -.015em; }
.paso p { margin-top: .4rem; color: var(--color-text-muted); font-size: .95rem; }

.bases__grid { display: grid; grid-template-columns: minmax(0,4fr) minmax(0,7fr); gap: clamp(24px, 5vw, 72px); align-items: start; }
.bases__intro p { margin-top: .7rem; color: var(--color-text-muted); max-width: 40ch; }
.bases__intro .bases__acepto { display: inline-flex; margin-top: 1.1rem; padding: .5rem .85rem; border-radius: 999px; background: var(--azul-claro); color: var(--color-primary); font-weight: 600; font-size: .9rem; }
.bases__lista { border-top: 1px solid var(--linea); }
.base { border-bottom: 1px solid var(--linea); }
.base summary { display: flex; align-items: center; gap: 14px; min-height: 58px; padding: .7rem 0; cursor: pointer; list-style: none; font-weight: 600; }
.base summary::-webkit-details-marker { display: none; }
.base__n { font: 600 .82rem/1 var(--font-display); color: var(--color-primary); min-width: 2em; }
.base__t { flex: 1; }
.base__ico { width: 18px; height: 18px; color: var(--color-text-muted); transition: transform .3s var(--ease); }
.base[open] .base__ico { transform: rotate(90deg); }
.base p { padding: 0 0 1.1rem calc(2em + 14px); color: var(--color-text-muted); max-width: 64ch; }
.base p a { color: var(--color-primary); font-weight: 600; }
.falta { display: inline-block; padding: 0 .45em; border-radius: 6px; background: var(--naranja-claro); color: var(--naranja-t); font-weight: 600; font-size: .92em; }

.extras { background: var(--color-bg-alt); }
.extras__grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.extras__grid .proxima { grid-row: span 2; }
.proxima { position: relative; display: block; overflow: hidden; border-radius: var(--radius-lg); background: var(--noche); color: #fff; text-decoration: none; min-height: 100%; }
.proxima > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; transition: scale 1.5s var(--ease), transform .8s var(--ease); }
.proxima:hover > img { transform: scale(1.04); }
.proxima::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18, 23, 63, 0) 30%, rgba(18, 23, 63, .55) 58%, rgba(18, 23, 63, .94) 100%); }
.proxima__txt { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; display: grid; gap: .45rem; padding: clamp(18px, 2.4vw, 26px); }
.proxima__kicker { justify-self: start; padding: .3rem .7rem; border-radius: 999px; background: #A85A1D; color: #fff; font-weight: 600; font-size: .8rem; }
.proxima__titulo { font: 800 clamp(1.1rem, .95rem + .5vw, 1.4rem)/1.2 var(--font-display); letter-spacing: -.02em; hyphens: manual; }
.proxima__cta { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .92rem; color: var(--niebla); }
.proxima__cta .ico { width: 18px; height: 18px; transition: translate .3s var(--ease); }
.proxima:hover .proxima__cta .ico { translate: 4px 0; }
.extra { display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; background: var(--color-surface); border: 1px solid var(--linea); text-decoration: none; transition: border-color .25s, translate .3s var(--ease); }
.extra:hover { border-color: var(--color-primary); }
.extra__foto { display: block; aspect-ratio: 1; width: 100%; overflow: hidden; background: #ECECEC; }
.extra__foto img { width: 100%; height: 100%; object-fit: cover; transition: scale 1.5s var(--ease), transform .8s var(--ease); }
.extra:hover .extra__foto img { transform: scale(1.04); }
.extra__txt { display: grid; gap: .2rem; padding: 12px 14px 14px; }
.extra__nombre { font-weight: 600; line-height: 1.3; }
.extra__cta { display: inline-flex; align-items: center; gap: .35rem; font-size: .86rem; font-weight: 600; color: var(--color-primary); }
.extra__cta .ico { width: 16px; height: 16px; transition: translate .3s var(--ease); }
.extra:hover .extra__cta .ico { translate: 3px 0; }

.cierre { padding-bottom: 0 !important; }
.cierre__caja { position: relative; z-index: 2; margin-bottom: calc(var(--cruce) * -1); display: grid; justify-items: center; gap: 1rem; text-align: center; padding: clamp(28px, 5vw, 60px) clamp(20px, 5vw, 60px); background: var(--color-surface); border-radius: 28px; box-shadow: 0 24px 60px rgba(18, 23, 63, .12); }
.cierre__sello { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem .9rem; border-radius: 999px; background: var(--azul-claro); color: var(--color-primary); font-weight: 600; font-size: .9rem; }
.cierre__sello .ico { width: 18px; height: 18px; }
.cierre h2 { font: 800 clamp(1.7rem, 1.1rem + 2.6vw, 3.1rem)/1.08 var(--font-display); letter-spacing: -.03em; text-wrap: balance; }
.cierre__n { color: var(--color-primary); }
.cierre__txt { color: var(--color-text-muted); max-width: 46ch; }
.cierre__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: .4rem; }

.site-footer { position: relative; background: var(--noche); color: var(--niebla); padding: calc(var(--cruce) + clamp(2.5rem, 5vw, 4rem)) 0 1.6rem; }
.footer-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(24px, 4vw, 48px); align-items: start; }
.footer-marca { grid-column: 1 / -1; display: inline-flex; align-items: center; min-height: 48px; text-decoration: none; justify-self: start; }
.site-footer .wm__a { color: #fff; }
.footer-col { display: grid; gap: .2rem; justify-items: start; font-size: .95rem; color: var(--niebla-muted); }
.footer-titulo { font: 600 .82rem/1.2 var(--font-display); letter-spacing: .06em; text-transform: uppercase; color: #fff; margin-bottom: .2rem; }
.footer-col a { display: inline-flex; align-items: center; min-height: 44px; color: var(--niebla); text-decoration: none; transition: color .2s; }
.footer-col a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.footer-wsp { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; font-weight: 600; white-space: nowrap; }
.footer-wsp .ico { width: 20px; height: 20px; color: #6FD39A; }
.footer-panel { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0 1rem; border-radius: 999px; border: 1px solid rgba(238, 240, 248, .3); background: transparent; color: #fff; font-weight: 600; font-size: .92rem; transition: border-color .2s; }
.footer-panel .ico { width: 18px; height: 18px; }
.footer-panel:hover { border-color: #fff; }
.footer-nota { font-size: .84rem; max-width: 32ch; }
.footer-pie { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: clamp(28px, 4vw, 44px); padding-top: 18px; border-top: 1px solid rgba(238, 240, 248, .14); font-size: .86rem; color: var(--niebla-muted); }
.footer-pie a { color: #fff; font-weight: 600; }

.hero--m2 {
  display: flow-root; color: var(--niebla); text-align: center;
  padding-block: clamp(1.6rem, 4vw, 3.4rem) 0 !important;
  background:
    radial-gradient(55% 60% at 12% 0%, rgba(42, 54, 194, .55), transparent 70%),
    radial-gradient(40% 50% at 92% 18%, rgba(212, 122, 48, .2), transparent 72%),
    var(--noche);
}
.hero2 { display: grid; justify-items: center; }
.hero2 .hero-eyebrow { color: var(--niebla-muted); }
.hero2 h1 { font-size: clamp(2.15rem, 1.1rem + 4.3vw, 4.7rem); line-height: 1.03; max-width: 15ch; color: #fff; }
.hero2 .hero-lead { color: var(--niebla-muted); max-width: 54ch; margin-inline: auto; }
.hero2 .hero-ctas { justify-content: center; }
.boleto { position: relative; z-index: 2; width: 100%; max-width: 1060px; margin: clamp(2rem, 4vw, 3.2rem) auto calc(var(--cruce) * -1); text-align: left; container-type: inline-size; filter: drop-shadow(0 30px 50px rgba(5, 8, 30, .35)); }
.ticket--hero { min-height: 330px; --cx: 200px; --m: 15px; grid-template-columns: var(--cx) minmax(0,300px) minmax(0,1fr); color: var(--color-text); }
.ticket--hero .ticket__talon { gap: 12px; padding: 26px 22px; background: var(--color-primary); border-right-color: rgba(255, 255, 255, .5); }
.ticket--hero .wm__b { background: #fff; color: var(--color-primary); }
.ticket--hero .ticket__talon .ticket__label, .ticket--hero .ticket__valor { color: #DADDF8; }
.ticket__rango { font: 800 clamp(1.7rem, 1.3rem + 1.4vw, 2.3rem)/1 var(--font-display); color: #fff; letter-spacing: -.03em; }
.ticket__valor { display: grid; gap: .2rem; margin-top: auto; padding-top: 12px; border-top: 1px dashed rgba(238, 240, 248, .28); font-size: .8rem; color: var(--niebla-muted); }
.ticket__valor b { font: 800 1.35rem/1 var(--font-display); color: #fff; }
.ticket__foto { position: relative; overflow: hidden; background: #FFFFFF; }
.ticket__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 14px 10px; }
.ticket__info { display: grid; align-content: center; gap: .6rem; padding: clamp(20px, 3vw, 36px); }
.ticket__info .ticket__label { color: var(--color-text-muted); }
.ticket__premio-g { font: 800 clamp(1.4rem, 1.1rem + 1.2vw, 2.1rem)/1.1 var(--font-display); letter-spacing: -.025em; }
.ticket__detalle { color: var(--color-text-muted); }
.avance { display: grid; gap: .5rem; margin-top: .4rem; }
.avance__barra { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--libre-bg); }
.avance__vendidos { background: var(--vendido); transition: width .6s var(--ease); }
.avance__reservados { background: var(--reservado); transition: width .6s var(--ease); }
.avance__txt { font-size: .93rem; color: var(--color-text-muted); }
.avance__txt b { font-family: var(--font-display); color: var(--color-text); }
.ticket__sorteo { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; font-size: .93rem; }
.ticket__sorteo .ico { width: 18px; height: 18px; color: var(--color-primary); }
@container (max-width: 760px) {
  .ticket--hero {
    --cy: 116px; grid-template-columns: minmax(0,1fr); grid-template-rows: var(--cy) auto auto;
    -webkit-mask: radial-gradient(circle var(--m) at 0 var(--cy), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% var(--cy), #0000 97%, #000) right / 51% 100% no-repeat;
    mask: radial-gradient(circle var(--m) at 0 var(--cy), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% var(--cy), #0000 97%, #000) right / 51% 100% no-repeat;
  }
  .ticket--hero .ticket__talon { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto; align-content: center; gap: 4px 16px; padding: 16px 20px; border-right: 0; border-bottom: 1px dashed rgba(238, 240, 248, .4); }
  .ticket--hero .ticket__marca { grid-column: 1; grid-row: 1; }
  .ticket--hero .ticket__label { display: none; }
  .ticket--hero .ticket__rango { grid-column: 1; grid-row: 2; font-size: 1.5rem; }
  .ticket--hero .ticket__valor { grid-column: 2; grid-row: 1 / 3; margin: 0; padding: 0 0 0 16px; border-top: 0; border-left: 1px dashed rgba(238, 240, 248, .28); align-content: center; }
  .ticket__foto { aspect-ratio: 4 / 3; }
}

.premio2 { padding-top: calc(var(--section-pad-y) + var(--cruce)) !important; }
.premio2__grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.premio2__grid .sec-head { grid-column: 1 / -1; margin-bottom: 0; }
.visor--m2 { grid-template-columns: minmax(0,1fr) 84px; align-items: start; }
.visor--m2 .visor__tira { grid-auto-flow: row; grid-template-columns: minmax(0,1fr); align-content: start; }
.visor--m2 .visor__editar { grid-column: 1 / -1; }
.ficha { display: grid; border-top: 1px solid var(--linea); }
.ficha .dato { background: none; border: 0; border-bottom: 1px solid var(--linea); border-radius: 0; padding: 1rem 0; display: grid; grid-template-columns: minmax(0,9rem) minmax(0,1fr); gap: 12px; align-items: baseline; }
.ficha .dato dd { font: 600 clamp(1rem, .95rem + .3vw, 1.15rem)/1.3 var(--font-display); letter-spacing: -.015em; }

.numeros2 { background: var(--color-bg-alt); }
.numeros2__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,380px); gap: clamp(20px, 3vw, 36px); align-items: start; }
.numeros2__aside { position: sticky; top: 16px; }
@media (min-width: 1025px) {
  .m2 .tablero .eleccion { display: none; }
}

.reglas2__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.25fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.pasos__lista--v { grid-template-columns: minmax(0,1fr); gap: 0; position: relative; }
.pasos__lista--v .paso { background: none; padding: 0 0 26px; border-radius: 0; position: relative; }
.pasos__lista--v .paso::before { content: ""; position: absolute; left: 21.5px; top: 48px; bottom: 4px; width: 1px; border-left: 1px dashed var(--linea-fuerte); }
.pasos__lista--v .paso:last-child::before { display: none; }
.pasos__lista--v .paso:last-child { padding-bottom: 0; }
.reglas2__bases .bases__intro { margin-bottom: 1.2rem; }

.extras2 { display: grid; gap: 14px; }
.extras2 .proxima { display: grid; grid-template-columns: minmax(0,260px) minmax(0,1fr); min-height: 0; }
.extras2 .proxima > img { position: relative; inset: auto; aspect-ratio: 4 / 5; height: auto; }
.extras2 .proxima::after { display: none; }
.extras2 .proxima__txt { position: relative; align-content: center; padding: clamp(22px, 4vw, 48px); }
.extras2 .proxima__titulo { font-size: clamp(1.3rem, 1rem + 1.4vw, 2.1rem); max-width: 20ch; }
.extras2__tiles { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 12px; }

.cierre--m2 .cierre__caja {
  --m: 16px; justify-items: start; text-align: left; box-shadow: none; border-radius: 26px;
  grid-template-columns: minmax(0,1fr) auto; align-items: end; column-gap: clamp(20px, 4vw, 56px);
  -webkit-mask: radial-gradient(circle var(--m) at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle var(--m) at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--m) at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
}
.cierre--m2 .cierre__caja > * { grid-column: 1; }
.cierre--m2 .cierre__ctas { grid-column: 2; grid-row: 1 / span 3; justify-content: flex-end; flex-direction: column; align-items: stretch; }
.cierre--m2 h2 { font-size: clamp(1.9rem, 1.1rem + 3.4vw, 3.9rem); max-width: 14ch; }
.cierre--m2 { background: var(--color-bg); }

.panel { position: fixed; inset: 0; z-index: 130; display: grid; place-items: center; }
.panel__fondo { position: absolute; inset: 0; background: rgba(10, 13, 38, .55); opacity: 0; transition: opacity .3s var(--ease-out); }
.panel__caja {
  position: relative; display: grid; grid-template-rows: auto auto minmax(0,1fr);
  width: min(1060px, calc(100vw - 32px)); height: min(780px, calc(100dvh - 32px));
  background: var(--color-bg); border-radius: 24px; overflow: hidden; box-shadow: var(--shadow-lg);
  opacity: 0; translate: 0 24px; transition: opacity .35s var(--ease-out), translate .35s var(--ease-out);
}
.panel.open .panel__fondo { opacity: 1; }
.panel.open .panel__caja { opacity: 1; translate: 0 0; }
.panel__top { display: flex; align-items: center; gap: 14px 20px; flex-wrap: wrap; padding: 14px 16px 14px 22px; background: var(--color-surface); }
.panel__marca { display: inline-flex; align-items: center; gap: .7rem; }
.panel__kicker { font-weight: 600; font-size: .92rem; color: var(--color-text-muted); }
.panel__aviso { flex: 1 1 260px; padding: .45rem .8rem; border-radius: 10px; background: var(--azul-claro); color: var(--noche); font-size: .84rem; }
.panel__cerrar { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--color-bg-alt); margin-left: auto; }
.panel__tabs { display: flex; gap: 22px; padding: 0 22px; background: var(--color-surface); border-bottom: 1px solid var(--linea); overflow-x: auto; scrollbar-width: none; }
.ptab { position: relative; display: inline-flex; align-items: center; gap: .45rem; min-height: 50px; padding: 0 2px; border: 0; background: none; font-weight: 600; color: var(--color-text-muted); white-space: nowrap; }
.ptab::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--color-primary); transform: scaleX(0); transition: transform .3s var(--ease); }
.ptab[aria-selected="true"] { color: var(--color-primary); }
.ptab[aria-selected="true"]::after { transform: scaleX(1); }
.ptab__badge { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--res-bg); color: var(--res-t); font-size: .78rem; }
.panel__cuerpo { overflow-y: auto; overscroll-behavior: contain; padding: 20px 22px 28px; }
.ppanel { display: grid; gap: 14px; align-content: start; outline: 0; }
.pp-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.buscar--panel { flex: 1 1 220px; }
.pp-ayuda { color: var(--color-text-muted); font-size: .92rem; max-width: 70ch; }
.pp-ayuda--chica { font-size: .84rem; }
.pp-info { font-size: .86rem; color: var(--color-text-muted); }
.pp-mas { justify-self: start; }
.pp-pedidos { display: grid; gap: 10px; }
.ped { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1.1fr) auto minmax(0,.9fr); gap: 10px 18px; align-items: center; padding: 14px 16px; border-radius: 16px; background: var(--color-surface); border: 1px solid var(--linea); }
.ped__nombre { font-weight: 600; }
.ped__meta { font-size: .82rem; color: var(--color-text-muted); }
.ped__nums { display: flex; flex-wrap: wrap; gap: 5px; }
.ped__total { font: 600 1rem/1 var(--font-display); white-space: nowrap; }
.ped__estado { display: inline-flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 600; }
.ped--espera .ped__estado { color: var(--naranja-t); }
.ped--aprobado .ped__estado { color: #8F2C25; }
.ped--liberado { opacity: .72; }
.ped--liberado .ped__estado { color: var(--libre-t); }
.ped__acciones { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.ped__acciones:empty { display: none; }
.pp-grid { display: grid; grid-template-columns: repeat(10, minmax(0,1fr)); gap: 6px; max-width: 720px; }
.pnum { min-height: 44px; border-radius: 10px; border: 1px solid transparent; font: 600 .9rem/1 var(--font-display); font-variant-numeric: tabular-nums; transition: background-color .2s, color .2s, transform .15s; }
.pnum:active { transform: scale(.94); }
.pp-grid--3 .pnum { font-size: .76rem; }
.pnum--libre { background: var(--libre-bg); border-color: var(--libre-borde); color: var(--libre-t); }
.pnum--reservado { background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .3) 0 5px, transparent 5px 10px), var(--res-bg); color: var(--res-t); }
.pnum--vendido { background: var(--vendido); color: #fff; }
.pp-form { display: grid; gap: 16px; max-width: 820px; }
.pp-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 18px; }
.campo--ancho { grid-column: 1 / -1; }
.pp-form__acciones { display: flex; flex-wrap: wrap; gap: 10px; }
.ppi-lista { display: grid; gap: 8px; max-width: 640px; }
.ppi { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 14px; background: var(--color-surface); border: 1px solid var(--linea); }
.ppi--oculta { opacity: .55; }
.ppi__img { flex: none; width: 56px; height: 56px; border-radius: 10px; overflow: hidden; }
.ppi__img img { width: 100%; height: 100%; object-fit: cover; }
.ppi__txt { display: grid; flex: 1; min-width: 0; }
.ppi__cap { font-weight: 600; }
.ppi__rol { font-size: .82rem; color: var(--color-text-muted); }
.ppi__acc { display: flex; gap: 4px; }
.icon-btn { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 12px; background: var(--color-bg-alt); color: var(--color-text); transition: background-color .2s; }
.icon-btn:hover { background: var(--azul-claro); }
.icon-btn:disabled { opacity: .35; cursor: default; }
.icon-btn .ico { width: 20px; height: 20px; }
.ppi-subir { justify-self: start; cursor: pointer; position: relative; }
.ppi-subir:focus-within { outline: 2px solid var(--color-primary); outline-offset: 3px; }

.wsp-float { position: fixed; right: clamp(14px, 3vw, 24px); bottom: clamp(14px, 3vw, 24px); z-index: 90; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: #fff; box-shadow: 0 10px 24px rgba(18, 23, 63, .22); opacity: 0; transform: translateY(12px) scale(.9); pointer-events: none; transition: opacity .3s, transform .3s var(--ease); }
.wsp-float svg { width: 28px; height: 28px; }
.wsp-float.visible { opacity: 1; transform: none; pointer-events: auto; }
.wsp-float:active { transform: scale(.95); }
.wsp-float::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #25D366; z-index: -1; animation: pulse-ring 2.4s cubic-bezier(0.22, 1, 0.36, 1) infinite; }
@keyframes pulse-ring { 0% { transform: scale(1); opacity: .5; } 80%, 100% { transform: scale(1.6); opacity: 0; } }
body.no-scroll .wsp-float { opacity: 0; pointer-events: none; }

.toast-wrap { position: fixed; left: 50%; bottom: 20px; z-index: 140; transform: translateX(-50%); display: grid; gap: .5rem; width: min(440px, calc(100vw - 32px)); pointer-events: none; }
.toast { display: flex; align-items: center; gap: .7rem; padding: .85rem 1.1rem; border-radius: 14px; background: var(--noche); color: var(--niebla); font-weight: 600; font-size: .95rem; box-shadow: 0 16px 40px rgba(10, 13, 38, .32); animation: toast-in .35s var(--ease) both; }
.toast svg { width: 20px; height: 20px; flex: none; color: #8FD3A8; }
.toast.hiding { animation: toast-out .22s var(--ease-out) both; }
@keyframes toast-in { from { opacity: 0; transform: translateY(14px); } }
@keyframes toast-out { to { opacity: 0; transform: translateY(8px); } }

[data-animate] { transition: opacity .9s var(--ease), transform 1.1s var(--ease), clip-path 1.2s var(--ease), filter 1s var(--ease); }
[data-animate].in { opacity: 1 !important; transform: none !important; }
[data-animate="blur"].in { filter: none !important; }
[data-animate="mascara"].in, [data-animate="cortina"].in { clip-path: inset(0 0 0 0) !important; }
[data-animate="linea"] { transform-origin: 0 50%; }
[data-animate="escala"] { transition: opacity .8s var(--ease-pop), transform 1s var(--ease-pop); }
[data-animate="mascara"] > img, [data-animate] .extra__foto img { scale: 1.12; transition: scale 1.5s var(--ease), transform .8s var(--ease); }
[data-animate="mascara"].in > img, [data-animate].in .extra__foto img { scale: 1; }
.compra[data-animate] { transition: opacity .9s var(--ease), transform 1.1s var(--ease); }

@media (max-width: 1100px) {
  .extras2__tiles { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 1024px) {
  .hero-grid { grid-template-columns: minmax(0,1fr); }
  .hero-col { max-width: 640px; }
  .pasos__lista { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .numeros2__grid { grid-template-columns: minmax(0,1fr); }
  .numeros2__aside { position: static; }
  .reglas2__grid { grid-template-columns: minmax(0,1fr); }
  }
@media (max-width: 900px) {
  .bases__grid { grid-template-columns: minmax(0,1fr); }
  .extras__grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .extras__grid .proxima { grid-column: 1 / -1; grid-row: auto; display: grid; grid-template-columns: minmax(0,38%) minmax(0,1fr); min-height: 0; }
  .extras__grid .proxima > img { position: relative; inset: auto; aspect-ratio: 4 / 5; height: auto; }
  .extras__grid .proxima::after { display: none; }
  .extras__grid .proxima__txt { position: relative; align-content: center; }
  .premio2__grid { grid-template-columns: minmax(0,1fr); }
  .visor--m2 { grid-template-columns: minmax(0,1fr); }
  .visor--m2 .visor__tira { grid-auto-flow: column; grid-template-columns: none; }
  .ped { grid-template-columns: minmax(0,1fr) auto; }
  .ped__nums { grid-column: 1; }
  .ped__estado { grid-column: 2; grid-row: 1; justify-self: end; }
  .ped__total { grid-column: 2; grid-row: 2; justify-self: end; }
}
@media (max-width: 760px) {
  .cierre--m2 .cierre__caja { grid-template-columns: minmax(0,1fr); }
  .cierre--m2 .cierre__ctas { grid-column: 1; grid-row: auto; flex-direction: row; justify-content: flex-start; }
  .extras2 .proxima { grid-template-columns: minmax(0,38%) minmax(0,1fr); }
}
@media (max-width: 640px) {
  .pasos__lista { grid-template-columns: minmax(0,1fr); }
  .extras__grid, .extras2__tiles { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .extras__grid .proxima, .extras2 .proxima { grid-template-columns: minmax(0,1fr); }
  .extras__grid .proxima > img, .extras2 .proxima > img { aspect-ratio: 4 / 3; object-position: 50% 40%; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .footer-col:last-child { grid-column: 1 / -1; }
  .panel__caja { width: 100vw; height: 100dvh; border-radius: 0; }
  .panel__top { padding: 10px 12px 10px 16px; }
  .panel__aviso { order: 3; flex-basis: 100%; }
  .panel__tabs { padding: 0 16px; gap: 18px; }
  .panel__cuerpo { padding: 16px 16px 28px; }
  .pp-grid { grid-template-columns: repeat(5, minmax(0,1fr)); }
  .pp-form__grid { grid-template-columns: minmax(0,1fr); }
  .ped__quien { grid-column: 1 / -1; }
  .ped__nums { grid-column: 1; grid-row: 2; }
  .ped__total { grid-column: 2; grid-row: 2; align-self: center; }
  .ped__estado { grid-column: 1 / -1; grid-row: 3; justify-self: start; }
  .panel__tabs { gap: 16px; }
  .ptab { font-size: .95rem; }
  .hero-ctas .btn { flex: 1 1 auto; }
  .cierre__ctas .btn { flex: 1 1 100%; }
  .visor__tira { gap: 6px; }
}
@media (max-width: 400px) {
  .tablero__tools .btn--azar { flex: 1 1 100%; }
  .filtros .chip { padding: 0 .75rem; }
}

@media (prefers-reduced-motion: reduce) {
  [data-animate] { transition: none !important; }
  [data-animate="mascara"] > img, [data-animate] .extra__foto img { scale: 1; }
  .wsp-float::before { animation: none; }
  .num, .chip-num, .visor__main img { animation: none !important; }
  .panel__caja, .panel__fondo, .main-nav { transition: none; }
}

:root {
  --gw-modelos-bg: #12173F;
  --gw-modelos-active-bg: #F8F9FA;
  --gw-modelos-active-ink: #12173F;
}
.gw-modelos {
  position: fixed; bottom: calc(14px + env(safe-area-inset-bottom)); left: 50%; z-index: 95;
  transform: translateX(-50%);
  display: flex; align-items: center; gap: 3px;
  max-width: calc(100vw - 16px); padding: 4px;
  border-radius: 999px; background: var(--gw-modelos-bg); color: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.24);
  transition: opacity .3s ease;
}
.gw-modelos__btn {
  flex: 0 1 116px; min-height: 34px; padding: 9px 14px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; color: inherit;
  font: 800 12px/1 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  text-decoration: none; white-space: nowrap;
  transition: background-color .2s, color .2s, transform .15s;
}
.gw-modelos__btn:hover { background: rgba(255,255,255,.16); }
.gw-modelos__btn:active { transform: scale(.97); }
.gw-modelos__btn[aria-current] { background: var(--gw-modelos-active-bg); color: var(--gw-modelos-active-ink); }
.gw-modelos__btn[aria-current="page"] { pointer-events: none; }
.gw-modelos__btn:focus-visible { outline: 3px solid var(--gw-modelos-active-bg); outline-offset: 3px; }
body.no-scroll .gw-modelos { opacity: 0; pointer-events: none; }
.gw-modelos.gw-modelos--scrolling { opacity: 0; pointer-events: none; }
.toast-wrap { margin-bottom: 64px; }
.site-footer::after { content: ""; display: block; height: 64px; }
@media (max-width: 359px) {
  .gw-modelos { left: 12px; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .gw-modelos, .gw-modelos__btn { transition: none; } }