/* Scape Burguer · sections
   One block per page section, in page order, then the shared responsive rules. */

/* =============================== HERO / VIDEO =============================== */
/* The brand video is scrubbed by scroll; the order buttons reveal on its last frame. */
.build{position:relative;height:460vh;background:var(--void)}
.build__sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--void)}
/* box with the video's exact 16:9 geometry, so overlays stay pinned to the artwork */
.hero-media{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  aspect-ratio:16/9;width:min(100%,177.78vh);width:min(100%,177.78svh);
}
.hero-media video{
  position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;background:var(--void);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%);
}
/* wide screens: fill the viewport (crop is small enough to keep the video's text) */
@media (min-aspect-ratio:16/10){
  .hero-media{width:max(100%,177.78vh);width:max(100%,177.78svh)}
  .hero-media video{-webkit-mask-image:none;mask-image:none}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* sits right under "Qual você tem coragem de pedir?" in the final frame */
.hero-end{
  position:absolute;left:54.1%;top:62%;width:42%;z-index:4;pointer-events:none;
  display:flex;flex-direction:column;align-items:flex-start;gap:14px;
}
.hero-end>*{
  opacity:0;transform:translateY(18px);visibility:hidden;
  transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s;
}
.hero-end.show>*{
  opacity:1;transform:none;visibility:visible;
  transition:opacity .8s cubic-bezier(.16,.8,.24,1) var(--d,0ms),transform .8s cubic-bezier(.16,.8,.24,1) var(--d,0ms),visibility 0s linear 0s;
}
.hero-end.show .hero-ctas{pointer-events:auto}
.hero-end>:nth-child(3){--d:140ms}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-end__note{font-size:.82rem;color:var(--bone-dim);letter-spacing:.02em}
.hero-end__note b{color:var(--orange-2);font-weight:600}

/* "keep scrolling" cue: shown at the start and whenever scrolling pauses mid-video */
.build-hint{
  position:absolute;left:50%;bottom:calc(clamp(18px,4.5vh,40px) + env(safe-area-inset-bottom,0px));z-index:6;
  display:flex;align-items:center;gap:12px;padding:10px 20px 10px 12px;border-radius:99px;
  background:rgba(11,10,8,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(242,106,27,.45);box-shadow:0 10px 30px rgba(0,0,0,.45),0 0 24px rgba(242,106,27,.18);
  color:var(--bone);font-size:.84rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;pointer-events:none;
  transform:translate(-50%,0);opacity:1;
  transition:opacity .45s ease,transform .45s cubic-bezier(.16,.8,.24,1);
}
.build-hint.off{opacity:0;transform:translate(-50%,14px)}
.build-hint__icon{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(242,106,27,.14);color:var(--orange)}
.build-hint__touch,.build-hint__txt-touch{display:none}
/* mouse with a scrolling wheel dot */
.build-hint__mouse .wheel{animation:wheel 1.6s cubic-bezier(.6,0,.3,1) infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(6px);opacity:0}100%{transform:translateY(0);opacity:0}}
/* chevrons sliding up, for swipe */
.build-hint__touch path{animation:swipe 1.5s ease-in-out infinite}
.build-hint__touch path:nth-child(2){animation-delay:.18s}
@keyframes swipe{0%{transform:translateY(4px);opacity:0}40%{opacity:1}100%{transform:translateY(-4px);opacity:0}}
.build-hint b{color:var(--orange-2);font-weight:600}
@media (hover:none) and (pointer:coarse){
  .build-hint__mouse,.build-hint__txt-mouse{display:none}
  .build-hint__touch{display:block}
  .build-hint__txt-touch{display:inline}
}
@media (prefers-reduced-motion:reduce){.build-hint *{animation:none !important}}
.build-progress{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--orange);transform-origin:0 50%;transform:scaleX(0);z-index:5}

