/* Snack Point — Fun Lab 2.0: diseño pop con fondos ilustrados, sin alterar lógica comercial */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700;12..96,800&display=swap');
:root{--fun-pink:#ff63aa;--fun-lime:#cfff72;--fun-yellow:#ffd567;--fun-orange:#ff986a;--fun-ink:#201322;--fun-plum:#2a1335}
html{scroll-padding-top:84px}
body{background:#fff1e0}
h1,h2,h3,.btn,.pill,.navlogo,.story-quote,.service-info h3,.priceplay h2,.rickytitle,.footer h3{font-family:'Bricolage Grotesque','Space Grotesk',sans-serif!important}
.nav{background:#201323f5!important;border-bottom:3px solid #ffce65!important;box-shadow:0 6px 0 #1d10251c}
.navlogo{transform:rotate(-2deg);font-weight:800!important;letter-spacing:-.055em}
.navlogo em{color:var(--fun-lime)!important}
.nav-cta,.btn-gold{background:var(--fun-yellow)!important;border:2.5px solid var(--fun-ink)!important;color:var(--fun-ink)!important;box-shadow:5px 6px 0 #ec4f80!important}
.nav-cta:hover,.btn-gold:hover{box-shadow:2px 3px 0 #ec4f80!important}
.btn{border-radius:22px 30px 25px 28px!important;font-size:14px;letter-spacing:-.02em;min-height:50px;transform:rotate(-1deg);transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.btn:hover{transform:translateY(-5px) rotate(1.5deg) scale(1.035)}
.btn:active{transform:translateY(2px) rotate(0deg) scale(.96)}
.btn-ghost{background:var(--fun-pink)!important;color:var(--fun-ink)!important;border:2.5px solid var(--fun-ink)!important;box-shadow:5px 6px 0 var(--fun-yellow)!important}
.hero{background:#24132c!important;min-height:735px;overflow:hidden}
.hero::before{background-image:linear-gradient(105deg,rgba(24,12,30,.91) 0%,rgba(34,16,44,.75) 54%,rgba(35,12,37,.62) 100%),url('/snack-party-pattern.svg')!important;background-repeat:no-repeat,repeat!important;background-size:cover,480px 480px!important;opacity:1!important;z-index:-3!important}
.hero::after{background:radial-gradient(circle at 86% 33%,#ff638044,transparent 32%),radial-gradient(circle at 25% 76%,#ecba3a25,transparent 27%)!important}
.hero-inner{position:relative;z-index:2}
.hero-copy{z-index:4}
.hero-tag{background:#ffd567;color:#231125!important;border:2px solid #231125!important;border-radius:12px 20px 15px 24px!important;transform:rotate(-3deg);box-shadow:5px 5px 0 #f16ca5;font-size:12px;letter-spacing:.05em;white-space:normal}
.hero h1{font-size:clamp(66px,9vw,132px)!important;line-height:.85!important;letter-spacing:-.09em!important;transform:rotate(-2deg);text-shadow:5px 7px 0 #130d1e,8px 10px 0 #fa6e9477}
.hero h1 i{color:var(--fun-lime)!important;filter:drop-shadow(0 0 13px #cdf87550)}
.hero-rotator strong{color:var(--fun-yellow)!important}
.hero-desc{font-weight:500;color:#f2e4e4!important}
.hero-shine{background:radial-gradient(circle,#ffba6240,transparent 69%)!important}
.hero-sticker{background:var(--fun-pink)!important;color:#221020!important;border:3px dashed #281329!important;box-shadow:6px 7px 0 #ffe085!important;animation:snack-wiggle 5s ease-in-out infinite}
.ricky-bubble{border:2.5px solid #231625!important;background:var(--fun-lime)!important;box-shadow:6px 7px 0 #f8b6da!important}
.hero-bottom{background:var(--fun-yellow)!important;border-top:3px solid #221124!important}
.hero-bottom marquee{font-size:15px;letter-spacing:.12em}
.fun-floaters{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.fun-floater{position:absolute;left:var(--x);top:var(--y);font-size:clamp(30px,5vw,68px);line-height:1;opacity:.9;filter:drop-shadow(4px 6px 0 #2a15257a);transform:rotate(var(--rot));animation:snack-float var(--speed,6s) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}
.fun-floater:nth-child(1){opacity:.72}.fun-floater:nth-child(3){opacity:.82}
.hero-copy .fun-stamp{display:inline-flex;margin:2px 0 17px;padding:9px 14px;background:var(--fun-lime);border:2px solid var(--fun-ink);border-radius:17px 9px 20px 10px;color:#231a21;font:800 12px 'Bricolage Grotesque';transform:rotate(2deg);box-shadow:4px 4px 0 var(--fun-pink)}
.story{background:var(--fun-lime)!important;border-block:4px solid #1c1830}
.story-button{border:3px solid #242020!important;background:#fff0ac!important;border-radius:18px 24px 14px 23px!important;box-shadow:4px 5px 0 #fd75aa;transition:transform .2s,box-shadow .2s}
.story-button:hover{transform:rotate(-3deg) translateY(-4px);box-shadow:7px 8px 0 #fd75aa}
.services,.gallery,.priceplay{position:relative;isolation:isolate;overflow:hidden}
.services{background:linear-gradient(155deg,#fff2e7 0%,#ffedf6 55%,#fff6e2 100%)!important}
.services::before,.gallery::before,.priceplay::before{content:'';pointer-events:none;position:absolute;inset:0;background:url('/snack-party-pattern.svg') repeat; background-size:470px 470px;opacity:.14;z-index:-1}
.services>.container,.gallery>.container,.priceplay>.rickywrap{position:relative;z-index:1}
.sectiontop h2{letter-spacing:-.07em}
.services .eyebrow,.gallery .eyebrow{display:inline-block;background:var(--fun-yellow);border:2px solid #24132b;border-radius:9px;padding:7px 12px;transform:rotate(-2deg)}
.filterline{gap:10px!important}
.filter{border:2px solid #251924!important;border-radius:13px 23px 16px 21px!important;background:#fffdf4;font-weight:800;box-shadow:3px 4px 0 #241924;transition:transform .2s}
.filter:hover,.filter.active{transform:rotate(-3deg) translateY(-2px);background:var(--fun-yellow)!important;color:#211725!important}
.service-card{border:2.5px solid #28162a!important;border-radius:21px 27px 18px 27px!important;box-shadow:5px 7px 0 #2a15325e!important;transform:rotate(-.5deg);transition:transform .23s,box-shadow .23s!important}
.service-card:nth-child(3n+2){transform:rotate(.8deg);box-shadow:5px 7px 0 #ec77a85e!important}
.service-card:hover{transform:translateY(-9px) rotate(1deg) scale(1.025)!important;box-shadow:8px 12px 0 #261329a6!important}
.service-label{background:#231426!important;color:#fff6a9!important;border:2px solid #fff8f0}
.card-foot button,.pricecard button,.labbtn,.game-tab,.pricetab,.rickyfloat{border:2px solid #291829!important;border-radius:16px 23px 17px 24px!important;box-shadow:4px 5px 0 #ff9b66!important;transition:transform .2s,box-shadow .2s!important}
.card-foot button:hover,.pricecard button:hover,.labbtn:hover,.pricetab:hover,.rickyfloat:hover{transform:translateY(-4px) rotate(-2deg)!important;box-shadow:6px 7px 0 #e7689c!important}
.arcade{background:#25152d!important}
.arcade::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 75% 15%,#ff678029,transparent 38%),url('/snack-party-pattern.svg') repeat;background-size:cover,530px;opacity:.22;z-index:-1}
.arcade .game-area{border:3px solid #f3c969!important;box-shadow:8px 10px 0 #e66f9a7a!important}
.rickylab{background:#26172e!important}
.rickylab::before{content:'';position:absolute;inset:0;background:url('/snack-party-pattern.svg') repeat;background-size:550px;opacity:.10;pointer-events:none}
.rickylab>.rickywrap{position:relative}
.labpanel{box-shadow:8px 10px 0 #ff73a38c;border:2px solid #f7d276;border-radius:24px;overflow:hidden}
.labchip{box-shadow:3px 4px 0 #5e2f60;border-radius:14px 24px 12px 21px!important}
.labchip[aria-pressed="true"]{background:var(--fun-lime)!important;color:#261429!important;transform:rotate(-2deg)}
.priceplay{background:#fff3e3!important}
.pricecard{border:2.5px solid #211328!important;border-radius:19px 25px 18px 28px!important;box-shadow:5px 7px 0 #f1a0c0!important}
.pricecard:nth-child(3n+2){box-shadow:5px 7px 0 #d2e87b!important}
.pricetab[aria-pressed="true"]{background:var(--fun-pink)!important;color:#201321!important}
.rickyfaq{background:#ffe5ee!important}
.rickyfloat{background:var(--fun-lime)!important;box-shadow:5px 6px 0 #ed77ae!important}
.footer{background:#211426!important}
.fun-quote{background:#ffd767;color:#201327;border:3px solid #271425;border-radius:12px 23px 12px 23px;padding:14px 20px;box-shadow:6px 8px 0 #f271a0;display:inline-block;transform:rotate(-2deg);font:800 clamp(18px,2.5vw,25px)/1.15 'Bricolage Grotesque'}
@keyframes snack-float{0%{transform:translate3d(0,0,0) rotate(var(--rot))}100%{transform:translate3d(10px,-20px,0) rotate(calc(var(--rot) + 10deg))}}
@keyframes snack-wiggle{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(-9deg) translateY(-5px)}}
@media(max-width:800px){.hero{min-height:700px}.hero::before{background-size:cover,350px 350px!important}.hero h1{font-size:clamp(60px,14vw,90px)!important}.fun-floater{font-size:35px}.fun-floater:nth-child(n+6){display:none}.service-card{transform:none}.hero-copy .fun-stamp{font-size:10px}}
@media(max-width:560px){.hero-inner{padding-top:52px!important}.hero h1{font-size:clamp(53px,15vw,78px)!important}.hero-tag{font-size:10px}.hero-desc{font-size:14px}.hero-actions{gap:12px}.hero-actions .btn{padding:13px 15px;min-height:50px;font-size:12px;white-space:normal;text-align:center}.fun-floater{opacity:.5}.fun-floater:nth-child(n+4){display:none}.services::before,.gallery::before{background-size:320px}.service-card{box-shadow:3px 5px 0 #29142670!important}.nav-cta{font-size:10px}}
@media(prefers-reduced-motion:reduce){.fun-floater,.hero-sticker{animation:none!important} .service-card,.btn,.filter,.card-foot button,.story-button{transition:none!important}html{scroll-behavior:auto}}

/* The original Fun Lab theme, adapted to the current header and host stage. */
.nav .snack-brand { transform: none; }
.nav .ricky-map-open {
  background: var(--fun-lime);
  color: var(--fun-ink);
  border: 2px solid var(--fun-ink);
  border-radius: 15px 20px 17px 21px;
  box-shadow: 3px 4px 0 var(--fun-pink);
}
.nav .nav-cta .count { background: #ff805f; color: var(--fun-ink); }
.hero .hero-actions { gap: 14px; }
.hero .hero-copy { min-width: 0; }
.hero .hero-proof { line-height: 1.35; }
.hero .hero-sticker { z-index: 3; }
.hero .stage .ricky-bubble { z-index: 4; }
.hero a:focus-visible, .nav button:focus-visible {
  outline: 3px solid var(--fun-lime);
  outline-offset: 5px;
}
@media (min-width: 651px) and (max-width: 900px) {
  .hero h1 { font-size: clamp(56px, 10vw, 90px) !important; }
}
@media (max-width: 650px) {
  html { scroll-padding-top: 75px; }
  .nav .navinner { gap: 9px; }
  .nav .nav-cta { font-size: 11px; padding-inline: 8px; white-space: nowrap; }
  .nav .ricky-map-open { padding-inline: 7px; }
  .hero .hero-inner { padding-top: 30px !important; gap: 12px; }
  .hero .hero-actions .btn { flex: 1 1 auto; }
  .hero .stage .ricky-bubble { top: 0; }
  .hero .stage .hero-sticker { top: 5%; }
}
@media (max-width: 370px) {
  .nav .navinner { width: calc(100% - 24px); gap: 6px; }
  .nav .snack-brand { flex-basis: 104px; }
  .nav .nav-cta { gap: 3px; padding-inline: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero .stage-circle, .hero .stage-circle::after { animation: none !important; }
}
@media (min-width: 901px) {
  .hero h1 { font-size: clamp(66px, 8vw, 112px) !important; }
}
