/* Dumpling Bar — stili globali condivisi
   Estratti dai blocchi <style> delle pagine Design Canvas originali. */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}
img{display:block}
::selection{background:#8C1D18;color:#F4ECDD}

@keyframes db-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

/* link con underline animata */
.db-link{position:relative}
.db-link::after{content:"";position:absolute;left:0;bottom:-4px;height:1px;width:0;background:#8C1D18;transition:width .3s ease}
.db-link:hover::after{width:100%}

/* hover (sostituiscono gli attributi style-hover del Design Canvas) */
.lnk-red{transition:background .25s}
.lnk-red:hover{background:#6F1512 !important}
.lnk-hero{transition:transform .2s,background .2s}
.lnk-hero:hover{transform:translateY(-2px);background:#A02019 !important}
.lnk-ghost{transition:background .2s}
.lnk-ghost:hover{background:rgba(247,240,226,.2) !important}
.city{transition:color .2s}
.city:hover{color:#8C1D18 !important}

/* righe ricettario alternate (legacy) */
.rec-row:nth-of-type(even){flex-direction:row-reverse}

/* menu hamburger (mobile) — nascosto su desktop */
.db-burger{display:none;background:none;border:0;cursor:pointer;padding:6px 2px;line-height:0;margin-left:auto}
.db-burger span{display:block;width:26px;height:2px;background:#231A12;margin:6px 0;border-radius:2px;transition:transform .25s ease,opacity .2s ease}
header.nav-open .db-burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
header.nav-open .db-burger span:nth-child(2){opacity:0}
header.nav-open .db-burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* filtri categoria interattivi */
.flt{font-family:'Hanken Grotesk',sans-serif;font-size:13px;font-weight:600;letter-spacing:.04em;padding:10px 20px;border-radius:100px;cursor:pointer;transition:all .2s;background:transparent;color:#5A4B3A;border:1px solid rgba(35,26,18,.22)}
.flt:hover{border-color:rgba(140,29,24,.5);color:#8C1D18}
.flt.is-active{background:#8C1D18;color:#F4ECDD;border:1px solid #8C1D18}
.flt.is-active:hover{color:#F4ECDD}

/* responsive — le regole c'erano nel sorgente, qui applicate alle classi giuste */
@media(max-width:860px){
  .db-nav{padding:12px 20px !important;gap:12px !important}
  .db-burger{display:block}
  .db-navlinks{display:none !important}
  header.nav-open .db-navlinks{display:flex !important;flex-direction:column;align-items:stretch;flex-basis:100%;gap:0 !important;margin-top:10px;border-top:1px solid rgba(35,26,18,.12);padding-top:6px}
  header.nav-open .db-navlinks a{padding:13px 6px !important;font-size:15px !important;border-bottom:1px solid rgba(35,26,18,.07)}
  header.nav-open .db-navlinks a[href^="tel:"]{margin-top:12px;text-align:center;border-bottom:0}
  .db-sec{padding-left:20px !important;padding-right:20px !important}
  .db-pad{padding:60px 20px !important}
  .db-statement{grid-template-columns:1fr !important;gap:28px !important;padding:48px 20px !important}
  .db-statement .db-badge{border-left:none !important;border-top:1px solid rgba(244,236,221,.3) !important;padding-left:0 !important;padding-top:28px !important}
  .db-menu-cols{column-count:1 !important}
  .db-grid-2{grid-template-columns:1fr !important;gap:32px !important}
  .db-grid-3{grid-template-columns:1fr !important;gap:24px !important}
  .db-grid-4{grid-template-columns:repeat(2,1fr) !important}
  .db-hero{min-height:78vh !important}
  .db-hero-inner{padding:0 20px 48px !important}
  .db-phone{font-size:44px !important}
}
@media(max-width:480px){
  .db-grid-4{grid-template-columns:repeat(2,1fr) !important;gap:12px !important}
  .db-phone{font-size:36px !important}
}
/* tablet: ricette home da 3 a 2 colonne prima del collasso a 1 */
@media(min-width:861px) and (max-width:1024px){
  .db-grid-3{grid-template-columns:repeat(2,1fr) !important}
}
