/*
 * fukugyou-2026.css
 * FUKUGYOU MASTERCLASS 2026 LP — スコープ型スタイルシート
 * スコープ: body.fukugyou-2026-lp / #f26-root
 * カラーパレット: オリーブグリーン × ダークフォレスト × ゴールド × アイボリー
 * ============================================================ */

/* ─────────────────────────────────────────────
   0. CSS カスタムプロパティ
───────────────────────────────────────────── */
:root {
  /* ── 背景系 ── */
  --f26-bg:        #070b08;   /* 深森ブラック */
  --f26-bg2:       #0c120d;   /* 深森グリーン */
  --f26-bg3:       #111a12;   /* フォレストサーフェス */
  --f26-surface:   #172019;   /* オリーブサーフェス */
  --f26-surface2:  #1e2b1f;   /* ライトサーフェス */

  /* ── ボーダー系 ── */
  --f26-border:    #22301f;   /* 深いグリーンボーダー */
  --f26-border2:   #344828;   /* ライトボーダー */

  /* ── テキスト系 ── */
  --f26-text:      #e8e4d6;   /* ウォームアイボリー */
  --f26-text2:     #a4a89a;   /* セージグレー */
  --f26-text3:     #666a5e;   /* フェイントテキスト */

  /* ── アクセント系（グリーン・ゴールド）── */
  --f26-gold:      #b89040;   /* アンバーゴールド */
  --f26-gold2:     #d4a848;   /* ライトゴールド */
  --f26-gold3:     #f0c870;   /* ブライトゴールド */
  --f26-olive:     #7a9a5a;   /* オリーブグリーン */
  --f26-olive2:    #96b070;   /* ライトオリーブ */
  --f26-sage:      #6a9070;   /* セージグリーン */
  --f26-sage2:     #8ab090;   /* ライトセージ */
  --f26-teal:      #3a8060;   /* フォレストティール（チェック）*/
  --f26-accent:    #c07060;   /* テラコッタアクセント（警告）*/

  /* ── タイポグラフィ ── */
  --f26-sans:   'M PLUS Rounded 1c', 'Noto Sans JP', sans-serif;
  --f26-serif:  'Noto Serif JP', serif;
  --f26-mono:   'IBM Plex Mono', monospace;

  /* ── レイアウト ── */
  --f26-section-gap:  clamp(80px, 12vw, 140px);
  --f26-content-max:  880px;
  --f26-h-offset:     64px;   /* tp-header 想定高さ */
  --f26-nav-h:        52px;   /* LP内サブナビ高さ */
}

/* ─────────────────────────────────────────────
   1. html / body ベース
───────────────────────────────────────────── */
html.fukugyou-2026-lp-html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--f26-h-offset) + var(--f26-nav-h) + 20px);
}

body.fukugyou-2026-lp {
  background:   var(--f26-bg);
  color:        var(--f26-text);
  font-family:  var(--f26-sans);
  font-weight:  300;
  font-size:    16px;
  line-height:  1.85;
  overflow-x:   hidden;
}

/* ノイズテクスチャオーバーレイ */
body.fukugyou-2026-lp::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9998;
  opacity: 0.28;
}

/* ─────────────────────────────────────────────
   2. Cocoon / 親テーマ CSS 干渉の安全な遮断
───────────────────────────────────────────── */
#f26-root .article,
#f26-root .entry-content,
#f26-root .main,
#f26-root .content,
#f26-root .wrap,
#f26-root .container,
#f26-root #main,
#f26-root #body-in {
  max-width: none;
  margin:    0;
  padding:   0;
  background: transparent;
  border:    none;
  box-shadow: none;
  float:     none;
  width:     auto;
}

/* ─────────────────────────────────────────────
   3. プログレスバー
───────────────────────────────────────────── */
.f26-progress {
  position: fixed;
  top:    0;
  left:   0;
  height: 2px;
  width:  0%;
  background: linear-gradient(90deg, var(--f26-olive), var(--f26-gold2));
  z-index: 9999;
  transition: width 0.1s linear;
}

