/* landings/chass-basket/assets/css/chass.css — Fase 359: portada Chass Basket (pelota ↔ hamburguesa).
   --cb-acc cambia con cada tramo del scroll (lo actualiza chass.js). */
:root{color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body.cb-body{margin:0;background:var(--bg);color:var(--tx);font-family:var(--fb);overflow-x:clip;-webkit-font-smoothing:antialiased}
.cb-body h1,.cb-body h2,.cb-body h3,.cb-body h4{font-family:var(--ft);margin:0}
.cb-body :focus-visible{outline:2px solid var(--cb-acc);outline-offset:3px}
.cb-skip{position:absolute;left:-999px;top:8px;background:var(--acc);color:var(--btn-tx);padding:8px 12px;z-index:100;font-weight:700}.cb-skip:focus{left:8px}

/* barra superior */
.cb-nav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:18px;padding:12px 24px;background:linear-gradient(180deg,rgba(11,11,16,.94),rgba(11,11,16,.78));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.07)}
.cb-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;min-width:0}
.cb-logo svg{width:34px;height:34px;flex:none}.cb-logo img{height:38px;width:auto;display:block}
.cb-logo b{font-family:var(--ft);font-style:italic;font-weight:900;font-size:24px;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-links{display:flex;gap:4px;margin-left:auto}
.cb-links a{color:var(--tx);text-decoration:none;font-family:var(--ft);font-weight:800;font-size:15px;letter-spacing:.14em;text-transform:uppercase;padding:8px 12px}.cb-links a:hover{color:var(--cb-acc)}

.cb-btn{display:inline-block;font-family:var(--ft);font-weight:800;font-size:17px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:15px 26px;border:0;cursor:pointer;color:var(--btn-tx);background:var(--cb-acc);border-radius:var(--btn-radius,10px);box-shadow:0 0 26px color-mix(in srgb,var(--cb-acc) 55%,transparent);transition:background .5s,box-shadow .5s,filter .2s,transform .15s}
.cb-btn:hover{filter:brightness(1.12)}.cb-btn:active{transform:scale(.97)}
.cb-btn.ghost{background:transparent;color:#fff;box-shadow:none;border:1.5px solid rgba(255,255,255,.4)}.cb-btn.ghost:hover{border-color:var(--cb-acc)}
.cb-btn.cb-mini{padding:9px 16px;font-size:14px;letter-spacing:.1em;box-shadow:none}
.cb-btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.cb-row{display:flex;flex-wrap:wrap;gap:12px}

/* escenario */
.cb-stage{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.cb-stage.off{visibility:hidden}
.cb-glow{position:absolute;inset:0;background:radial-gradient(52% 50% at 50% 54%,color-mix(in srgb,var(--cb-acc) 38%,transparent),transparent 72%);transition:background .6s}
.cb-giant{position:absolute;inset:0;display:flex;justify-content:center;padding-top:22vh;font-family:var(--ft);font-style:italic;font-weight:900;font-size:clamp(46px,12.5vw,230px);line-height:.9;text-align:center;white-space:nowrap;color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--cb-acc) 70%,#fff 10%);opacity:.5}
.cb-canvas{position:absolute;inset:0}.cb-canvas canvas{display:block;position:absolute;inset:0;width:100%;height:100%}
.cb-fb{position:absolute;left:50%;top:50%;width:0;height:0;display:none}
.cb-stage.fb .cb-fb{display:block}
.cb-fb-ball,.cb-fb-burger{position:absolute;left:-150px;top:-150px;width:300px;transition:opacity .2s}
.cb-fb-ball svg,.cb-fb-burger svg{width:100%;height:auto;display:block;filter:drop-shadow(0 20px 40px rgba(0,0,0,.5))}

/* tramos */
.cb-main{position:relative;z-index:1}
.cb-act{min-height:100vh;min-height:100svh;padding:90px 24px 56px;display:grid;align-items:center;max-width:1280px;margin:0 auto;position:relative}
.cb-act.cb-hero{align-items:end;min-height:100svh;padding-bottom:70px}
.cb-copy{max-width:min(470px,100%);display:flex;flex-direction:column;gap:14px;align-items:flex-start;text-shadow:0 2px 18px rgba(11,11,16,.9)}
.cb-act.cb-r .cb-copy{justify-self:end}
.cb-act.cb-fin{align-items:end}.cb-act.cb-fin .cb-copy{justify-self:center;align-items:center;text-align:center;max-width:620px}
.cb-act.cb-hero .cb-copy{max-width:640px}
.cb-eyebrow{font-family:var(--ft);font-weight:800;font-size:16px;letter-spacing:.3em;text-transform:uppercase;color:var(--cb-acc);transition:color .5s}
.cb-act h1,.cb-act h2{font-style:italic;font-weight:900;line-height:.98;color:#fff;text-wrap:balance}
.cb-act h1{font-size:clamp(34px,5vw,64px)}.cb-act h1 em{color:var(--cb-acc);transition:color .5s}
.cb-act h2{font-size:clamp(36px,4.8vw,64px)}
.cb-act p{margin:0;font-size:19px;line-height:1.5;color:var(--tx)}
.cb-scroll{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);color:#fff;opacity:.7;font-size:20px;animation:cb-bob 1.8s ease-in-out infinite;text-decoration:none}
@keyframes cb-bob{50%{transform:translate(-50%,6px)}}

/* secciones sólidas */
.cb-solido{position:relative;z-index:2;background:var(--bg)}
.cb-sec{scroll-margin-top:70px}.cb-alt{background:var(--sup)}
.cb-wrap{max-width:1160px;margin:0 auto;padding:84px 24px;display:flex;flex-direction:column;gap:28px}
.cb-head{display:flex;flex-direction:column;gap:10px}
.cb-head h2{font-style:italic;font-weight:900;font-size:clamp(34px,4.4vw,56px);line-height:1;color:#fff}.cb-head h2 em{color:var(--acc);font-style:italic}
.cb-head p{margin:0;color:var(--tx2);font-size:18px;max-width:60ch}
.cb-head .cb-eyebrow{color:var(--acc)}
.cb-cat{font-family:var(--ft);font-weight:900;font-style:italic;font-size:30px;color:var(--acc2);margin-top:14px;text-transform:uppercase;letter-spacing:.04em}
.cb-menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.cb-item{background:var(--card);border:1px solid rgba(255,255,255,.07);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}
.cb-item:hover{border-color:var(--acc);transform:translateY(-3px)}
.cb-item img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.cb-item-in{padding:16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.cb-item-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.cb-item h4{font-size:23px;font-weight:800;color:#fff;letter-spacing:.02em}.cb-item-top b{font-family:var(--ft);font-size:24px;font-weight:800;color:var(--acc2);white-space:nowrap}
.cb-item p{margin:0;color:var(--tx2);font-size:16px;line-height:1.45}
.cb-extras{font-size:13px;color:var(--tx2);opacity:.85;margin-top:auto}
.cb-tag{align-self:flex-start;background:rgba(255,93,93,.15);color:#ff7a7a;border-radius:999px;font-size:12px;font-weight:700;padding:3px 10px}
.cb-item.off{opacity:.55}
.cb-pasos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.cb-paso{position:relative;background:var(--card);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:26px 22px;display:flex;flex-direction:column;gap:8px}
.cb-paso strong{font-family:var(--ft);font-size:24px;font-weight:800;color:#fff}.cb-paso span:last-child{color:var(--tx2);font-size:16px;line-height:1.5}
.cb-num{position:absolute;right:16px;top:8px;font-family:var(--ft);font-style:italic;font-weight:900;font-size:64px;color:rgba(255,255,255,.07);line-height:1}
.cb-ico{font-size:36px}
.cb-faq details{border-bottom:1px solid rgba(255,255,255,.1);max-width:780px}
.cb-faq summary{cursor:pointer;padding:18px 0;font-family:var(--ft);font-weight:800;font-size:22px;color:#fff}
.cb-faq details p{margin:0;padding:0 0 20px;color:var(--tx);font-size:17px;line-height:1.55;max-width:65ch}

/* reserva */
.cb-reserva{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:18px}
.cb-cargando{color:var(--tx2)}
.cb-dias{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.cb-dia{flex:none;min-width:68px;background:var(--sup);border:1.5px solid rgba(255,255,255,.1);color:var(--tx);border-radius:12px;padding:8px 6px;text-align:center;cursor:pointer;font-family:var(--fb);line-height:1.2}
.cb-dia small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--tx2)}.cb-dia b{font-family:var(--ft);font-size:24px;font-weight:800;display:block}
.cb-dia.act{background:var(--acc);border-color:var(--acc);color:var(--btn-tx)}.cb-dia.act small{color:inherit}
.cb-fila{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cb-fila select,.cb-fila input[type=date]{background:var(--sup);border:1.5px solid rgba(255,255,255,.12);color:var(--tx);border-radius:10px;padding:10px 12px;font-size:15px;font-family:inherit;color-scheme:dark}
.cb-turnos{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.cb-turno{background:var(--sup);border:1.5px solid rgba(255,255,255,.12);color:var(--tx);border-radius:12px;padding:10px 6px;cursor:pointer;font-family:var(--fb);display:flex;flex-direction:column;gap:2px;align-items:center;transition:border-color .15s,background .15s}
.cb-turno b{font-family:var(--ft);font-size:23px;font-weight:800;line-height:1}.cb-turno small{color:var(--tx2);font-size:12px}
.cb-turno:hover:not(:disabled){border-color:var(--acc)}
.cb-turno.sel{background:var(--acc);border-color:var(--acc);color:var(--btn-tx)}.cb-turno.sel small{color:inherit}
.cb-turno:disabled{opacity:.38;cursor:not-allowed;text-decoration:line-through}.cb-turno:disabled small{text-decoration:none}
.cb-resumen{background:var(--sup);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;font-size:16px}
.cb-resumen strong{font-family:var(--ft);font-size:26px;font-weight:800;color:#fff}.cb-resumen .m{color:var(--tx2);font-size:14px}
.cb-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cb-form label{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--tx2)}
.cb-form input{background:var(--sup);border:1.5px solid rgba(255,255,255,.12);color:var(--tx);border-radius:10px;padding:12px;font-size:16px;font-family:inherit}
.cb-form input:focus{border-color:var(--acc);outline:0}
.cb-hp{position:absolute!important;left:-5000px;width:1px;height:1px;overflow:hidden}
.cb-msg{padding:12px 14px;border-radius:10px;font-size:15px}.cb-msg.err{background:rgba(255,93,93,.12);color:#ff8a8a;border:1px solid rgba(255,93,93,.35)}
.cb-ok{background:rgba(56,210,122,.08);border:1px solid rgba(56,210,122,.4);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:10px}
.cb-ok h3{font-size:28px;font-weight:900;font-style:italic;color:#38d27a}.cb-ok p{margin:0;line-height:1.5}
.cb-ok code{background:var(--sup);padding:2px 8px;border-radius:6px;font-size:15px;word-break:break-all}
.cb-lnk{background:none;border:0;color:var(--tx2);text-decoration:underline;cursor:pointer;font-size:14px;padding:0;font-family:inherit;align-self:flex-start}

/* footer */
.cb-foot{background:#07070b;border-top:1px solid rgba(255,255,255,.08)}
.cb-foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:32px;padding-bottom:30px}
.cb-foot h3{font-family:var(--ft);font-weight:800;font-size:16px;letter-spacing:.3em;text-transform:uppercase;color:var(--acc);margin-bottom:8px}
.cb-foot p{margin:0 0 8px;line-height:1.6}.cb-foot a{color:inherit}.cb-mut{color:var(--tx2)}
.cb-foot-logo{display:flex;align-items:center;gap:10px;margin-bottom:8px}.cb-foot-logo svg{width:36px;height:36px}.cb-foot-logo b{font-family:var(--ft);font-style:italic;font-weight:900;font-size:26px;text-transform:uppercase}
.cb-redes{display:flex;gap:10px;margin-top:10px}.cb-redes a{width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none}.cb-redes a:hover{border-color:var(--acc);color:var(--acc)}
.cb-map iframe{display:block;width:100%;height:190px;border:1px solid rgba(255,255,255,.12);border-radius:12px;filter:grayscale(.3) contrast(1.05)}
.cb-foot-bottom{padding-top:0;padding-bottom:30px;text-align:center;font-size:12px;color:var(--tx2)}.cb-foot-bottom a{color:inherit}

@media (max-width:820px){
  .cb-nav{padding:10px 12px;gap:10px}.cb-links{display:none}.cb-nav .cb-btn{margin-left:auto}
  .cb-logo b{font-size:17px}.cb-nav .cb-btn{white-space:nowrap;padding:8px 12px;font-size:13px;letter-spacing:.06em}.cb-logo svg{width:28px;height:28px}
  .cb-act{align-items:end;padding:80px 16px 40px}.cb-act.cb-r .cb-copy{justify-self:start}.cb-copy{max-width:none}
  .cb-act p{font-size:17px}.cb-wrap{padding:56px 16px}
  .cb-form{grid-template-columns:1fr}.cb-foot-grid{grid-template-columns:1fr}
  .cb-giant{padding-top:16vh}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cb-scroll{animation:none}.cb-btn,.cb-item{transition:none}}
