/* Es Borinot: estilos del tema. Base cómic pop + páginas interiores + capa suave. */
@font-face{font-family:'KK1';src:url(../fonts/kk1.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'KK2R';src:url(../fonts/kk2r.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
/* Concepto: cómic pop sobre blanco. Burgers recortadas como pegatinas, rayos turquesa, onomatopeyas y un bicho que va a lo suyo. */
:root{
  --white:#FFFFFF; --cyan:#61C2D0; --black:#0D0D0D; --mist:#EAF8FA; --soft:#333;
  --display:'KK1','Arial Rounded MT Bold','Arial Black',sans-serif;
  --body:'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;
  --marker:'KK1','Comic Sans MS',cursive;
  --star:polygon(50% 0%,61% 18%,80% 8%,78% 29%,98% 30%,85% 47%,100% 62%,80% 68%,86% 90%,64% 82%,50% 100%,38% 82%,16% 92%,22% 69%,0% 62%,15% 47%,2% 30%,22% 29%,20% 8%,39% 18%);
  --hh:66px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:clip}
body{margin:0;background:var(--white);color:var(--black);font-family:var(--body);font-size:17px;line-height:1.5}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--white);z-index:60}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:4px solid var(--black);outline-offset:3px}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,figure,blockquote{margin:0}
section{position:relative}
.bb{font-family:var(--display);font-weight:400}
.mk{font-family:var(--marker);font-weight:400}
.wrap{width:100%;max-width:1760px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.out{color:var(--white);-webkit-text-stroke:5px var(--black);paint-order:stroke fill;text-shadow:7px 7px 0 var(--black);text-transform:uppercase;font-family:var(--display);font-weight:400;line-height:.9;letter-spacing:.01em}
.star{position:relative;background:var(--black);clip-path:var(--star);display:flex;align-items:center;justify-content:center;text-align:center}
.star::before{content:"";position:absolute;inset:8px;background:var(--cyan);clip-path:var(--star)}
.star>*{position:relative;z-index:1}
.say{position:relative;background:var(--white);border:4px solid var(--black);border-radius:26px;padding:12px 18px;font-weight:700;line-height:1.25;box-shadow:5px 5px 0 var(--black)}
.say::after{content:"";position:absolute;left:34px;bottom:-14px;width:22px;height:22px;background:var(--white);border-right:4px solid var(--black);border-bottom:4px solid var(--black);transform:rotate(45deg)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--display);font-size:18px;line-height:1;min-height:58px;padding:0 30px;border:4px solid var(--black);border-radius:999px;box-shadow:6px 6px 0 var(--black);background:var(--white);color:var(--black);cursor:pointer;transition:transform .12s,box-shadow .12s;white-space:nowrap}
.btn:hover{transform:translate(3px,3px) rotate(-1deg);box-shadow:3px 3px 0 var(--black)}
.btn:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--black)}
.btn.c{background:var(--cyan)}
.btn.k{background:var(--black);color:var(--white);box-shadow:6px 6px 0 var(--cyan)}
.btn.sm{min-height:46px;font-size:15px;padding:0 20px;box-shadow:4px 4px 0 var(--black);border-width:3px}
.halftone{background-image:radial-gradient(circle,var(--cyan) 3px,transparent 3.6px);background-size:20px 20px}

/* Barra */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:70;background:var(--white);border-bottom:4px solid var(--black);height:var(--hh)}
header .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
header a:first-child{flex:none;display:block}
header .logo{height:46px;width:auto;max-width:none}
header nav{display:flex;align-items:center;gap:26px;font-weight:700}
header nav a.l:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px;text-decoration-color:var(--cyan)}
@media (max-width:860px){header nav a.l{display:none}header .btn.sm.hide-s{display:none}}

/* Portada */
.hero{overflow:hidden;background:var(--white)}
.stage{position:relative;height:clamp(560px,min(46vw,calc(100vh - 150px)),880px);margin:0 auto}
.stage .rays{position:absolute;left:50%;top:56%;width:min(1500px,170vw);aspect-ratio:1;margin:calc(min(1500px,170vw) / -2) 0 0 calc(min(1500px,170vw) / -2);background:repeating-conic-gradient(from 0deg,var(--cyan) 0 5deg,transparent 5deg 10deg);-webkit-mask-image:radial-gradient(circle,#000 0,#000 18%,transparent 52%);mask-image:radial-gradient(circle,#000 0,#000 18%,transparent 52%);animation:spin 80s linear infinite;opacity:.85}
.stage .dots{position:absolute;inset:0;-webkit-mask-image:radial-gradient(ellipse at 50% 50%,transparent 38%,#000 85%);mask-image:radial-gradient(ellipse at 50% 50%,transparent 38%,#000 85%);opacity:.7}
@keyframes spin{to{transform:rotate(360deg)}}
.wm{position:absolute;left:0;right:0;top:clamp(22px,4vw,64px);text-align:center;font-size:clamp(64px,12.5vw,240px);white-space:nowrap;pointer-events:none;-webkit-text-stroke-width:clamp(3px,.45vw,7px);animation:wmin .7s cubic-bezier(.2,1.5,.4,1) 1s both}
@keyframes wmin{from{transform:translateY(-60px) scale(.9);opacity:0}to{transform:none;opacity:1}}
.tilt{position:absolute;left:50%;top:44%;width:clamp(250px,34vw,620px);margin-left:calc(clamp(250px,34vw,620px) / -2);transform-origin:50% 60%;will-change:translate,rotate}
.slam{animation:slam .6s cubic-bezier(.2,1.5,.4,1) 1.15s both}
@keyframes slam{0%{transform:translateY(-120vh) scale(2.6) rotate(-16deg)}65%{transform:translateY(0) scale(.96) rotate(3deg)}100%{transform:none}}
.tilt img{width:100%;filter:drop-shadow(10px 14px 0 var(--cyan));animation:bob 5s ease-in-out 1.9s infinite}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-14px) rotate(2deg)}}
.pam{position:absolute;left:calc(50% - clamp(190px,30vw,470px));top:22%;width:clamp(100px,14vw,190px);aspect-ratio:1;transform:rotate(-12deg) scale(0);animation:pam .45s cubic-bezier(.2,1.8,.4,1) 1.75s forwards,wob 3s ease-in-out 2.3s infinite;font-family:var(--display);font-size:clamp(20px,3vw,38px);color:var(--black)}
@keyframes pam{to{transform:rotate(-12deg) scale(1)}}
@keyframes wob{0%,100%{rotate:0deg}50%{rotate:8deg}}
.ribbon{position:absolute;left:50%;bottom:9%;transform:translateX(-50%) rotate(-3deg);background:var(--black);color:var(--white);font-family:var(--display);font-size:clamp(24px,5vw,72px);line-height:1;padding:.22em .9em;white-space:nowrap;clip-path:polygon(0 0,100% 0,96% 50%,100% 100%,0 100%,4% 50%);border:0;animation:ribbon .5s cubic-bezier(.2,1.4,.4,1) 1.9s both;z-index:5}
@keyframes ribbon{from{transform:translateX(-50%) rotate(-3deg) scaleX(0)}to{transform:translateX(-50%) rotate(-3deg) scaleX(1)}}
.sat{position:absolute;z-index:3;will-change:translate;filter:drop-shadow(7px 9px 0 var(--cyan))}
.sat img{width:100%;animation:float 6s ease-in-out infinite;transition:transform .2s}
.sat:hover img{transform:rotate(-10deg) scale(1.1)}
@keyframes float{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-16px) rotate(calc(var(--r,0deg) + 4deg))}}
.flyw{position:absolute;left:0;top:0;width:clamp(70px,9vw,130px);z-index:8;will-change:transform;pointer-events:none}
.flyw .bz{filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff)}
.flyw .say{position:absolute;left:78%;bottom:76%;white-space:nowrap;font-size:clamp(13px,1.4vw,18px);transform:scale(0);transform-origin:10% 100%;transition:transform .25s cubic-bezier(.2,1.6,.4,1)}
.flyw .say.on{transform:scale(1)}
.tdot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--black);pointer-events:none;animation:tdot 1.4s ease-out forwards;z-index:6}
@keyframes tdot{from{transform:scale(1);opacity:.9}to{transform:scale(.2);opacity:0}}
@media (max-width:700px){.sat.hide-s{display:none}}
.tag1{position:absolute;left:max(16px,4%);top:42%;background:var(--white);border:4px solid var(--black);padding:8px 14px;font-size:clamp(18px,2vw,28px);line-height:1;transform:rotate(-4deg);box-shadow:5px 5px 0 var(--black);z-index:6}
.heroCta{display:flex;flex-wrap:wrap;gap:16px 20px;justify-content:center;align-items:center;padding:8px 16px 56px;position:relative;z-index:6}
.heroCta .btn.big{min-height:68px;font-size:22px;padding:0 40px}
.mini-b{background:none;border:0;font:700 16px var(--body);text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--cyan);text-underline-offset:5px;cursor:pointer;color:var(--black);min-height:44px;padding:0 6px}
.mini-b:hover{text-decoration-color:var(--black)}