/* ─────────────────────────────────────────────
   4. LP 内サブナビゲーション
   tp-header の下に配置（top: var(--f26-h-offset)）
───────────────────────────────────────────── */
.f26-nav {
  position: fixed;
  top:    var(--f26-h-offset);
  left:   0;
  right:  0;
  z-index: 100;
  height: var(--f26-nav-h);
  padding: 0 clamp(20px, 5vw, 80px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(7, 11, 8, 0.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(122, 154, 90, 0.12);
  transition: background 0.3s ease;
}

.f26-nav-logo {
  font-family:    var(--f26-mono);
  font-size:      14px;
  letter-spacing: 0.2em;
  color:          var(--f26-text);
  text-decoration: none;
  transition:     opacity 0.25s;
}
.f26-nav-logo:hover { opacity: 0.65; }
.f26-nav-logo span  { color: var(--f26-olive); }

.f26-nav-links {
  display: flex;
  gap: clamp(1rem, 2.5vw, 2.5rem);
  list-style: none;
  margin:  0;
  padding: 0;
}

.f26-nav-links a {
  font-size:      10px;
  letter-spacing: 0.28em;
  color:          var(--f26-text3);
  text-decoration: none;
  text-transform: uppercase;
  transition:     color 0.25s;
  white-space:    nowrap;
}
.f26-nav-links a:hover,
.f26-nav-links a:focus-visible {
  color:   var(--f26-olive2);
  outline: none;
}

/* ─────────────────────────────────────────────
   5. スクロールリビール
───────────────────────────────────────────── */
.f26-reveal {
  opacity:   0;
  transform: translateY(28px);
  transition: opacity 0.75s ease, transform 0.75s ease;
}
.f26-reveal.is-visible {
  opacity:   1;
  transform: translateY(0);
}
.f26-reveal-d1 { transition-delay: 0.1s; }
.f26-reveal-d2 { transition-delay: 0.2s; }
.f26-reveal-d3 { transition-delay: 0.3s; }
.f26-reveal-d4 { transition-delay: 0.4s; }

/* ─────────────────────────────────────────────
   6. HERO セクション
───────────────────────────────────────────── */
body.fukugyou-2026-lp .f26-hero {
  position:       relative;
  min-height:     100vh;
  display:        flex;
  flex-direction: column;
  justify-content: center;
  padding:        clamp(80px, 12vw, 140px) clamp(24px, 6vw, 80px);
  overflow:       hidden;
}

/* ヒーロー背景グラデーション */
.f26-hero-bg {
  position: absolute;
  inset:    0;
  background:
    radial-gradient(ellipse 80% 60% at 65% 40%, rgba(90, 130, 60, 0.10) 0%, transparent 65%),
    radial-gradient(ellipse 60% 80% at 15% 75%, rgba(184, 144, 64, 0.07) 0%, transparent 60%),
    radial-gradient(ellipse 50% 50% at 90% 10%, rgba(60, 128, 96, 0.06) 0%, transparent 50%);
  pointer-events: none;
}

/* ヒーロー背景画像（シネマティック） */
.f26-hero-img-wrap {
  position: absolute;
  inset:    0;
  overflow: hidden;
}
.f26-hero-img {
  width:      100%;
  height:     100%;
  object-fit: cover;
  object-position: center 30%;
  opacity:    0.18;
  transform:  scale(1.05);
  transition: transform 8s ease;
  filter:     saturate(0.6) brightness(0.8);
}
.f26-hero-img-overlay {
  position: absolute;
  inset:    0;
  background: linear-gradient(
    160deg,
    rgba(7, 11, 8, 0.85) 0%,
    rgba(7, 11, 8, 0.55) 50%,
    rgba(7, 11, 8, 0.80) 100%
  );
}

/* 縦ライン */
.f26-hero-line {
  position: absolute;
  top:    0;
  left:   clamp(24px, 6vw, 80px);
  width:  1px;
  height: 100%;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(122, 154, 90, 0.15) 20%,
    rgba(122, 154, 90, 0.25) 50%,
    rgba(122, 154, 90, 0.08) 80%,
    transparent 100%
  );
  pointer-events: none;
}

/* 年バッジ */
.f26-hero-year-badge {
  position:   absolute;
  top:        clamp(24px, 4vw, 48px);
  right:      clamp(24px, 6vw, 80px);
  font-family: var(--f26-mono);
  font-size:  11px;
  color:      var(--f26-text3);
  border:     1px solid var(--f26-border);
  padding:    6px 14px;
  border-radius: 3px;
  opacity:    0;
  animation:  f26FadeIn 0.8s ease 1s forwards;
}

/* ヒーロー テキストコンテンツ */
.f26-hero-content {
  position:   relative;
  z-index:    1;
  max-width:  680px;
  padding-left: clamp(16px, 4vw, 48px);
  border-left: 2px solid rgba(122, 154, 90, 0.25);
}

.f26-hero-eyebrow {
  font-family:    var(--f26-mono);
  font-size:      11px;
  letter-spacing: 0.18em;
  color:          var(--f26-olive);
  text-transform: uppercase;
  margin-bottom:  28px;
  opacity:        0;
  animation:      f26FadeUp 0.8s ease 0.2s forwards;
}

.f26-hero-title {
  font-family:    var(--f26-serif);
  font-size:      clamp(38px, 6.5vw, 88px);
  font-weight:    700;
  line-height:    1.1;
  letter-spacing: -0.02em;
  margin-bottom:  28px;
  opacity:        0;
  animation:      f26FadeUp 0.9s ease 0.4s forwards;
}
.f26-hero-title em {
  font-style: normal;
  color:      var(--f26-gold2);
  display:    block;
}

.f26-hero-subtitle {
  font-size:     clamp(14px, 1.8vw, 17px);
  color:         var(--f26-text2);
  line-height:   2;
  margin-bottom: 48px;
  opacity:       0;
  animation:     f26FadeUp 0.9s ease 0.6s forwards;
}

.f26-hero-cta {
  display:        inline-flex;
  align-items:    center;
  gap:            12px;
  font-family:    var(--f26-sans);
  font-size:      14px;
  font-weight:    400;
  color:          var(--f26-gold3);
  border-bottom:  1px solid rgba(184, 144, 64, 0.35);
  padding-bottom: 4px;
  text-decoration: none;
  opacity:        0;
  animation:      f26FadeUp 0.9s ease 0.8s forwards;
  transition:     color 0.25s, border-color 0.25s;
}
.f26-hero-cta:hover {
  color:        var(--f26-text);
  border-color: rgba(255, 255, 255, 0.35);
}
.f26-hero-cta-arrow { transition: transform 0.22s ease; }
.f26-hero-cta:hover .f26-hero-cta-arrow { transform: translateX(5px); }

/* スクロールヒント */
.f26-scroll-hint {
  position:       absolute;
  bottom:         40px;
  left:           clamp(24px, 6vw, 80px);
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.16em;
  color:          var(--f26-text3);
  opacity:        0;
  animation:      f26FadeIn 1s ease 1.5s forwards;
}

/* ─── ヒーローアニメーション ─── */
@keyframes f26FadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0);    }
}
@keyframes f26FadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ─────────────────────────────────────────────
   7. 画像パネル（セクション遷移）
