/* =============================================================
   住み継ぐリノベ LP – デザイントークン
   既存LP（mpluskenchikukobo.com/lp/）のスタイルを継承
   ============================================================= */

:root {
  /* ====================================
     カラーパレット
     ==================================== */

  /* セクション背景：3色を交互に配置するベース構成 */
  --color-beige:        #EAE5DE;  /* セクション背景（ベージュ）*/
  --color-white:        #FFFFFF;  /* セクション背景（白）*/
  --color-gray:         #E8E8E8;  /* セクション背景（グレー / CTA向け）*/

  /* 旧クリーム系（後方互換のため残置、現状参照箇所のため徐々に置換予定） */
  --color-cream:        #FFFFFF;
  --color-paper:        #EAE5DE;
  --color-paper-warm:   #EAE5DE;
  --color-paper-deep:   #E8E8E8;
  --color-line:         #cccccc;  /* 区切り線・ボーダー（ニュートラルグレー） */
  --color-input-bg:     #eeeeee;  /* フォーム入力欄の背景 */

  /* アクセント */
  --color-navy:         #1C275B;  /* 紺：英字（STEP表記など）に使用 */
  --color-button:       #6D635B;  /* ボタン背景の茶 */
  --color-button-hover: #564E47;  /* ボタン背景の茶（ホバー時：やや濃い） */
  --color-accent:       #8a6a3c;  /* 茶系のサブアクセント（ボーダー・装飾線等） */
  --color-accent-deep:  #6c4f25;

  /* テキスト */
  --color-ink:          #362e26;
  --color-ink-soft:     #4a4339;
  --color-muted:        #686868;

  /* 補助色 */
  --color-leaf:         #6b7a4f;
  --color-orange:       #da6d00;  /* 必須マーク等のアクセント */


  /* ====================================
     タイポグラフィ
     ==================================== */

  /* フォントファミリー */
  --font-mincho: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", serif;
  --font-latin:  "Cormorant Garamond", "Shippori Mincho", serif;

  /* 既存LPは font-weight 500 をメインに使用、強調で 600 */
  --font-weight-base:    500;
  --font-weight-strong:  600;

  /* フォントサイズ階層（rem単位、相対値で組む） */
  --font-size-xs:     0.68rem;   /* キャプション・補助 */
  --font-size-sm:     0.78rem;   /* 小さめ本文・ラベル */
  --font-size-base:   0.95rem;   /* 標準本文 */
  --font-size-md:     1.05rem;   /* リード文 */
  --font-size-lg:     1.3rem;    /* サブ見出し */
  --font-size-xl:     1.6rem;    /* セクション見出し */
  --font-size-2xl:    1.8rem;    /* 大見出し */
  /* FVキャッチコピー等の大型サイズは個別指定 */

  /* letter-spacing（字間） */
  --letter-spacing-base:    0.04em;  /* 本文 */
  --letter-spacing-wide:    0.14em;  /* 見出し */
  --letter-spacing-widest:  0.32em;  /* 英字・装飾 */

  /* line-height（行間） */
  --line-height-tight:  1.55;
  --line-height-base:   1.85;
  --line-height-loose:  2.0;


  /* ====================================
     形状・装飾
     ==================================== */

  /* 角丸 */
  --radius-pill:    999px;  /* ボタン（pill型）*/
  --radius-card:    8px;    /* カード・フォーム */
  --radius-small:   4px;    /* 細部装飾 */
  --radius-circle:  50%;    /* 円形アイコン */

  /* シャドウ（柔らかく深みのある2層） */
  --shadow-card:
    0 30px 60px -28px rgba(58, 42, 18, 0.28),
    0 8px 18px -10px rgba(58, 42, 18, 0.18);


  /* ====================================
     レイアウト
     ==================================== */

  /* コンテナ最大幅 */
  --container-main:   880px;   /* 通常コンテンツ幅 */
  --container-wide:   1240px;  /* フルワイド（FV等）*/

  /* ブレークポイント（メディアクエリ参考値、CSS変数では@media内で使えないためコメント） */
  /* --bp-tablet: 980px */
  /* --bp-mobile: 880px */ /* メインBP */
  /* --bp-small:  600px */
  /* --bp-tiny:   420px */
}


/* =============================================================
   ベーススタイル（リセット＋初期設定）
   ============================================================= */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-mincho);
  font-weight: var(--font-weight-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  letter-spacing: var(--letter-spacing-base);
  color: var(--color-ink);
  background-color: var(--color-white);
  /* 日本語の自動改行調整 */
  word-break: auto-phrase;
  line-break: strict;
}

p, .lead, .summary {
  text-wrap: pretty;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
}


/* =============================================================
   ユーティリティクラス
   ============================================================= */

.serif {
  font-family: var(--font-mincho);
  font-feature-settings: "palt";
}

.latin {
  font-family: var(--font-latin);
  letter-spacing: var(--letter-spacing-base);
}

.container {
  max-width: var(--container-main);
  margin: 0 auto;
  padding: 0 24px;
}