/* Cinta */
.tape{height:130px;overflow:hidden;position:relative;background:var(--white)}
.tape .b{position:absolute;left:-4%;width:108%;top:34px;background:var(--cyan);border-top:4px solid var(--black);border-bottom:4px solid var(--black);transform:rotate(-1.6deg);padding:10px 0;overflow:hidden}
.track{display:flex;width:max-content;will-change:transform}
.track span{font-family:var(--display);font-size:clamp(26px,3.6vw,44px);line-height:1;white-space:nowrap;padding-right:.5em}

/* Cómic */
.comic{padding:72px 0 96px}
.comic .wrap{display:flex;flex-direction:column;gap:48px}
.shead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px}
.shead h2{font-size:clamp(54px,9vw,128px)}
.shead .say{max-width:340px;font-size:18px}

/* Burgers: showcase fijado */
.show{height:calc(var(--n) * 62vh + 100vh);background:var(--mist);border-top:4px solid var(--black);border-bottom:4px solid var(--black)}
.show .sticky{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hh));height:calc(100vh - var(--hh) - env(safe-area-inset-top,0px));min-height:560px;overflow:hidden}
.show .htitle{position:absolute;left:max(16px,3vw);top:18px;z-index:12;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.show .htitle h2{font-size:clamp(34px,4.2vw,58px)}
.show .view{position:absolute;inset:0;overflow:hidden}
.htrack{display:flex;height:100%;will-change:transform}
.hs{position:relative;flex:0 0 100%;height:100%;overflow:hidden}
.hs .hbg{position:absolute;left:0;right:0;top:50%;transform:translateY(-58%);text-align:center;font-family:var(--display);font-size:clamp(90px,19vw,300px);line-height:.9;color:transparent;-webkit-text-stroke:3px var(--black);white-space:nowrap;opacity:.9;text-transform:uppercase}
.hs .blob{position:absolute;left:50%;top:52%;width:min(430px,32vw,52vh);aspect-ratio:1;transform:translate(-50%,-50%);background:var(--cyan);border:5px solid var(--black);border-radius:58% 42% 55% 45%/48% 56% 44% 52%;box-shadow:12px 12px 0 var(--black);animation:morph 9s ease-in-out infinite}
@keyframes morph{0%,100%{border-radius:58% 42% 55% 45%/48% 56% 44% 52%}50%{border-radius:42% 58% 45% 55%/56% 44% 52% 48%}}
.hs .himg{position:absolute;left:50%;top:52%;width:min(450px,34vw,54vh);transform:translate(-50%,-50%);filter:drop-shadow(12px 16px 0 rgba(13,13,13,.9))}
.hs .himg img{width:100%}
.hs.act .himg img{animation:hpop .55s cubic-bezier(.2,1.6,.4,1) both}
@keyframes hpop{0%{transform:scale(.6) rotate(-14deg)}70%{transform:scale(1.06) rotate(2deg)}100%{transform:none}}
.hs .price{position:absolute;left:calc(50% + min(190px,15vw));top:12%;width:clamp(110px,13vw,170px);aspect-ratio:1;font-family:var(--display);font-size:clamp(20px,2.4vw,32px);transform:rotate(10deg);z-index:6}
.hs .info{position:absolute;left:max(16px,3vw);bottom:60px;z-index:7;display:flex;flex-direction:column;gap:10px;max-width:min(340px,26vw)}
.hs .info .no{font-family:var(--marker);font-size:26px;line-height:1}
.hs .info h3{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.9vw,42px);line-height:.95;text-transform:uppercase;background:var(--white);border:4px solid var(--black);padding:12px 16px;box-shadow:6px 6px 0 var(--black);transform:rotate(-2deg)}
.hs .info p{font-weight:500}
.hs .say{position:absolute;right:max(16px,5vw);bottom:24%;max-width:260px;z-index:7;transform:rotate(2deg);font-family:var(--marker);font-weight:400;font-size:24px}
.hs .say::after{left:auto;right:36px}
.hs .order{position:absolute;right:max(16px,5vw);bottom:60px;z-index:7}
.dotsnav{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:10px;z-index:12}
.dotsnav button{width:22px;height:22px;border-radius:50%;border:3px solid var(--black);background:var(--white);padding:0;cursor:pointer}
.dotsnav button.on{background:var(--black)}
.show .hint{position:absolute;right:max(16px,3vw);top:20px;z-index:12;font-family:var(--marker);font-size:24px;background:var(--white);border:3px solid var(--black);padding:6px 12px;transform:rotate(3deg);box-shadow:4px 4px 0 var(--black)}
@media (max-width:860px){
  .show{height:auto}
  .show .sticky{position:relative;top:auto;height:auto;min-height:0;overflow:visible;padding-top:96px}
  .show .view{position:relative;overflow:visible}
  .htrack{flex-direction:column;height:auto;transform:none!important}
  .hs{flex:none;height:560px;border-top:4px solid var(--black)}
  .hs .blob{width:64vw;top:46%}
  .hs .himg{width:72vw;top:46%}
  .hs .hbg{font-size:26vw;top:40%}
  .hs .price{left:auto;right:6%;top:6%;width:104px;font-size:20px}
  .hs .info{left:16px;bottom:18px;max-width:64%}
  .hs .say{display:none}
  .hs .order{right:16px;bottom:18px}
  .dotsnav,.show .hint{display:none}
}

/* Mesa */
.mesa{padding:88px 0 96px;background:var(--white)}
.mesa .wrap{display:flex;flex-direction:column;gap:36px}
.mesa .shead h2{font-size:clamp(50px,8vw,112px)}
.board{position:relative;height:clamp(640px,56vw,780px);border:5px solid var(--black);box-shadow:10px 10px 0 var(--black);overflow:hidden;background-color:var(--white);touch-action:pan-y}
.board::before{content:"";position:absolute;inset:0}
.dr{position:absolute;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;z-index:1}
.dr.down{cursor:grabbing;z-index:50}
.dr .im{filter:drop-shadow(8px 10px 0 var(--cyan));transition:transform .15s}
.dr:hover .im{transform:scale(1.03)}
.dr.down .im{transform:scale(1.07) rotate(-3deg)}
.dr img{width:100%;pointer-events:none}
.dr .lab{position:relative;margin:-16px auto 0;transform:rotate(-2deg);background:var(--white);border:4px solid var(--black);padding:6px 12px;font-weight:700;font-size:15px;line-height:1.2;text-align:center;width:max-content;max-width:94%;box-shadow:4px 4px 0 var(--black);pointer-events:none}
.dr .lab b{display:block;font-family:var(--display);font-weight:400;font-size:18px;margin-top:2px;font-variant-numeric:tabular-nums}
@media (max-width:700px){.board{height:780px}}
.board .bhint{position:absolute;right:16px;top:14px;z-index:60;display:flex;gap:12px;align-items:center}

