/* Mobile refinements. Desktop layout and imagery remain governed by styles.css. */
.hero-copy > .hero-location { display: none; }
.mobile-word { display: contents; }
@media (max-width: 760px) {
  :root {
    --mobile-bar-height: 58px;
    --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
    --mobile-bottom-space: calc(var(--mobile-bar-height) + var(--mobile-safe-bottom));
  }
  html {
    scroll-padding-top: 82px;
    scroll-padding-bottom: calc(var(--mobile-bottom-space) + 16px);
  }
  body { padding-bottom: var(--mobile-bottom-space); }
  main p, main h2, main h3, .faq-answer {
    line-break: strict;
    word-break: normal;
    overflow-wrap: normal;
    text-wrap: pretty;
  }
  .mobile-phrase { display: inline; white-space: nowrap; }
  .hero-copy > .hero-location {
    display: block;
    margin: 0 0 20px;
    font-size: 12px;
    line-height: 1.9;
    letter-spacing: .04em;
  }
  .hero-location small {
    display: block;
    color: var(--muted);
    font-size: 10px;
    letter-spacing: .02em;
    margin-top: 3px;
  }
  .philosophy, .menu { padding-top: 56px; padding-bottom: 56px; }
  .philosophy .section-heading { margin-bottom: 28px; }
  .philosophy .section-heading > p {
    max-width: none;
    font-size: 12px;
    line-height: 2;
    letter-spacing: .02em;
  }
  .philosophy .intro-sentence { display: block; }
  .reason-grid { gap: 30px; }
  .reason-copy { margin-top: 16px; gap: 16px; }
  .reason-copy > div { min-width: 0; }
  .reason h3 { letter-spacing: .02em; text-wrap: balance; }
  .reason p { letter-spacing: .02em; }
  .menu-rows { margin-top: 20px; }
  .menu-row, .menu-row:first-child { padding-top: 20px; padding-bottom: 20px; }
  .menu-description p { font-size: 12px; line-height: 1.9; letter-spacing: .02em; }
  .menu-price { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
  .menu-price .text-link {
    float: none;
    align-self: flex-end;
    min-height: 44px;
    margin-top: 0;
    font-size: 12px;
    padding: 10px 0;
  }
  .gallery-filters button { min-height: 44px; font-size: 11px; }
  .dialog-close { width: 44px; height: 44px; }
  .mobile-nav {
    max-height: calc(100svh - 74px - var(--mobile-bottom-space));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .mobile-nav > a { min-height: 44px; }
  .mobile-reserve {
    box-sizing: border-box;
    height: var(--mobile-bottom-space);
    padding-bottom: var(--mobile-safe-bottom);
    background: linear-gradient(to right, var(--paper) 36%, var(--ink) 36%);
  }
  .mobile-reserve > a, .mobile-reserve > button { min-height: 44px; }
  .dialog-open .mobile-reserve { visibility: hidden; }
  .reservation-actions .button { gap: 16px; letter-spacing: .07em; }
  .site-footer { padding-bottom: 46px; }
}
@media (max-width: 370px) {
  .reason-copy {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px 14px;
  }
  .reason-copy > div { display: contents; }
  .reason-number { grid-column: 1; grid-row: 1; font-size: 38px; }
  .reason h3 { grid-column: 2; align-self: center; font-size: 18px; margin: 0; }
  .reason p { grid-column: 1 / -1; font-size: 12px; }
  .artist { padding-left: 24px; padding-right: 24px; }
  .artist-copy .jp-title { font-size: 23px; letter-spacing: 0; }
  .flow-list > li { grid-template-columns: 88px minmax(0, 1fr); gap: 14px; }
  .step-photo { width: 88px; height: 88px; }
  .flow-list > li:not(:last-child)::after { left: 39px; }
  .flow-list p { letter-spacing: 0; }
  .menu-row { grid-template-columns: 68px minmax(0, 1fr); column-gap: 14px; }
  .menu-thumb { width: 68px; height: 95px; }
  .menu-description h3 { font-size: 16px; letter-spacing: 0; }
  .menu-price > p { font-size: 26px; }
  .menu-price > p > span { min-width: 48px; margin-right: 8px; }
  .gallery-filters button { padding-left: 8px; padding-right: 8px; }
  .reservation h2 { font-size: 25px; letter-spacing: .02em; }
}
/* Adopted mobile body typography. Desktop, headings, prices and controls retain their sizes. */
@media (max-width: 760px) {
  .hero-copy > p,
  .hero-location small,
  .philosophy .section-heading > p,
  .reason p,
  .artist-copy .body-copy,
  .artist-copy > .fine-print,
  .gallery .section-subtitle,
  .gallery-desc,
  .gallery-note,
  .voices .fine-print,
  .voices blockquote,
  .voices cite,
  .flow-list p,
  .menu-intro > .body-copy,
  .menu-intro > .fine-print,
  .menu-description p,
  .menu-footnote p,
  .faq .body-copy,
  .faq-answer,
  .access-address,
  .access-hours,
  .access-guide,
  .access-disclaimer,
  .access-location figcaption,
  .reservation > div > p,
  .reservation .reservation-actions > p {
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: .01em;
  }
  .philosophy .intro-sentence { text-wrap: balance; }
  .gallery .section-subtitle,
  .gallery-desc, .flow-list p { line-height: 1.8; }
  .menu-description p, .menu-footnote p { line-height: 1.85; }
}

/* Give descriptions their own reading width without changing the photo collection. */
@media (max-width: 760px) {
  .mobile-phrase { display: inline-block; width: max-content; max-width: 100%; white-space: normal; vertical-align: baseline; }
  .menu-description { display: contents; }
  .menu-description h3 { grid-column: 2; grid-row: 1; align-self: start; margin-bottom: 0; padding-top: 5px; }
  .menu-description p { grid-column: 1 / -1; grid-row: 2; }
  .menu-description p br, .flow-list p br { display: none; }
  .menu-thumb { grid-column: 1; grid-row: 1; }
  .menu-row { row-gap: 14px; }
  .menu-price { display: contents; }
  .menu-price .text-link { margin-left: auto; }
  .gallery-desc { letter-spacing: 0; }
  .menu-footnote { flex-direction: column; gap: 4px; }
}
@media (max-width: 370px) {
  .gallery-grid { column-gap: 12px; }
  .flow-list > li { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
  .step-photo { width: 72px; height: 72px; }
  .flow-list > li:not(:last-child)::after { left: 31px; }
  .flow-list p { letter-spacing: 0; }
}
@media (max-width: 760px) {
  .hero-copy > .hero-location, .concern-list li,
  .dialog-intro, #design-description, .design-detail > .fine-print,
  .info-dialog > p:not(.section-label), .booking-message {
    font-size: 14px; line-height: 1.8; letter-spacing: .01em;
  }
  .menu-price { display: contents; }
  .menu-price > p { grid-column: 2; grid-row: 1; align-self: end; text-align: left; padding-bottom: 5px; }
  .menu-price > p > span { font-size: 14px; }

  .menu-price .text-link { grid-column: 1 / -1; grid-row: 3; justify-self: end; }
}
@media (max-width: 760px) {
  .hero h1, .menu-intro .english-title { white-space: normal; }
}
/* Slightly deeper tones for readable mobile text on the existing palette. */
@media (max-width: 760px) {
  .philosophy .section-heading > p, .reason p,
  .gallery-desc, .gallery-note, .voices .fine-print, .voices cite,
  .access-hours, .access-guide, .access-disclaimer, .access-location figcaption { color: #70645c; }
  .menu-price .text-link { color: #86634f; border-color: currentColor; }
  .gallery-filters button.active { background: #896957; }
  .google-map-button { background: #7b716c; }
  .footer-bottom > p { font-size: 14px; line-height: 1.8; letter-spacing: .01em; }
}