/* Mobile + touch refinements, layered on top of base.css. */
.pz{overflow-x:clip}
body{-webkit-tap-highlight-color:transparent}
a,button,input,textarea{touch-action:manipulation}
.hero2{touch-action:pan-y}
.cats,.feat-row,.edit,.pills{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}

/* hover states stick after a tap on touch screens */
@media (hover:none){
  .card:hover{transform:none;box-shadow:none}
  .cat:hover .cat-ring{transform:none;box-shadow:none}
  .iconbtn:hover{background:transparent}
  .pill:hover{border-color:#D9CBBE}
  .pill.on:hover{border-color:#3A2A22}
}

@media (min-width:861px){.mnav{display:none}}

@media (max-width:860px){
  :root{--hdr-h:62px}
  .wrap{padding-left:max(32px,env(safe-area-inset-left));padding-right:max(32px,env(safe-area-inset-right))}
  .hdr-in,.hdr[data-scrolled] .hdr-in{min-height:62px;gap:12px}
  .logo,.hdr[data-scrolled] .logo{height:42px}
  .menu-btn{display:inline-flex}
  /* 16px stops iOS from zooming the page when a field is focused */
  .search input,.field input,.field textarea{font-size:16px}
  .search{flex-basis:100%;max-width:none}
  .linkbtn{min-height:40px}
  .dot{height:36px}
  /* category filter follows the reader down a 150-item list */
  .pills{position:sticky;top:calc(var(--hdr-h) + 1px);z-index:20;margin:0 -32px;padding:10px 32px;scroll-padding:0 32px;background:rgba(247,242,238,.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid #E7DDD3}
  #lista{scroll-margin-top:calc(var(--hdr-h) + 76px)}
  .steps3>div{padding:24px!important}
  /* cart button becomes a thumb-reach bar */
  .float{left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));justify-content:center;min-height:54px;padding:0 18px}
  .toast{bottom:calc(80px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  footer#contato{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
  .drawer{width:100%;box-shadow:none}
  .overlay-x{display:none}
  .drawer-head{padding:16px 18px}
  .drawer-body{padding:8px 18px 20px}
  .drawer-foot{padding:14px 18px calc(16px + env(safe-area-inset-bottom))}
  .drawer-foot .btn{font-size:13px!important;letter-spacing:.05em;padding:0 14px}
  .labs{gap:28px 40px}
  .labs img{height:36px}
}

@media (max-width:560px){
  .wrap{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
  .hdr-search{display:none}
  .pills{margin:0 -18px;padding:10px 18px;scroll-padding:0 18px}
  .foot{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 20px}
  .foot>div:first-child{grid-column:1/-1}
  .labs{gap:22px 30px}
  .labs img{height:30px}
  .ph .serif{font-size:34px}
  .edit figure{scroll-snap-align:start}
  .edit{scroll-snap-type:x mandatory}
}

@media (max-width:380px){
  .stitle{font-size:35px}
  .card-title{font-size:16px!important}
  .addbtn{letter-spacing:.02em}
  h2.serif{font-size:29px!important}
}
