/**
 * Design tokens — Figma「TOP採用版」node-id=212-3 から抽出した実値
 *
 * 既存トークン名（--color-gold 等）は後方互換のため残置。
 * Figma 新色は --color-accent / --color-secondary 系として追加。
 */
:root {
	/* ---- brand color (Figma実値) ---- */
	--color-bg:            #faf9f6;  /* メインBG（Figma frame #FAF9F6） */
	--color-bg-warm:       #f8f3ec;
	--color-bg-cream:      #f4efe1;  /* 装飾英字・料金セクション */
	--color-bg-ivory:      #edd8c9;  /* Hero装飾 PARTNERSHIP 文字色 */

	--color-text:          #412707;  /* ダークブラウン（メインテキスト） */
	--color-text-sub:      #2c2825;  /* Contact 見出し等 */
	--color-text-body:     #6b6560;  /* 特典リスト等の補助テキスト */
	--color-text-muted:    #9b9590;  /* 非アクティブ言語スイッチ・日付 */
	--color-text-footer:   #333333;  /* コピーライト */

	--color-accent:        #bb8b80;  /* Point 見出し・Voice バッジ・ピンクブラウン */
	--color-accent-strong: #bc8a7f;  /* 強調テキスト（concerns強調） */
	--color-secondary:     #9a7f6c;  /* ヘッダーナビ・CTAテキスト・タン */
	--color-cta-bg:        #e2cebd;  /* CTA背景 */

	--color-logo:          #131D3C;  /* Figma variable「ロゴ色」 */
	--color-white:         #ffffff;
	--color-border:        #e5ddd4;
	--color-voice-bubble:  rgba(228, 199, 178, 0.2);  /* concerns カード3の透明ベール */

	/* 旧トークン（後方互換） */
	--color-gold:          #bb8b80;
	--color-gold-light:    #e2cebd;
	--color-gold-dark:     #9a7f6c;
	--color-mauve:         #bc8a7f;
	--color-mauve-light:   #edd8c9;
	--color-text-light:    #6b6560;

	/* ---- typography ---- */
	--font-display:   'Playfair Display', 'Cormorant Garamond', serif;
	--font-script:    'Dancing Script', 'Playfair Display', cursive;
	--font-serif-jp:  'Shippori Mincho', 'Noto Serif JP', serif;
	--font-body-jp:   'Noto Serif JP', 'Shippori Mincho', serif;
	--font-body:      'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;

	/* ---- sizing (clamp / 1440px基準 → モバイル縮退) ---- */
	--container-max:  1200px;
	--container-pad:  clamp(20px, 5vw, 60px);

	/* タイポスケール */
	--fs-hero-main:      clamp(24px, 3.8vw, 37px);   /* Hero「本気で生涯の」37px */
	--fs-hero-en-large:  clamp(22px, 2.4vw, 34.65px); /* Hero PARTNERSHIP 34.6px */
	--fs-hero-en-small:  clamp(14px, 1.45vw, 20.3px); /* Hero CONCIERGE 20px */
	--fs-hero-script:    clamp(22px, 2.1vw, 30px);   /* International Dancing 30px */
	--fs-h2:             clamp(22px, 2.2vw, 28px);   /* セクション和文見出し 28px */
	--fs-h2-deco:        clamp(20px, 1.8vw, 26px);   /* 英字見出し 26px */
	--fs-h2-vertical:    clamp(28px, 3.2vw, 44px);   /* 装飾縦組英字 44px */
	--fs-h3:             clamp(20px, 1.8vw, 26px);   /* Reasons ポイント見出し */
	--fs-h3-card:        clamp(18px, 1.6vw, 20px);   /* Concerns カード見出し */
	--fs-price-big:      clamp(16px, 1.4vw, 18px);   /* 料金表数値 */
	--fs-plan-en:        clamp(28px, 2.8vw, 40px);   /* Standard/Elite Dancing 40px */
	--fs-body:           15px;
	--fs-body-lead:      16px;
	--fs-small:          14px;
	--fs-xs:             12px;
	--fs-quote:          clamp(60px, 6vw, 100px);    /* 声のクォート記号 */

	/* letter-spacing（Figma から採寸） */
	--ls-title:        0.14em;  /* Hero 5.18px / 37px */
	--ls-eyebrow:      0.25em;
	--ls-hero-en:      0.3em;   /* PARTNERSHIP 3.46px / 34.65 */
	--ls-nav:          0.08em;
	--ls-wide:         0.12em;  /* 和文見出し */
	--ls-card:         0.05em;
	--ls-tight:        0.03em;

	/* ---- spacing ---- */
	--gap-xs:   8px;
	--gap-sm:   16px;
	--gap-md:   24px;
	--gap-lg:   40px;
	--gap-xl:   64px;
	--gap-2xl:  96px;
	--gap-3xl:  140px;

	--section-pad: clamp(60px, 10vw, 140px);

	/* ---- radius ---- */
	--radius-sm:   2px;
	--radius-md:   8px;
	--radius-lg:   30px;
	--radius-pill: 100px;

	/* ---- shadow ---- */
	--shadow-sm: 0 2px 8px rgba(65, 39, 7, 0.06);
	--shadow-md: 0 6px 24px rgba(65, 39, 7, 0.08);
	--shadow-card: 0 4px 20px rgba(65, 39, 7, 0.06);

	/* ---- easing / duration ---- */
	--ease-out-expo:   cubic-bezier(0.16, 1, 0.3, 1);
	--ease-out-quart:  cubic-bezier(0.25, 1, 0.5, 1);
	--dur-fast:  0.2s;
	--dur-mid:   0.45s;
	--dur-slow:  0.9s;

	/* legacy (app.css references) */
	--easing:  var(--ease-out-expo);

	/* ---- z-index ---- */
	--z-header:      100;
	--z-mobile-cta:  110;
	--z-modal:       1000;
}
