:root{--pink:#F4B9C9;--pink-d:#E0879F;--rose:#C9506F;--cream:#FFF6EC;--cocoa:#4A2B20;--cocoa2:#6B3A28;--caramel:#C98A4B;--coral:#D9603B;--line:rgba(74,43,32,.18);--mut:#85685a;
--head:"Bricolage Grotesque",system-ui,sans-serif;--script:"Yellowtail",cursive}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
html,body,main{overflow-x:clip}
body{background:var(--cream);color:var(--cocoa);font:400 17px/1.65 var(--head);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
ul{padding:0;list-style:none}
em{font-family:var(--script);font-style:normal;font-weight:400;color:var(--rose);font-size:1.12em}
.wrap{width:min(1180px,100% - 56px);margin-inline:auto}
h1,h2,h3{font-weight:800;line-height:1.02;letter-spacing:-.02em}
h2{font-size:clamp(34px,4.8vw,64px)}
::selection{background:var(--pink);color:var(--cocoa)}
.top{background:var(--cocoa);color:#f2d6c4;font:600 11px/1 var(--head);letter-spacing:.14em;text-transform:uppercase;text-align:center;padding:10px 16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#hd{position:sticky;top:0;z-index:60;height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 36px;background:rgba(255,246,236,.9);backdrop-filter:blur(12px);border-bottom:2px solid transparent;transition:.3s}
#hd.solid{border-color:var(--cocoa);height:68px}
.brand{display:flex;align-items:center;gap:10px;font:800 24px var(--head);letter-spacing:-.02em}
.brand svg{width:38px;height:38px;animation:roll 14s linear infinite}
@keyframes roll{to{transform:rotate(360deg)}}
.brand em{font-size:1.25em}
#nav{display:flex;gap:30px}
#nav a{font:700 14px var(--head);position:relative;padding:6px 0}
#nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:3px;background:var(--pink-d);border-radius:3px;transition:right .3s}
#nav a:hover::after{right:0}
.hd-r{display:flex;align-items:center;gap:16px}
.open{display:inline-flex;align-items:center;gap:8px;font:700 12px var(--head);padding:6px 13px;border-radius:99px;background:#fff;border:2px solid var(--cocoa);white-space:nowrap}
.open i{width:9px;height:9px;border-radius:50%;background:#2e9e5b;animation:pl 2s infinite}.open.off i{background:var(--coral);animation:none}
@keyframes pl{70%{box-shadow:0 0 0 7px rgba(46,158,91,0)}0%{box-shadow:0 0 0 0 rgba(46,158,91,.6)}}
.lang{display:flex;align-items:center;gap:6px;font:800 12px var(--head);color:var(--mut)}.lang i{font-style:normal;opacity:.4}
.lang button{padding:3px 2px;color:var(--mut)}.lang button.on{color:var(--cocoa);border-bottom:3px solid var(--pink-d)}
.burger{display:none;width:42px;height:42px;position:relative}
.burger i{position:absolute;left:9px;right:9px;height:3px;border-radius:3px;background:var(--cocoa);transition:.3s}
.burger i:nth-child(1){top:15px}.burger i:nth-child(2){top:24px}
.burger.on i:nth-child(1){top:19px;transform:rotate(45deg)}.burger.on i:nth-child(2){top:19px;transform:rotate(-45deg)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 30px;border-radius:99px;font:800 15px var(--head);border:2.5px solid var(--cocoa);transition:transform .25s,box-shadow .25s,background .25s;box-shadow:4px 4px 0 var(--cocoa)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--cocoa)}
.btn.pink{background:var(--pink);color:var(--cocoa)}.btn.line{background:#fff;color:var(--cocoa)}.btn.full{width:100%}
.eyebrow{font:800 12px var(--head);letter-spacing:.2em;text-transform:uppercase;color:var(--rose);margin-bottom:14px}
.eyebrow.light{color:var(--pink)}
.sh{margin-bottom:44px;max-width:720px}.sh .sub{margin-top:14px;color:var(--mut);font-size:18px}

/* hero */
.hero{position:relative;background:var(--pink);overflow:hidden;padding:60px 0 90px;border-bottom:3px solid var(--cocoa)}
.blob{position:absolute;border-radius:50%;pointer-events:none}
.b1{width:560px;height:560px;background:#F9CFDA;right:-120px;top:-140px}.b2{width:380px;height:380px;background:#EFA5BA;left:-120px;bottom:-160px}
.ck{position:absolute;pointer-events:none;animation:flt 7s ease-in-out infinite}
.c1{width:84px;left:46%;top:52px;transform:rotate(-14deg)}.c2{width:56px;left:6%;bottom:60px;animation-delay:-3s}
@keyframes flt{50%{transform:translateY(-14px) rotate(8deg)}}
.hero-in{position:relative;z-index:2;width:min(1180px,100% - 56px);margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.kick{font:800 12px var(--head);letter-spacing:.2em;text-transform:uppercase;color:var(--cocoa);margin-bottom:22px;animation:fade 1s .1s both}
.hero h1{font-size:clamp(46px,7.4vw,112px);line-height:.94}
.hero h1 .ln{display:block;overflow:hidden;padding:.04em 0 .16em}
.hero h1 .ln>*{display:inline-block;animation:up 1.2s cubic-bezier(.2,.8,.2,1) both}.hero h1 .ln:nth-child(2)>*{animation-delay:.15s}
.hero h1 em{color:var(--rose);font-size:1.18em;line-height:.8}
@keyframes up{from{transform:translateY(112%)}to{transform:none}}@keyframes fade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.lead{font-size:clamp(17px,1.5vw,20px);max-width:500px;margin:20px 0 32px;animation:fade 1s .5s both}
.cta{display:flex;gap:14px;flex-wrap:wrap}.hero .cta{animation:fade 1s .7s both}
.stickers{margin-top:34px}
.stk{display:inline-block;background:var(--cream);border:2.5px solid var(--cocoa);border-radius:99px;padding:8px 18px;font:800 13px var(--head);transform:rotate(-3deg);box-shadow:3px 3px 0 var(--cocoa)}
.hero-art{position:relative;height:560px;animation:fade 1.3s .4s both}
.pic{position:absolute;overflow:hidden;border:3px solid var(--cocoa);background:var(--cream);box-shadow:6px 6px 0 var(--cocoa)}
.pic img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.p1{left:0;top:40px;width:56%;height:66%;border-radius:200px 200px 28px 28px;transform:rotate(-3deg)}
.p2{right:0;top:0;width:42%;height:46%;border-radius:28px 100px 28px 28px;transform:rotate(4deg)}
.p3{right:6%;bottom:0;width:48%;height:40%;border-radius:100px 28px 28px 28px;transform:rotate(-2deg)}
.round{position:absolute;left:34%;bottom:6%;width:128px;height:128px;border-radius:50%;background:var(--cocoa);color:var(--pink);display:grid;place-items:center;animation:roll 18s linear infinite}
.round svg{position:absolute;inset:0;width:100%;height:100%}.round text{font:800 10.4px var(--head);letter-spacing:.14em;fill:var(--pink)}.round b{font-size:28px;animation:roll 18s linear infinite reverse}
.ticker{background:var(--cocoa);color:var(--pink);overflow:hidden;white-space:nowrap;padding:14px 0}
.tk{display:inline-flex;animation:tk 34s linear infinite}
.tk span{font:800 22px var(--head);padding:0 22px;position:relative}.tk span::after{content:"✦";position:absolute;right:-8px;font-size:14px;color:var(--caramel)}
@keyframes tk{to{transform:translateX(-50%)}}

/* carta */
.carta{padding:100px 0;background:var(--cream)}
.fbar{display:flex;flex-direction:column;gap:12px;padding:16px 20px 18px;background:#fff;border:2.5px solid var(--cocoa);border-radius:22px;box-shadow:5px 5px 0 var(--cocoa);margin-bottom:44px;position:sticky;top:76px;z-index:30}
.fl{display:inline-flex;align-items:center;gap:8px;font:800 12px var(--head);letter-spacing:.16em;text-transform:uppercase;color:var(--rose)}.fl svg{width:17px;height:17px}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tabs button{padding:9px 20px;border:2.5px solid var(--cocoa);border-radius:99px;font:800 14px var(--head);transition:.2s;background:#fff}
.tabs button small{margin-left:6px;color:var(--mut);font-size:12px}.tabs button:hover{background:var(--pink)}
.tabs button.on{background:var(--cocoa);color:var(--cream)}.tabs button.on small{color:var(--pink)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.item{background:#fff;border:2.5px solid var(--cocoa);border-radius:26px;overflow:hidden;display:flex;flex-direction:column;box-shadow:5px 5px 0 var(--cocoa);opacity:0;transform:translateY(22px);animation:in .6s cubic-bezier(.2,.7,.2,1) forwards;transition:transform .25s,box-shadow .25s}
.item:hover{transform:translate(-3px,-3px)!important;box-shadow:8px 8px 0 var(--cocoa)}
@keyframes in{to{opacity:1;transform:none}}
.item .ph{aspect-ratio:4/3;overflow:hidden;background:var(--pink);position:relative;border-bottom:2.5px solid var(--cocoa)}
.item .ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);transition:transform .8s}
.item:hover .ph img{transform:scale(1.14)}
.item .ph.noimg{display:grid;place-items:center;font-size:64px}
.item .tag{position:absolute;left:12px;top:12px;background:var(--coral);color:#fff;font:800 11px var(--head);letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:99px;border:2px solid var(--cocoa)}
.item .bd{padding:20px 22px 24px}.item h3{font-size:26px;margin-bottom:6px}.item p{color:var(--mut);font-size:15.5px;line-height:1.5}

/* cookie builder */
.cookie{padding:100px 0;background:var(--cocoa);color:var(--cream);position:relative}
.cookie h2{color:#fff}.cookie-in{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}
.cookie p{color:#ead3c6;margin-top:16px;max-width:440px}
.builder{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;background:var(--cream);color:var(--cocoa);border:3px solid var(--pink);border-radius:30px;overflow:hidden;box-shadow:8px 8px 0 var(--pink-d)}
.bv{background:var(--pink);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;border-right:3px solid var(--cocoa)}
#bk{width:100%;max-width:230px;filter:drop-shadow(0 12px 0 rgba(74,43,32,.2));animation:flt 6s ease-in-out infinite}
.bname{font:800 20px/1.2 var(--head);text-align:center;margin-top:14px;min-height:50px}
.bc{padding:26px 26px 24px;display:grid;gap:16px}
.grp label{display:block;font:800 12px var(--head);letter-spacing:.16em;text-transform:uppercase;color:var(--rose);margin-bottom:8px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts button{padding:8px 15px;border:2px solid var(--cocoa);border-radius:99px;font:700 14px var(--head);background:#fff;transition:.2s}
.opts button:hover{background:var(--pink)}.opts button.on{background:var(--cocoa);color:var(--cream)}
.bc small,.tform small{display:block;text-align:center;color:#2e8f5f;font-weight:700;font-size:13px}

/* about */
.about{padding:110px 0;background:var(--cream);position:relative}
.about-in{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:center}
.about-img{position:relative}
.about-img img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:36px;border:3px solid var(--cocoa);box-shadow:8px 8px 0 var(--pink-d)}
.note{position:absolute;right:-22px;bottom:-22px;width:150px;height:150px;border-radius:50%;background:var(--coral);color:#fff;border:3px solid var(--cocoa);display:grid;place-content:center;text-align:center;transform:rotate(-8deg);padding:12px}
.note b{font:800 46px/1 var(--head)}.note span{font:700 12px/1.25 var(--head)}
.about p{margin-top:16px;color:var(--cocoa2);max-width:540px}
.ticks{margin-top:22px;display:grid;gap:0}.ticks li{padding:12px 0 12px 34px;border-bottom:2px dashed var(--line);position:relative;font-weight:600}
.ticks li::before{content:"✦";position:absolute;left:4px;color:var(--rose)}

/* tartas */
.tartas{padding:100px 0;background:var(--pink);border-block:3px solid var(--cocoa)}
.tartas-in{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.tartas p{margin-top:16px;max-width:480px}
.tq{margin-top:30px;width:100%;max-width:420px;border-radius:26px;border:3px solid var(--cocoa);box-shadow:6px 6px 0 var(--cocoa);transform:rotate(-2deg)}
.tform{background:var(--cream);border:3px solid var(--cocoa);border-radius:30px;padding:32px;display:grid;gap:16px;box-shadow:8px 8px 0 var(--cocoa)}
label span{display:block;font:800 12px var(--head);letter-spacing:.14em;text-transform:uppercase;color:var(--rose);margin-bottom:6px}
input,select{width:100%;background:#fff;border:2.5px solid var(--cocoa);border-radius:14px;padding:12px 14px;font:600 16px var(--head);color:var(--cocoa);outline:0}
input:focus,select:focus{border-color:var(--rose)}
.rng{display:flex;align-items:center;gap:14px}.rng input{padding:0;height:8px;accent-color:var(--rose);border:0}.rng output{min-width:36px;font:800 22px var(--head)}
.msg{background:#fff;border:2px dashed var(--pink-d);border-radius:14px;padding:12px 14px;font-size:14.5px;color:var(--cocoa2);line-height:1.5}

/* agenda */
.agenda{padding:100px 0;background:var(--cocoa);color:var(--cream)}
.agenda h2{color:#fff}.fairs{display:grid;gap:16px}
.fair{display:grid;grid-template-columns:150px 1fr auto;gap:28px;align-items:center;padding:24px 28px;background:#5a362a;border:3px solid var(--pink);border-radius:26px}
.fair .dt{font:800 15px var(--head);color:var(--pink);text-transform:uppercase;letter-spacing:.08em}.fair .dt b{display:block;font-size:46px;line-height:1;color:#fff;letter-spacing:-.02em}
.fair h3{font-size:clamp(22px,2.6vw,34px);color:#fff}.fair p{color:#e5cdbf;font-size:16px;margin-top:4px}
.st{padding:7px 16px;border-radius:99px;font:800 12px var(--head);letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--cream)}
.st.now{background:var(--coral);border-color:var(--coral);color:#fff}.st.soon{background:var(--pink);color:var(--cocoa);border-color:var(--pink)}.st.past{opacity:.55}
.fair.past{opacity:.6}

/* visit */
.visit{padding:100px 0;background:var(--cream)}
.visit-in{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.hours{border:3px solid var(--cocoa);border-radius:24px;overflow:hidden;margin:22px 0 18px;background:#fff;box-shadow:5px 5px 0 var(--cocoa)}
.hours div{display:flex;justify-content:space-between;gap:12px;padding:14px 22px;border-bottom:2px dashed var(--line);font-size:16.5px}.hours div:last-child{border:0}
.hours div.now{background:var(--pink)}.hours b{font-weight:800}
.addr{margin-bottom:24px;font-weight:700}.addr a{border-bottom:3px solid var(--pink-d)}
.shop{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.shop img{width:100%;height:100%;object-fit:cover;border:3px solid var(--cocoa);border-radius:24px;box-shadow:5px 5px 0 var(--pink-d)}
.shop img:nth-child(1){aspect-ratio:1/1.1}.shop img:nth-child(2){aspect-ratio:1/1.1;margin-top:34px}.shop img:nth-child(3){grid-column:1/3;aspect-ratio:2/1}
footer{background:var(--cocoa);color:#d9bfae;text-align:center;padding:44px 20px 52px;font-size:15px}
footer b{color:#fff;font-size:20px}footer em{color:var(--pink)}footer .fine{font-size:12.5px;margin-top:6px;opacity:.7}
.fab{position:fixed;right:20px;bottom:20px;z-index:40;width:56px;height:56px;border-radius:50%;background:var(--pink);color:var(--cocoa);border:3px solid var(--cocoa);display:grid;place-items:center;box-shadow:4px 4px 0 var(--cocoa);transform:scale(0);transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.fab.show{transform:scale(1)}.fab svg{width:26px;height:26px}
.js .rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}.js .rv.in{opacity:1;transform:none}
[hidden]{display:none!important}

@media (max-width:1000px){
 #hd{padding:0 18px}
 #nav{position:fixed;top:0;right:0;bottom:0;width:min(300px,84%);background:var(--cream);flex-direction:column;gap:0;padding:96px 28px 28px;transform:translateX(102%);transition:transform .4s;border-left:3px solid var(--cocoa);z-index:59}
 #nav.on{transform:none}#nav a{padding:15px 0;font-size:18px;border-bottom:2px dashed var(--line)}
 .burger{display:block;z-index:61}.open b{display:none}
 .hero-in,.cookie-in,.about-in,.tartas-in,.visit-in{grid-template-columns:1fr;gap:50px}
 .hero-art{height:460px;max-width:480px;margin:0 auto;width:100%}
 .grid{grid-template-columns:repeat(2,1fr)}
 .builder{grid-template-columns:1fr}.bv{border-right:0;border-bottom:3px solid var(--cocoa)}
 .about-img{max-width:440px}.fair{grid-template-columns:110px 1fr}.fair .st{grid-column:1/-1;justify-self:start}
}
@media (max-width:640px){
 body{font-size:16px}.wrap,.hero-in{width:calc(100% - 36px)}
 .top{font-size:9px;letter-spacing:.08em}
 .hero{padding:36px 0 64px}.hero h1{font-size:clamp(42px,13vw,58px)}
 .hero-art{height:380px}.round{width:96px;height:96px}.round text{font-size:9px}
 .cta .btn{flex:1 1 100%}
 .carta,.cookie,.about,.tartas,.agenda,.visit{padding:72px 0}
 .fbar{top:68px;padding:12px 14px 14px}.tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-14px;padding-inline:14px}.tabs::-webkit-scrollbar{display:none}.tabs button{white-space:nowrap}
 .grid{grid-template-columns:1fr}.item h3{font-size:23px}
 .tform{padding:22px 18px}.note{right:-6px;width:116px;height:116px}.note b{font-size:36px}
 .fair{grid-template-columns:1fr;gap:10px;padding:20px}.fair .dt b{display:inline;font-size:34px;margin-right:8px}
 .shop img:nth-child(2){margin-top:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important}.js .rv,.item{opacity:1;transform:none}}

.bname{color:var(--cocoa)}
.hero h1 em{font-size:1.05em;line-height:.9;display:inline-block}
.round text{font-size:9.6px;letter-spacing:.06em}
.cookie .bname{color:var(--cocoa)}
.item .ph.noimg{aspect-ratio:16/6}
.item .ph.noimg{font-size:54px}
@media (max-width:640px){.c1{display:none}.item .ph.noimg{aspect-ratio:16/5}}
