/*
 * astra-reset.css — Astra 親テーマの挙動に対するカウンタールール集約
 *
 * 方針: Astra 由来の挙動がカスタム 5-zone UX と衝突する箇所を、全て本ファイルに
 *       まとめて "1 箇所で解除" できる形に保つ。将来 Astra を外す or 別親テーマ
 *       に移る時は本ファイルを削除すれば足りる。
 *
 * Cascade order (enqueue.php 参照): Astra -> lp-design-tokens -> lp-astra-reset
 * -> lp-components -> lp-pages。design-tokens が先なので `var(--*)` が使える。
 *
 * 本ファイルに入れるべきもの:
 *   - Astra が .entry-content 内の h1-h6 / p に強制してくる色/フォントサイズ
 *   - Astra の `.site-content .ast-container { display:flex; direction:row }`
 *     (Phase 1 で desktop レイアウトが横並び崩壊した真因)
 *
 * 入れないもの:
 *   - .lp-header / .lp-footer のスタイル (= PHP マークアップの構造補完であって
 *     Astra カウンターではない。components.css に残す)
 */

/* ==========================================================================
 * .entry-content 見出し/段落の neutralize
 *
 * Astra は `.entry-content :where(h1..h6) { color:#808285; font-size:2em; ... }`
 * を強制してくる。カスタムテンプレはインライン style / 独自 class で色/サイズ
 * を制御しているので、Astra のこのルールを inherit にして黙らせる。
 * ========================================================================== */
body[class*="zone-"] .entry-content :where(h1, h2, h3, h4, h5, h6) {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  margin-bottom: 0;
}
body[class*="zone-"] .entry-content :where(p) {
  margin-bottom: 0;
}

/* ==========================================================================
 * .ast-container flex-direction 強制 (desktop)
 *
 * Astra は desktop (>=922px) で `.site-content .ast-container` を
 * `display:flex` + `flex-direction:row` (default) にする。これは `.ast-container`
 * の子が <main> + optional <aside sidebar> の 1-2 要素だけという前提。
 *
 * カスタムゾーンテンプレは get_header() 直後に <div class="section"> を複数
 * 並べて出力するため、それらが flex row の子になって min-content 幅 (日本語
 * なら 1 文字分) に潰れる。Phase 1 の視覚崩壊の根本原因。
 *
 * 強制的に column 方向にして縦積みに戻す。モバイル (<=921px) では Astra 自身が
 * column を当ててくるので本ルールは不要。
 * ========================================================================== */
@media (min-width: 922px) {
  body[class*="zone-"] .site-content > .ast-container {
    flex-direction: column;
  }
}