@media (max-height:560px){
  .hero-end{gap:8px}
  .hero-end .btn{padding:9px 16px;font-size:.8rem}
  .hero-end__note{display:none}
}
/* portrait tablets: 16:9 video band near the top, buttons stacked below it */
@media (orientation:portrait){
  .hero-media{top:42%}
  .hero-end{left:0;right:0;width:auto;top:calc(100% + 26px);align-items:center;text-align:center;padding-inline:var(--pad)}
  .hero-ctas{flex-direction:column;width:100%;max-width:340px;gap:10px}
  .hero-ctas .btn{width:100%;padding-block:13px}
}
/* phones: a dedicated 9:16 video fills the whole screen (the JS loads it on the
   same media query); the buttons sit under "Qual você tem coragem de pedir?",
   which spans 65–74% of the frame height */
/* phones held upright: four still scenes replace the video (js/hero.js drives
   them from the scroll position). Each transition takes 80% of a screen of scrolling. */
.scenes,.scene-dots{display:none}
@media (max-width:820px) and (orientation:portrait){
  .build{height:calc(100vh + 3 * 80vh);height:calc(100svh + 3 * 80svh)}
  /* the 9:16 frame fills the screen but crops at most ~6% per side, since the
     captions run from 9% to 93% of the width; .hero-media keeps the same frame
     so the buttons line up with the last scene */
  .hero-media{top:50%;aspect-ratio:9/16;width:min(max(100%,56.25vh),113%);width:min(max(100%,56.25svh),113%)}
  .hero-media video{display:none}
  .hero-end{top:77%;padding-inline:max(var(--pad),calc((100% - 100vw) / 2 + var(--pad)))}

  .scenes{display:block;position:absolute;inset:0;overflow:hidden}
  /* each scene fills the screen with its own background colour, so a phone
     taller than 9:16 shows no seams */
  .scene{position:absolute;inset:0;overflow:hidden;background:var(--bg);visibility:hidden;transform-origin:50% 45%;will-change:transform,clip-path}
  .scene:first-child{visibility:visible}
  .scene:nth-child(3){box-shadow:0 -24px 60px rgba(0,0,0,.5)}
  .scene::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--shade,0);pointer-events:none}
  .scene img{
    position:absolute;left:50%;top:50%;height:auto;aspect-ratio:9/16;
    width:min(max(100%,56.25vh),113%);width:min(max(100%,56.25svh),113%);
    transform:translate(-50%,-50%);will-change:transform;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 4%,#000 96%,transparent 100%);
            mask-image:linear-gradient(180deg,transparent 0,#000 4%,#000 96%,transparent 100%);
  }

  /* which scene you are on */
  .scene-dots{display:flex;flex-direction:column;align-items:center;gap:8px;position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:6;pointer-events:none}
  .scene-dots i{width:6px;height:6px;border-radius:99px;background:rgba(244,236,220,.4);box-shadow:0 0 6px rgba(0,0,0,.6);transition:height .35s cubic-bezier(.16,.8,.24,1),background .35s}
  .scene-dots i.on{height:22px;background:var(--orange)}
}
@media (prefers-reduced-motion:reduce){
  .build{height:100vh;height:100svh}
  .build-hint,.build-progress{display:none}
}

/* =============================== MARQUEE =============================== */
.marquee-wrap{
  position:relative;z-index:3;overflow:hidden;
  background:linear-gradient(90deg,var(--blood-dim),var(--blood) 50%,var(--blood-dim));
  border-block:1px solid rgba(244,236,220,.08);
}
.marquee-track{display:flex;align-items:center;width:max-content;animation:marquee 36s linear infinite;will-change:transform}
.marquee-track span{
  display:flex;align-items:center;
  font-family:var(--font-display);font-size:clamp(1.3rem,3.4vw,2.1rem);
  color:var(--bone);padding-block:13px;line-height:1;white-space:nowrap;letter-spacing:.03em;
}
/* drawn skull instead of the ☠ character, which phones replace with an emoji
   of their own size and baseline */