───────────────────────────────────────────── */
.f26-img-panel {
  position:       relative;
  width:          100%;
  height:         clamp(200px, 30vw, 380px);
  overflow:       hidden;
  opacity:        0;
  transition:     opacity 1s ease;
}
.f26-img-panel.is-visible { opacity: 1; }
.f26-img-panel img {
  width:      100%;
  height:     100%;
  object-fit: cover;
  object-position: center;
  filter:     saturate(0.5) brightness(0.65);
  transform:  scale(1.04);
  transition: transform 6s ease;
}
.f26-img-panel.is-visible img { transform: scale(1.0); }
.f26-img-panel-overlay {
  position:   absolute;
  inset:      0;
  background: linear-gradient(
    180deg,
    rgba(7, 11, 8, 0.6) 0%,
    rgba(7, 11, 8, 0.2) 50%,
    rgba(7, 11, 8, 0.7) 100%
  );
}

/* ─────────────────────────────────────────────
   8. 汎用セクション
───────────────────────────────────────────── */
body.fukugyou-2026-lp .f26-section {
  max-width: var(--f26-content-max);
  margin:    0 auto;
  padding:   var(--f26-section-gap) clamp(24px, 6vw, 48px);
}

/* ─────────────────────────────────────────────
   9. セクションラベル
───────────────────────────────────────────── */
.f26-section-label {
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.22em;
  color:          var(--f26-olive);
  text-transform: uppercase;
  margin-bottom:  20px;
  display:        flex;
  align-items:    center;
  gap:            12px;
}
.f26-section-label::after {
  content:    '';
  display:    block;
  width:      32px;
  height:     1px;
  background: var(--f26-olive);
  opacity:    0.45;
}

/* ─────────────────────────────────────────────
   10. タイポグラフィ
───────────────────────────────────────────── */
#f26-root h2 {
  font-family:    var(--f26-serif);
  font-size:      clamp(26px, 3.8vw, 42px);
  font-weight:    700;
  line-height:    1.25;
  letter-spacing: -0.01em;
  margin-bottom:  28px;
  color:          var(--f26-text);
}
#f26-root h3 {
  font-family:  var(--f26-serif);
  font-size:    clamp(17px, 2.4vw, 23px);
  font-weight:  600;
  margin-bottom: 14px;
  color:        var(--f26-text);
}
#f26-root h4 {
  font-family:  var(--f26-sans);
  font-size:    14px;
  font-weight:  500;
  color:        var(--f26-text);
  margin-bottom: 4px;
}
#f26-root p {
  color:         var(--f26-text2);
  line-height:   1.95;
  margin-bottom: 18px;
  font-size:     15px;
}
#f26-root p:last-child { margin-bottom: 0; }
#f26-root p strong {
  color:       var(--f26-text);
  font-weight: 500;
}