/* Beber */
.drink{background:var(--cyan);border-top:4px solid var(--black);border-bottom:4px solid var(--black);overflow:hidden}
.drink .wrap{padding-top:88px;padding-bottom:96px;display:flex;flex-direction:column;gap:40px;position:relative;z-index:2}
.drink .shead h2{font-size:clamp(50px,8vw,112px)}
.menuB{background:var(--white);border:5px solid var(--black);border-radius:34px;box-shadow:12px 12px 0 var(--black);padding:clamp(22px,4vw,48px);display:flex;flex-wrap:wrap;gap:32px 56px;position:relative}
.menuB .lst{flex:1 1 280px;min-width:0}
.menuB h3{font-family:var(--marker);font-weight:400;font-size:38px;line-height:1;display:inline-block;transform:rotate(-2deg);margin-bottom:10px;background:var(--cyan);border:4px solid var(--black);padding:4px 14px}
.menuB .row{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:3px dotted var(--black);font-size:18px}
.menuB .row b{font-family:var(--display);font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums}
.menuB .fine{font-size:15px;padding-top:12px}
.bub{position:absolute;bottom:-70px;border-radius:50%;border:4px solid var(--black);background:rgba(255,255,255,.35);opacity:0;animation:rise 10s ease-in infinite;z-index:1}
@keyframes rise{0%{transform:translateY(0) translateX(0);opacity:0}10%{opacity:1}50%{transform:translateY(-450px) translateX(calc(var(--dx,40px) * -.5))}100%{transform:translateY(-1000px) translateX(var(--dx,40px));opacity:0}}
.drunk{position:absolute;right:clamp(8px,4vw,60px);top:-58px;width:clamp(70px,8vw,110px);animation:drunk 4s ease-in-out infinite;z-index:3}
@keyframes drunk{0%,100%{transform:rotate(160deg) translateX(0)}25%{transform:rotate(200deg) translateX(10px)}50%{transform:rotate(150deg) translateX(-6px)}75%{transform:rotate(190deg) translateX(8px)}}

/* Reseña */
.rev{padding:96px 0 104px;background:var(--white)}
.rev .wrap{display:flex;flex-wrap:wrap;gap:40px 64px;align-items:center}
.rev .pic{flex:0 1 380px;min-width:0;display:flex;justify-content:center;position:relative}
.rev .pic .im{width:min(100%,380px);filter:drop-shadow(10px 12px 0 var(--cyan));transform:rotate(-4deg)}
.rev .gb{position:absolute;right:-4%;top:-8%;width:clamp(120px,14vw,170px);aspect-ratio:1;font-family:var(--display);font-size:clamp(15px,1.7vw,21px);line-height:1.05;transform:rotate(12deg)}
.rev .bubble{flex:1 1 540px;min-width:0;position:relative;background:var(--white);border:5px solid var(--black);border-radius:40px;box-shadow:12px 12px 0 var(--black);padding:clamp(24px,4vw,52px)}
.rev .bubble::after{content:"";position:absolute;left:-26px;bottom:60px;width:44px;height:44px;background:var(--white);border-left:5px solid var(--black);border-bottom:5px solid var(--black);transform:rotate(45deg)}
.rev blockquote{font-family:var(--display);font-size:clamp(26px,4vw,52px);line-height:1.08;text-wrap:balance}
.rev .who{font-family:var(--marker);font-size:28px;margin-top:18px}
@media (max-width:860px){.rev .bubble::after{display:none}}