.marquee-track span i{
  flex:none;width:.9em;height:.9em;margin-inline:22px;transform:translateY(-1px);opacity:.85;background:var(--orange-2);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill-rule='evenodd' d='M50 6C28 6 13 21 13 41c0 11 5 18 10 23l-2 12c-1 5 2 9 7 9h5v6c0 3 2 5 5 5h24c3 0 5-2 5-5v-6h5c5 0 8-4 7-9l-2-12c5-5 10-12 10-23C87 21 72 6 50 6zM36 33a9 9 0 110 18 9 9 0 010-18zm28 0a9 9 0 110 18 9 9 0 010-18zM50 55l6 12H44z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill-rule='evenodd' d='M50 6C28 6 13 21 13 41c0 11 5 18 10 23l-2 12c-1 5 2 9 7 9h5v6c0 3 2 5 5 5h24c3 0 5-2 5-5v-6h5c5 0 8-4 7-9l-2-12c5-5 10-12 10-23C87 21 72 6 50 6zM36 33a9 9 0 110 18 9 9 0 010-18zm28 0a9 9 0 110 18 9 9 0 010-18zM50 55l6 12H44z'/%3E%3C/svg%3E") center/contain no-repeat;
}
@keyframes marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* =============================== CARDAPIO =============================== */
#cardapio{background:linear-gradient(180deg,var(--void) 0%,var(--void-soft) 100%)}
/* intro: copy on the left, vertical kitchen video on the right */
.menu-intro{display:grid;grid-template-columns:1fr auto;gap:clamp(30px,6vw,90px);align-items:center;margin-bottom:clamp(36px,5vw,56px)}
.menu-intro .section-head{margin-bottom:0}
.menu-intro__list{margin-top:26px;display:grid;gap:12px}
.menu-intro__list li{display:flex;align-items:center;gap:12px;color:var(--bone);font-size:.96rem;font-weight:500}
.menu-intro__list i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 12px var(--orange)}
.reel{
  position:relative;margin:0;width:clamp(240px,26vw,320px);aspect-ratio:9/16;
  border-radius:26px;overflow:hidden;background:#000;
  border:1px solid rgba(242,106,27,.35);
  box-shadow:var(--shadow-lg),0 0 70px rgba(242,106,27,.16);
  transform:rotate(2.5deg);transition:transform .5s cubic-bezier(.16,.8,.24,1);
}
.reel:hover{transform:rotate(0) scale(1.02)}
.reel video{width:100%;height:100%;object-fit:cover;display:block}
.reel::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(11,10,8,.45) 0%,transparent 22%,transparent 78%,rgba(11,10,8,.5) 100%)}
.reel__tag{
  position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:7px;
  padding:6px 12px;border-radius:99px;background:rgba(11,10,8,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font-size:.72rem;font-weight:600;letter-spacing:.04em;color:var(--bone);
}
.reel__tag i{width:7px;height:7px;border-radius:50%;background:var(--blood);box-shadow:0 0 0 0 rgba(168,18,31,.7);animation:recPulse 1.6s ease-out infinite}
@keyframes recPulse{0%{box-shadow:0 0 0 0 rgba(242,60,60,.7)}100%{box-shadow:0 0 0 8px rgba(242,60,60,0)}}
.reel__sound{
  position:absolute;right:12px;bottom:12px;z-index:2;width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;color:var(--bone);background:rgba(11,10,8,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid var(--line);transition:border-color .25s,color .25s,transform .25s;
}
.reel__sound:hover{border-color:var(--orange);color:var(--orange-2);transform:scale(1.08)}
.reel__sound[aria-pressed="true"] .reel__mute,.reel__sound[aria-pressed="false"] .reel__waves{display:none}
@media (max-width:760px){
  .menu-intro{grid-template-columns:1fr}
  .reel{width:min(72vw,290px);margin-inline:auto;transform:none}
}
@media (prefers-reduced-motion:reduce){.reel{transform:none}.reel__tag i{animation:none}}

.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.menu-card{
  position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
  background:var(--panel);box-shadow:var(--shadow-md);
  transition:transform .4s cubic-bezier(.16,.8,.24,1),box-shadow .4s,border-color .4s;
  display:flex;flex-direction:column;min-height:420px;
}
.menu-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:rgba(242,106,27,.4)}
.menu-card__media{position:relative;aspect-ratio:4/5;overflow:hidden}
.menu-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.menu-card:hover .menu-card__media img{transform:scale(1.08)}
.menu-card__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,10,8,0) 28%,rgba(11,10,8,.82) 62%,rgba(11,10,8,.97) 100%)}
.menu-card__body{position:absolute;left:0;right:0;bottom:0;padding:22px;z-index:2}
.menu-card__hook{font-family:var(--font-display);color:var(--bone);font-size:1.25rem;line-height:1.2;letter-spacing:.01em;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.menu-card__desc{color:var(--bone-dim);font-size:.86rem;margin-top:10px;line-height:1.55}

.menu-card.poster{min-height:420px}
.menu-card.poster .menu-card__media{
  aspect-ratio:auto;height:100%;position:absolute;inset:0;
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.15) 0 2px,transparent 2px 4px),
    radial-gradient(120% 140% at 20% 0%,rgba(242,106,27,.35),transparent 55%),
    linear-gradient(160deg,#241a12,#0f0c09 70%);
}
.menu-card.poster .menu-card__media::after{
  content:"";position:absolute;inset:0;mix-blend-mode:overlay;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:staticFlicker 6s steps(2) infinite;
}
@keyframes staticFlicker{0%,100%{opacity:.45}50%{opacity:.6}75%{opacity:.35}}
.menu-card.more{grid-column:1/-1;min-height:230px;align-items:center;justify-content:center;text-align:center}
.menu-card.more .menu-card__body{position:relative;padding:clamp(28px,5vw,48px) 22px}
.menu-card__more{font-family:var(--font-display);font-size:clamp(2.4rem,6.5vw,4.6rem);line-height:1;color:var(--orange);text-shadow:0 6px 30px rgba(0,0,0,.5)}
.menu-card__more span{color:var(--bone)}
.menu-card.more .menu-card__desc{font-size:1rem;margin-top:14px}
.menu-card.poster .skull-mark{position:absolute;left:22px;top:20px;width:34px;height:34px;opacity:.5;z-index:2}

