/* Umê Izakaya · vinho, creme e vermelho; Barlow Condensed nos títulos, Gantari no texto, Zen Maru no japonês */
@font-face{font-family:Barlow;src:url(../fonts/barlow-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Barlow;src:url(../fonts/barlow-800.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:Gantari;src:url(../fonts/gantari.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --vinho:#640120;--vinho-2:#4B0018;--vinho-3:#7A1530;--vermelho:#F53822;--creme:#EFDBB2;--creme-2:#F7ECD6;--tinta:#141414;--cinza:#EFEFEF;--rosa:#E2A3B3;
  --t:Barlow,"Arial Narrow",sans-serif;--f:Gantari,system-ui,sans-serif;--jp:"Zen Maru","Hiragino Maru Gothic ProN",sans-serif;
  --cx:1240px;--gut:clamp(18px,4.5vw,56px);--topo:78px;--sec:clamp(84px,10vw,150px);
  --mola:cubic-bezier(.34,1.56,.64,1);--ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--topo)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.luz::before{opacity:0}.luz::after{opacity:1}}
body{margin:0;font-family:var(--f);font-size:17.5px;line-height:1.6;color:var(--tinta);background:var(--creme-2);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--t);font-weight:800;text-transform:uppercase;line-height:.92;letter-spacing:-.005em;margin:0;text-wrap:balance}
h2{font-size:clamp(46px,6vw,92px)}
h3{font-size:clamp(28px,2.6vw,38px)}
p{margin:0 0 1em}
.jp{font-family:var(--jp);font-weight:700;color:var(--vermelho);letter-spacing:.04em;margin:0 0 10px;font-size:clamp(20px,2vw,28px)}
:focus-visible{outline:3px solid var(--vermelho);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:12px;top:-60px;background:var(--vinho);color:#fff;padding:10px 16px;z-index:99}
.pular:focus{top:12px}
.cx{max-width:calc(var(--cx) + var(--gut)*2);margin:0 auto;padding:0 var(--gut)}
.ic{width:1.1em;height:1.1em;flex:none}

/* botões com cara de adesivo: borda grossa e sombra que afunda no clique */
.btn{--b:var(--vinho);--c:#fff;--s:var(--tinta);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 28px;font:800 20px/1 var(--t);text-transform:uppercase;letter-spacing:.02em;color:var(--c);background:var(--b);border:3px solid var(--tinta);border-radius:16px;box-shadow:0 5px 0 var(--s);text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px) rotate(-1deg);box-shadow:0 7px 0 var(--s)}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--s)}
.btn-vermelho{--b:var(--vermelho)}
.btn-creme{--b:var(--creme);--c:var(--vinho)}
.btn-vinho{--b:var(--vinho)}
.acoes{display:flex;flex-wrap:wrap;gap:14px}

/* topo */
.topo{position:sticky;top:0;z-index:50;background:var(--vinho);border-bottom:3px solid var(--tinta)}
.topo-cx{display:flex;align-items:center;gap:28px;height:var(--topo)}
.marca{margin-right:auto;display:block;transition:transform .3s var(--mola)}
.marca:hover{transform:rotate(-4deg) scale(1.04)}
.marca img{height:52px;width:auto}
.menu{display:flex;align-items:center;gap:26px}
.menu ul{display:flex;gap:24px;list-style:none;margin:0;padding:0}
.menu a:not(.btn){font:800 21px/1 var(--t);text-transform:uppercase;color:var(--creme);text-decoration:none;letter-spacing:.03em;display:inline-block;transition:transform .2s var(--mola),color .2s}
.menu a:not(.btn):hover,.menu a[aria-current]{color:#fff;transform:translateY(-2px) rotate(-3deg)}
.menu a[aria-current]{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
.topo-status{font:700 15px var(--f);color:var(--creme);opacity:.85}
.topo .btn{min-height:44px;font-size:17px;padding:0 18px;border-width:2px;box-shadow:0 3px 0 var(--tinta)}
.abre-menu{display:none;width:46px;height:46px;background:none;border:0;color:var(--creme);cursor:pointer}
.hamb,.hamb::before,.hamb::after{display:block;width:26px;height:3px;border-radius:3px;background:currentColor;position:relative;margin:auto;transition:transform .25s,background .25s}
.hamb::before,.hamb::after{content:"";position:absolute;left:0}
.hamb::before{top:-8px}.hamb::after{top:8px}
.menu-aberto .hamb{background:transparent}
.menu-aberto .hamb::before{transform:translateY(8px) rotate(45deg)}
.menu-aberto .hamb::after{transform:translateY(-8px) rotate(-45deg)}

/* adesivos arrastáveis */
.adesivo{position:absolute;width:var(--w,140px);height:auto;transform:translate(var(--dx,0px),var(--dy,0px)) rotate(var(--giro,0deg)) scale(var(--esc,1));filter:drop-shadow(0 8px 10px rgba(20,20,20,.25));cursor:grab;touch-action:none;user-select:none;-webkit-user-drag:none;transition:transform .45s var(--mola),filter .3s;z-index:5}
.adesivo:hover{--esc:1.06}
.adesivo.pegando{cursor:grabbing;transition:filter .2s;--esc:1.14;filter:drop-shadow(0 22px 22px rgba(20,20,20,.3));z-index:30}
.js .adesivo:not(.visto){opacity:0;--esc:.3}
.js .adesivo.visto{animation:cola .7s var(--mola)}
@keyframes cola{from{opacity:0;scale:.3}to{opacity:1;scale:1}}

/* Umêzinho */
.umezinho{position:relative;display:block;padding:0;border:0;background:none;cursor:pointer;width:var(--w,320px);aspect-ratio:720/615;transform:rotate(var(--inc,0deg));transition:transform .5s var(--mola);-webkit-tap-highlight-color:transparent}
.umezinho img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .12s}
.umezinho img.on{opacity:1}
.umezinho img,.umezinho .balao{pointer-events:none}
.umezinho{animation:pula 3.6s var(--ease) infinite}
@keyframes pula{0%,62%,100%{translate:0 0;scale:1 1}70%{translate:0 3%;scale:1.06 .92}78%{translate:0 -14%;scale:.95 1.06}86%{translate:0 0;scale:1.05 .95}93%{scale:.99 1.01}}
.umezinho.brinda{animation:brinda .7s var(--mola)}
@keyframes brinda{0%{scale:1}30%{scale:1.15 .85}60%{scale:.9 1.12;translate:0 -10%}100%{scale:1;translate:0 0}}
.balao{position:absolute;top:-14%;right:-26%;padding:10px 16px 12px;background:#fff;color:var(--vinho);font:700 clamp(18px,2vw,26px)/1 var(--jp);border:3px solid var(--tinta);border-radius:20px 20px 20px 4px;white-space:nowrap;opacity:0;transform:translateY(10px) scale(.6) rotate(-6deg);transform-origin:0 100%;transition:opacity .2s,transform .5s var(--mola)}
.umezinho.fala .balao{opacity:1;transform:rotate(-6deg)}
.flor-voa{position:fixed;z-index:60;width:34px;pointer-events:none;will-change:transform,opacity}

/* hero: as palavras empilhadas como nos stories, o Umêzinho no meio */
.hero{position:relative;min-height:calc(100svh - var(--topo));background:radial-gradient(ellipse 60% 55% at 50% 46%,#8A0A2C 0,transparent 70%),var(--vinho);overflow:hidden;isolation:isolate;display:grid;grid-template-rows:1fr auto;padding:clamp(20px,3vw,40px) 0 clamp(26px,4vw,46px)}
.hero-placa,.hero-placa[data-acende]{position:absolute;inset:0;z-index:-4;margin:0;transform-origin:50% 40%;animation:respira 24s ease-in-out infinite alternate}
.hero-placa img{width:100%;height:100%;object-fit:cover;object-position:50% 36%}
@keyframes respira{from{transform:scale(1) translate(0,0)}to{transform:scale(1.09) translate(-1.5%,1%)}}
.hero-veu{position:absolute;inset:0;z-index:-3;background:linear-gradient(rgba(100,1,32,.55),rgba(100,1,32,.35) 40%,rgba(100,1,32,.8))}
@media (min-width:1001px){
  .hero-placa[data-acende]{left:auto;right:0;width:min(40%,620px);-webkit-mask:linear-gradient(90deg,transparent,#000 35%);mask:linear-gradient(90deg,transparent,#000 35%)}
  .hero-veu{background:linear-gradient(90deg,rgba(100,1,32,.95) 45%,rgba(100,1,32,.35) 72%,rgba(100,1,32,.15))}
}
.hero-padrao{position:absolute;inset:-10%;z-index:-2;background:url(../img/padrao-vinho.svg) 0 0/280px 280px;opacity:.55;-webkit-mask:radial-gradient(ellipse 75% 70% at 50% 46%,transparent 18%,#000 75%);mask:radial-gradient(ellipse 75% 70% at 50% 46%,transparent 18%,#000 75%);animation:desliza 60s linear infinite}
@keyframes desliza{to{background-position:280px 280px}}
.hero-jp{position:absolute;right:var(--gut);top:50%;translate:0 -50%;writing-mode:vertical-rl;font:700 clamp(40px,5vw,72px)/1 var(--jp);color:var(--vermelho);margin:0;z-index:-1;opacity:.9}
.pilha{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:clamp(64px,12.5vw,210px);line-height:.84;text-align:center;color:var(--vinho);margin:0;padding:0 var(--gut);user-select:none}
.pilha-l{display:block;white-space:nowrap;transform:translateX(var(--x,0px));will-change:transform}
.pilha-l:nth-child(2){color:#7E2240}.pilha-l:nth-child(3){color:#9A4A61}.pilha-l:nth-child(4){color:#B57283}.pilha-l:nth-child(5){color:#CC98A3}.pilha-l:nth-child(6){color:#DDB9BD}
.hero .pilha-l:nth-child(n+5){display:none}
.hero .pilha-l{color:var(--creme);text-shadow:.045em .045em 0 var(--vermelho)}
.hero .pilha-l:nth-child(2){color:var(--rosa)}
.hero .pilha-l:nth-child(3){color:rgba(239,219,178,.42);text-shadow:none}
.hero .pilha-l:nth-child(4){color:rgba(226,163,179,.28);text-shadow:none}
.hero-titulo{position:relative;align-self:center;justify-self:center;width:fit-content}
.hero .pilha{font-size:clamp(52px,min(11vw,calc((100svh - var(--topo) - 200px) / 3.6)),184px);padding:0}
@media (min-width:1001px){.hero .pilha{font-size:clamp(96px,min(13.5vw,calc((100svh - var(--topo) - 190px) / 1.85)),230px)}.hero .pilha-l:nth-child(n+3){display:none}}
.hero-ume{position:absolute;right:calc(var(--w) * -1.04);top:-4%;--w:clamp(96px,8.6vw,150px);z-index:6}
.hero-adesivos .adesivo{z-index:7}
.ad-a{--w:clamp(52px,4.8vw,82px);left:6%;top:12%}
.ad-b{--w:clamp(40px,3.6vw,60px);left:9%;top:62%}
.ad-c{--w:clamp(70px,6.4vw,108px);right:8%;top:9%}
.ad-d{--w:clamp(34px,3vw,50px);right:15%;top:64%}
.ad-e{--w:clamp(34px,3vw,50px);left:22%;top:5%}
.hero-pe{display:grid;grid-template-columns:1fr auto;gap:18px 36px;align-items:center;padding:0 var(--gut);max-width:calc(var(--cx) + var(--gut)*2);width:100%;margin:0 auto;position:relative;z-index:8}
.hero-status{margin:0;font:800 26px/1 var(--t);text-transform:uppercase;color:var(--creme)}
.hero-lead{margin:0;font-size:18px;max-width:30em}
.dica{position:absolute;left:var(--gut);bottom:clamp(110px,14vh,150px);margin:0;font:700 14px var(--f);color:var(--vinho);opacity:.7;z-index:8}

/* kanpai: vermelho com anéis, vídeo do brinde */
.kanpai{position:relative;background:var(--vermelho);color:var(--tinta);padding:calc(var(--sec) + 30px) 0 var(--sec);overflow:hidden;isolation:isolate;border-block:3px solid var(--tinta)}
.kanpai-aneis{position:absolute;inset:0;z-index:-1;opacity:.35;background:radial-gradient(circle at 50% 50%,transparent 0 38px,#FF8A70 39px 46px,transparent 47px) 0 0/130px 130px,radial-gradient(circle,#FF8A70 0 46px,transparent 47px) 65px 65px/130px 130px}
.kanpai-cx{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,6vw,96px);align-items:center}
.kanpai-video{position:absolute;left:0;top:0;bottom:0;width:min(50%,760px);margin:0;z-index:0;-webkit-mask:linear-gradient(90deg,#000 45%,transparent 98%),linear-gradient(#0000,#000 12%,#000 88%,#0000);-webkit-mask-composite:source-in;mask:linear-gradient(90deg,#000 45%,transparent 98%) intersect,linear-gradient(#0000,#000 12%,#000 88%,#0000)}
.kanpai-video video{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.kanpai-cx{z-index:1}
.kanpai-tx{grid-column:2}
.kanpai .jp{color:#fff;font-size:clamp(30px,3.4vw,48px)}
.kanpai h2{color:var(--tinta);margin-bottom:22px}
.kanpai-tx>p{font-size:19px;max-width:30em}
.comanda{list-style:none;margin:28px 0 0;padding:20px 24px;background:var(--creme-2);border:3px solid var(--tinta);border-radius:18px;box-shadow:8px 8px 0 var(--tinta);max-width:540px;transform:rotate(1deg)}
.comanda li{display:flex;align-items:baseline;gap:10px;padding:10px 0;border-bottom:2px dashed rgba(20,20,20,.18)}
.comanda li:last-child{border:0}
.comanda b{font:800 24px/1 var(--t);text-transform:uppercase;color:var(--vinho);display:block}
.comanda small{font-size:14.5px;color:#5a4a3f}
.comanda i{flex:1}
.comanda em{font:800 24px/1 var(--t);font-style:normal;color:var(--vermelho);white-space:nowrap}
.ad-kanpai{--w:clamp(200px,22vw,340px);right:calc(var(--gut) - 40px);bottom:calc(-1 * var(--sec) + 10px);position:absolute}

/* Umênu em pôsteres, como as artes da casa */
.menu-sec{position:relative;background:var(--vinho);color:var(--creme);padding:var(--sec) 0;overflow:hidden;isolation:isolate}
.padrao-vinho{position:absolute;inset:0;z-index:-1;background:url(../img/padrao-vinho.svg) 0 0/220px 220px;opacity:.7}
.menu-cab{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:clamp(36px,4vw,56px)}
.menu-cab h2{display:flex;flex-direction:column;color:var(--creme);font-size:clamp(70px,10vw,160px)}
.menu-cab h2 .jp{font-size:clamp(24px,2.4vw,36px);margin-top:8px}
.menu-cab p{max-width:22em;font-size:19px;margin:0 0 10px}
.posteres{display:flex;gap:clamp(18px,2.4vw,34px);overflow-x:auto;padding:20px var(--gut) 50px;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab}
.posteres::-webkit-scrollbar{display:none}
.posteres.arrastando{cursor:grabbing;scroll-snap-type:none}
.poster{position:relative;flex:0 0 clamp(270px,26vw,350px);scroll-snap-align:center;background:var(--vinho-2);border:4px solid var(--tinta);border-radius:22px;padding:18px 18px 22px;color:var(--creme);transform:rotate(var(--g,0deg));transition:transform .5s var(--mola),box-shadow .3s;box-shadow:10px 10px 0 var(--tinta);text-decoration:none;display:flex;flex-direction:column;user-select:none}
.poster:hover{transform:rotate(0deg) translateY(-10px) scale(1.02)}
.poster header{display:flex;justify-content:space-between;align-items:center;font:800 13px var(--f);text-transform:uppercase;letter-spacing:.08em;color:var(--creme);opacity:.9;margin-bottom:12px}
.poster-marca{font:800 22px/1 var(--t);text-transform:lowercase;letter-spacing:0;color:var(--creme)}
.poster h3{font-size:clamp(38px,3.4vw,52px);color:#fff;margin:0}
.poster-jp{font:700 22px/1.1 var(--jp);color:var(--vermelho);margin:6px 0 14px}
.poster figure{margin:0 -4px 14px;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:#3a0012;border:3px solid var(--tinta)}
.poster figure img,.poster figure video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);pointer-events:none}
.poster:hover figure img{transform:scale(1.06)}
.poster-d{font-size:15.5px;line-height:1.45;margin:0;color:#F3DFC0;min-height:4.4em}
.preco{position:absolute;top:auto;bottom:118px;right:-18px;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--creme);color:var(--vinho);border:3px solid var(--tinta);font:800 22px/1 var(--t);transform:rotate(12deg);box-shadow:0 4px 0 var(--tinta);z-index:2;transition:transform .5s var(--mola)}
.poster:hover .preco{transform:rotate(-8deg) scale(1.1)}
.poster-mais{background:var(--creme);color:var(--vinho);align-items:center;justify-content:center;text-align:center;gap:10px;min-height:520px}
.poster-mais strong{font:800 44px/.95 var(--t);text-transform:uppercase}
.poster-mais span{font-size:16px;max-width:14em}
.poster-ume{position:relative!important;--w:104px;transform:none;cursor:pointer}

/* a casa */
.casa-sec{position:relative;padding:var(--sec) 0 calc(var(--sec) + 60px);overflow:hidden;background:#F6ECD4}
.casa-cx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(36px,6vw,96px);align-items:center}
.casa-tx h2{color:var(--vinho);margin-bottom:22px}
.casa-tx>p{font-size:19px;max-width:30em}
.numeros{display:flex;flex-wrap:wrap;gap:14px;list-style:none;margin:26px 0 32px;padding:0}
.numeros li{display:flex;flex-direction:column;padding:14px 18px 12px;background:#fff;border:3px solid var(--tinta);border-radius:16px;box-shadow:5px 5px 0 var(--vinho);transform:rotate(var(--r,0deg))}
.numeros li:nth-child(1){--r:-2deg}.numeros li:nth-child(2){--r:1.5deg}.numeros li:nth-child(3){--r:-1deg}
.numeros b{font:800 38px/1 var(--t);text-transform:uppercase;color:var(--vermelho)}
.numeros span{font-size:14.5px;font-weight:600}
.casa-fotos{position:relative;height:clamp(460px,46vw,640px)}
.cf{position:absolute;margin:0;border:4px solid var(--tinta);border-radius:20px;overflow:hidden;box-shadow:8px 8px 0 var(--tinta);background:var(--vinho)}
.cf img,.cf video{width:100%;height:100%;object-fit:cover}
.cf-1{left:0;top:4%;width:44%;aspect-ratio:3/4;transform:rotate(-4deg)}
.cf-2{right:0;top:0;width:52%;aspect-ratio:4/5;transform:rotate(3deg)}
.cf-3{left:26%;bottom:0;width:36%;aspect-ratio:1;transform:rotate(-2deg);z-index:2}
.ad-casa{--w:76px;right:4%;bottom:6%;z-index:6}
.espia{position:absolute;left:50%;bottom:-6px;width:clamp(140px,14vw,200px);translate:-50% 70%;transition:translate .9s var(--mola);z-index:3}
.espia.visto{translate:-50% 32%}
.espia img{width:100%}

/* o Umêzinho apresenta a logo */
.apresenta{background:#F6ECD4;padding:0 0 var(--sec)}
.apresenta-cx{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:clamp(20px,4vw,60px);align-items:center}
.apresenta-video{margin:0 0 0 calc(var(--gut) * -1);aspect-ratio:16/9;background:#F6ECD4;-webkit-mask:radial-gradient(ellipse 72% 70% at 50% 50%,#000 62%,transparent 100%);mask:radial-gradient(ellipse 72% 70% at 50% 50%,#000 62%,transparent 100%)}
.apresenta-video video{width:100%;height:100%;object-fit:cover;cursor:pointer}
.apresenta h2{color:var(--vinho);margin-bottom:18px}
.apresenta-tx p:not(.jp){font-size:19px}

/* depoimentos em balões */
.vozes{background:var(--rosa);padding:var(--sec) 0;border-block:3px solid var(--tinta);position:relative;overflow:hidden}
.vozes-cx{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,60px);align-items:start}
.voz{margin:0;padding:28px 30px 24px;background:#fff;border:3px solid var(--tinta);border-radius:28px 28px 28px 6px;box-shadow:8px 8px 0 var(--vinho);transform:rotate(-1.5deg)}
.voz-b{margin-top:70px;border-radius:28px 28px 6px 28px;transform:rotate(1.5deg)}
.voz p{font:800 clamp(24px,2.3vw,34px)/1.05 var(--t);text-transform:uppercase;color:var(--vinho);margin-bottom:16px}
.voz footer{font-size:15px;font-weight:600}
.vozes-ume{--w:clamp(80px,7vw,112px);right:3%;bottom:-30px}

/* venha */
.vem{background:var(--vinho);color:var(--creme);padding:var(--sec) 0;overflow:hidden}
.vem-cx{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(30px,5vw,80px);align-items:center}
.pilha-vem{align-items:flex-start;text-align:left;padding:0;font-size:clamp(56px,8vw,128px);margin-bottom:28px}
.pilha-vem .pilha-l{color:var(--creme)}
.pilha-vem .pilha-l:nth-child(2){color:#C79A8E}.pilha-vem .pilha-l:nth-child(3){color:#9C5A63}
.end{font-size:20px;max-width:26em}
.horas{display:grid;gap:0;margin:22px 0 30px;max-width:460px;border:3px solid var(--creme);border-radius:16px;overflow:hidden}
.horas div{display:flex;justify-content:space-between;gap:16px;padding:12px 18px;border-bottom:2px solid rgba(239,219,178,.3)}
.horas div:last-child{border:0}
.horas dt{font-weight:600}
.horas dd{margin:0;font:800 22px/1 var(--t);text-transform:uppercase;color:#fff}
.vem-foto{position:relative;margin:0;border:4px solid var(--tinta);border-radius:22px;box-shadow:10px 10px 0 var(--tinta);transform:rotate(3deg);aspect-ratio:9/14;background:var(--vinho-2)}
.vem-foto picture,.vem-foto>img{border-radius:18px;overflow:hidden;width:100%;height:100%}
.vem-foto img:not(.adesivo){width:100%;height:100%;object-fit:cover;border-radius:18px}
[data-acende]{position:relative}
.luz{position:absolute;left:0;top:0;width:0;height:0;border-radius:50%;pointer-events:none;z-index:2}
.luz::before{content:"";position:absolute;inset:-2%;border-radius:50%;background:#0C0A10;opacity:var(--apagado,.93)}
.luz::after{content:"";position:absolute;inset:-32%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,246,226,.55) 62%,rgba(255,226,190,.25) 75%,transparent 100%);mix-blend-mode:screen;opacity:0}
[data-dia] .luz{--apagado:.5}
[data-dia] .luz::after{inset:-14%;background:radial-gradient(closest-side,rgba(255,250,236,.42) 64%,rgba(255,232,196,.18) 78%,transparent 100%)}
.acesa .luz::before{animation:liga 1.6s steps(1,end) forwards}
.acesa .luz::after{animation:brilha 2.4s .9s var(--ease) forwards}
@keyframes liga{0%{opacity:var(--apagado,.93)}12%{opacity:.2}18%{opacity:var(--apagado,.9)}30%{opacity:.12}36%{opacity:.6}52%{opacity:0}58%{opacity:.35}66%,100%{opacity:0}}
@keyframes brilha{to{opacity:1}}

/* rodapé */
.rodape{background:var(--creme);color:var(--vinho);padding:70px 0 26px;border-top:3px solid var(--tinta);position:relative;overflow:hidden}
.rodape-cx{display:grid;grid-template-columns:200px repeat(3,minmax(0,1fr));gap:40px;align-items:start}
.rodape-selo{position:relative;height:180px}
.rodape-emblema{--w:128px;left:0;top:0}
.rodape h2{font-size:30px;margin-bottom:12px}
.rodape p{font-size:16px}
.rodape .link,.rodape a{color:var(--vinho);font-weight:700}
.rodape-menu{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px}
.rodape-flores{width:220px;margin:40px auto 0;opacity:.9}
.rodape-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:30px;padding-top:18px;border-top:2px solid rgba(100,1,32,.25);font-size:14px}
.rodape-legal p{margin:0}
.rodape-legal p:last-child{margin-left:auto}

/* páginas internas */
.pg-topo{position:relative;background:var(--vinho);color:var(--creme);padding:clamp(60px,8vw,120px) 0 clamp(50px,6vw,90px);overflow:hidden;isolation:isolate}
.pg-topo::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/padrao-vinho.svg) 0 0/220px 220px;opacity:.7}
.pg-topo h1{font-size:clamp(76px,12vw,190px);color:var(--creme)}
.pg-topo .lead{font-size:20px;max-width:32em;margin-top:18px}
.pg-topo .adesivo{z-index:1}
.fudas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.fuda{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 18px;background:var(--creme);color:var(--vinho);border:3px solid var(--tinta);border-radius:16px;box-shadow:0 4px 0 var(--tinta);text-decoration:none;transition:transform .3s var(--mola)}
.fuda:hover{transform:translateY(-4px) rotate(-3deg)}
.fuda-jp{font:700 14px var(--jp);color:var(--vermelho)}
.fuda-pt{font:800 22px/1 var(--t);text-transform:uppercase}
.cardapio{padding:20px 0 var(--sec)}
.secao{padding:clamp(56px,7vw,100px) 0;border-bottom:3px dashed rgba(100,1,32,.2)}
.secao-cx{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(30px,5vw,80px);align-items:start;position:relative}
.secao-cx.sem-foto{grid-template-columns:minmax(0,1fr)}
.secao-jp{grid-column:1/-1;margin:0;font:700 clamp(26px,2.6vw,38px)/1 var(--jp);color:var(--vermelho)}
.secao-cab{grid-column:1/-1}
.secao-cab h2{display:flex;align-items:center;gap:14px;color:var(--vinho);font-size:clamp(56px,7vw,110px)}
.secao-cab .ic-secao{width:.6em;height:.6em}
.secao-cab p{font-size:18px;margin-top:8px}
.pratos{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.prato{padding:16px 0;border-bottom:2px dashed rgba(20,20,20,.15)}
.prato-linha{display:flex;align-items:baseline;gap:12px}
.prato h3{font-size:clamp(26px,2.2vw,32px);color:var(--vinho)}
.pontos{flex:1;border-bottom:3px dotted rgba(100,1,32,.35);transform:translateY(-6px)}
.prato .preco{position:static;width:auto;height:auto;border:0;box-shadow:none;background:none;transform:none;font:800 28px/1 var(--t);color:var(--vermelho);display:inline}
.prato p{margin:6px 0 0;font-size:16px;max-width:36em}
.variacao{font-weight:700;color:var(--vinho)}
.secao-fotos{display:grid;gap:16px}
.secao-fotos.n2{grid-template-columns:1fr 1fr}
.secao-fotos figure{margin:0;border:3px solid var(--tinta);border-radius:18px;overflow:hidden;box-shadow:6px 6px 0 var(--vinho);background:#fff;transform:rotate(var(--r,1.5deg))}
.secao-fotos figure:nth-child(2){--r:-2deg}
.secao-fotos img,.secao-fotos video{width:100%;aspect-ratio:4/5;object-fit:cover}
#ramen .secao-fotos img{object-position:85% 50%}
.secao-fotos figcaption{padding:10px 14px;font:800 20px var(--t);text-transform:uppercase;color:var(--vinho)}
.aviso{display:flex;gap:12px;align-items:flex-start;margin-top:40px;padding:18px 22px;background:#fff;border:3px solid var(--tinta);border-radius:16px;font-size:16px}
.prosa-dupla{padding:var(--sec) 0}
.prosa-dupla.inverso{background:var(--rosa);border-block:3px solid var(--tinta)}
.prosa-cx{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,6vw,96px);align-items:center}
.inverso .prosa-foto{order:2}
.prosa-foto{margin:0;border:4px solid var(--tinta);border-radius:22px;overflow:hidden;box-shadow:10px 10px 0 var(--vinho);transform:rotate(-2deg);background:var(--vinho)}
.prosa-foto img,.prosa-foto video{width:100%;aspect-ratio:4/5;object-fit:cover}
.prosa h2{color:var(--vinho);margin-bottom:20px;display:flex;align-items:center;gap:12px}
.prosa p{font-size:19px;max-width:32em}
.link{color:var(--vinho);font-weight:700;text-decoration-thickness:2px;text-underline-offset:3px}
.utina{background:var(--vermelho);padding:var(--sec) 0;border-bottom:3px solid var(--tinta)}
.utina-cx{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.5fr) minmax(0,.4fr);gap:28px;align-items:center}
.utina-jp{font:700 30px var(--jp);color:#fff}
.utina h2{margin-bottom:16px}
.utina-tx p:not(.utina-jp){font-size:19px}
.utina figure{margin:0;border:4px solid var(--tinta);border-radius:20px;overflow:hidden;box-shadow:8px 8px 0 var(--tinta);background:var(--vinho)}
.utina figure img,.utina figure video{width:100%;aspect-ratio:3/4;object-fit:cover}
.utina-f1{transform:rotate(-3deg)}.utina-f2{transform:rotate(3deg);margin-top:60px!important}
.visita-cx{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(30px,6vw,90px);align-items:center}
.visita-foto{margin:0;justify-self:center;width:min(100%,340px);border:4px solid var(--tinta);border-radius:22px;overflow:hidden;box-shadow:10px 10px 0 var(--tinta);transform:rotate(3deg);background:var(--vinho-2)}
.visita-foto img{width:100%;aspect-ratio:9/14;object-fit:cover}
.antes{padding:var(--sec) 0}
.antes-cx{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px)}
.antes h2{color:var(--vinho);font-size:clamp(44px,5vw,72px);display:flex;align-items:center;gap:12px;margin-bottom:22px}
.lista{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.lista li{padding:14px 18px;background:#fff;border:3px solid var(--tinta);border-radius:14px;box-shadow:4px 4px 0 var(--vinho)}
.canal{padding:28px;background:var(--creme);border:3px solid var(--tinta);border-radius:22px;box-shadow:8px 8px 0 var(--vinho);align-self:start}
.canal p{font-size:18px}
.p404{min-height:70svh;display:grid;place-items:center;text-align:center;padding:60px var(--gut)}
.p404 h1{font-size:clamp(70px,12vw,170px);color:var(--vinho);margin-bottom:16px}

/* entradas: tudo chega como adesivo colando */
.js [data-revela]:not(.adesivo){opacity:0;transform:translateY(30px) rotate(var(--g,0deg)) scale(.96)}
.js [data-revela].visto:not(.adesivo){opacity:1;transform:rotate(var(--g,0deg));transition:opacity .5s,transform .8s var(--mola)}
.js .poster[data-revela].visto:hover{transform:rotate(0deg) translateY(-10px) scale(1.02)}
.js .cf[data-revela]{opacity:0}
.js .cf[data-revela].visto{opacity:1}
.js .cf-1.visto{transform:rotate(-4deg)}.js .cf-2.visto{transform:rotate(3deg)}.js .cf-3.visto{transform:rotate(-2deg)}
.js .voz[data-revela].visto{transform:rotate(-1.5deg)}.js .voz-b[data-revela].visto{transform:rotate(1.5deg)}
.js .vem-foto[data-revela].visto{transform:rotate(3deg)}

@media (max-width:1000px){
  :root{--topo:68px}
  .abre-menu{display:block}
  .topo-status{display:none}
  .marca img{height:44px}
  .menu{position:fixed;inset:var(--topo) 0 auto;flex-direction:column;align-items:stretch;gap:16px;padding:20px var(--gut) 28px;background:var(--vinho);border-bottom:3px solid var(--tinta);display:none}
  .menu-aberto .menu{display:flex}
  .menu ul{flex-direction:column;gap:0}
  .menu a:not(.btn){font-size:34px;padding:10px 0}
  .apresenta-cx,.kanpai-cx,.casa-cx,.vem-cx,.secao-cx,.prosa-cx,.visita-cx,.antes-cx,.utina-cx{grid-template-columns:1fr}
  .inverso .prosa-foto{order:0}
  .vozes-cx{grid-template-columns:1fr}
  .voz-b{margin-top:0}
  .rodape-cx{grid-template-columns:1fr 1fr}
  .hero-pe{grid-template-columns:1fr}
  .kanpai{padding-top:0}
  .kanpai-video{position:relative;width:100%;height:72vh;-webkit-mask:linear-gradient(#000 62%,transparent);mask:linear-gradient(#000 62%,transparent)}
  .kanpai-cx{margin-top:-60px}
  .kanpai-tx{grid-column:auto}
}
@media (max-width:640px){
  .hero-jp{display:none}
  body{font-size:16.5px}
  .hero{min-height:calc(100svh - var(--topo))}
  .pilha{font-size:clamp(54px,17vw,90px)}
  .hero .pilha{font-size:clamp(54px,17vw,90px)}
  .hero .pilha-l:nth-child(n+5){display:none}
.hero .pilha-l{color:var(--creme);text-shadow:.045em .045em 0 var(--vermelho)}
.hero .pilha-l:nth-child(2){color:var(--rosa)}
.hero .pilha-l:nth-child(3){color:rgba(239,219,178,.42);text-shadow:none}
.hero .pilha-l:nth-child(4){color:rgba(226,163,179,.28);text-shadow:none}
  .hero-ume{right:-1%;top:calc(var(--w) * -.95);--w:80px}
  .pilha-vem{font-size:clamp(46px,14vw,64px)}
  .ad-a{left:4%;top:4%}.ad-c{right:5%;top:auto;bottom:30%}.ad-b{left:6%;top:auto;bottom:32%}.ad-d,.ad-e{display:none}
  .dica{display:none}
  .hero-status{font-size:22px}
  .btn{min-height:52px;font-size:18px}
  .ad-kanpai{display:none}
  .menu-cab{flex-direction:column;align-items:flex-start}
  .poster{flex-basis:78vw}
  .casa-fotos{height:120vw}
  .vozes-ume{display:none}
  .vem-foto{width:80%;justify-self:center}
  .rodape-cx{grid-template-columns:1fr}
  .rodape-legal p:last-child{margin-left:0}
  .secao-fotos.n2{grid-template-columns:1fr 1fr}
}
.ad-topo-a{--w:clamp(56px,5.6vw,88px);right:12%;top:18%}
.ad-topo-b{--w:clamp(76px,7.6vw,118px);right:4%;bottom:8%}
.topo-casa-cx{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.topo-ume{--w:clamp(104px,10vw,150px)}

/* Umêzinho parceiro: acompanha a rolagem no canto e comenta cada parte */
.parceiro{position:fixed;right:clamp(12px,2.4vw,32px);bottom:clamp(12px,2.4vw,28px);z-index:40;display:flex;align-items:flex-end;gap:8px;pointer-events:none;translate:0 140%;transition:translate .6s var(--mola)}
.parceiro.on{translate:0 0}
.parceiro-ume{position:relative;width:clamp(56px,5vw,72px);aspect-ratio:1;border:0;padding:0;background:none;cursor:pointer;pointer-events:auto;flex:none}
.parceiro-ume img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .12s;filter:drop-shadow(0 4px 6px rgba(20,20,20,.22))}
.parceiro-ume img.on{opacity:1}
.parceiro-ume.pula{animation:pulinho .55s var(--mola)}
@keyframes pulinho{40%{transform:translateY(-12px) scale(1.05,.95)}}
.parceiro-fala{position:relative;max-width:min(240px,62vw);margin:0 0 34px;padding:9px 13px;background:var(--creme-2);color:var(--vinho);border:2.5px solid var(--tinta);border-radius:14px 14px 4px 14px;box-shadow:3px 3px 0 var(--tinta);font:700 15px/1.3 var(--f);opacity:0;transform:scale(.6) translateY(8px);transform-origin:100% 100%;transition:opacity .2s,transform .35s var(--mola)}
.parceiro-fala.on{opacity:1;transform:none}
body.menu-aberto .parceiro{display:none}
@media (max-width:640px){.parceiro-fala{font-size:14px;margin-bottom:28px}}

@media (min-width:1001px){.hero-padrao{-webkit-mask:linear-gradient(90deg,#000 22%,transparent 58%);mask:linear-gradient(90deg,#000 22%,transparent 58%)}}
@media (min-width:1001px){
  .hero-titulo{justify-self:start;margin-left:max(var(--gut),calc((100vw - var(--cx)) / 2))}
  .hero .pilha{align-items:flex-start;text-align:left;font-size:clamp(90px,min(11.4vw,calc((100svh - var(--topo) - 190px) / 1.85)),220px)}
  .hero .ad-c,.hero .ad-d{display:none}
  .hero .ad-a{left:44%;top:7%}
  .hero .ad-b{left:38%;top:auto;bottom:9%}
}
.hero .ad-c{display:none}

/* recado do dia, vindo do painel */
.recado{background:var(--creme);color:var(--vinho);border-bottom:3px solid var(--tinta)}
.recado-fechado{background:var(--rosa)}
.recado-cx{display:flex;align-items:center;gap:14px;min-height:58px;padding-block:8px}
.recado img{width:44px;height:auto;flex:none;transform:rotate(-6deg)}
.recado p{margin:0;font:800 clamp(18px,1.8vw,22px)/1.1 var(--t);text-transform:uppercase;letter-spacing:.01em}

/* item que acabou: o Umêzinho fica triste */
.prato-esgotado h3,.prato-esgotado>p:not(.esgotado),.prato-esgotado .pontos{opacity:.42}
.prato-esgotado .preco{opacity:.42;text-decoration:line-through;text-decoration-thickness:3px}
.esgotado{display:inline-flex;align-items:center;gap:8px;margin:10px 0 2px!important;padding:4px 14px 4px 6px;background:var(--creme);color:var(--vinho);border:2px solid var(--tinta);border-radius:14px 14px 14px 4px;font:800 18px/1 var(--t)!important;text-transform:uppercase;transform:rotate(-1.5deg)}
.esgotado img{width:34px;height:auto}
.marcas{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px!important}
.marcas span{font:700 13px/1 var(--f);color:var(--vinho);border:2px solid currentColor;border-radius:8px 3px 8px 3px;padding:4px 8px}
.foto-esgotada img,.foto-esgotada video{filter:grayscale(1);opacity:.6}
.poster figure{position:relative}
.poster-esgotado figure img,.poster-esgotado figure video{filter:grayscale(.9) brightness(.7)}
.poster-acabou{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--creme);color:var(--vinho);border:3px solid var(--tinta);border-radius:14px 14px 14px 4px;font:800 21px/1 var(--t);text-transform:uppercase;transform:rotate(-3deg)}
.poster-acabou img{width:52px;height:auto}
.comanda-esgotado b,.comanda-esgotado em{opacity:.45}
.comanda-esgotado em{text-decoration:line-through}
.comanda-esgotado small{color:var(--vermelho);font-weight:700}
.aviso p{margin:0}.aviso p+p{margin-top:.5em}

/* aviso de cookies: um balão do Umêzinho no canto */
.cookies{position:fixed;left:clamp(12px,2.4vw,28px);bottom:clamp(12px,2.4vw,28px);z-index:60;width:min(440px,calc(100vw - 24px));display:flex;gap:14px;align-items:flex-start;padding:18px 20px 20px;background:var(--creme-2);border:3px solid var(--tinta);border-radius:24px 24px 24px 6px;box-shadow:8px 8px 0 var(--vinho);translate:0 30px;opacity:0;transition:translate .45s var(--mola),opacity .25s}
.cookies.on{translate:0 0;opacity:1}
.cookies>img{width:58px;height:auto;flex:none;margin-top:-34px;transform:rotate(-8deg)}
.cookies p{font-size:15px;line-height:1.45;margin:0 0 14px}
.cookies p b{font:800 20px/1.05 var(--t);text-transform:uppercase;color:var(--vinho);display:block;margin-bottom:4px}
.cookies a{color:var(--vinho);font-weight:700}
.cookies-bt{display:flex;flex-wrap:wrap;gap:10px}
.cookies .btn{min-height:44px;padding:0 18px;font-size:17px;border-width:2px;box-shadow:0 3px 0 var(--tinta)}
.rodape-links{display:flex;gap:16px}
.link-cookies{background:none;border:0;padding:0;font:inherit;color:var(--vinho);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* política de privacidade */
.priv{padding:clamp(56px,7vw,100px) 0}
.priv-cx{max-width:calc(820px + var(--gut)*2)}
.priv h2{font-size:clamp(32px,3.6vw,48px);color:var(--vinho);margin:48px 0 14px}
.priv h2:first-child{margin-top:0}
.priv p,.priv li{max-width:68ch}
.priv .lista{margin:0 0 1em}
.priv-terceiros{margin:0 0 1.2em;border:3px solid var(--tinta);border-radius:18px 6px 18px 6px;background:#fff}
.priv-terceiros div{padding:14px 18px;border-bottom:2px dashed rgba(20,20,20,.15)}
.priv-terceiros div:last-child{border:0}
.priv-terceiros dt{font:800 22px/1 var(--t);text-transform:uppercase;color:var(--vinho);margin-bottom:6px}
.priv-terceiros dd{margin:0}
.priv .link-cookies{font-weight:700}
.priv-data{margin-top:40px;font-size:14px;opacity:.7}
@media (max-width:640px){.cookies{left:12px;right:12px;width:auto}.cookies>img{width:46px}}
.poster figure .poster-acabou img{width:52px;height:auto;filter:none;transform:none;pointer-events:none}