/* 下層ヒーローは各ページの背景変数を使用。初期生成の写真の二重表示を止める。 */
.cp-page-hero.aihp-subpage-hero--with-image::before { background-image: none; }

/* ==========================================================================
   店主紹介を文章中心にする調整（index #message / about 店主セクション）。
   写真枠（placeholder-portrait）を取り除いたあとに空の列が残らないよう、
   枠組みの列構成だけを組み替える。配色・フォントは既存の変数に依存。
   ========================================================================== */

/* index #message: 写真列を除き「本文 + 縦書き署名」の 2 列に */
.message__grid--text-only { grid-template-columns: minmax(0, 7fr) auto; }

/* about 店主紹介: 写真列を除き、本文を見やすい 1 列幅に収める */
.two-col--text-only { grid-template-columns: minmax(0, 1fr); max-width: 46rem; }

/* main.css のブレークポイント定義（写真列あり前提）より後に読み込まれるため、
   写真なしの並びに合わせて列数を上書きする */
@media (max-width: 1024px) {
  .message__grid--text-only { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   スマートフォン（560px 以下）のトップヒーロー: 見出し → 料理写真 →
   予約ボタン → 説明文の順に並べ替える。PC 表示は従来どおり。
   実ブラウザで 320 / 375 / 390px を検証済み。
   ========================================================================== */
@media (max-width: 560px) {
.page-home .hero { padding-block: 1.5rem 3rem; }
.page-home .hero__grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.page-home .hero__copy, .page-home .hero__text { display: contents; }
.page-home .hero__title { grid-row: 1; font-size: clamp(1.65rem, 7.2vw, 2rem); line-height: 1.55; letter-spacing: .06em; }
.page-home .hero__media { grid-row: 2; min-width: 0; }
.page-home .hero__media picture { display: block; }
.page-home .hero__media img { height: auto; }
.page-home .hero__actions { grid-row: 3; margin-top: 0; gap: .8rem 1rem; }
.page-home .hero__text .eyebrow { grid-row: 4; margin-top: .5rem; }
.page-home .hero__text p.body { grid-row: 5; }
.page-home .hero__text .en-italic { grid-row: 6; font-size: 1rem; }
}

/* 写真差し替え互換性: data-slot を標準の gallery- 接頭辞に揃えたことに合わせる */
img[data-slot="gallery-pairing-glass"] { object-position: 68% center; }
img[data-slot="gallery-access-entrance"] { object-position: 56% center; }