.f26-lead {
  font-size:     clamp(16px, 2.1vw, 20px);
  color:         var(--f26-text);
  line-height:   1.85;
  margin-bottom: 36px;
}

/* ─────────────────────────────────────────────
   11. プルクォート
───────────────────────────────────────────── */
.f26-pullquote {
  border-left: 2px solid var(--f26-olive);
  padding:     8px 0 8px 28px;
  margin:      36px 0;
}
.f26-pullquote p {
  font-family: var(--f26-serif);
  font-size:   clamp(17px, 2.3vw, 22px);
  color:       var(--f26-text);
  line-height: 1.65;
  margin:      0;
  font-weight: 300;
}
.f26-pullquote cite {
  font-family:    var(--f26-mono);
  font-size:      11px;
  color:          var(--f26-text3);
  display:        block;
  margin-top:     12px;
  letter-spacing: 0.08em;
}

/* ─────────────────────────────────────────────
   12. コールアウトボックス
───────────────────────────────────────────── */
.f26-callout {
  background:    var(--f26-surface);
  border:        1px solid var(--f26-border);
  border-radius: 8px;
  padding:       26px 30px;
  margin:        28px 0;
}
.f26-callout-gold { border-color: rgba(184, 144, 64, 0.35); }
.f26-callout-sage { border-color: rgba(106, 144, 112, 0.35); }
.f26-callout h4 {
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.16em;
  color:          var(--f26-gold);
  text-transform: uppercase;
  margin-bottom:  14px;
}
.f26-callout p { margin: 0; font-size: 14.5px; }

/* ─────────────────────────────────────────────
   13. ステージフロー
───────────────────────────────────────────── */
.f26-stage-flow {
  display:    flex;
  flex-direction: column;
  gap:        0;
  margin:     16px 0 0;
  border-top: 1px solid var(--f26-border);
}
.f26-stage-item {
  display:    flex;
  align-items: flex-start;
  gap:        18px;
  padding:    18px 0;
  border-bottom: 1px solid var(--f26-border);
  transition: background 0.2s;
  border-radius: 4px;
  padding-left: 4px;
}
.f26-stage-item:last-child { border-bottom: none; }
.f26-stage-num {
  font-family:    var(--f26-mono);
  font-size:      10px;
  color:          var(--f26-olive);
  min-width:      24px;
  padding-top:    3px;
}
.f26-stage-content h4 { font-size: 14px; margin-bottom: 3px; }
.f26-stage-content p  { font-size: 13px; margin: 0; color: var(--f26-text3); line-height: 1.7; }

/* ─────────────────────────────────────────────
   14. 比較テーブル
───────────────────────────────────────────── */
.f26-compare-wrap {
  overflow-x: auto;
  margin:     28px 0;
  border-radius: 8px;
  border:     1px solid var(--f26-border);
}
.f26-compare-table {
  width:           100%;
  border-collapse: collapse;
  font-size:       13px;
  min-width:       620px;
}
.f26-compare-table th {
  text-align:     left;
  padding:        13px 16px;
  font-family:    var(--f26-mono);
  font-size:      9.5px;
  letter-spacing: 0.15em;
  color:          var(--f26-text3);
  text-transform: uppercase;
  border-bottom:  1px solid var(--f26-border);
  background:     var(--f26-bg2);
}
.f26-compare-table th:first-child { width: 150px; }
.f26-compare-table td {
  padding:        13px 16px;
  color:          var(--f26-text2);
  border-bottom:  1px solid var(--f26-border);
  vertical-align: top;
  line-height:    1.6;
}
.f26-compare-table tr:last-child td { border-bottom: none; }
.f26-compare-table tr:hover td { background: var(--f26-surface); }
.f26-compare-table td:first-child {
  color:       var(--f26-text);
  font-weight: 500;
}