/* Visita */
.visit{background:var(--mist);border-top:4px solid var(--black);overflow:hidden}
.visit .wrap{padding-top:88px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:40px;position:relative;z-index:2;align-items:center}
.visit .box{flex:1 1 500px;min-width:0;border:5px solid var(--black);background:var(--white);box-shadow:12px 12px 0 var(--black);border-radius:34px;padding:clamp(22px,4vw,48px);display:flex;flex-direction:column;gap:22px}
.visit h2{font-size:clamp(44px,6.6vw,96px)}
.visit .info div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:13px 0;border-bottom:3px dotted var(--black);font-size:19px}
.visit .info div:last-child{border-bottom:0}
.visit .phone{font-family:var(--display);font-size:clamp(36px,5.4vw,70px);line-height:1;user-select:all}
.visit .acts{display:flex;flex-wrap:wrap;gap:14px}
.visit .side{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.visit .sun{font-family:var(--display);font-size:clamp(32px,4.6vw,60px);line-height:.98;text-transform:uppercase;transform:rotate(-2deg)}
.visit .sun em{font-style:normal;background:var(--black);color:var(--white);padding:0 .12em}
.shake{animation:shake 4s ease-in-out infinite}
@keyframes shake{0%,86%,100%{transform:none}88%{transform:translate(-4px,2px) rotate(-2deg)}90%{transform:translate(5px,-2px) rotate(2deg)}92%{transform:translate(-5px,1px) rotate(-2deg)}94%{transform:translate(4px,-1px) rotate(2deg)}96%{transform:translate(-2px,0) rotate(-1deg)}}

/* Pie */
footer{background:var(--cyan);border-top:4px solid var(--black);overflow:hidden;position:relative}
footer .wrap{padding-top:48px;padding-bottom:0;display:flex;flex-direction:column;gap:26px}
footer .top{display:flex;flex-wrap:wrap;gap:24px 64px;justify-content:space-between;align-items:flex-start}
footer .links{display:flex;flex-direction:column;font-weight:700}
footer .links a{min-height:38px;display:flex;align-items:center}
footer .links a:hover{text-decoration:underline;text-decoration-thickness:3px}
footer .ph{border:3px dashed var(--black);padding:12px 14px;font-size:14px;line-height:1.4;max-width:260px}
footer .legal{display:flex;flex-wrap:wrap;gap:2px 24px;font-size:14px;border-top:3px solid var(--black);padding-top:14px}
footer .legal a{min-height:36px;display:flex;align-items:center}
footer .giant{font-family:'KK2R',var(--display);font-size:clamp(90px,24vw,360px);text-align:center;white-space:nowrap;line-height:.78;transform:translateY(12%);-webkit-text-stroke-width:clamp(3px,.5vw,8px);text-shadow:8px 8px 0 var(--black);user-select:none;pointer-events:none}

/* Extras */
#cfly{position:fixed;left:0;top:0;width:44px;z-index:95;pointer-events:none;will-change:transform;filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff)}
.mini{position:fixed;left:0;top:0;z-index:90;pointer-events:none;filter:drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff)}
.rain{position:fixed;left:0;top:0;z-index:85;pointer-events:none}
.splat{position:fixed;z-index:88;pointer-events:none;width:0;height:0}
.splat svg{position:absolute;left:-70px;top:-70px;width:140px;height:140px;overflow:visible;animation:splat 1.7s ease-out forwards}
.splat span{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotate(var(--rot));font-family:var(--marker);font-size:30px;line-height:1;color:var(--black);white-space:nowrap;animation:splatt 1.7s ease-out forwards}
@keyframes splat{0%{transform:scale(.2);opacity:1}15%{transform:scale(1);opacity:1}75%{opacity:1}100%{transform:scale(1.05);opacity:0}}
@keyframes splatt{0%{opacity:0;scale:.3}15%{opacity:1;scale:1.2}30%{scale:1}80%{opacity:1}100%{opacity:0}}
@media (min-width:861px){.pill{display:none}}
.pill{position:fixed;z-index:80;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.pill .btn{min-height:54px;font-size:16px;padding:0 24px;background:var(--cyan)}
.shk{animation:shk .4s linear}
@keyframes shk{0%,100%{transform:none}15%{transform:translate(-9px,5px)}30%{transform:translate(8px,-6px)}45%{transform:translate(-7px,-4px)}60%{transform:translate(6px,5px)}75%{transform:translate(-3px,3px)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .stage .rays,.tilt img,.slam,.wm,.pam,.ribbon,.sat img,.hs .blob,.bub,.drunk,.shake,.shk,.tdot{animation:none!important}
  .pam{transform:rotate(-12deg) scale(1)}
  .btn{transition:none}
}

/* ===== V3 ===== */
.intro{position:fixed;inset:0;z-index:300;background:var(--cyan);display:flex;align-items:center;justify-content:center;pointer-events:none;overflow:hidden;animation:introOut .6s cubic-bezier(.7,0,.3,1) .95s forwards}
.intro::before{content:"";position:absolute;left:50%;top:50%;width:200vmax;height:200vmax;margin:-100vmax 0 0 -100vmax;background:repeating-conic-gradient(var(--white) 0 6deg,transparent 6deg 12deg);opacity:.35;animation:spin 14s linear infinite}
.intro .in-w{position:relative;text-align:center;font-size:clamp(52px,13vw,200px);animation:wmin .5s cubic-bezier(.2,1.5,.4,1) .05s both}
.intro .in-b{position:absolute;left:50%;top:50%;font-size:clamp(34px,7vw,90px);color:var(--black);transform:translate(-30%,70%) rotate(-8deg);background:var(--white);border:4px solid var(--black);padding:4px 18px;box-shadow:6px 6px 0 var(--black);animation:pam2 .4s cubic-bezier(.2,1.8,.4,1) .35s both}
@keyframes pam2{from{scale:0}to{scale:1}}
@keyframes introOut{from{clip-path:circle(150% at 50% 50%)}to{clip-path:circle(0% at 50% 50%);visibility:hidden}}

.burst{position:absolute;left:50%;top:51%;width:clamp(360px,56vw,820px);aspect-ratio:1;translate:-50% -50%;background:var(--black);clip-path:polygon(98.0% 50.0%,87.4% 53.9%,97.9% 60.2%,85.5% 61.5%,94.4% 69.8%,83.3% 69.2%,88.2% 77.7%,79.0% 76.1%,81.5% 85.0%,72.8% 81.3%,73.6% 90.9%,65.2% 84.1%,64.9% 95.9%,58.4% 89.4%,55.0% 97.1%,50.0% 87.9%,44.9% 98.6%,41.5% 89.9%,34.9% 96.3%,34.3% 85.3%,25.0% 93.2%,28.1% 80.1%,16.8% 86.8%,21.6% 75.5%,11.6% 77.9%,17.5% 68.7%,6.2% 69.5%,11.7% 62.4%,3.5% 59.9%,10.9% 54.1%,1.1% 50.0%,11.7% 46.0%,2.4% 39.9%,14.6% 38.5%,6.9% 30.8%,17.2% 31.1%,10.3% 21.2%,21.2% 24.1%,17.9% 14.4%,26.9% 18.2%,25.8% 8.1%,34.5% 15.1%,34.7% 3.0%,41.7% 11.1%,45.0% 2.5%,50.0% 10.7%,55.1% 1.7%,58.4% 10.4%,65.2% 3.2%,65.5% 15.1%,75.0% 6.8%,72.0% 19.7%,82.3% 14.1%,79.7% 23.2%,88.4% 22.1%,83.7% 30.5%,93.0% 30.8%,87.7% 37.7%,98.2% 39.8%,89.1% 45.9%);animation:burstin .5s cubic-bezier(.2,1.6,.4,1) 1.1s both;z-index:1}
.burst::before{content:"";position:absolute;inset:14px;background:var(--white);background-image:radial-gradient(circle,rgba(97,194,208,.55) 2.6px,transparent 3.2px);background-size:16px 16px;clip-path:polygon(98.0% 50.0%,87.4% 53.9%,97.9% 60.2%,85.5% 61.5%,94.4% 69.8%,83.3% 69.2%,88.2% 77.7%,79.0% 76.1%,81.5% 85.0%,72.8% 81.3%,73.6% 90.9%,65.2% 84.1%,64.9% 95.9%,58.4% 89.4%,55.0% 97.1%,50.0% 87.9%,44.9% 98.6%,41.5% 89.9%,34.9% 96.3%,34.3% 85.3%,25.0% 93.2%,28.1% 80.1%,16.8% 86.8%,21.6% 75.5%,11.6% 77.9%,17.5% 68.7%,6.2% 69.5%,11.7% 62.4%,3.5% 59.9%,10.9% 54.1%,1.1% 50.0%,11.7% 46.0%,2.4% 39.9%,14.6% 38.5%,6.9% 30.8%,17.2% 31.1%,10.3% 21.2%,21.2% 24.1%,17.9% 14.4%,26.9% 18.2%,25.8% 8.1%,34.5% 15.1%,34.7% 3.0%,41.7% 11.1%,45.0% 2.5%,50.0% 10.7%,55.1% 1.7%,58.4% 10.4%,65.2% 3.2%,65.5% 15.1%,75.0% 6.8%,72.0% 19.7%,82.3% 14.1%,79.7% 23.2%,88.4% 22.1%,83.7% 30.5%,93.0% 30.8%,87.7% 37.7%,98.2% 39.8%,89.1% 45.9%)}
@keyframes burstin{from{scale:0;rotate:-40deg}to{scale:1;rotate:0deg}}
.tilt,.sat{z-index:2}.wm{z-index:1}.pam{z-index:4}.intro .out{text-shadow:7px 7px 0 var(--black)}

.bori{display:block;position:relative}
.bori .bz{display:block;position:relative;animation:buzz .16s linear infinite}
.bori img{width:100%}
@keyframes buzz{0%{transform:translate(0,0) rotate(0)}25%{transform:translate(1.2px,-1px) rotate(1.4deg)}50%{transform:translate(-1px,1px) rotate(-1.2deg)}75%{transform:translate(1px,1px) rotate(1deg)}100%{transform:translate(0,0) rotate(0)}}
.eye{position:absolute;width:11.4%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:#fff;overflow:hidden}
.eye b{position:absolute;left:50%;top:50%;width:50%;aspect-ratio:1;border-radius:50%;background:#1a0e00;translate:calc(-50% + var(--px,0px)) calc(-50% + var(--py,0px))}
.eye b::after{content:"";position:absolute;left:18%;top:14%;width:30%;height:30%;border-radius:50%;background:#fff}

.tape{height:170px}
.tape .b2{top:66px;background:var(--black);color:var(--cyan);transform:rotate(1.4deg);z-index:2}
.tape .b{z-index:1}

.hs .sp{position:absolute;font-style:normal;font-family:var(--display);color:var(--black);font-size:clamp(28px,4vw,56px);line-height:1;animation:twk 2.2s ease-in-out infinite;z-index:5}
.hs .s1{left:calc(50% - min(330px,26vw));top:22%}.hs .s2{left:calc(50% + min(300px,24vw));top:68%;animation-delay:-.8s}.hs .s3{left:calc(50% - min(250px,20vw));top:74%;animation-delay:-1.4s;color:var(--white);-webkit-text-stroke:2px var(--black)}
@keyframes twk{0%,100%{transform:scale(.6) rotate(0)}50%{transform:scale(1.2) rotate(25deg)}}


.open{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;line-height:1.1;border:3px solid var(--black);border-radius:999px;padding:6px 12px;background:var(--white);white-space:nowrap}
.open i{flex:none;width:12px;height:12px;border-radius:50%;background:var(--black);border:2px solid var(--black)}
.open.on i{background:var(--cyan);animation:pulse 1.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(97,194,208,.9)}100%{box-shadow:0 0 0 12px rgba(97,194,208,0)}}
.open.big{align-self:flex-start;font-size:17px;padding:10px 18px;box-shadow:5px 5px 0 var(--black);white-space:normal}
@media (max-width:1100px){.open.hide-m{display:none}}

.bor{padding:96px 0 104px;background:var(--white);overflow:hidden}
.bor .wrap{display:flex;flex-wrap:wrap;gap:44px 64px;align-items:center}
.arena{position:relative;flex:1 1 440px;min-width:0;height:clamp(380px,44vw,540px);border:5px solid var(--black);box-shadow:12px 12px 0 var(--black);overflow:hidden;background:var(--cyan);cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg transform='rotate(-40 28 28)'%3E%3Crect x='24' y='30' width='8' height='24' rx='3' fill='%230D0D0D'/%3E%3Crect x='12' y='2' width='32' height='30' rx='9' fill='%2361C2D0' stroke='%230D0D0D' stroke-width='3'/%3E%3Cpath d='M20 6v22M28 6v22M36 6v22M14 12h28M14 20h28' stroke='%230D0D0D' stroke-width='1.6'/%3E%3C/g%3E%3C/svg%3E") 10 10,crosshair}
.arena::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,255,255,.38) 0 6deg,transparent 6deg 12deg)}
.arena .big{position:absolute;left:50%;top:50%;width:clamp(170px,24vw,290px);translate:-50% -50%;padding:0;border:0;background:none;cursor:inherit;transition:left .38s cubic-bezier(.3,1.7,.5,1),top .38s cubic-bezier(.3,1.7,.5,1);filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(8px 10px 0 rgba(13,13,13,.9))}
.arena .big:focus-visible{outline:4px solid var(--black);outline-offset:8px;border-radius:12px}
.arena .bsay{position:absolute;left:16px;top:16px;max-width:min(300px,70%);font-family:var(--marker);font-weight:400;font-size:22px;z-index:3}
.arena.shk{animation:shk .4s linear}
.bor .copy{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.bor .copy h2{font-size:clamp(42px,6vw,88px)}
.bor .lead{font-size:clamp(19px,1.8vw,24px);font-weight:500;max-width:520px}
.bor .score{display:flex;align-items:center;gap:16px;border:4px solid var(--black);border-radius:20px;padding:10px 20px;box-shadow:5px 5px 0 var(--black);background:var(--mist)}
.bor .score .mk{font-size:22px;line-height:1.1}
.bor .score b{font-family:var(--display);font-weight:400;font-size:52px;line-height:1;min-width:1.2ch;text-align:center;font-variant-numeric:tabular-nums}
.bor .fine2{font-weight:500}
.bor .cta-on{animation:shake 1.2s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.intro{display:none}.burst,.bori .bz,.hs .sp,.open.on i,.cta-on,.arena.shk{animation:none!important}.burst{scale:1}}

.trio{padding:80px max(16px,env(safe-area-inset-left,0px)) 96px;display:flex;flex-direction:column;gap:clamp(28px,5vw,64px);align-items:center;overflow:hidden;position:relative}
.trio .row{position:relative;width:100%;max-width:1200px;display:flex;align-items:center;gap:20px 40px;justify-content:space-between;flex-wrap:wrap;opacity:0;transform:translateX(var(--sx,-80px)) rotate(var(--rr,0deg));transition:opacity .5s,transform .7s cubic-bezier(.2,1.3,.4,1)}
.trio .row.in{opacity:1;transform:rotate(var(--rr,0deg))}
.trio .r1{--sx:-120px;--rr:-1.5deg}.trio .r2{--sx:120px;--rr:1.5deg;flex-direction:row}.trio .r3{--sx:-120px;--rr:-1deg}
.trio h2{font-size:clamp(58px,10.5vw,160px);flex:none}
@media (min-width:900px){.trio .row{flex-wrap:nowrap}.trio p{max-width:260px}}
.trio p{font-size:clamp(22px,2.6vw,36px);line-height:1.1;max-width:300px;background:var(--white);border:4px solid var(--black);box-shadow:5px 5px 0 var(--black);padding:10px 16px;transform:rotate(2deg)}
.trio .stk{width:clamp(180px,30vw,380px);filter:drop-shadow(10px 12px 0 var(--cyan));animation:float 6s ease-in-out infinite}
.trio .r2 .stk{width:clamp(130px,20vw,260px)}
.trio .gl{width:clamp(150px,22vw,280px);aspect-ratio:1;filter:none;font-family:var(--display);font-size:clamp(24px,3.4vw,44px)}
.trio .gl .star{width:100%;height:100%}
.trio .r1::before,.trio .r3::before{content:"";position:absolute;left:50%;width:100vw;margin-left:-50vw;top:8%;bottom:8%;background:var(--cyan);z-index:-1;transform:skewY(-2deg);border-top:4px solid var(--black);border-bottom:4px solid var(--black)}
.trio .r3::before{background:var(--mist)}
.trio .r1,.trio .r3{padding:0 clamp(8px,2vw,28px)}
.trio .big2{min-height:68px;font-size:22px;padding:0 40px}
@media (max-width:700px){.trio .row{justify-content:center;text-align:center}.trio p{transform:none}}
@media (prefers-reduced-motion:reduce){.trio .row{opacity:1;transform:rotate(var(--rr,0deg));transition:none}.trio .stk{animation:none}}

.bg{padding:88px 0 104px;background:var(--mist);border-top:4px solid var(--black);border-bottom:4px solid var(--black)}
.bg .wrap{display:flex;flex-direction:column;gap:44px}
.bg .shead h2{font-size:clamp(54px,9vw,128px)}
.bgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:30px 26px}
.bc{grid-column:span 3;position:relative;background:var(--white);border:5px solid var(--black);box-shadow:8px 8px 0 var(--black);padding:16px 16px 20px;display:flex;flex-direction:column;gap:10px;align-items:flex-start;transform:rotate(var(--r,0deg));transition:transform .25s cubic-bezier(.2,1.5,.4,1),box-shadow .25s}
.bc:nth-child(n+5){grid-column:span 4}
.bc:hover{transform:rotate(0deg) translateY(-8px);box-shadow:12px 14px 0 var(--black)}
.bc .ph{position:relative;width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}
.bc .blob{position:absolute;inset:6% 12%;background:var(--cyan);border:4px solid var(--black);border-radius:58% 42% 55% 45%/48% 56% 44% 52%;animation:morph 9s ease-in-out infinite}
.bc img{position:relative;width:88%;max-width:300px;filter:drop-shadow(6px 8px 0 rgba(13,13,13,.9));transition:transform .35s cubic-bezier(.2,1.5,.4,1)}
.bc:hover img{transform:scale(1.08) rotate(-4deg)}
.bc .pr{position:absolute;right:-6px;top:-6px;width:92px;aspect-ratio:1;font-family:var(--display);font-size:17px;transform:rotate(12deg)}
.bc h3{font-family:var(--display);font-weight:400;font-size:clamp(22px,2vw,28px);line-height:1;text-transform:uppercase}
.bc p{font-size:21px;line-height:1.1}
.bc .btn{margin-top:auto}
@media (max-width:1000px){.bc,.bc:nth-child(n+5){grid-column:span 6}}
@media (max-width:640px){.bc,.bc:nth-child(n+5){grid-column:span 12}.bc .ph{aspect-ratio:5/4}}
@media (prefers-reduced-motion:reduce){.bc .blob{animation:none}.bc,.bc img{transition:none}}

.stks{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:22px clamp(14px,3vw,40px);padding:48px max(16px,env(safe-area-inset-left,0px)) 24px;position:relative;z-index:3}
.sk{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--white);border:4px solid var(--black);box-shadow:6px 6px 0 var(--black);padding:14px 22px;transform:rotate(var(--r,0deg));transition:transform .25s cubic-bezier(.2,1.7,.4,1);cursor:default}
.sk:hover{transform:rotate(calc(var(--r,0deg) * -1.6)) scale(1.1)}
.sk b{font-family:var(--display);font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1}
.sk span{font-weight:700;font-size:15px}
.sk.s1{--r:-4deg;background:var(--cyan)}.sk.s3{--r:3deg}.sk.s4{--r:-2deg;background:var(--black);color:var(--cyan);box-shadow:6px 6px 0 var(--cyan)}
.sk.star{border:0;box-shadow:none;width:clamp(120px,13vw,160px);aspect-ratio:1;padding:0;font-family:var(--display);font-size:clamp(14px,1.5vw,18px);line-height:1.05}
.sk.s2{--r:8deg}.sk.s5{--r:-9deg}

/* Burgers v2: más pequeñas, entrada con impacto */
.bgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:34px 24px}
.bc,.bc:nth-child(n+5){grid-column:auto;flex:0 1 calc(25% - 18px);min-width:230px}
.bc img{width:74%;max-width:215px}
.bc .ph{aspect-ratio:1/.8}
.bc .blob{inset:8% 18%}
.bc .pr{width:78px;font-size:15px}
.bc h3{font-size:clamp(20px,1.7vw,25px)}
.bc .ring{position:absolute;left:50%;top:42%;width:140px;aspect-ratio:1;margin:-70px 0 0 -70px;border-radius:50%;border:7px solid var(--cyan);pointer-events:none;opacity:0;z-index:5}
.bc.pre{opacity:0}
.bc.go{animation:cardin .75s cubic-bezier(.2,1.1,.3,1) var(--d,0s) both}
.bc.go img{animation:stamp .7s cubic-bezier(.2,1.5,.35,1) calc(var(--d,0s) + .22s) both}
.bc.go .pr{animation:prpop .5s cubic-bezier(.2,1.9,.4,1) calc(var(--d,0s) + .6s) both}
.bc.go .ring{animation:ring .7s ease-out calc(var(--d,0s) + .42s) both}
.bc.go h3,.bc.go p,.bc.go .btn{animation:rise2 .5s ease-out calc(var(--d,0s) + .55s) both}
@keyframes cardin{0%{opacity:0;translate:0 -140px;scale:1.35;rotate:var(--tw,12deg)}55%{opacity:1;translate:0 0;scale:.94;rotate:0deg}75%{scale:1.04}100%{opacity:1;translate:0 0;scale:1;rotate:0deg}}
@keyframes stamp{0%{opacity:0;scale:2.8;rotate:-30deg;filter:blur(8px) drop-shadow(6px 8px 0 rgba(13,13,13,.9))}60%{opacity:1;scale:.9;rotate:4deg;filter:blur(0) drop-shadow(6px 8px 0 rgba(13,13,13,.9))}100%{opacity:1;scale:1;rotate:0deg;filter:blur(0) drop-shadow(6px 8px 0 rgba(13,13,13,.9))}}
@keyframes prpop{from{scale:0;rotate:-120deg}to{scale:1;rotate:0deg}}
@keyframes ring{0%{opacity:1;scale:.2}100%{opacity:0;scale:3.2}}
@keyframes rise2{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@media (max-width:640px){.bc,.bc:nth-child(n+5){flex-basis:100%}.bc img{max-width:190px}}
@media (prefers-reduced-motion:reduce){.bc.pre{opacity:1}.bc.go,.bc.go *{animation:none!important}}

.mesa{background:var(--white)}
.sg .bc,.sg .bc:nth-child(n+5){flex:0 1 calc(20% - 20px);min-width:210px}
.sg .bc h3{font-size:clamp(16px,1.35vw,20px);line-height:1.1;text-transform:none;font-family:var(--body);font-weight:700}
.sg .bc .ph{aspect-ratio:1/.72}
.sg .bc img{max-width:190px}
.sg .bc .btn{margin-top:auto}
.more-c{display:flex;justify-content:center}

/* Ajustes para Kid Knowledge (más ligera que la anterior) */
.btn{font-size:22px}.btn.sm{font-size:19px}.heroCta .btn.big,.big2{font-size:27px}
.bc .pr{font-size:20px}.bc h3{font-size:clamp(24px,2.1vw,30px)}.bc p.mk{font-size:25px}
.sg .bc h3{font-size:clamp(17px,1.4vw,21px)}
.ribbon{font-size:clamp(28px,5.6vw,80px)}
.pam{font-size:clamp(24px,3.4vw,44px)}
.open{font-size:14px}

/* ===== Páginas interiores ===== */
header nav a.l.on{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px;text-decoration-color:var(--cyan)}
.ph1{position:relative;overflow:hidden;background:var(--white);border-bottom:4px solid var(--black);padding:56px 0 64px}
.ph1::before{content:"";position:absolute;left:50%;top:50%;width:1500px;height:1500px;margin:-750px 0 0 -750px;background:repeating-conic-gradient(var(--cyan) 0 5deg,transparent 5deg 10deg);-webkit-mask-image:radial-gradient(circle,#000 0,#000 14%,transparent 48%);mask-image:radial-gradient(circle,#000 0,#000 14%,transparent 48%);animation:spin 80s linear infinite;opacity:.8}
.ph1 .wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px}
.ph1 h1{font-size:clamp(56px,10vw,150px)}
.ph1 .say{max-width:360px;font-family:var(--marker);font-weight:400;font-size:24px}
.chips{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hh));z-index:40;background:var(--white);border-bottom:4px solid var(--black)}
.chips .wrap{display:flex;gap:12px;padding-top:12px;padding-bottom:12px;overflow-x:auto}
.chips a{flex:none;font-family:var(--display);font-size:16px;line-height:1;border:3px solid var(--black);border-radius:999px;padding:12px 20px;background:var(--white);min-height:44px;display:flex;align-items:center}
.chips a:hover,.chips a.on{background:var(--cyan)}
.cat{padding:72px 0 24px;scroll-margin-top:140px}
.cat .wrap{display:flex;flex-direction:column;gap:36px}
.cat h2{font-size:clamp(44px,7vw,100px)}
.list{display:flex;flex-direction:column}
.list .row{display:flex;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:3px dotted var(--black);font-size:19px}
.list .row b{font-family:var(--display);font-weight:400;white-space:nowrap}
.panel{background:var(--white);border:5px solid var(--black);border-radius:34px;box-shadow:12px 12px 0 var(--black);padding:clamp(22px,4vw,48px);display:flex;flex-wrap:wrap;gap:32px 56px}
.panel .lst{flex:1 1 280px;min-width:0}
.panel h3{font-family:var(--marker);font-weight:400;font-size:36px;line-height:1;display:inline-block;transform:rotate(-2deg);margin-bottom:10px;background:var(--cyan);border:4px solid var(--black);padding:4px 14px}
.panel .fine{font-size:15px;padding-top:12px}
.note{font-weight:500;max-width:560px}
.cta-band{background:var(--cyan);border-top:4px solid var(--black);border-bottom:4px solid var(--black);padding:64px 0;text-align:center}
.cta-band .wrap{display:flex;flex-direction:column;align-items:center;gap:26px}
.cta-band h2{font-size:clamp(40px,7vw,100px)}
.cta-band .acts{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.cg .bc,.cg .bc:nth-child(n+5){flex:0 1 calc(25% - 18px)}
.cg .bc .d{font-size:14px;line-height:1.35;font-weight:500}.cg .bc .al{font-size:12px;line-height:1.3;opacity:.7}.cg .bc h3{font-size:clamp(18px,1.6vw,22px)}
.more{font-size:30px;margin:8px 0 12px}
.items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.it{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:3px dotted var(--black)}
.it .t{display:flex;flex-direction:column;gap:3px;min-width:0}.it b{font-size:18px;line-height:1.2}.it span{font-size:15px;line-height:1.35}.it em{font-style:normal;font-size:12px;opacity:.65}
.it i{font-style:normal;font-family:var(--display);white-space:nowrap}
.panel .row{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:3px dotted var(--black);font-size:17px}.panel .row b{font-family:var(--display);font-weight:400;white-space:nowrap}
.panel .row small{display:block;font-size:13px;font-weight:400;opacity:.75}
@media (max-width:1000px){.cg .bc,.cg .bc:nth-child(n+5){flex-basis:calc(50% - 12px)}.items{grid-template-columns:1fr}}
@media (max-width:640px){.cg .bc,.cg .bc:nth-child(n+5){flex-basis:100%}}
.ct{padding:72px 0 96px;background:var(--mist)}.ct .wrap{display:flex;flex-wrap:wrap;gap:40px;align-items:stretch}
.ct .box{flex:1 1 480px;min-width:0;border:5px solid var(--black);background:var(--white);box-shadow:12px 12px 0 var(--black);border-radius:34px;padding:clamp(22px,4vw,48px);display:flex;flex-direction:column;gap:22px}
.ct .info div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:13px 0;border-bottom:3px dotted var(--black);font-size:19px}.ct .info div:last-child{border-bottom:0}
.ct .phone{font-family:var(--display);font-size:clamp(36px,5.4vw,70px);line-height:1;user-select:all}.ct .acts{display:flex;flex-wrap:wrap;gap:14px}
.ct .soc{display:flex;gap:22px;font-weight:700}.ct .soc a{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--cyan);text-underline-offset:5px;min-height:44px;display:flex;align-items:center}
.mapw{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:24px}
.mapw iframe{width:100%;flex:1;min-height:360px;border:5px solid var(--black);box-shadow:10px 10px 0 var(--black);background:var(--white)}
.mapw .sun{font-family:var(--display);font-size:clamp(28px,3.6vw,48px);line-height:.98;text-transform:uppercase;transform:rotate(-2deg)}.mapw .sun em{font-style:normal;background:var(--black);color:var(--white);padding:0 .12em}
.nm{padding:80px 0}.nm .wrap{display:flex;flex-wrap:wrap;gap:44px 64px;align-items:center}
.arena.static{cursor:default;display:flex;align-items:center;justify-content:center}
.bigf{position:relative;width:clamp(170px,24vw,290px);filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(8px 10px 0 rgba(13,13,13,.9))}
.nm .copy{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:22px;align-items:flex-start}.nm .copy h2{font-size:clamp(40px,5.6vw,80px)}.nm .lead{font-size:clamp(19px,1.8vw,24px);font-weight:500;max-width:540px}
.three{padding:24px 0 88px}.three h2{font-size:clamp(44px,7vw,100px)}
.three .bc,.three .bc:nth-child(n+5){flex:0 1 calc(33.3% - 18px)}
.bc .glass{position:relative;width:60%;aspect-ratio:1;font-family:var(--display);font-size:22px}
@media (max-width:640px){.three .bc{flex-basis:100%}}