.combo-banner{
  margin-top:22px;border-radius:var(--radius);overflow:hidden;position:relative;
  background:linear-gradient(115deg,var(--blood) 0%,var(--blood-dim) 55%,#2a0a0e 100%);
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding:clamp(24px,4vw,40px);box-shadow:var(--shadow-md);border:1px solid rgba(244,236,220,.1);
}
.combo-banner__text h3{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2rem);color:var(--bone)}
.combo-banner__text p{color:rgba(244,236,220,.78);margin-top:8px;max-width:52ch;font-size:.95rem}
.combo-banner__cta{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.combo-drip{position:absolute;top:0;left:0;width:100%;height:14px;opacity:.9}

.menu-foot{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:36px;text-align:center}
.menu-foot small{color:var(--smoke);font-size:.82rem}

/* =============================== GALERIA =============================== */
#galeria{background:var(--void-soft)}
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gal-tile{position:relative;aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line)}
.gal-tile img{width:100%;height:100%;object-fit:cover;filter:grayscale(.85) contrast(1.05);transform:scale(1.02);transition:filter .6s ease,transform .6s cubic-bezier(.16,.8,.24,1)}
.gal-tile:hover img{filter:grayscale(0) contrast(1.08) saturate(1.12);transform:scale(1.09)}
.gal-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(11,10,8,.65));pointer-events:none}
.gal-tile::before{
  content:"";position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .4s;
  background:repeating-linear-gradient(0deg,rgba(242,106,27,.12) 0 1px,transparent 1px 3px);
  pointer-events:none;
}
.gal-tile:hover::before{opacity:1}

/* ---- Pennywise behind the gallery ----
   .penny is a clip box whose bottom edge sits --hide px below the top of the
   photo grid; the grid (solid background, painted above him) covers that part,
   so only what is raised above the grid's top edge shows.
   Positions are in % of his own height minus --hide. */