/* バッジ */
.f26-badge {
  display:        inline-block;
  font-family:    var(--f26-mono);
  font-size:      9px;
  letter-spacing: 0.08em;
  padding:        3px 8px;
  border-radius:  3px;
  text-transform: uppercase;
  vertical-align: middle;
}
.f26-badge-gold  { background: rgba(184, 144, 64, 0.12); color: var(--f26-gold2);  border: 1px solid rgba(184, 144, 64, 0.28); }
.f26-badge-green { background: rgba(122, 154, 90, 0.12); color: var(--f26-olive2); border: 1px solid rgba(122, 154, 90, 0.28); }
.f26-badge-sage  { background: rgba(106, 144, 112, 0.1); color: var(--f26-sage2);  border: 1px solid rgba(106, 144, 112, 0.25); }
.f26-badge-red   { background: rgba(192, 112, 96, 0.10); color: var(--f26-accent); border: 1px solid rgba(192, 112, 96, 0.25); }

/* ─────────────────────────────────────────────
   15. ディバイダー
───────────────────────────────────────────── */
.f26-divider {
  border:     none;
  border-top: 1px solid var(--f26-border);
  margin:     0;
}

/* ─────────────────────────────────────────────
   16. フェーズバナー
───────────────────────────────────────────── */
.f26-phase-banner {
  background:    var(--f26-bg3);
  border-top:    1px solid var(--f26-border);
  border-bottom: 1px solid var(--f26-border);
  padding:       18px clamp(24px, 6vw, 80px);
  display:       flex;
  align-items:   center;
  gap:           20px;
  overflow-x:    auto;
}
.f26-phase-item {
  display:    flex;
  align-items: center;
  gap:        10px;
  flex-shrink: 0;
}
.f26-phase-year {
  font-family:    var(--f26-mono);
  font-size:      11px;
  color:          var(--f26-text3);
  white-space:    nowrap;
}
.f26-phase-label {
  font-size:   13px;
  color:       var(--f26-text2);
  white-space: nowrap;
}
.f26-phase-arrow {
  color:     var(--f26-border2);
  font-size: 18px;
  flex-shrink: 0;
}

/* ─────────────────────────────────────────────
   17. モードグリッド（お小遣いvs事業）
───────────────────────────────────────────── */
.f26-mode-grid {
  display:        grid;
  grid-template-columns: 1fr 1fr;
  gap:            2px;
  margin:         28px 0;
  border-radius:  8px;
  overflow:       hidden;
  border:         1px solid var(--f26-border);
}
.f26-mode-card {
  padding:    26px;
  background: var(--f26-bg2);
}
.f26-mode-bad  { border-top: 3px solid var(--f26-accent); }
.f26-mode-good { border-top: 3px solid var(--f26-teal); }
.f26-mode-title {
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom:  14px;
}
.f26-mode-bad  .f26-mode-title { color: var(--f26-accent); }
.f26-mode-good .f26-mode-title { color: var(--f26-teal); }
.f26-mode-list {
  list-style: none;
  padding:    0;
  margin:     0;
}
.f26-mode-list li {
  font-size:    13px;
  color:        var(--f26-text2);
  padding:      7px 0;
  border-bottom: 1px solid var(--f26-border);
  display:      flex;
  align-items:  flex-start;
  gap:          8px;
  line-height:  1.55;
}
.f26-mode-list li:last-child { border-bottom: none; }
.f26-mode-list li::before   { font-size: 11px; flex-shrink: 0; margin-top: 2px; }
.f26-mode-bad  .f26-mode-list li::before { content: '×'; color: var(--f26-accent); opacity: 0.8; }
.f26-mode-good .f26-mode-list li::before { content: '◎'; color: var(--f26-teal); }

/* ─────────────────────────────────────────────
   18. スタッツバー
───────────────────────────────────────────── */
.f26-stats-bar {
  display:    flex;
  gap:        0;
  border:     1px solid var(--f26-border);
  border-radius: 8px;
  overflow:   hidden;
  margin:     28px 0;
}
.f26-stat-block {
  flex:       1;
  padding:    22px 18px;
  border-right: 1px solid var(--f26-border);
  text-align: center;
  transition: background 0.2s;
}
.f26-stat-block:last-child { border-right: none; }
.f26-stat-block:hover { background: var(--f26-surface); }
.f26-stat-num {
  font-family:  var(--f26-mono);
  font-size:    26px;
  font-weight:  500;
  color:        var(--f26-gold2);
  display:      block;
  line-height:  1;
  margin-bottom: 6px;
}
.f26-stat-desc {
  font-size:   11.5px;
  color:       var(--f26-text3);
  line-height: 1.55;
}

