/* Customizer image presentation and small-screen layout corrections */
.brand-logo { display: block; width: auto; max-width: 210px; max-height: 58px; object-fit: contain; }
.hero-logo-image { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
.footer-logo-image { display: block; width: auto; max-width: 120px; height: auto; max-height: 90px; object-fit: contain; margin: 0 auto; }
.story-art { background: transparent; border: 0; }
.hero.has-custom-image { background-image: linear-gradient(rgba(34,3,4,.55),rgba(34,3,4,.88)), var(--watan-hero-image); background-position: center; background-size: cover; background-repeat: no-repeat; }
.menu-section.has-custom-image { background-image: linear-gradient(rgba(53,7,8,.93),rgba(53,7,8,.93)), var(--watan-menu-image); background-position: center; background-size: cover; background-repeat: no-repeat; }

/* Small-screen layout corrections */
@media (max-width: 800px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  .site-header { width: 100%; }
  .brand-logo { max-width: 150px; max-height: 44px; }
  .footer-logo-image { max-width: 95px; max-height: 70px; }
  .hero, .section-wrap, .site-footer { width: 100%; max-width: 100%; overflow: hidden; }
  .section-wrap { padding: 68px 22px; }

  .hero-content { width: 100%; padding: 120px 22px 44px; }
  .hero-seal { width: 110px; height: 110px; }
  .hero-seal span { font-size: 58px; }
  .hero h1 { font-size: 54px; letter-spacing: 5px; }
  .hero-actions { flex-direction: column; align-items: stretch; max-width: 260px; margin: auto; }
  .hero-actions .button { text-align: center; }
  .hero-location { width: 100%; font-size: 10px; line-height: 1.5; letter-spacing: 2px; }

  .story { display: flex; flex-direction: column; gap: 50px; }
  .story-art { width: calc(100% - 20px); height: 330px; margin: 0 10px 0 0; overflow: visible; }
  .story-image-rice { left: -7%; top: 0; width: 98%; height: 78%; }
  .story-image-kabab { right: -22%; bottom: -5%; width: 97%; height: 50%; }
  .story-copy h2, .section-heading h2, .contact-copy h2 { font-size: 42px; }
  .story-copy > p:not(.eyebrow), .section-heading > p:last-child { font-size: 16px; }
  blockquote { margin-top: 30px; padding: 20px; font-size: 17px; }

  .menu-section { padding-left: 18px; padding-right: 18px; }
  .section-heading { margin-bottom: 38px; }
  .menu-promises { margin-bottom: 40px; padding: 16px 5px; }
  .menu-group { margin-bottom: 42px; }
  .menu-group h3 { font-size: 24px; }
  .menu-item { padding-right: 82px; }
  .menu-item strong { font-size: 16px; }
  .menu-item span { font-size: 14px; }
  .menu-item p { font-size: 14px; line-height: 1.45; }
  .side-columns { grid-template-columns: 1fr; }
  .side-columns > div { padding: 0 0 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .menu-special { width: calc(100% - 18px); padding: 24px 18px; }
  .menu-special strong { font-size: 66px; }

  .review-grid { grid-template-columns: 1fr; }
  .review-grid article { min-height: 0; padding: 27px; }
  .find-us { display: flex; flex-direction: column; gap: 45px; }
  .contact-copy { width: 100%; }
  .contact-copy dl { padding-left: 62px; }
  .contact-copy dt:before { left: -62px; width: 42px; height: 42px; }
  .order-card { width: 100%; min-height: 400px; padding: 55px 26px; }
  .order-card h2 { font-size: 36px; }
}

@media (max-width: 390px) {
  .brand-name { display: none; }
  .header-order { font-size: 10px; }
  .menu-item { padding-right: 72px; }
  .menu-item strong { font-size: 15px; }
  .menu-item span { font-size: 13px; }
}