/* ===== Capa suave (v4): mismo concepto cómic pop, con menos peso =====
   Líneas más finas, sin sombras duras, títulos sin contorno, menos adornos y menos movimiento. */
:root{--line:2.5px;--rad:20px;--ink:#0D0D0D}
body{font-size:17px}
.wrap{max-width:1240px;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}

/* Títulos: negro liso, sin contorno ni sombra */
.out{color:var(--black);-webkit-text-stroke:0;text-shadow:none;line-height:.95;letter-spacing:0}
.shead h2,.bg .shead h2,.mesa .shead h2,.drink .shead h2{font-size:clamp(38px,5.2vw,68px)}
.shead{align-items:center}

/* Botones */
.btn,.btn.sm{border-width:var(--line);box-shadow:3px 3px 0 var(--black);font-size:19px;min-height:52px;padding:0 26px}
.btn.sm{font-size:17px;min-height:44px;padding:0 18px;box-shadow:2px 2px 0 var(--black)}
.btn:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--black)}
.btn.sm:hover{box-shadow:1px 1px 0 var(--black)}
.btn:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--black)}
.btn.k{box-shadow:none}
.btn.k:hover{box-shadow:none;transform:translateY(-1px)}
.heroCta .btn.big,.big2,.trio .big2{font-size:22px;min-height:58px;padding:0 34px}

