/* Dirección visual: cuento de papel de invierno. Cereza, abeto, oro y noche sobre crema. */
:root{
  --rojo:#a3202e; --rojo-h:#8b1925; --abeto:#1f4d3a; --oro:#c9962b; --crema:#fbf4e4; --noche:#16213e;
  --tinta:#2b2230; --suave:#6d6272; --linea:#e6dcc6; --papel:#fff;
  --display:'Young Serif',Georgia,serif; --cuerpo:'Nunito',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--crema);color:var(--tinta);font:17px/1.5 var(--cuerpo);padding-bottom:104px}
h1,h2{font-family:var(--display);font-weight:400;text-wrap:balance}
button{font:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--oro);outline-offset:2px}

.hero{position:relative;background:var(--noche);color:#fff;overflow:hidden;padding:44px 16px 64px;min-height:340px;display:flex;align-items:flex-end}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s;z-index:0}
.hero-bg.ok{opacity:1}
.hero:has(.hero-bg.ok)::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#16213e55 0%,#16213ecc 55%,#16213ef5 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:28px;background:var(--crema);
  -webkit-mask:radial-gradient(circle at 14px 0,transparent 13px,#000 14px) 0 0/28px 28px repeat-x;
          mask:radial-gradient(circle at 14px 0,transparent 13px,#000 14px) 0 0/28px 28px repeat-x}
.stars{position:absolute;inset:0;z-index:1;background:
  radial-gradient(2px 2px at 12% 22%,#fff8,transparent),radial-gradient(2px 2px at 78% 14%,#fffc,transparent),
  radial-gradient(3px 3px at 90% 48%,var(--oro),transparent),radial-gradient(2px 2px at 35% 64%,#fff9,transparent),
  radial-gradient(2px 2px at 60% 38%,#fff7,transparent),radial-gradient(3px 3px at 6% 70%,var(--oro),transparent)}
.hero-in{position:relative;z-index:2;max-width:560px;margin:0 auto;width:100%}
.when{margin:.2em 0 1em;font-weight:800;color:#f3dca0;font-size:18px}
.cta{display:inline-block;background:var(--rojo);color:#fff;text-decoration:none;font-weight:800;border-radius:14px;padding:15px 26px;box-shadow:0 6px 18px #0006}
.cta:hover{background:var(--rojo-h)}
.kicker{margin:0;color:var(--oro);font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:13px}
.hero h1{font-size:clamp(32px,9vw,46px);line-height:1.08;margin:.25em 0 .2em}
.lead{margin:0 0 .6em;font-size:19px}


.wrap{max-width:560px;margin:0 auto;padding:6px 16px 24px}
.steps{scroll-margin-top:8px;list-style:none;display:flex;gap:6px;margin:8px 0 18px;padding:0;font-size:13px;font-weight:800}
.steps li{flex:1;text-align:center;padding:8px 2px;border-bottom:4px solid var(--linea);color:var(--suave)}
.steps li.on{color:var(--rojo);border-color:var(--rojo)}
.steps li.done{color:var(--abeto);border-color:var(--abeto)}
.panel h2{font-size:24px;margin:.2em 0 .6em}
.notice{background:#fff0c9;color:#5c4100;border-radius:14px;padding:14px 16px;font-weight:700;margin:12px 0}

.days{display:grid;gap:10px}
.day{display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;width:100%;padding:16px;border-radius:16px;border:2px solid var(--linea);background:var(--papel);color:var(--tinta)}
.day strong{font-size:18px}
.day small{color:var(--suave);font-size:14px}
.day[aria-checked="true"]{border-color:var(--rojo);background:#fdecee;box-shadow:0 0 0 3px #a3202e22}
.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}
.slot{padding:12px 0;border-radius:12px;border:2px solid var(--linea);background:var(--papel);font-weight:800;color:var(--tinta)}
.slot[aria-checked="true"]{background:var(--rojo);border-color:var(--rojo);color:#fff}
.slot:disabled{background:transparent;color:#a99fad;text-decoration:line-through;cursor:not-allowed;border-style:dashed}
.hint{color:var(--suave);font-size:15px;margin:.4em 0 .8em}

.count{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--papel);border:2px solid var(--linea);border-radius:16px;padding:12px 14px;margin-bottom:10px}
.count small{display:block;color:var(--suave);font-size:14px}
.stepper{display:flex;align-items:center;gap:6px}
.stepper button{width:46px;height:46px;border-radius:50%;border:2px solid var(--abeto);background:#fff;color:var(--abeto);font-size:26px;font-weight:800;line-height:1}
.stepper button:disabled{opacity:.35;cursor:not-allowed}
.stepper output{min-width:34px;text-align:center;font-size:24px;font-weight:800}
.price{background:var(--noche);color:#fff;border-radius:16px;padding:14px 16px;margin-top:14px}
.price div{display:flex;justify-content:space-between;gap:10px;padding:2px 0}
.price .t{border-top:1px solid #ffffff33;margin-top:6px;padding-top:8px;font-size:20px;font-weight:800;color:var(--oro)}

label{display:block;font-weight:800;margin:14px 0 4px}
label small{font-weight:400;color:var(--suave)}
input[type=text],input[type=tel],input[type=email],input:not([type]){width:100%;font:inherit;padding:14px;border:2px solid var(--linea);border-radius:12px;background:#fff;color:var(--tinta)}
input:focus{border-color:var(--abeto);outline:none;box-shadow:0 0 0 3px #1f4d3a33}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin:14px 0}
.check input{width:24px;height:24px;margin-top:2px;flex:none;accent-color:var(--rojo)}
.summary{background:var(--papel);border:2px solid var(--linea);border-radius:16px;padding:14px 16px}
.summary dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.summary dt{color:var(--suave)}.summary dd{margin:0;text-align:right;font-weight:800}
.error{color:#8b1020;font-weight:700;min-height:1.4em}
.lookup{margin-top:26px;border-top:1px solid var(--linea);padding-top:14px}
.lookup summary{cursor:pointer;font-weight:800;color:var(--abeto)}

.bar{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#fffdf7;border-top:1px solid var(--linea);box-shadow:0 -8px 24px #16213e14;z-index:5;transform:translateY(110%);transition:transform .25s}
.bar.show{transform:none}
.tot{flex:1;line-height:1.1}.tot small{display:block;color:var(--suave);font-size:13px}.tot strong{font-size:22px}
.go{background:var(--rojo);color:#fff;border:0;border-radius:14px;padding:15px 24px;font-weight:800;min-width:150px}
.go:hover{background:var(--rojo-h)}
.go:disabled{background:#cdbfc0;cursor:not-allowed}
.ghost{background:transparent;border:2px solid var(--abeto);color:var(--abeto);border-radius:14px;padding:13px 18px;font-weight:800}
.foot{max-width:560px;margin:0 auto;padding:0 16px 20px;color:var(--suave);font-size:14px;text-align:center}
@media (max-width:380px){.slots{grid-template-columns:repeat(3,1fr)}.go{min-width:120px;padding:15px 14px}}
@media (prefers-reduced-motion:no-preference){.panel{animation:in .25s ease-out}@keyframes in{from{opacity:.0;transform:translateY(6px)}to{opacity:1;transform:none}}}

/* Galería de escenas */
.story{max-width:760px;margin:0 auto;padding:8px 0 4px}
.story-in{padding:0 16px}
.story h2{font-size:26px;margin:.3em 0 .3em}
.story-p{margin:0 0 14px;color:var(--suave)}
.scenes{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 16px 14px;-webkit-overflow-scrolling:touch}
.scene{flex:0 0 78%;max-width:300px;scroll-snap-align:start;background:var(--papel);border-radius:18px;overflow:hidden;box-shadow:0 2px 0 rgba(22,33,62,.06),0 10px 26px rgba(22,33,62,.10)}
.scene h3{font:400 19px/1.2 var(--display);margin:12px 14px 4px}
.scene p{margin:0 14px 16px;color:var(--suave);font-size:15px}
.pic{position:relative;aspect-ratio:4/3;background:linear-gradient(150deg,#16213e,#1f4d3a);display:grid;place-items:center;overflow:hidden}
.pic::before{content:"";position:absolute;inset:0;background:radial-gradient(2px 2px at 20% 30%,#fffa,transparent),radial-gradient(3px 3px at 75% 22%,var(--oro),transparent),radial-gradient(2px 2px at 60% 70%,#fff8,transparent),radial-gradient(2px 2px at 12% 78%,#fff7,transparent)}
.num{position:relative;font:400 64px/1 var(--display);color:#f3dca0;opacity:.9}
.pic img,.inc-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.pic img.ok,.inc-pic img.ok{opacity:1}
.pic img.ok~.num,.pic:has(img.ok) .num{display:none}
.incluye{display:grid;gap:14px;padding:6px 16px 4px;align-items:center}
.inc-pic{position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:linear-gradient(150deg,#a3202e,#16213e);display:grid;place-items:center;box-shadow:0 10px 26px rgba(22,33,62,.12)}
.inc-ph{position:relative;color:#f3dca0;font:400 22px var(--display)}
.inc-pic:has(img.ok) .inc-ph{display:none}
.incluye ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.incluye li{background:var(--papel);border:2px solid var(--linea);border-radius:14px;padding:12px 14px}
.reserva-t{font-size:28px;margin:18px 0 4px;scroll-margin-top:12px}
html{scroll-behavior:smooth}
@media (min-width:700px){.scenes{flex-wrap:wrap;overflow:visible}.scene{flex:1 1 calc(50% - 14px);max-width:none}.incluye{grid-template-columns:1fr 1fr;padding:6px 0 4px}.story-in,.scenes,.incluye{padding-left:0;padding-right:0}.story{padding:8px 16px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}