/* ─────────────────────────────────────────────
   19. チェックリストセクション
───────────────────────────────────────────── */
.f26-checklist-section {
  background: var(--f26-bg2);
  padding:    var(--f26-section-gap) 0;
}
.f26-checklist-inner {
  max-width: var(--f26-content-max);
  margin:    0 auto;
  padding:   0 clamp(24px, 6vw, 48px);
}
.f26-checklist-group {
  margin-bottom: 44px;
}
.f26-checklist-group-label {
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.2em;
  color:          var(--f26-olive);
  text-transform: uppercase;
  margin-bottom:  6px;
}
.f26-checklist-group h3 {
  font-family:   var(--f26-sans);
  font-size:     15px;
  font-weight:   500;
  color:         var(--f26-text);
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--f26-border);
}

/* チェックアイテム */
.f26-check-item {
  display:       flex;
  align-items:   flex-start;
  gap:           13px;
  padding:       13px 4px;
  border-bottom: 1px solid var(--f26-border);
  cursor:        pointer;
  border-radius: 4px;
  transition:    background 0.15s;
}
.f26-check-item:last-child { border-bottom: none; }
.f26-check-item:hover      { background: rgba(122, 154, 90, 0.04); }
.f26-check-item:focus-visible {
  outline:        2px solid var(--f26-olive);
  outline-offset: 2px;
}

/* チェックボックス */
.f26-check-box {
  width:       20px;
  height:      20px;
  border:      1.5px solid var(--f26-border2);
  border-radius: 4px;
  flex-shrink: 0;
  display:     flex;
  align-items: center;
  justify-content: center;
  transition:  border-color 0.2s, background 0.2s;
  margin-top:  1px;
}
.f26-check-mark {
  display:     none;
  color:       var(--f26-bg);
  font-size:   11px;
  font-weight: 700;
}
.f26-check-item.is-checked .f26-check-box {
  background:   var(--f26-teal);
  border-color: var(--f26-teal);
}
.f26-check-item.is-checked .f26-check-mark { display: block; }
.f26-check-item.is-checked .f26-check-text {
  color:           var(--f26-text3);
  text-decoration: line-through;
  text-decoration-color: var(--f26-border2);
}
.f26-check-text {
  font-size:   14px;
  color:       var(--f26-text2);
  line-height: 1.65;
  transition:  color 0.2s;
}
.f26-check-text strong { color: var(--f26-text); font-weight: 500; }

/* ─────────────────────────────────────────────
   20. スコアメーター
───────────────────────────────────────────── */
.f26-score-meter {
  background:    var(--f26-surface);
  border:        1px solid var(--f26-border);
  border-radius: 8px;
  padding:       22px 26px;
  margin:        28px 0;
  display:       flex;
  align-items:   center;
  gap:           22px;
}
.f26-score-num {
  font-family: var(--f26-mono);
  font-size:   40px;
  font-weight: 500;
  color:       var(--f26-gold2);
  min-width:   80px;
  line-height: 1;
}
.f26-score-num span { font-size: 15px; color: var(--f26-text3); }
.f26-score-bar-wrap { flex: 1; }
.f26-score-label {
  font-family:    var(--f26-mono);
  font-size:      9.5px;
  letter-spacing: 0.13em;
  color:          var(--f26-text3);
  text-transform: uppercase;
  margin-bottom:  7px;
}
.f26-score-bar-bg {
  height:      5px;
  background:  var(--f26-border);
  border-radius: 3px;
  overflow:    hidden;
}
.f26-score-bar-fill {
  height:      100%;
  background:  var(--f26-teal);
  border-radius: 3px;
  transition:  width 0.55s ease, background 0.55s ease;
}
.f26-score-message {
  font-size:  13px;
  color:      var(--f26-text2);
  margin-top: 7px;
}