.gal-wrap{position:relative;--hide:220px}
#galeria .section-head{position:relative;z-index:2}
.gal-wrap .gal-grid{position:relative;z-index:1;background:var(--void-soft)}
.penny{position:absolute;left:0;right:0;bottom:calc(100% - var(--hide));height:calc(var(--hide) + 380px);overflow:hidden;pointer-events:none;z-index:0}
.penny img{
  position:absolute;right:3%;bottom:0;width:min(28%,290px);height:auto;
  transform:translateY(100%);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(90deg,#000 78%,transparent 99%);mask-image:linear-gradient(90deg,#000 78%,transparent 99%);
}
/* phones: the heading spans the full width, so give him his own gap above the photos */
@media (max-width:640px){.gal-wrap{margin-top:100px}.penny img{width:46%;right:0}}
/* 1) jumps out: shoots up past his hands with a jolt */
.penny.scare img{animation:pennyScare 1.5s cubic-bezier(.2,1.6,.4,1) forwards}
@keyframes pennyScare{
  0%{transform:translateY(100%) scale(.9)}
  14%{transform:translateY(calc(12% - var(--hide))) scale(1.12) rotate(-3deg)}
  20%{transform:translateY(calc(16% - var(--hide))) scale(1.1) rotate(3deg)}
  26%{transform:translateY(calc(13% - var(--hide))) scale(1.11) rotate(-2deg)}
  75%{transform:translateY(calc(15% - var(--hide))) scale(1.08) rotate(0)}
  100%{transform:translateY(calc(48% - var(--hide))) scale(1) rotate(0)}
}
/* 2) then stays peeking over the photos, eyes and grin above the edge, swaying */
.penny.peek img{transform:translateY(calc(48% - var(--hide)));animation:pennyLurk 6s ease-in-out infinite;transition:transform .5s cubic-bezier(.2,1.4,.4,1)}
@keyframes pennyLurk{
  0%,100%{transform:translateY(calc(48% - var(--hide))) rotate(0)}
  30%{transform:translateY(calc(46% - var(--hide))) rotate(-2.5deg)}
  60%{transform:translateY(calc(50% - var(--hide))) rotate(2deg)}
}
/* 3) hovering the photos lures him out a little more */
.gal-wrap:hover .penny.peek img{animation:none;transform:translateY(calc(34% - var(--hide))) rotate(-2deg)}
@media (prefers-reduced-motion:reduce){
  .penny.scare img,.penny.peek img{animation:none;transition:none;transform:translateY(calc(48% - var(--hide)))}
}

/* =============================== SOBRE =============================== */
#sobre{background:var(--void);border-top:1px solid var(--line-soft)}
.sobre-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,90px);align-items:center}
.sobre-media{position:relative}
.sobre-media .frame{
  position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow-lg);
  clip-path:polygon(0 0,94% 0,100% 6%,100% 100%,6% 100%,0 94%);
}
.sobre-media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
.sobre-badge{
  position:absolute;bottom:-22px;right:-14px;background:var(--orange);color:#160c04;
  border-radius:50%;width:118px;height:118px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:var(--font-display);box-shadow:var(--shadow-md);transform:rotate(-9deg);text-align:center;line-height:1;
}
.sobre-badge b{font-size:1.7rem}
.sobre-badge small{font-family:var(--font-body);font-weight:600;font-size:.62rem;letter-spacing:.06em;margin-top:4px}
.sobre-content h2{font-size:clamp(2.1rem,4.6vw,3.4rem);color:var(--bone)}
.sobre-content p{color:var(--bone-dim);margin-top:18px;font-size:1.04rem;max-width:52ch}
.sobre-stats{display:flex;gap:clamp(20px,4vw,44px);margin-top:30px;flex-wrap:wrap}
.stat b{display:block;font-family:var(--font-display);font-size:clamp(1.9rem,3.6vw,2.6rem);color:var(--orange);line-height:1}
.stat span{display:block;color:var(--smoke);font-size:.84rem;margin-top:6px}
.sobre-content .btn{margin-top:30px}

/* =============================== LOCAL =============================== */
#local{background:var(--void-soft)}
.local-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,5vw,70px);align-items:center}
.local-map{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-md);height:300px;position:relative;filter:grayscale(.35) contrast(1.05)}
.local-map iframe{width:100%;height:100%;border:0;display:block;filter:invert(0)}

.local-info h2{font-size:clamp(2rem,4.4vw,3rem);color:var(--bone)}
.local-info>p{color:var(--bone-dim);margin-top:12px;font-size:1rem}
.local-addr{display:flex;gap:12px;align-items:flex-start;margin-top:28px;color:var(--bone)}
.local-addr svg{flex:none;margin-top:3px;color:var(--orange)}
.hours-table{margin-top:26px;border-top:1px solid var(--line)}
.hours-row{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line-soft);font-size:.94rem}
.hours-row span:first-child{color:var(--bone)}
.hours-row span:last-child{color:var(--bone-dim)}
.hours-row.closed span:last-child{color:var(--blood);font-weight:600}
.hours-row.today{color:var(--orange)}
.hours-row.today span:first-child{color:var(--orange);font-weight:600}
.local-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