/* Bocadillos */
.say{border-width:var(--line);box-shadow:none;border-radius:18px;padding:10px 16px}
.say::after{border-right-width:var(--line);border-bottom-width:var(--line);width:16px;height:16px;bottom:-10px}
.shead .say{font-size:20px!important;max-width:300px}

/* Barra */
header{border-bottom-width:2px}
.open{border-width:2px}
.open.big{box-shadow:none}

/* Portada */
.stage{height:clamp(480px,min(42vw,calc(100vh - 190px)),720px)}
.stage .dots,.burst,.pam,.tdot{display:none!important}
.stage .rays{opacity:.28;animation:none;top:58%}
.wm{color:var(--white);-webkit-text-stroke:clamp(2px,.28vw,4px) var(--black);text-shadow:4px 4px 0 var(--black);font-size:clamp(56px,10.5vw,190px);top:clamp(16px,2.6vw,40px)}
.tilt{top:40%;width:clamp(230px,30vw,520px);margin-left:calc(clamp(230px,30vw,520px) / -2)}
.tilt img{filter:drop-shadow(6px 8px 0 var(--cyan));animation:none}
.slam{animation:softin .6s cubic-bezier(.2,1,.3,1) .9s both}
@keyframes softin{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:none}}
.sat{filter:drop-shadow(4px 5px 0 var(--cyan))}
.sat img{animation:none;transform:rotate(var(--r,0deg))}
.sat:hover img{transform:rotate(var(--r,0deg)) scale(1.05)}
.sat.hide-s{display:none}
.sat{width:clamp(96px,13vw,190px)!important;top:30%!important}
.ribbon{font-size:clamp(24px,3.8vw,54px);bottom:7%;transform:translateX(-50%) rotate(-2deg);animation:ribbonS .45s ease-out 1.4s both}
@keyframes ribbonS{from{opacity:0;transform:translateX(-50%) rotate(-2deg) translateY(12px)}to{opacity:1;transform:translateX(-50%) rotate(-2deg)}}
.tag1{display:none}
.tilt .flyw{left:16%;top:-17%;width:26%;transform:rotate(-8deg);animation:softin .4s ease-out 1.6s both;pointer-events:none}
.tilt .flyw .bz{filter:drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff)}
.tilt .flyw .say{font-size:clamp(13px,1.2vw,16px);left:82%;bottom:70%}
.bori .bz{animation:none}
.heroCta{padding:20px 16px 64px}
.heroCta .where{flex-basis:100%;text-align:center;font-weight:500;font-size:16px;color:var(--soft)}