/* ─────────────────────────────────────────────
   21. AI プロンプトグリッド
───────────────────────────────────────────── */
.f26-ai-prompt-grid {
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   12px;
  margin:                28px 0;
}
.f26-ai-prompt-card {
  background:    var(--f26-surface);
  border:        1px solid var(--f26-border);
  border-radius: 8px;
  padding:       18px 20px;
  position:      relative;
  overflow:      hidden;
  transition:    border-color 0.2s;
}
.f26-ai-prompt-card:hover { border-color: var(--f26-border2); }
.f26-ai-prompt-card::before {
  content:        'AI';
  position:       absolute;
  top:            14px;
  right:          14px;
  font-family:    var(--f26-mono);
  font-size:      9px;
  letter-spacing: 0.12em;
  color:          var(--f26-sage);
  background:     rgba(106, 144, 112, 0.1);
  padding:        3px 8px;
  border-radius:  3px;
  border:         1px solid rgba(106, 144, 112, 0.2);
}
.f26-ai-prompt-card h4 {
  font-family:    var(--f26-sans);
  font-size:      11.5px;
  font-weight:    500;
  color:          var(--f26-text3);
  margin-bottom:  8px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.f26-ai-prompt-text {
  font-family:  var(--f26-mono);
  font-size:    11.5px;
  color:        var(--f26-sage2);
  line-height:  1.7;
  background:   rgba(106, 144, 112, 0.05);
  border:       1px solid rgba(106, 144, 112, 0.12);
  border-radius: 4px;
  padding:      10px 12px;
  margin:       0;
  white-space:  pre-wrap;
  word-break:   break-all;
}
.f26-copy-btn {
  display:        inline-block;
  margin-top:     10px;
  font-family:    var(--f26-mono);
  font-size:      9.5px;
  letter-spacing: 0.1em;
  color:          var(--f26-text3);
  cursor:         pointer;
  padding:        4px 10px;
  border:         1px solid var(--f26-border);
  border-radius:  3px;
  transition:     color 0.2s, border-color 0.2s;
  user-select:    none;
  min-height:     28px;
  min-width:      44px;
  text-align:     center;
}
.f26-copy-btn:hover           { color: var(--f26-text2); border-color: var(--f26-border2); }
.f26-copy-btn.is-copied       { color: var(--f26-teal);  border-color: var(--f26-teal); }
.f26-copy-btn:focus-visible   { outline: 2px solid var(--f26-olive); outline-offset: 2px; }

/* ─────────────────────────────────────────────
   22. ロードマップ（5ステップ）
───────────────────────────────────────────── */
.f26-roadmap { margin: 36px 0; }
.f26-roadmap-step {
  display:        flex;
  gap:            22px;
  padding-bottom: 36px;
  position:       relative;
}
.f26-roadmap-step:last-child { padding-bottom: 0; }
.f26-roadmap-step::before {
  content:    '';
  position:   absolute;
  left:       13px;
  top:        30px;
  bottom:     0;
  width:      1px;
  background: var(--f26-border);
}
.f26-roadmap-step:last-child::before { display: none; }
.f26-roadmap-dot {
  width:       28px;
  height:      28px;
  border-radius: 50%;
  background:  var(--f26-bg2);
  border:      1px solid var(--f26-border2);
  display:     flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--f26-mono);
  font-size:   10px;
  color:       var(--f26-olive);
  position:    relative;
  z-index:     1;
}
.f26-roadmap-content h4 {
  font-size:     14.5px;
  font-weight:   500;
  color:         var(--f26-text);
  margin-bottom: 5px;
}
.f26-roadmap-content p {
  font-size:   13px;
  margin:      0;
  color:       var(--f26-text3);
  line-height: 1.78;
}

/* ─────────────────────────────────────────────
   23. 3つの問いかけ
───────────────────────────────────────────── */
.f26-three-q {
  counter-reset: f26-q-counter;
  margin:        36px 0;
  display:       flex;
  flex-direction: column;
  gap:           14px;
}
.f26-q-card {
  background:       var(--f26-bg2);
  border:           1px solid var(--f26-border);
  border-radius:    8px;
  padding:          22px 26px 22px 54px;
  position:         relative;
  font-family:      var(--f26-serif);
  font-size:        clamp(15px, 2vw, 17px);
  color:            var(--f26-text);
  line-height:      1.68;
  font-weight:      300;
  counter-increment: f26-q-counter;
  transition:       border-color 0.25s;
}
.f26-q-card:hover  { border-color: rgba(122, 154, 90, 0.25); }
.f26-q-card::before {
  content:     counter(f26-q-counter);
  position:    absolute;
  left:        22px;
  top:         24px;
  font-family: var(--f26-mono);
  font-size:   17px;
  font-weight: 500;
  color:       var(--f26-olive);
  line-height: 1;
}

/* ─────────────────────────────────────────────
   24. CTA ブロック
───────────────────────────────────────────── */
.f26-cta-block {
  text-align: center;
  margin:     48px 0 32px;
}
.f26-cta-btn {
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  padding:         1.1rem 3rem;
  background:      var(--f26-cta-color, #3a6b40);
  color:           #fff;
  font-family:     var(--f26-sans);
  font-size:       1rem;
  font-weight:     700;
  letter-spacing:  0.12em;
  text-decoration: none;
  border-radius:   4px;
  min-height:      56px;
  box-shadow:      0 4px 28px rgba(0, 0, 0, 0.35);
  transition:      transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease;
  position:        relative;
  overflow:        hidden;
}
.f26-cta-btn::after {
  content:    '';
  position:   absolute;
  inset:      0;
  background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 60%);
  pointer-events: none;
}
.f26-cta-btn:hover {
  transform:  translateY(-2px);
  box-shadow: 0 8px 36px rgba(0, 0, 0, 0.45);
  filter:     brightness(1.08);
}
.f26-cta-sub {
  margin-top: 12px;
  font-family: var(--f26-mono);
  font-size:  11px;
  color:      var(--f26-text3);
  letter-spacing: 0.12em;
  text-align: center;
}

