/* ============================================================
   Future Secure Wave — Foundations: Color & Type
   フューチャーセキュアウェイブ株式会社
   Derived from the official template: FSW_テンプレート_ver1.2.pptx
   Base: white · navy #0A1561 · pale-blue gradient · crimson accent
   ============================================================ */

/* ---- Fonts -------------------------------------------------
   Primary : Meiryo / メイリオ
   Fallback: system Japanese sans-serif fonts.
   Meiryo is expected to be available in the export/viewing environment.
------------------------------------------------------------- */

:root {
  /* ===== Brand navy (primary) ===== */
  --navy-900: #060D3E;   /* deepest — reversed slides, footers */
  --navy-800: #0A1561;   /* PRIMARY brand navy (titles, logo, bars) */
  --navy-700: #223178;   /* gradient mid / hover */
  --navy-600: #33408C;

  /* ===== Pale blue (secondary accent / gradient end) ===== */
  --paleblue: #B3D9FF;   /* signature gradient end, highlights, fills */
  --paleblue-200: #D6E9FF;
  --paleblue-100: #EAF3FF;

  /* ===== Crimson (logo "wave" accent — use sparingly) ===== */
  --crimson:    #D6004B; /* brand crimson (vector) */
  --crimson-bright: #F00048; /* logo PNG crimson */
  --crimson-600: #B1003E; /* hover / press */
  --crimson-100: #FCE4EC;

  /* ===== Neutrals (cool grey) =====
     v2: ミュート文字を WCAG 準拠まで濃く調整（寸法・用途は不変）
       #757575(≈4.6:1) / #7F7F7F(≈4.0:1 不合格) → #5C6470(≈6.0:1) */
  --white:    #FFFFFF;
  --paper:    #FFFFFF;   /* slides are pure white */
  --slate-50: #F5F7FB;
  --slate-100:#EDF1F7;
  --slate-200:#DEE4EE;
  --slate-300:#C5CEDD;
  --slate-400:#9AA5B8;
  --gray-500: #5C6470;   /* template muted grey (subtitles / notes) ≈6.0:1 */
  --gray-600: #5C6470;   /* footer / placeholder grey ≈6.0:1 */
  --slate-700:#3A4252;
  --ink:      #1A1F2E;   /* body text (near-black) */
  --black:    #000000;

  /* ===== Semantic ===== */
  --success:  #1E7E46;  --success-bg:#E6F3EC;
  --warning:  #9A5A00;  --warning-bg:#FBF1DF;  /* darkened ≈4.8:1 */
  --danger:   #C0142C;  --danger-bg: #FBE7EA;
  --info:     #0A1561;  --info-bg:   #EAF3FF;

  /* ===== Foreground roles ===== */
  --fg-1: var(--navy-800);   /* headings / titles */
  --fg-body: var(--ink);     /* body copy */
  --fg-2: var(--slate-700);  /* secondary */
  --fg-3: var(--gray-500);   /* captions / subtitles */
  --fg-on-navy: #FFFFFF;
  --fg-on-navy-dim: #C9E0FF; /* on-navy 補助文字 ≈8:1（旧 #B3D9FF を微調整） */
  --brand: var(--navy-800);
  --accent: var(--crimson);
  --line: var(--slate-200);
  --line-strong: var(--slate-300);

  /* ===== Backgrounds & the signature gradient ===== */
  --bg-page: var(--white);
  --bg-surface: var(--white);
  --bg-navy: var(--navy-800);
  /* The template's title underline bar: navy holds, then → pale blue */
  --grad-bar: linear-gradient(90deg, #0A1561 0%, #0A1561 30%, #B3D9FF 100%);
  /* Full navy field (section/closing on dark) */
  --grad-navy: linear-gradient(90deg, #0A1561 0%, #0A1561 88%, #223178 100%);
  --grad-navy-deep: linear-gradient(135deg, #060D3E 0%, #0A1561 55%, #223178 100%);

  /* ===== Type families ===== */
  --font-jp:   "Meiryo", "メイリオ", "Yu Gothic", "Hiragino Kaku Gothic ProN", system-ui, sans-serif;
  --font-sans: var(--font-jp);
  --font-latin:var(--font-jp);

  /* ===== Type scale — px values mirror the template's pt sizes
     (48pt=64 · 36pt=48 · 24pt=32 · 20pt≈27 · 18pt=24 · 14pt≈19 · 9pt=12) ===== */
  --fs-cover:  64px;  /* 表紙 title (48pt) */
  --fs-sec:    48px;  /* 章扉 title (48pt → 64 optional) */
  --fs-h1:     48px;  /* content title (36pt) → use 48px scale */
  --fs-title:  48px;  /* content slide title (36pt) */
  --fs-h2:     32px;  /* 24pt */
  --fs-h3:     27px;  /* 20pt — body emphasis */
  --fs-body:   27px;  /* body (20pt) */
  --fs-lg:     24px;  /* 18pt subtitle */
  --fs-sm:     19px;  /* 14pt */
  --fs-cap:    16px;  /* 12pt */
  --fs-foot:   12px;  /* 9pt footer */

  --lh-tight: 1.18;
  --lh-snug:  1.4;
  --lh-body:  1.65;   /* template: 倍数1.2 + 段落前5pt; web reads better ~1.6 */
  --track-jp: 0.01em;

  /* ===== Spacing (8pt base) ===== */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; --sp-10:128px;

  /* ===== Radii — template is mostly square; keep restrained ===== */
  --r-sm:3px; --r-md:6px; --r-lg:10px; --r-pill:999px;

  /* ===== Elevation (cool navy-tinted) ===== */
  --sh-1: 0 1px 2px rgba(10,21,97,.06), 0 1px 3px rgba(10,21,97,.08);
  --sh-2: 0 4px 14px rgba(10,21,97,.08), 0 2px 4px rgba(10,21,97,.05);
  --sh-3: 0 14px 36px rgba(10,21,97,.12), 0 4px 10px rgba(10,21,97,.07);
  --sh-navy:0 20px 50px rgba(6,13,62,.30);
  --ring: 0 0 0 3px rgba(179,217,255,.7);
}

/* ============================================================
   Semantic type classes
   ============================================================ */
.fsw-cover  { font-family:var(--font-jp); font-weight:700; font-size:var(--fs-cover); line-height:var(--lh-tight); letter-spacing:var(--track-jp); color:var(--fg-1); }
.fsw-sec    { font-family:var(--font-jp); font-weight:700; font-size:var(--fs-sec);  line-height:var(--lh-tight); letter-spacing:var(--track-jp); color:var(--fg-1); }
.fsw-title  { font-family:var(--font-jp); font-weight:700; font-size:var(--fs-title);line-height:var(--lh-tight); color:var(--fg-1); }
.fsw-h2     { font-family:var(--font-jp); font-weight:700; font-size:var(--fs-h2);   line-height:var(--lh-snug);  color:var(--fg-1); }
.fsw-h3     { font-family:var(--font-jp); font-weight:700; font-size:var(--fs-h3);   line-height:var(--lh-snug);  color:var(--fg-1); }
.fsw-body   { font-family:var(--font-jp); font-weight:400; font-size:var(--fs-body); line-height:var(--lh-body);  color:var(--fg-body); }
.fsw-lg     { font-family:var(--font-jp); font-weight:400; font-size:var(--fs-lg);   line-height:var(--lh-body);  color:var(--fg-3); }
.fsw-sm     { font-family:var(--font-jp); font-weight:400; font-size:var(--fs-sm);   line-height:var(--lh-snug);  color:var(--fg-2); }
.fsw-cap    { font-family:var(--font-jp); font-weight:400; font-size:var(--fs-cap);  line-height:var(--lh-snug);  color:var(--fg-3); }
.fsw-foot   { font-family:var(--font-jp); font-weight:400; font-size:var(--fs-foot); line-height:1.2; color:var(--gray-600); }
.fsw-strong { font-weight:700; }
/* pale-blue highlighter — 太字を内包し、強調が色だけに依存しないように */
.fsw-mark   { background:linear-gradient(transparent 60%, var(--paleblue) 60%); font-weight:700; }

/* The signature title bar (place directly under a content title) */
.fsw-bar { height:8px; width:100%; background:var(--grad-bar); border:0; }