/* Tres categorías: tira tranquila en lugar de las bandas gigantes */
.cats{padding:8px 0 80px}
.cats .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cat3{display:flex;align-items:center;gap:18px;border:var(--line) solid var(--black);border-radius:var(--rad);padding:18px 22px;background:var(--white);transition:transform .2s,background .2s}
.cat3:hover{background:var(--mist);transform:translateY(-3px)}
.cat3 .pic{flex:none;width:96px;height:96px;display:flex;align-items:center;justify-content:center}
.cat3 .pic img{max-width:100%;max-height:100%;width:auto}
.cat3 .pic.fly{background:var(--cyan);border-radius:50%}
.cat3 .pic.fly img{width:56%;transform:rotate(18deg)}
.cat3 b{display:block;font-family:var(--display);font-weight:400;font-size:30px;line-height:1;text-transform:uppercase}
.cat3 small{display:block;font-size:15.5px;line-height:1.35;margin-top:6px;color:var(--soft)}
@media (max-width:900px){.cats .wrap{grid-template-columns:1fr;gap:12px}.cat3 .pic{width:76px;height:76px}.cat3 b{font-size:26px}}

/* Tarjetas de producto */
.bg{border:0;padding:80px 0 88px}
.bg .wrap,.mesa .wrap{gap:36px}
.mesa{padding:80px 0 88px}
.bgrid{gap:22px 20px}
.bc,.bc:nth-child(n+5){transform:none;border-width:var(--line);border-radius:var(--rad);box-shadow:none;padding:14px 16px 18px;flex:0 1 calc(25% - 15px)}
.bc:hover{transform:translateY(-4px);box-shadow:0 10px 0 -6px var(--black)}
.bc .blob{border:0;background:var(--mist);animation:none;border-radius:50%;inset:10% 20%}
.bg .bc .blob{background:#D9F1F5}
.bc img{filter:none;width:78%}
.bc:hover img{transform:scale(1.04)}
.bc .ring{display:none}
.bc .pr,.bc .pr.star{clip-path:none;background:var(--white);border:2px solid var(--black);border-radius:999px;width:auto;aspect-ratio:auto;padding:4px 10px;right:0;top:0;transform:none;font-family:var(--body);font-weight:700;font-size:14px;line-height:1.2;font-variant-numeric:tabular-nums}
.bc .pr.star::before{display:none}
.bc h3{font-size:clamp(21px,1.8vw,25px)}
.sg .bc,.sg .bc:nth-child(n+5){flex:0 1 calc(20% - 16px);min-width:200px}
.sg .bc h3{font-size:16px;line-height:1.25;font-weight:500}
.bc.go{animation:rise2 .5s ease-out var(--d,0s) both}
.bc.go img,.bc.go .pr,.bc.go h3,.bc.go p,.bc.go .btn{animation:none}
.more-c{margin-top:4px}

/* Para beber */
.drink{border:0}
.drink .wrap{padding-top:80px;padding-bottom:88px;gap:32px}
.bub,.drunk{display:none!important}
.menuB,.panel{border-width:var(--line);border-radius:24px;box-shadow:none}
.menuB h3,.panel h3{background:none;border:0;padding:0;transform:none;font-size:30px!important;margin-bottom:6px}
.menuB .row,.panel .row,.list .row,.it,.visit .info div,.ct .info div{border-bottom:1.5px dotted rgba(13,13,13,.55)}
.menuB .row b,.panel .row b,.list .row b,.it i{font-family:var(--body);font-weight:700;font-size:16px}

/* Mascota */
.bor{padding:88px 0}
.arena{border-width:var(--line);border-radius:24px;box-shadow:none;background:var(--mist);height:clamp(320px,34vw,420px)}
.arena::before{display:none}
.arena .big,.bigf{width:clamp(150px,18vw,220px);filter:drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff) drop-shadow(4px 6px 0 var(--cyan))}
.arena .bsay{font-size:19px}
.bor .copy h2,.nm .copy h2{font-size:clamp(34px,4.4vw,58px)}
.bor .lead,.nm .lead{font-size:clamp(17px,1.5vw,20px);font-weight:400}
.bor .score{border-width:2px;border-radius:16px;box-shadow:none;padding:8px 18px}
.bor .score b{font-size:38px}
.bor .score .mk{font-size:19px}
.bor .cta-on{animation:none}