/* ─────────────────────────────────────────────
   25. LP フッター
───────────────────────────────────────────── */
.f26-lp-footer {
  background:  var(--f26-bg2);
  border-top:  1px solid var(--f26-border);
  padding:     clamp(40px, 8vw, 80px) clamp(24px, 6vw, 48px);
  text-align:  center;
}
.f26-footer-mark {
  font-family:    var(--f26-mono);
  font-size:      10px;
  letter-spacing: 0.22em;
  color:          var(--f26-text3);
  text-transform: uppercase;
  margin-bottom:  16px;
}
.f26-lp-footer p {
  color:      var(--f26-text3);
  font-size:  13px;
  line-height: 1.95;
  max-width:  480px;
  margin:     0 auto;
  text-align: center;
}

/* ─────────────────────────────────────────────
   26. テキストハイライトユーティリティ
───────────────────────────────────────────── */
.f26-highlight       { color: var(--f26-gold2); }
.f26-highlight-olive { color: var(--f26-olive2); }
.f26-highlight-sage  { color: var(--f26-sage2); }

/* ─────────────────────────────────────────────
   27. レスポンシブ
   SP: ≤767px / Tablet: 768px+ / PC: 1024px+
───────────────────────────────────────────── */

/* ── モバイル ── */
@media (max-width: 767px) {
  body.fukugyou-2026-lp .f26-section {
    padding: clamp(64px, 16vw, 100px) 24px;
  }
  .f26-hero-year-badge   { display: none; }
  .f26-scroll-hint       { left: 24px; }
  .f26-ai-prompt-grid    { grid-template-columns: 1fr; }
  .f26-mode-grid         { grid-template-columns: 1fr; }
  .f26-stats-bar         { flex-direction: column; }
  .f26-stat-block {
    border-right:  none;
    border-bottom: 1px solid var(--f26-border);
  }
  .f26-stat-block:last-child { border-bottom: none; }
  .f26-phase-banner      { padding: 18px 24px; overflow-x: auto; }
  .f26-checklist-inner   { padding: 0 24px; }
  .f26-score-meter       { flex-direction: column; align-items: flex-start; }
  .f26-score-num         { font-size: 32px; }
  .f26-nav-links         { display: none; }
  .f26-img-panel         { height: clamp(140px, 38vw, 220px); }
  .f26-lp-footer         { padding: 40px 24px; }
  .f26-q-card            { padding: 18px 20px 18px 48px; }
  .f26-q-card::before    { left: 18px; top: 20px; }
  .f26-cta-btn           { min-width: 240px; width: 100%; max-width: 340px; }
}

/* ── タブレット ── */
@media (min-width: 768px) and (max-width: 1023px) {
  .f26-ai-prompt-grid { grid-template-columns: 1fr; }
}

/* ── PC ── */
@media (min-width: 1024px) {
  .f26-hero-content { padding-left: 48px; }
}

/* ─────────────────────────────────────────────
   28. LP フッター — 背景画像レイアウト（IMAGE5）
───────────────────────────────────────────── */
.f26-lp-footer {
  position: relative;
  overflow: hidden;
}

/* 背景画像ラッパー */
.f26-footer-bg-wrap {
  position: absolute;
  inset:    0;
  z-index:  0;
}

/* 背景画像本体 */
.f26-footer-bg-img {
  width:      100%;
  height:     100%;
  object-fit: cover;
  object-position: center 40%;
  filter:     saturate(0.45) brightness(0.55);
  transform:  scale(1.03);
  transition: transform 6s ease;
}
.f26-lp-footer:hover .f26-footer-bg-img {
  transform: scale(1.0);
}

/* グラデーションオーバーレイ */
.f26-footer-bg-overlay {
  position: absolute;
  inset:    0;
  background: linear-gradient(
    180deg,
    rgba(7, 11, 8, 0.72) 0%,
    rgba(7, 11, 8, 0.55) 50%,
    rgba(7, 11, 8, 0.80) 100%
  );
}

/* テキストコンテンツ（画像の上に重ねる）*/
.f26-footer-content {
  position: relative;
  z-index:  1;
}