/* =============================== AVALIACOES =============================== */
#avaliacoes{background:var(--void)}
.aval-top{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,40px)}
.aval-score{display:flex;align-items:center;gap:18px}
.aval-score b{font-family:var(--font-display);font-size:clamp(2.6rem,5vw,3.6rem);color:var(--orange);line-height:1}
.aval-score .stars{color:var(--orange);font-size:1.1rem;letter-spacing:2px}
.aval-score span{display:block;color:var(--smoke);font-size:.85rem;margin-top:4px}

.aval-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.aval-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(22px,3vw,30px);position:relative;transition:transform .35s,border-color .35s,box-shadow .35s;
}
.aval-card:hover{transform:translateY(-5px);border-color:rgba(242,106,27,.35);box-shadow:var(--shadow-md)}
.aval-card .stars{color:var(--orange);font-size:.95rem;letter-spacing:3px;margin-bottom:14px;display:block}
.aval-card p.quote{color:var(--bone-dim);font-size:.98rem;line-height:1.7}
.aval-who{display:flex;align-items:center;gap:12px;margin-top:20px}
.aval-avatar{
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:1.05rem;color:#160c04;flex:none;
}
.aval-who b{display:block;font-size:.92rem;color:var(--bone);font-weight:600}
.aval-who span{display:block;font-size:.78rem;color:var(--smoke);margin-top:1px}

/* =============================== FOOTER =============================== */
footer{background:var(--void);border-top:1px solid var(--line);padding-block:clamp(44px,6vw,64px) 28px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(30px,5vw,50px)}
.foot-brand{display:flex;align-items:center;gap:10px}
.foot-brand img{height:34px}
.foot-brand span{font-family:var(--font-display);font-size:1.2rem;color:var(--bone)}
.foot-tag{color:var(--smoke);font-size:.92rem;margin-top:16px;max-width:32ch}
.foot-social{display:flex;gap:12px;margin-top:22px}
.foot-social a{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
  transition:border-color .25s,background .25s,transform .25s;
}
.foot-social a:hover{border-color:var(--orange);background:rgba(242,106,27,.1);transform:translateY(-3px)}
.foot-col h4{font-family:var(--font-body);font-weight:600;font-size:.85rem;letter-spacing:.04em;color:var(--bone);margin-bottom:16px}
.foot-col ul li{margin-bottom:11px}
.foot-col ul a,.foot-col ul span{color:var(--smoke);font-size:.92rem;transition:color .25s}
.foot-col ul a:hover{color:var(--orange-2)}
.foot-bottom{
  margin-top:40px;padding-top:22px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:var(--smoke);font-size:.8rem;
}

/* =============================== RESPONSIVE =============================== */
@media (max-width:980px){
  .nav__links{display:none}
  .nav__burger{display:flex}
  .sobre-grid{grid-template-columns:1fr}
  .sobre-media{max-width:420px;margin-inline:auto}
  .menu-grid{grid-template-columns:repeat(2,1fr)}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .aval-grid{grid-template-columns:1fr}
  .local-grid{grid-template-columns:1fr}
  .local-map{order:2;height:220px}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .menu-grid{grid-template-columns:1fr}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr}
  .hero-ctas{flex-direction:column;width:100%;max-width:340px;margin-inline:auto;gap:10px}
  .hero-ctas .btn{width:100%;padding-block:13px}
  .combo-banner{flex-direction:column;align-items:flex-start}
  .combo-banner__cta{width:100%;justify-content:space-between}
  /* compact nav so logo, name, "Peça agora" and the menu button share one row */
  .nav{padding-inline:16px}
  .nav__brand{gap:8px}
  .nav__brand img{height:32px}
  .nav__brand-name{font-size:1.02rem}
  .nav__right{gap:8px}
  .nav__right .btn-sm{padding:9px 14px;font-size:.8rem}
  /* keep the Google badge inside the screen */
  .sobre-badge{right:6px;bottom:-18px;width:98px;height:98px}
  .sobre-badge b{font-size:1.45rem}
}
@media (max-width:370px){
  .nav__brand-name{display:none}
}