/* ═══════════════════════════════════════════════════
   PLF LP base.css — homepage 埋め込み用スコープ版
   グローバル汚染（body 背景ダーク化 / * リセット）を .plf-lp 内に封じ込め。
   元: plf-lp/css/base.css をスコープ化（2026-06-19 統合）
   HEX直書き禁止 — トークン定義行のみ例外
═══════════════════════════════════════════════════ */

/* ── 1. Design Tokens (:root) ── 名前空間 --hc-* で homepage と非衝突 ── */
:root {
  --hc-dark:         #0A0F1E;
  --hc-dark-mid:     #0F1528;
  --hc-navy:         #1E3A5F;
  --hc-gold:         #C89B3C;
  --hc-gold-dim:     #8A6B28;
  --hc-gold-hover:   #D4AE5A;
  --hc-gold-glow:    rgba(200,155,60,0.35);
  --hc-teal:         #0D9488;
  --hc-text:         #F0F4FF;
  --hc-text-dim:     rgba(240,244,255,0.72);
  --hc-text-dimmer:  rgba(240,244,255,0.55);
  --hc-text-sub:     rgba(240,244,255,0.55);
  --hc-overlay:      rgba(10,15,30,0.72);
  --hc-overlay-dark: rgba(10,15,30,0.88);
  --hc-divider:      rgba(240,244,255,0.10);
  --hc-muted:        rgba(240,244,255,0.20);
  --hc-navy-bg:      rgba(30,58,95,0.55);
  --hc-field-bg:     rgba(10,15,30,0.65);
  --hc-card-bg:      rgba(10,15,30,0.50);
  --hc-glass-bg:     rgba(15,21,40,0.60);
  --hc-glass-border: rgba(240,244,255,0.12);

  /* タイポスケール */
  --size-hero:   clamp(5rem, 18vw, 14rem);
  --size-recall: clamp(5.5rem, 20vw, 16rem);
  --size-h1:     clamp(2.5rem, 6vw, 5rem);
  --size-h2:     clamp(1.8rem, 3.5vw, 3rem);
  --size-tagline: clamp(1.25rem, 2.5vw, 2rem);
  --size-body:   clamp(0.95rem, 1.5vw, 1.15rem);
  --size-sub:    clamp(0.9rem, 1.4vw, 1.1rem);
  --size-kicker: clamp(0.75rem, 1.2vw, 0.9rem);
}

/* ── 2. Reset（.plf-lp 配下に限定）─────────────── */
.plf-lp, .plf-lp *, .plf-lp *::before, .plf-lp *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ── 3. LP コンテナ（旧 body 役）──────────────── */
.plf-lp {
  position: relative;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  background-color: var(--hc-dark);
  color: var(--hc-text);
  -webkit-font-smoothing: antialiased;
}

/* ── 4. ユーティリティ ────────────────────────── */
.plf-lp .gold { color: var(--hc-gold); }

/* ── 5. reduced-motion フォールバック共通（.plf-lp 内）── */
@media (prefers-reduced-motion: reduce) {
  .plf-lp *, .plf-lp *::before, .plf-lp *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
  .plf-lp .kinetic-wrap  { height: auto !important; }
  .plf-lp .kinetic-stage { position: static !important; height: auto !important; padding: 6rem 2rem; }
  .plf-lp .progress-bar  { display: none !important; }
  .plf-lp .scroll-arrow  { display: none !important; }
  .plf-lp .phase-search  { opacity: 0 !important; }
  .plf-lp .phase-recall  { opacity: 1 !important; display: flex !important; }
  .plf-lp .recall-kicker { opacity: 1 !important; transform: none !important; }
  .plf-lp .rw            { opacity: 1 !important; transform: none !important; filter: none !important; }
  .plf-lp .phase-tagline { opacity: 1 !important; }
  .plf-lp .tagline       { opacity: 1 !important; transform: none !important; }
  .plf-lp .tagline-sub   { opacity: 1 !important; transform: none !important; }
  .plf-lp .summon-scroll-wrap { display: none !important; }
  .plf-lp .static-fallback    { display: flex !important; }
  /* clip-section: poster 静止 + テキスト即表示 */
  .plf-lp .clip-section video { display: none !important; }
  .plf-lp .clip-poster  { display: block !important; }
  .plf-lp .clip-text    { opacity: 1 !important; transform: none !important; }
}