/*
 * B案 CSS override — wide-viewport (幅 2000px 超) レイアウト崩れの一括修正
 *
 * ======================================================================
 *  背景
 * ======================================================================
 * 元 CSS は「セクションを 1080px 幅で中央寄せ」する為に以下のパターンを使う:
 *
 *   padding-inline: max(22px, 50% - 540px) !important;
 *
 * この `%` は CSS 仕様上、親要素の幅を参照する。親 <main> がフル幅なら
 * `50% = 1280px @2560vw → 1280 - 540 = 740px パディング` が両側に入る。
 *
 * ●【動く】 セクション: outer = full-width (2545px)
 *   padding 740+740 で content = 1065px ≈ 1080 ✓
 *   → .danger-band / .reason-section / .area-section / .contact-section /
 *     .operation-section / .lp-repeat-cta / .site-footer
 *
 * ●【潰れる】セクション: outer が既に narrow (1180px 等の max-width)
 *   padding 740+740 が outer を超過 → content = 0 ✗
 *   → .service-promise (width: min(1180px, 100% - 40px))
 *   → #price.section (width: min(1080px, 100% - 48px))
 *
 * ======================================================================
 *  修正戦略
 * ======================================================================
 * 「潰れる」narrow セクションだけ padding-inline を小さく固定する。
 * 「動く」full-width セクションは触らない (元の中央寄せトリックが機能してる)。
 */

/* ---- narrow セクション: padding-inline を最小に固定 ---- */
main.delivery-polish .service-promise,
main.delivery-polish #price.section {
  padding-left: 22px !important;
  padding-right: 22px !important;
}

/*
 * ======================================================================
 *  バグ #2: #price.section が左寄せになる
 * ======================================================================
 * 元 CSS の
 *   main.delivery-polish .section {margin: 0 !important; ...}
 * が specificity 0-2-1 で勝ち、bare `.section {margin: 0 auto}` (0-1-0) を
 * 上書きしてしまうため #price.section が親の左端に張り付く。
 * (`.service-promise` は別ルールで margin: auto !important が既に効いてる)
 *
 * FIX: #price.section だけ margin-inline: auto を強制。
 */
main.delivery-polish #price.section {
  margin-left: auto !important;
  margin-right: auto !important;
}
