/* ===== 案B — クリーンテック ===== */

:root {
  --font-sans: "Noto Sans JP", system-ui, sans-serif;
  --font-display: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --font-mono: "Space Mono", monospace;

  --bg: #ffffff;
  --surface: #f4f6f9;
  --surface-alt: #f0f3f7;
  --ink: #0d1117;
  --ink-soft: #353c49;
  --ink-faint: #69707d;
  --line: #e6eaf0;
  --line-strong: #d2d8e2;

  --accent: #2f4bdb;
  --accent-strong: #2f4bdb;
  --accent-ink: #ffffff;

  --title-weight: 800;
  --hero-weight: 800;
  --btn-radius: 10px;
  --img-radius: 12px;
  --chip-bg: #f7f9fc;
}

/* ---------- タイポ・レイアウトでダイナミック（影・背景演出なし） ---------- */
.theme-b .section-title {
  letter-spacing: -.03em;
  font-size: clamp(32px, 4.6vw, 56px);
  line-height: 1.14;
}

.theme-b .hero-title {
  font-size: clamp(36px, 5.4vw, 76px);
  line-height: 1.08;
  letter-spacing: -.025em;
}

.theme-b .hero-title span:last-child {
  color: var(--accent);
}

.theme-b .hero-lead {
  font-size: clamp(19px, 2vw, 26px);
  line-height: 1.65;
  max-width: 58ch;
}

.theme-b .hero-body { max-width: 62ch; font-size: 16px; }

.theme-b .eyebrow { color: var(--accent); }
.theme-b .eyebrow::before { width: 32px; height: 2px; opacity: 1; }

.theme-b .hero-actions .btn-ghost {
  padding: 16px 34px;
  font-weight: 700;
  border-width: 2px;
  border-color: var(--accent);
  color: var(--accent);
}

.theme-b .hero-actions .btn-ghost:hover {
  background: var(--accent);
  color: var(--accent-ink);
  transform: translateY(-2px);
}

.theme-b .portrait {
  box-shadow: none;
  border-width: 2px;
  border-color: var(--line-strong);
}

.theme-b .case-img {
  border-radius: var(--img-radius);
  border-width: 2px;
  border-color: var(--line-strong);
}

.theme-b .hc-name { font-size: clamp(26px, 2.2vw, 32px); }

.theme-b .metric-v {
  font-size: clamp(28px, 3.4vw, 44px);
  letter-spacing: -.03em;
  color: var(--accent);
}

.theme-b .fde-pt { font-size: 19px; }
.theme-b .explore-k {
  font-size: clamp(36px, 4vw, 52px);
  color: var(--accent);
}

.theme-b .case-title {
  font-size: clamp(24px, 2.8vw, 34px);
  letter-spacing: -.02em;
}

.theme-b .chip {
  background: var(--chip-bg);
  border-radius: 8px;
  font-weight: 500;
}

.theme-b .chip:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* グリッドのコントラストを強める */
.theme-b .fde-grid,
.theme-b .explore-grid,
.theme-b .metrics {
  border-radius: 14px;
  overflow: hidden;
  border: 2px solid var(--line-strong);
}

.theme-b .fde-grid,
.theme-b .explore-grid { background: var(--line-strong); }

.theme-b .fde-point,
.theme-b .explore-item { background: var(--surface); }

.theme-b .metric { background: var(--surface); }

.theme-b .case-badge {
  border-radius: 8px;
  font-weight: 700;
  background: color-mix(in srgb, var(--accent) 10%, #fff);
}

.theme-b .pa-after {
  border: 2px solid color-mix(in srgb, var(--accent) 45%, var(--bg));
  background: color-mix(in srgb, var(--accent) 6%, var(--bg));
}

.theme-b .pa-after p { font-size: 17px; }

.theme-b a.case-title:hover { color: var(--accent); }

.theme-b .btn-primary { background: var(--accent); color: #fff; }
.theme-b .btn-primary:hover { background: #233bbf; color: #fff; }

.theme-b .site-nav a:hover::after { background: var(--accent); height: 2px; }

@media (min-width: 1200px) {
  .theme-b .section-title { font-size: clamp(38px, 3.5vw, 58px); }
  .theme-b .case-situation { max-width: 72ch; font-size: 16px; }
}