/* Shared responsive rules for the guide and all restaurant pages. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
img{max-width:100%}
.hero-copy,.hero figure,.detail-columns>*,.tips>*,.visit{min-width:0}
.detail-title h1,.restaurant h3,.dish-title,address,footer{overflow-wrap:anywhere}
button,a,select{touch-action:manipulation}
@media(max-width:900px){
  .header{gap:18px}
  nav{gap:16px}
  .hero{gap:24px}
  .hero h1{font-size:clamp(36px,5.5vw,49px)}
  .detail-columns{grid-template-columns:1fr;gap:28px}
  .visit{max-width:100%}
  .food-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:650px){
  html{scroll-padding-top:16px}
  main,.header,footer{width:calc(100% - 32px)}
  .header{padding:16px 0 8px;gap:8px}
  .header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:4px}
  .header nav a{display:flex;align-items:center;justify-content:center;min-height:44px;font-size:13px;line-height:1.3;text-align:center;padding:8px 4px}
  .header nav a:first-child{justify-content:flex-start}
  .brand{min-height:44px;display:inline-flex;align-items:center}
  .hero{padding:24px 0 30px;gap:24px}
  .hero h1{font-size:clamp(36px,9vw,49px);letter-spacing:-1.5px;margin:12px 0 16px}
  .hero-copy>p:not(.eyebrow){font-size:16px;line-height:1.6;margin:0 0 20px}
  .hero .primary{width:100%;min-height:48px}
  .mini-steps{gap:6px 14px;margin-top:16px;font-size:11px}
  .hero img{height:auto;aspect-ratio:4/3}
  .hero figcaption{position:static;margin:10px 0 0;padding:0;border:0;font-size:17px}
  .hero figcaption small{line-height:1.5}
  .eyebrow{font-size:11px;letter-spacing:1.5px;overflow-wrap:anywhere}
  h2{font-size:30px;letter-spacing:-.7px}
  .finder{padding:26px 0}
  .section-title{margin-bottom:18px}
  .section-title>p br{display:none}
  .food-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .food-button{padding:14px;min-height:140px}
  .food-number{top:10px;right:12px;font-size:10px}
  .food-button strong{font-size:16px;line-height:1.25;margin-top:15px;padding-right:0;overflow-wrap:anywhere}
  .food-button small{line-height:1.45;margin-bottom:14px}
  .location-bar{margin-top:0;padding:22px 0;gap:16px}
  select{min-width:0;max-width:100%;font-size:16px;min-height:48px}
  .results-head{gap:12px;margin:12px 0;font-size:13px}
  .reset{min-height:44px;padding:8px 4px;flex-shrink:0}
  .restaurants-grid{gap:18px}
  .restaurant{padding:20px}
  .card-photo{margin:-20px -20px 16px}
  .card-photo img{height:auto;aspect-ratio:3/2}
  .restaurant h3{font-size:28px;margin-top:16px}
  .restaurant h3 a{display:inline-block;padding:5px 0}
  .restaurant .text-link{min-height:48px;align-items:center;padding-top:12px}
  .table-guide{padding:22px;margin:32px 0;gap:16px}
  .empty{padding:24px 18px}
  .empty .primary{max-width:100%}
  .detail{padding-top:16px}
  .back{display:inline-flex;align-items:center;min-height:44px}
  .detail-title{padding:20px 0 24px}
  .detail-title h1{font-size:clamp(34px,9vw,45px);letter-spacing:-1.3px}
  .detail-branch{font-size:20px}
  .lede{font-size:17px;line-height:1.65;margin-bottom:0}
  .detail-photo{margin-bottom:24px}
  .detail-photo img{height:auto;aspect-ratio:4/3}
  .detail-photo figcaption{font-size:12px;line-height:1.6}
  .detail-columns{padding-top:24px;gap:24px}
  .dish-title{font-size:21px;margin-bottom:28px}
  .visit{padding:20px}
  .address-row{flex-direction:column;align-items:stretch;gap:12px}
  .address-row address{flex:auto;font-size:16px;line-height:1.65}
  .copy-address{width:100%;min-height:48px;font-size:14px}
  .visit .primary{min-height:48px;gap:12px;padding:14px 16px}
  .visit .text-link{min-height:44px;align-items:center;margin:8px 0;line-height:1.5}
  .more{margin:36px 0}
  footer{padding:24px 0 max(28px,env(safe-area-inset-bottom));gap:14px}
  footer p,footer small{line-height:1.7}
}
@media(max-width:360px){
  .food-grid{gap:8px}
  .food-button{padding:12px}
  .food-button strong{font-size:15px}
  .visit{padding:16px}
}