/* ==========================================================================
   Button (CTA) — 共通CTAコンポーネント
   ==========================================================================
   対象（計6箇所）:
     - .l-header__cta / .l-nav__cta      → css/components/header.css
     - .hero__cta-btn                    → css/sections/hero.css
     - .worries__cta-btn                 → css/sections/worries.css
     - .contact__submit                  → css/sections/contact.css
     - .final-cta__btn                   → css/sections/final-cta.css

   [事前分析：安全に共通化できた項目]
   6箇所すべてで、ブレークポイントによる上書きも含めて完全に同じ値だった
   のは以下の4プロパティのみ。
     - align-items: center;
     - justify-content: center;
     - color: var(--color-base);
     - font-weight: 700;（worries__cta-btnと final-cta__btn のPC版のみ
       900に意図的に上書きされているため、上書き宣言はそれぞれの
       ファイル側にそのまま残してある）

   [事前分析：あえて共通化しなかった項目]
   実装方法そのものが6箇所で異なっており、統一するとカスケード結果や
   見た目が変わるリスクが高いため、今回は一切手を加えず各ファイルに
   残した。
     - 背面オフセット装飾（4パターンが混在）
         l-header__cta   : 装飾なし（そもそも影表現を持たない）
         l-nav__cta      : ::before（z-index:-1）
         hero__cta-btn   : 子span(.hero__cta-btn-deco) + box-shadow を
                            ブレークポイントで切替
         worries__cta-btn: 兄弟span(.worries__cta-btn-deco, z-index:1) +
                            box-shadow をブレークポイントで切替
         contact__submit : ::before + ::after + box-shadow をブレーク
                            ポイントで切替
         final-cta__btn  : ::before + ::after（SP/PC共通、box-shadowなし）
     - hover / transition：l-nav__cta と worries__cta-btn には元々
       hoverもtransitionも存在しない（他4箇所にはある）。存在しない箇所に
       追加すると「意図しない動作の追加」になるため見送った。
     - width / height / padding / gap / font-size：全箇所で個別の値。
     - position / z-index：背面装飾の実装方法と密結合しているため個別。
     - 矢印アイコン：l-header__cta と l-nav__cta にはそもそも矢印画像が
       存在しない。存在する4箇所も width / aspect-ratio が全て異なる。
     - letter-spacing：worries(0.02em)・contact(0.04em)のみ個別設定。
     - display：flex / inline-flex / none をそれぞれ意味を持って使い
       分けており（特に l-header__cta と l-nav__cta はブレークポイントに
       よる出し分けそのものに display を使っている）、共通化すると
       表示切り替えロジックを壊すリスクがあるため個別のまま。

   [使い方]
   既存のBEMクラス（.hero__cta-btn 等）は変更せず、それに加える形で
   .c-cta-btn を付与する。CSSの読み込み順は、この button.css が
   header.css より後・各 sections/*.css より前に読み込まれるため、
   worries__cta-btn / final-cta__btn(PC) 側の font-weight:900 の
   上書きはそのまま有効（後から読み込まれるファイルの同一詳細度セレクタが
   勝つ）。
   ========================================================================== */
.c-cta-btn {
  align-items: center;
  justify-content: center;
  color: var(--color-base);
  font-weight: 700;
}