/* SITE 126 — レスポンシブ
   調整順（MASTER §7）: カラム減少 → 縦積み → 余白 → 写真比率 → 折畳み → 表カード化 → 最後に見出し
   本文・料金・時刻・住所・フォームラベルは16px、注記は14pxを下回らせない。
   ドロワー切替と固定CTA表示のブレークポイントは1023pxで一致させる。 */

/* ============ 1440px以上 ============ */
@media (min-width: 1440px) {
  .container { padding-inline: var(--sp-6); }
}

/* ============ 1279px以下: ヘッダーを詰める / 列数を落とす ============ */
@media (max-width: 1279px) {
  .header-actions .btn--tel .btn__label { display: none; }
  .header-actions .btn--tel { width: var(--tap); padding-inline: 0; }
  .global-nav__list { gap: 12px; }
  .featured { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============ 1119px以下: 2カラム構成を縦積みへ ============ */
@media (max-width: 1119px) {
  .access-layout { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
  .hero-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ============ 1023px以下: ドロワー・固定CTA ============ */
@media (max-width: 1023px) {
  :root { --h-header: 62px; --h-anchor: 48px; }
  body { padding-bottom: calc(var(--h-cta) + 1px + env(safe-area-inset-bottom, 0px)); }
  /* CANON必須: 固定モバイルCTAの高さぶんをスクロール到達の下端マージンにも反映する。
     scroll-padding-topだけでは、フォーム内をTab移動・scrollIntoViewした際に
     入力欄やボタンが固定CTAの裏に隠れ、実際のタップ/クリック座標を固定CTAに奪われる
     （実測: 390pxでチェックボックスをクリックしたら固定CTAのMENUリンクが反応した）。
     scroll-margin-bottomだけでは短いパネルで発動しないことがあるため、
     スクロールコンテナ側のscroll-padding-bottomも必ず設定する。 */
  html, html.onepage { scroll-padding-bottom: calc(var(--h-cta) + var(--sp-4)); }

  .global-nav { display: none; }
  .drawer-toggle { display: flex; }
  .header-actions { margin-left: auto; }
  .header-actions .btn--tel { display: none; }
  .mobile-cta { display: block; }

  .brand__sub { display: none; }

  .anchor-nav__label { display: none; }
  .anchor-nav__top { display: flex; }

  .grid--4, .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--2 { grid-template-columns: minmax(0, 1fr); }
  .featured { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .split, .split--wide-left { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
  .role-grid { grid-template-columns: minmax(0, 1fr); }

  .section { padding-block: var(--sp-7); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============ 767px以下: 完全1カラム / 表のカード化 ============ */
@media (max-width: 767px) {
  .container { padding-inline: var(--sp-4); }

  .hero { padding-block: var(--sp-5) var(--sp-6); }
  .hero__actions .btn { flex: 1 1 100%; }
  .hero-facts { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .hero-facts dt { display: none; }
  .hero-facts dd { border-right: 0; border-bottom: 1px solid var(--c-line); }
  .hero-facts dd:last-child { border-bottom: 0; }

  .featured { grid-template-columns: minmax(0, 1fr); }
  .concept-points { grid-template-columns: minmax(0, 1fr); }

  .def-list__row { grid-template-columns: minmax(0, 1fr); }
  .def-list__key { border-right: 0; border-bottom: 1px solid var(--c-line); }
  .confirm-list__row { grid-template-columns: minmax(0, 1fr); }
  .confirm-list__key { border-bottom: 1px solid var(--c-line); }

  .menu-item { grid-template-columns: minmax(0, 1fr); }
  .menu-item__price { text-align: left; }

  .news-item summary { flex-direction: column; align-items: flex-start; gap: 6px; }

  .section { padding-block: var(--sp-6); }
  .section-head { margin-bottom: var(--sp-5); }
  .footer-grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }

  .cta-band { padding: var(--sp-4); }
  .cta-band__actions { width: 100%; }
  .cta-band__actions .btn { flex: 1 1 100%; }

  .form-foot { justify-content: stretch; }
  .form-foot .btn { flex: 1 1 140px; }
}

/* ============ 479px以下: 390pxを正 ============ */
@media (max-width: 479px) {
  .container { padding-inline: 14px; }
  .page-head { padding-block: var(--sp-6) var(--sp-5); }
  .tabs { gap: 6px; }
  .tab { padding: 8px 12px; font-size: var(--fs-note); }
}

/* ============ 360px以下の保険（320pxまで破綻させない） ============ */
@media (max-width: 360px) {
  .container { padding-inline: 12px; }
  .brand__mark { width: 30px; height: 30px; }
  .brand__name { font-size: 15px; }
  .mobile-cta__item { font-size: var(--fs-note); padding-inline: 2px; }
}