/* Reseña */
.rev{padding:72px 0 88px}
.rev .pic{flex-basis:300px}
.rev .pic .im{filter:drop-shadow(5px 6px 0 var(--cyan));transform:rotate(-3deg);width:min(100%,300px)}
.rev .gb,.rev .gb.star{clip-path:none;background:var(--white);border:2px solid var(--black);border-radius:999px;width:auto;aspect-ratio:auto;padding:6px 14px;transform:rotate(4deg);font-family:var(--body);font-weight:700;font-size:14px;right:0;top:-6%}
.rev .gb.star::before{display:none}
.rev .bubble{border-width:var(--line);border-radius:28px;box-shadow:none;padding:clamp(22px,3.4vw,40px)}
.rev .bubble::after{border-left-width:var(--line);border-bottom-width:var(--line);width:30px;height:30px;left:-17px;bottom:48px}
.rev blockquote{font-size:clamp(22px,2.8vw,36px);line-height:1.15}
.rev .who{font-size:22px;margin-top:14px}

/* Visita */
.visit{border:0}
.visit>.halftone{display:none}
.visit .wrap{padding-top:80px;padding-bottom:88px}
.visit .box,.ct .box{border-width:var(--line);border-radius:24px;box-shadow:none}
.visit h2{font-size:clamp(36px,4.8vw,62px)}
.visit .phone,.ct .phone{font-size:clamp(32px,4vw,50px)}
.visit .sun,.mapw .sun{transform:none;font-size:clamp(26px,3.2vw,40px);line-height:1.05}
.shake{animation:none}
.mapw iframe{border-width:var(--line);border-radius:24px;box-shadow:none}

/* Pie */
footer{border-top:0}
footer .giant{text-shadow:none;color:var(--white);-webkit-text-stroke:clamp(2px,.3vw,4px) var(--black);font-size:clamp(70px,17vw,240px)}
footer .legal{border-top-width:1.5px}
footer .ph{border-width:1.5px}

/* Intro más corta y lisa */
.intro::before{display:none}
.intro .in-b{display:none}
.intro .out{color:var(--white);-webkit-text-stroke:clamp(2px,.3vw,4px) var(--black);text-shadow:4px 4px 0 var(--black)}
.intro{animation-delay:.6s}

/* Páginas interiores */
.ph1{border-bottom:0;background:var(--mist);padding:48px 0 52px}
.ph1::before{display:none}
.ph1 h1{font-size:clamp(44px,6.4vw,88px)}
.ph1 .say{font-size:20px}
.chips{border-bottom-width:2px}
.chips a{border-width:2px;font-size:17px;padding:10px 18px}
.cat{padding:60px 0 16px}
.cat h2,.three h2{font-size:clamp(34px,4.6vw,60px)}
.cat .wrap{gap:26px}
.cg .bc,.cg .bc:nth-child(n+5){flex:0 1 calc(25% - 15px)}
.three .bc,.three .bc:nth-child(n+5){flex:0 1 calc(33.3% - 14px)}
.three .bc .glass,.three .bc .glass.star{clip-path:none;background:none;width:auto;aspect-ratio:auto;font-size:26px}
.three .bc .glass.star::before{display:none}
.cta-band{border:0;padding:56px 0}
.cta-band h2{font-size:clamp(34px,4.8vw,62px)}
.it{padding:14px 0}

/* Extras fuera */
#cfly,.mini,.rain{display:none!important}
.pill .btn{box-shadow:3px 3px 0 var(--black)}

@media (max-width:1000px){.bc,.bc:nth-child(n+5),.cg .bc,.cg .bc:nth-child(n+5){flex-basis:calc(50% - 10px)}.sg .bc,.sg .bc:nth-child(n+5){flex-basis:calc(33.3% - 14px)}}
@media (max-width:640px){
  .wrap{padding-left:16px;padding-right:16px}
  .bc,.bc:nth-child(n+5),.cg .bc,.cg .bc:nth-child(n+5),.sg .bc,.sg .bc:nth-child(n+5),.three .bc,.three .bc:nth-child(n+5){flex-basis:calc(50% - 10px);min-width:0;padding:10px 12px 14px}
  .bgrid{gap:14px 12px}
  .bc h3{font-size:19px}.sg .bc h3{font-size:14.5px}
  .bc .btn.sm{font-size:15px;min-height:40px;padding:0 12px;white-space:normal}
  .bc .pr,.bc .pr.star{font-size:12.5px;padding:3px 8px}
  .stage{height:410px}
  .sat{top:27%!important;width:84px!important}
  .tilt{top:31%}
  .ribbon{bottom:5%}
  .rev .bubble::after{display:none}
}
@media (prefers-reduced-motion:reduce){.slam,.ribbon,.tilt .flyw,.bc.go{animation:none!important}}

/* Reservas (CoverManager) */
.resv{padding:80px 0 88px;background:var(--white);scroll-margin-top:var(--hh)}
.resv .wrap{display:flex;flex-direction:column;gap:28px;max-width:920px}
.resv .rhead{display:flex;flex-direction:column;gap:10px}
.resv h2{font-size:clamp(36px,4.8vw,62px)}
.resv .rhead p{font-size:18px;color:var(--soft);max-width:520px}
.rbox{border:var(--line) solid var(--black);border-radius:24px;overflow:hidden;background:var(--white);padding:clamp(8px,2vw,20px)}
.rbox iframe{display:block;width:100%;min-height:550px;border:0}
.rfall{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:clamp(16px,3vw,32px);background:var(--mist);border-radius:16px}
.rfall p{max-width:520px}
.rbox iframe[hidden],.rfall[hidden]{display:none}

/* ===== WordPress ===== */
.rnote{font-size:15px;color:var(--soft)}
.rnote a{text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--cyan);text-underline-offset:4px}
.admin-bar header{top:calc(32px + env(safe-area-inset-top,0px))}
.admin-bar .chips{top:calc(32px + env(safe-area-inset-top,0px) + var(--hh))}
@media (max-width:782px){.admin-bar header{top:calc(46px + env(safe-area-inset-top,0px))}.admin-bar .chips{top:calc(46px + env(safe-area-inset-top,0px) + var(--hh))}}
@media (max-width:600px){.admin-bar header{top:0}.admin-bar .chips{top:var(--hh)}}
header nav a.l.on{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px;text-decoration-color:var(--cyan)}
header .logo,header .custom-logo{height:46px;width:auto;max-width:none}
footer .logos img{max-width:260px;height:auto}
.prose{padding:56px 0 88px}
.prose .wrap{max-width:820px}
.prose h2{font-family:var(--display);font-weight:400;font-size:34px;line-height:1.1;margin:1.6em 0 .5em}
.prose h3{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.15;margin:1.4em 0 .4em}
.prose p,.prose ul,.prose ol{margin:0 0 1.1em}
.prose a:not(.btn){text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--cyan);text-underline-offset:4px}
.prose img{border-radius:var(--rad)}
.prose .items{margin-bottom:2em}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.screen-reader-text.skip:focus{position:fixed;left:12px;top:12px;width:auto;height:auto;clip:auto;z-index:400;background:var(--white);border:2px solid var(--black);padding:10px 14px}
.no-js .bc.pre{opacity:1}
.shead .say.mk{font-family:var(--marker);font-weight:400}
.bc .ph img{height:auto}