/*!
 * AI-Talent-2026.css
 * 「使う」から「使いこなす」へ ― 生成AI活用人材 育成ロードマップ LP
 * Cocoon非依存・完全独立スタイルシート
 * Version: 1.0.0
 */


/* ============================================================
   BASE LAYOUT（ヒーロー・ルート・セクション骨格）
   ============================================================ */


  :root{
    --night:#0B1220;
    --night-ink:#F3EFE3;
    --paper:#F3F0E7;
    --paper-dim:#EAE5D6;
    --ink:#171F33;
    --ink-soft:#4B5468;
    --gold:#C69A3C;
    --gold-deep:#9C7826;
    --teal:#2B6E6B;
    --brick:#AE3C2C;
    --line:#D8D1BC;
    --card:#FBF9F3;
    --radius:2px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:"Noto Sans JP", sans-serif;
    line-height:1.85;
    font-feature-settings:"palt";
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.mincho{
    font-family:"Shippori Mincho B1", serif;
    letter-spacing:.02em;
  }
  .mono{
    font-family:"JetBrains Mono", monospace;
  }
  a{color:inherit;}
  img,svg{display:block;max-width:100%;}

  /* ---------- layout shell / route rail ---------- */
  .route{position:relative;}
  .route::before{
    content:"";
    position:absolute;
    left:47px; top:0; bottom:0; width:1px;
    background-image:linear-gradient(to bottom, var(--gold) 0 6px, transparent 6px 14px);
    background-size:1px 14px;
    opacity:.55;
  }
  section{
    position:relative;
    padding:96px 40px 96px 108px;
    max-width:1180px;
    margin:0 auto;
  }
  .pin{
    position:absolute;
    left:32px; top:100px;
    width:32px; height:32px;
    border-radius:50%;
    background:var(--paper);
    border:2px solid var(--gold);
    display:flex;align-items:center;justify-content:center;
    font-family:"JetBrains Mono", monospace;
    font-size:11px; font-weight:700; color:var(--gold-deep);
    z-index:2;
  }
  .pin.dark{background:var(--night); border-color:var(--gold); color:var(--gold);}
  @media (max-width:860px){
    .route::before{left:22px;}
    section{padding:72px 24px 72px 56px;}
    .pin{left:6px; top:76px; width:26px;height:26px; font-size:9px;}
  }

  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:"JetBrains Mono", monospace;
    font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--gold-deep);
    margin-bottom:18px;
  }
  .eyebrow::before{content:"";width:22px;height:1px;background:var(--gold-deep);}
  h2.title{
    font-size:clamp(26px,3.2vw,38px);
    font-weight:800;
    margin:0 0 28px;
    line-height:1.5;
  }
  .lead{
    font-size:16px;
    color:var(--ink-soft);
    max-width:64ch;
    margin:0 0 44px;
  }
  .divider{
    max-width:1180px;margin:0 auto;padding:0 40px;
  }
  .divider hr{border:none;border-top:1px solid var(--line);margin:0;}

  /* ---------- reveal ---------- */
  .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}
  @media (prefers-reduced-motion:reduce){
    .reveal{opacity:1; transform:none; transition:none;}
    html{scroll-behavior:auto;}
  }

  /* ---------- HERO ---------- */
  .hero{
    background:radial-gradient(1200px 700px at 78% -10%, #16233F 0%, var(--night) 55%);
    color:var(--night-ink);
    padding:0;
    position:relative;
    overflow:hidden;
  }
  .hero-inner{
    max-width:1180px;margin:0 auto;
    padding:140px 40px 120px 108px;
    position:relative; z-index:2;
  }
  .hero .eyebrow{color:var(--gold);}
  .hero .eyebrow::before{background:var(--gold);}
  .hero h1{
    font-size:clamp(32px,5vw,58px);
    font-weight:800;
    line-height:1.45;
    margin:0 0 28px;
    max-width:18ch;
  }
  .hero h1 em{
    font-style:normal;
    color:var(--gold);
    border-bottom:1px solid var(--gold);
  }
  .hero p.sub{
    font-size:16px;
    color:#C9C6BB;
    max-width:56ch;
    margin:0 0 56px;
  }
  .hero-stats{
    display:flex; flex-wrap:wrap; gap:0;
    border-top:1px solid rgba(198,154,60,.35);
  }
  .hero-stats div{
    flex:1 1 200px;
    padding:22px 26px 22px 0;
    border-right:1px solid rgba(198,154,60,.25);
  }
  .hero-stats div:last-child{border-right:none;}
  .hero-stats .num{
    font-family:"JetBrains Mono", monospace;
    font-size:clamp(24px,2.6vw,32px);
    font-weight:700; color:var(--gold);
    display:block;
  }
  .hero-stats .cap{font-size:12.5px;color:#B7B4A9;margin-top:6px;}
  .hero-map{
    position:absolute; right:-60px; top:0; bottom:0; width:520px;
    opacity:.5;
  }
  .dawn{ height:150px; background:linear-gradient(to bottom, var(--night), var(--paper)); }
  @media (max-width:860px){
    .hero-inner{padding:96px 24px 72px 56px;}
    .hero-map{display:none;}
  }

  /* ---------- WHY NOW / chart ---------- */
  .chart-wrap{
    display:grid; grid-template-columns:.9fr 1.4fr; gap:48px; align-items:start;
  }
  @media (max-width:900px){ .chart-wrap{grid-template-columns:1fr;} }
  .fact-card{
    background:var(--card); border:1px solid var(--line);
    padding:28px 26px; border-radius:var(--radius);
  }
  .fact-card h3{margin:0 0 14px;font-size:16px;font-weight:700;}
  .fact-card p{font-size:14.5px;color:var(--ink-soft);margin:0 0 14px;}
  .fact-card p:last-child{margin-bottom:0;}
  .fact-card .hi{color:var(--ink);font-weight:700;}
  .fact-card .src{font-size:11px;color:#9A9585;margin-top:16px;font-family:"JetBrains Mono",monospace;}

  .barchart{
    display:flex; align-items:flex-end; gap:6px;
    height:280px; padding:0 6px 34px;
    position:relative;
    border-bottom:1px solid var(--line);
  }
  .barchart .col{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%;
    position:relative;
  }
  .barchart .bar{
    width:100%; max-width:26px;
    background:var(--ink); border-radius:2px 2px 0 0;
  }
  .barchart .col.forecast .bar{ background:repeating-linear-gradient(45deg, var(--gold) 0 4px, var(--gold-deep) 4px 8px); }
  .barchart .val{
    position:absolute; top:-20px; font-family:"JetBrains Mono",monospace;
    font-size:10px; color:var(--ink-soft); white-space:nowrap;
  }
  .barchart .yr{
    position:absolute; bottom:-24px; font-size:10px; color:var(--ink-soft);
    font-family:"JetBrains Mono",monospace;
  }
  .chart-note{
    display:flex; justify-content:space-between; margin-top:36px;
    font-size:11px; color:var(--ink-soft); font-family:"JetBrains Mono",monospace;
  }
  .chart-legend{display:flex;gap:18px;align-items:center;margin-top:8px;}
  .chart-legend span{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-soft);}
  .chart-legend i{width:12px;height:12px;display:inline-block;border-radius:2px;}
  .chart-title{font-size:13px;font-weight:700;margin-bottom:22px;color:var(--ink-soft);}
  .closer{
    margin-top:40px; padding-top:32px; border-top:1px solid var(--line);
    font-size:15px; color:var(--ink-soft); max-width:80ch;
  }
  .closer strong{color:var(--ink);}

  /* ---------- triad cards (generic) ---------- */
  .triad{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  @media (max-width:900px){.triad{grid-template-columns:1fr;}}
  .tcard{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:30px 26px;
  }
  .tcard .ic{
    width:44px;height:44px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:var(--paper-dim); margin-bottom:20px;
  }
  .tcard h3{margin:0 0 12px;font-size:16.5px;font-weight:700;line-height:1.5;}
  .tcard p{margin:0;font-size:14px;color:var(--ink-soft);}

  /* wall variant */
  .tcard.wall{border-top:3px solid var(--brick);}
  .tcard.wall .ic{background:#F4E4DF;}

  /* ---------- change management levels ---------- */
  .levels{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:8px;position:relative;}
  @media (max-width:900px){.levels{grid-template-columns:1fr;gap:18px;}}
  .level{
    background:var(--card); border:1px solid var(--line);
    padding:26px 22px; text-align:center; position:relative;
  }
  .level + .level{border-left:none;}
  @media (max-width:900px){ .level + .level{border-left:1px solid var(--line);} }
  .level .lv{
    font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.14em;
    color:#fff; background:var(--ink); display:inline-block; padding:4px 10px; border-radius:20px;
    margin-bottom:16px;
  }
  .level:nth-child(2) .lv{background:var(--teal);}
  .level:nth-child(3) .lv{background:var(--gold-deep);}
  .level .ring{
    width:54px;height:54px;margin:0 auto 14px;border-radius:50%;
    border:2px dashed var(--line); display:flex;align-items:center;justify-content:center;
    font-size:20px;
  }
  .level h4{margin:0;font-size:14.5px;font-weight:700;}
  .cm-note{
    background:var(--card); border:1px solid var(--line); padding:26px; margin-bottom:34px;
    font-size:14.5px; color:var(--ink-soft);
  }
  .cm-note strong{color:var(--ink);}
  .cm-note .src{font-size:11px;color:#9A9585;margin-top:10px;font-family:"JetBrains Mono",monospace;}

  /* ---------- ADKAR journey ---------- */
  .adkar{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);}
  @media (max-width:980px){.adkar{grid-template-columns:1fr;}}
  .astage{
    padding:22px 18px; border-right:1px solid var(--line);
    background:linear-gradient(180deg, transparent, transparent);
  }
  .astage:last-child{border-right:none;}
  @media (max-width:980px){.astage{border-right:none;border-bottom:1px solid var(--line);}}
  .astage .letter{
    font-family:"JetBrains Mono",monospace; font-size:11px; color:#fff;
    width:26px;height:26px;border-radius:50%; display:flex;align-items:center;justify-content:center;
    margin-bottom:12px;
  }
  .astage .en{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em;}
  .astage .jp{font-weight:700;font-size:15.5px;margin:2px 0 14px;}
  .astage .state{
    font-size:12px; color:var(--ink-soft); margin-bottom:14px; padding-bottom:14px;
    border-bottom:1px dashed var(--line);
  }
  .astage ul{list-style:none;margin:0;padding:0;}
  .astage li{
    font-size:12px; color:var(--ink-soft); margin-bottom:8px; padding-left:14px; position:relative;
  }
  .astage li::before{content:"–";position:absolute;left:0;color:var(--gold-deep);}
  .astage .grp{font-size:10.5px;letter-spacing:.08em;color:#9A9585;margin:14px 0 6px;font-family:"JetBrains Mono",monospace;}
  /* progressive gold intensity across the 5 stages */
  .astage:nth-child(1){background:#F3F0E7;}
  .astage:nth-child(1) .letter{background:#B9B29A;}
  .astage:nth-child(2){background:#F1EBDB;}
  .astage:nth-child(2) .letter{background:#B89A5C;}
  .astage:nth-child(3){background:#EFE6CD;}
  .astage:nth-child(3) .letter{background:var(--gold-deep);}
  .astage:nth-child(4){background:#ECE0BE;}
  .astage:nth-child(4) .letter{background:var(--gold);}
  .astage:nth-child(5){background:#E7D8A8;}
  .astage:nth-child(5) .letter{background:var(--ink);}
  .adkar-arrow{
    display:flex;justify-content:space-between;align-items:center;
    font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--ink-soft);
    margin:14px 0 6px;
  }

  /* ---------- 5 steps timeline ---------- */
  .steps{border-left:2px solid var(--line); margin-left:4px;}
  .step{position:relative; padding:0 0 44px 34px;}
  .step:last-child{padding-bottom:0;}
  .step .dot{
    position:absolute; left:-9px; top:2px; width:16px;height:16px;border-radius:50%;
    background:var(--paper); border:2px solid var(--ink); z-index:1;
  }
  .step .num{
    font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--gold-deep); letter-spacing:.1em;
  }
  .step h4{margin:4px 0 10px;font-size:17px;font-weight:700;}
  .step p{margin:0;color:var(--ink-soft);font-size:14.5px;max-width:70ch;}

  /* ---------- mechanisms (3 devices) ---------- */
  .mech{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
  @media (max-width:900px){.mech{grid-template-columns:1fr;}}
  .mcard{padding:0;}
  .mcard .tag{
    font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--teal);
    letter-spacing:.08em; margin-bottom:12px; display:block;
  }
  .mcard h3{font-size:17px;font-weight:700;margin:0 0 12px;line-height:1.5;}
  .mcard p{font-size:14px;color:var(--ink-soft);margin:0;}
  .mcard{border-top:2px solid var(--teal); padding-top:20px;}

  /* ---------- closing ---------- */
  .finale{
    background:var(--night); color:var(--night-ink);
  }
  .finale .eyebrow{color:var(--gold);}
  .finale .eyebrow::before{background:var(--gold);}
  .finale h2.title{color:#fff;}
  .finale .lead{color:#C9C6BB;}
  .finale .recap{
    display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid rgba(198,154,60,.3);
  }
  @media (max-width:900px){.finale .recap{grid-template-columns:1fr;}}
  .finale .rcell{
    padding:26px 22px; border-right:1px solid rgba(198,154,60,.25);
  }
  .finale .rcell:last-child{border-right:none;}
  @media (max-width:900px){.finale .rcell{border-right:none;border-bottom:1px solid rgba(198,154,60,.25);}}
  .finale .rcell .k{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--gold);letter-spacing:.1em;margin-bottom:10px;display:block;}
  .finale .rcell p{margin:0;font-size:13.5px;color:#D8D5C9;}
  .finale .goal-pin{
    margin-top:56px; display:flex; align-items:center; gap:16px;
  }
  .finale .goal-pin .circ{
    width:40px;height:40px;border-radius:50%;border:2px solid var(--gold);
    display:flex;align-items:center;justify-content:center; font-family:"JetBrains Mono",monospace;
    font-size:11px; color:var(--gold);
  }
  .finale .goal-pin p{margin:0;font-size:14px;color:#D8D5C9;}
  footer{
    background:var(--night); color:#8B8878; text-align:center; padding:28px; font-size:11.5px;
    font-family:"JetBrains Mono",monospace; border-top:1px solid rgba(198,154,60,.15);
  }


/* ============================================================
   SKIP LINK
   ============================================================ */
.ait-skip-link{
  position:absolute; left:-9999px; top:0; z-index:10000;
  background:var(--night); color:var(--night-ink);
  padding:12px 20px; font-size:13px; font-family:"JetBrains Mono",monospace;
}
.ait-skip-link:focus{ left:16px; top:16px; }

/* ============================================================
   HEADER / HAMBURGER NAV
   （daisen-business.css の設計思想を AI-Talent-2026 の
     --night / --gold トーンに合わせて再構築）
   ============================================================ */
.ait-header{
  position:fixed; top:0; left:0; right:0;
  z-index:9999;
  height:64px;
  background:rgba(11,18,32,.86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(198,154,60,.18);
  transition:background .4s, box-shadow .4s;
}
.ait-header.is-scrolled{
  background:rgba(11,18,32,.97);
  box-shadow:0 4px 28px rgba(0,0,0,.35);
}
.ait-header__inner{
  max-width:1320px; margin:0 auto; padding:0 32px;
  height:100%; display:flex; align-items:center; gap:16px;
}
.ait-logo{
  display:flex; align-items:center; gap:10px;
  color:var(--night-ink); flex-shrink:0;
}
.ait-logo__mark{ width:32px; height:32px; object-fit:contain; }
.ait-logo__text{
  font-family:"JetBrains Mono", monospace;
  font-weight:700; font-size:.92rem; letter-spacing:.18em;
}
.ait-nav{
  display:flex; align-items:center; gap:2px; margin-left:auto;
}
.ait-nav__item{
  font-family:"Noto Sans JP", sans-serif;
  font-size:.78rem; font-weight:500; letter-spacing:.03em;
  color:rgba(243,239,227,.72);
  padding:8px 12px; border-radius:3px;
  white-space:nowrap;
  transition:color .3s, background .3s;
}
.ait-nav__item:hover{ color:var(--night-ink); background:rgba(198,154,60,.1); }
.ait-nav__item--cta{
  margin-left:6px;
  padding:8px 18px;
  background:var(--gold);
  color:var(--night);
  font-weight:700;
  border-radius:2px;
  box-shadow:0 2px 14px rgba(198,154,60,.28);
}
.ait-nav__item--cta:hover{
  background:#D6AB4C; color:var(--night);
}

.ait-menu-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  padding:9px; margin-left:auto;
  border:1.5px solid rgba(243,239,227,.25); border-radius:4px;
}
.ait-menu-toggle span{
  display:block; width:20px; height:2px;
  background:rgba(243,239,227,.85); border-radius:1px;
  transition:transform .3s, opacity .3s;
}
.ait-menu-toggle.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.ait-menu-toggle.is-active span:nth-child(2){ opacity:0; }
.ait-menu-toggle.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:900px){
  .ait-header__inner{ padding:0 20px; }
  .ait-nav{
    display:none; flex-direction:column; align-items:stretch;
    position:fixed; top:64px; left:0; right:0;
    background:rgba(11,18,32,.98);
    padding:10px 0 20px;
    border-bottom:1px solid rgba(198,154,60,.18);
    max-height:calc(100vh - 64px); overflow-y:auto;
    z-index:9998;
  }
  .ait-nav.is-open{ display:flex; }
  .ait-nav__item{
    padding:13px 26px; border-bottom:1px solid rgba(243,239,227,.06);
    border-radius:0; font-size:.86rem;
  }
  .ait-nav__item--cta{ margin:10px 20px 0; text-align:center; border-radius:2px; }
  .ait-menu-toggle{ display:flex; }
}

/* header と hero が重なるための上部余白調整 */
.hero{ padding-top:0; }
.hero-inner{ padding-top:calc(140px + 64px); }
@media (max-width:860px){
  .hero-inner{ padding-top:calc(96px + 64px); }
}

/* hero: 背景写真対応（style属性でグラデーション込みの背景を敷く） */
.hero{
  background-color:var(--night);
  background-size:cover;
  background-position:center 38%;
  background-repeat:no-repeat;
}

/* ============================================================
   PHOTO BLOCKS（画像設置仕様に基づく実写フォト）
   ============================================================ */
.ait-photo{
  margin:0 0 52px;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--card);
  position:relative;
}
.ait-photo img{
  width:100%; height:auto; aspect-ratio:16/9; object-fit:cover;
  filter:saturate(.94) contrast(1.02);
}
.ait-photo figcaption{
  padding:14px 20px;
  font-size:12px; font-family:"JetBrains Mono",monospace;
  color:var(--ink-soft);
  border-top:1px solid var(--line);
  letter-spacing:.02em;
}
.ait-photo--walls{ margin-top:8px; }

/* ============================================================
   図解コンポーネント 埋め込み枠
   ============================================================ */
.ait-diagram-wrap{
  margin:8px 0 8px;
}
.ait-diagram{
  margin:0 -6px;
}
.ait-diagram .sheet,
.ait-diagram .page{
  margin:0 auto !important;
  box-shadow:0 20px 48px -22px rgba(23,31,51,.22), 0 1px 6px rgba(23,31,51,.05) !important;
}
@media (max-width:860px){
  .ait-diagram{ margin:0; }
}

/* ============================================================
   FINALE: 背景フォト対応 + CTA
   ============================================================ */
.finale{
  background-color:var(--night);
  background-size:cover;
  background-position:center 42%;
  background-repeat:no-repeat;
}
.ait-finale-cta{
  display:flex; flex-wrap:wrap; gap:16px;
  margin-top:44px;
}
.ait-finale-cta__btn{
  display:inline-flex; align-items:center;
  padding:14px 32px;
  font-family:"JetBrains Mono",monospace;
  font-size:12.5px; font-weight:700; letter-spacing:.08em;
  background:var(--gold); color:var(--night);
  border-radius:2px;
  transition:filter .3s, transform .3s;
}
.ait-finale-cta__btn:hover{ filter:brightness(1.1); transform:translateY(-2px); }
.ait-finale-cta__btn--ghost{
  background:transparent; color:var(--night-ink);
  border:1px solid rgba(243,239,227,.3);
}
.ait-finale-cta__btn--ghost:hover{
  border-color:rgba(243,239,227,.55); background:rgba(255,255,255,.04);
}
@media (max-width:480px){
  .ait-finale-cta{ flex-direction:column; }
  .ait-finale-cta__btn{ justify-content:center; }
}


/* ============================================================
   図解コンポーネント 01 ― 生成AI×育成戦略が重要な理由（市場データ図解）
   スコープ: #ait-d1
   ============================================================ */
#ait-d1{
  --ink:#171F33;
  --ink-soft:#4B5468;
  --sage-900:#1F4D49;
  --sage-800:#2B6E6B;
  --sage-700:#3F8480;
  --sage-600:#5FA39D;
  --sage-400:#9BC4BF;
  --sage-200:#DCEAE7;
  --silver:#F3F0E7;
  --paper:#FBF9F3;
  --line:#D8D1BC;
  --gold:#C69A3C;
}
#ait-d1 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d1{
  background:var(--silver);
  font-family:'Noto Sans JP', sans-serif;
  color:var(--ink);
}
#ait-d1 .sheet{
  max-width:1200px;
  margin:36px auto;
  background:var(--paper);
  border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(38,51,46,0.28), 0 2px 8px rgba(38,51,46,0.06);
  overflow:hidden;
}
#ait-d1 .header{
  background:linear-gradient(100deg, var(--sage-900) 0%, var(--sage-800) 55%, var(--sage-700) 100%);
  padding:30px 44px;
  position:relative;
}
#ait-d1 .header::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:100%; height:4px;
  background:linear-gradient(90deg, var(--gold), var(--sage-400));
}
#ait-d1 .header .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--sage-400);
  text-transform:uppercase;
  margin-bottom:8px;
}
#ait-d1 .header h1{
  color:#F5F7F4;
  font-size:29px;
  font-weight:800;
  letter-spacing:0.01em;
  line-height:1.4;
}
#ait-d1 .header h1 .accent{
  color:var(--gold);
}
#ait-d1 .body-grid{
  display:grid;
  grid-template-columns:0.92fr 1.18fr;
  gap:0;
  border-bottom:1px solid var(--line);
}
#ait-d1 .left-col{
  padding:38px 40px 34px;
  border-right:1px solid var(--line);
}
#ait-d1 .left-title{
  display:flex;
  align-items:center;
  gap:12px;
  padding-bottom:16px;
  margin-bottom:24px;
  border-bottom:2px solid var(--sage-900);
}
#ait-d1 .left-title .icon{
  width:36px; height:36px;
  border-radius:10px;
  background:linear-gradient(135deg, var(--sage-700), var(--sage-900));
  display:flex; align-items:center; justify-content:center;
  flex:none;
}
#ait-d1 .left-title .icon svg{ width:19px; height:19px; }
#ait-d1 .left-title h2{
  font-size:18px;
  font-weight:700;
  letter-spacing:0.01em;
  line-height:1.4;
}
#ait-d1 .stat-block{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:16px;
  padding:16px 0;
}
#ait-d1 .stat-block + .stat-block{
  border-top:1px dashed var(--line);
}
#ait-d1 .stat-block .ic{
  width:34px; height:34px;
  border-radius:9px;
  background:var(--sage-200);
  display:flex; align-items:center; justify-content:center;
  flex:none;
}
#ait-d1 .stat-block .ic svg{ width:18px; height:18px; stroke:var(--sage-900); }
#ait-d1 .stat-block p{
  font-size:13.5px;
  line-height:1.95;
  color:var(--ink-soft);
}
#ait-d1 .stat-block p .hl{
  color:var(--sage-900);
  font-weight:700;
  background:linear-gradient(180deg, transparent 62%, var(--sage-200) 62%);
  padding:0 1px;
}
#ait-d1 .right-col{
  padding:36px 44px 24px 40px;
}
#ait-d1 .chart-unit{
  font-family:'Space Grotesk', sans-serif;
  font-size:11.5px;
  color:var(--ink-soft);
  margin-bottom:6px;
}
#ait-d1 .chart-area{
  position:relative;
  height:420px;
  margin-left:44px;
}
#ait-d1 .gridlines{
  position:absolute;
  inset:0;
}
#ait-d1 .gridline{
  position:absolute;
  left:0; right:0;
  border-top:1px solid var(--line);
}
#ait-d1 .gridline .tick{
  position:absolute;
  left:-42px;
  top:-8px;
  font-family:'Space Grotesk', sans-serif;
  font-size:11.5px;
  color:var(--ink-soft);
  width:38px;
  text-align:right;
}
#ait-d1 .forecast-flag{
  position:absolute;
  top:6px;
  display:flex;
  align-items:center;
  gap:8px;
  font-family:'Noto Sans JP', sans-serif;
  font-size:12px;
  font-weight:600;
  color:var(--sage-900);
}
#ait-d1 .forecast-flag .arrow{
  width:46px; height:20px;
  background:linear-gradient(90deg, var(--sage-600), var(--sage-400));
  clip-path:polygon(0 22%, 70% 22%, 70% 0%, 100% 50%, 70% 100%, 70% 78%, 0 78%);
}
#ait-d1 .forecast-divider{
  position:absolute;
  top:0; bottom:34px;
  border-left:1.5px dashed var(--sage-700);
}
#ait-d1 .bars-row{
  position:absolute;
  left:0; right:0; bottom:34px; top:0;
  display:flex;
  align-items:flex-end;
  gap:9px;
}
#ait-d1 .bar-col{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  height:100%;
  justify-content:flex-end;
  position:relative;
}
#ait-d1 .bar-val{
  font-family:'Space Grotesk', sans-serif;
  font-weight:700;
  font-size:12.5px;
  color:var(--sage-900);
  margin-bottom:6px;
  white-space:nowrap;
}
#ait-d1 .bar{
  width:76%;
  border-radius:4px 4px 0 0;
  background:linear-gradient(180deg, var(--sage-400), var(--sage-700));
}
#ait-d1 .bar-col.forecast .bar{
  background:linear-gradient(180deg, var(--sage-600), var(--sage-900));
}
#ait-d1 .bar-col.forecast .bar-val{ color:var(--sage-800); }
#ait-d1 .x-labels{
  position:absolute;
  left:0; right:0; bottom:0;
  height:34px;
  display:flex;
  gap:9px;
}
#ait-d1 .x-labels span{
  flex:1;
  text-align:center;
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  color:var(--ink-soft);
  padding-top:6px;
  border-top:1px solid var(--sage-900);
}
#ait-d1 .x-note{
  text-align:right;
  font-family:'Space Grotesk', sans-serif;
  font-size:10.5px;
  color:var(--ink-soft);
  margin-top:2px;
}
#ait-d1 .source{
  text-align:right;
  font-size:11px;
  color:var(--ink-soft);
  margin-top:20px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
#ait-d1 .callout{
  margin:30px 44px 40px;
  padding:26px 32px;
  border:1.5px solid var(--sage-700);
  border-radius:14px;
  background:linear-gradient(135deg, rgba(124,154,130,0.07), rgba(124,154,130,0.02));
  position:relative;
}
#ait-d1 .callout::before{
  content:"POINT";
  position:absolute;
  top:-11px; left:26px;
  background:var(--sage-900);
  color:#fff;
  font-family:'Space Grotesk', sans-serif;
  font-size:10px;
  letter-spacing:0.2em;
  padding:4px 12px;
  border-radius:999px;
}
#ait-d1 .callout p{
  font-size:13.5px;
  line-height:2.05;
  color:var(--ink);
}
#ait-d1 .callout p .hl{
  color:var(--sage-900);
  font-weight:700;
}
#ait-d1 .callout p .hl-quote{
  color:var(--sage-900);
  font-weight:700;
  background:var(--sage-200);
  padding:1px 6px;
  border-radius:4px;
}


@media (max-width:920px){
#ait-d1 .body-grid{ grid-template-columns:1fr; }
#ait-d1 .left-col{ border-right:none; border-bottom:1px solid var(--line); }
#ait-d1 .right-col{ padding:32px 24px; }
#ait-d1 .chart-area{ margin-left:36px; }
#ait-d1 .callout{ margin:26px 20px 34px; }
}


/* ============================================================
   図解コンポーネント 02 ― AIエージェントの登場がもたらす変化
   スコープ: #ait-d2
   ============================================================ */
#ait-d2{
  --ink:#171F33;
  --ink-soft:#4B5468;
  --sage-900:#1F4D49;
  --sage-800:#2B6E6B;
  --sage-700:#3F8480;
  --sage-600:#5FA39D;
  --sage-400:#9BC4BF;
  --sage-200:#DCEAE7;
  --silver:#F3F0E7;
  --paper:#FBF9F3;
  --line:#D8D1BC;
  --gold:#C69A3C;
}
#ait-d2 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d2{
  background:var(--silver);
  font-family:'Noto Sans JP', sans-serif;
  color:var(--ink);
}
#ait-d2 .sheet{
  max-width:1200px;
  margin:36px auto;
  background:var(--paper);
  border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(38,51,46,0.28), 0 2px 8px rgba(38,51,46,0.06);
  overflow:hidden;
  padding:44px 56px 50px;
  position:relative;
}
#ait-d2 .sheet::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--sage-900), var(--sage-600), var(--gold));
}
#ait-d2 .header{
  padding-bottom:22px;
  margin-bottom:8px;
  border-bottom:1.5px solid var(--sage-700);
}
#ait-d2 .header .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--sage-700);
  text-transform:uppercase;
  margin-bottom:10px;
}
#ait-d2 .header h1{
  font-size:32px;
  font-weight:800;
  letter-spacing:0.01em;
  background:linear-gradient(100deg, var(--sage-900) 0%, var(--sage-600) 55%, var(--sage-800) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
#ait-d2 .header h1 .quote{ color:var(--sage-800); -webkit-text-fill-color:var(--sage-800); }
#ait-d2 .intro{
  padding:22px 0 8px;
  font-size:14.5px;
  line-height:2.0;
  color:var(--ink-soft);
  max-width:920px;
}
#ait-d2 .section{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:24px;
  padding:26px 0;
}
#ait-d2 .icon-wrap{
  width:64px; height:64px;
  border-radius:16px;
  background:linear-gradient(135deg, var(--sage-200), var(--sage-400));
  display:flex; align-items:center; justify-content:center;
  flex:none;
  box-shadow:inset 0 0 0 1px rgba(46,74,63,0.12);
}
#ait-d2 .icon-wrap svg{ width:32px; height:32px; }
#ait-d2 .section h2{
  font-size:19.5px;
  font-weight:700;
  color:var(--sage-900);
  margin-bottom:10px;
  letter-spacing:0.01em;
}
#ait-d2 .section p{
  font-size:14px;
  line-height:2.0;
  color:var(--ink-soft);
}
#ait-d2 .section p em{
  font-style:normal;
  color:var(--sage-900);
  font-weight:600;
  background:linear-gradient(180deg, transparent 62%, var(--sage-200) 62%);
  padding:0 1px;
}
#ait-d2 .divider{
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 0 0 88px;
}
#ait-d2 .divider .rule{
  flex:1;
  height:1px;
  background:linear-gradient(90deg, var(--sage-600), var(--sage-200));
}
#ait-d2 .divider .rule.right{
  background:linear-gradient(90deg, var(--sage-200), var(--sage-600));
}
#ait-d2 .divider .ornament{
  width:9px; height:9px;
  background:var(--sage-700);
  transform:rotate(45deg);
  flex:none;
}


@media (max-width:760px){
#ait-d2 .sheet{ padding:32px 24px 40px; }
#ait-d2 .header h1{ font-size:24px; }
#ait-d2 .section{ grid-template-columns:52px 1fr; gap:16px; }
#ait-d2 .icon-wrap{ width:52px; height:52px; border-radius:13px; }
#ait-d2 .icon-wrap svg{ width:26px; height:26px; }
#ait-d2 .divider{ padding-left:68px; }
}


/* ============================================================
   図解コンポーネント 03 ― 育成のボトルネックになりやすい3つの壁
   スコープ: #ait-d3
   ============================================================ */
#ait-d3{
  --ink:#171F33;
  --ink-soft:#4B5468;
  --sage-900:#1F4D49;
  --sage-800:#2B6E6B;
  --sage-700:#3F8480;
  --sage-600:#5FA39D;
  --sage-400:#9BC4BF;
  --sage-200:#DCEAE7;
  --silver:#F3F0E7;
  --paper:#FBF9F3;
  --line:#D8D1BC;
  --gold:#C69A3C;
}
#ait-d3 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d3{
  background:var(--silver);
  font-family:'Noto Sans JP', sans-serif;
  color:var(--ink);
}
#ait-d3 .sheet{
  max-width:1240px;
  margin:36px auto;
  background:var(--paper);
  border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(38,51,46,0.28), 0 2px 8px rgba(38,51,46,0.06);
  overflow:hidden;
}
#ait-d3 .header{
  background:linear-gradient(100deg, var(--sage-900) 0%, var(--sage-800) 55%, var(--sage-700) 100%);
  padding:30px 44px;
  position:relative;
}
#ait-d3 .header::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:100%; height:4px;
  background:linear-gradient(90deg, var(--gold), var(--sage-400));
}
#ait-d3 .header .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--sage-400);
  text-transform:uppercase;
  margin-bottom:8px;
}
#ait-d3 .header h1{
  color:#F5F7F4;
  font-size:29px;
  font-weight:800;
  letter-spacing:0.01em;
  line-height:1.4;
}
#ait-d3 .header h1 .num{ color:var(--gold); }
#ait-d3 .intro{
  padding:26px 44px 6px;
  font-size:14.5px;
  line-height:2.0;
  color:var(--ink-soft);
  max-width:980px;
}
#ait-d3 .cards{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:26px;
  padding:26px 44px 46px;
}
#ait-d3 .card{
  background:linear-gradient(180deg, rgba(124,154,130,0.05), rgba(124,154,130,0.015));
  border:1px solid var(--line);
  border-radius:16px;
  padding:30px 26px 28px;
  display:flex;
  flex-direction:column;
  position:relative;
}
#ait-d3 .card::before{
  content:"";
  position:absolute;
  top:0; left:22px; right:22px; height:3px;
  background:linear-gradient(90deg, var(--sage-700), var(--sage-400));
  border-radius:0 0 4px 4px;
}
#ait-d3 .icon-badge{
  width:76px; height:76px;
  border-radius:20px;
  background:linear-gradient(135deg, var(--sage-200), var(--sage-400));
  display:flex; align-items:center; justify-content:center;
  margin:6px auto 22px;
  box-shadow:inset 0 0 0 1px rgba(46,74,63,0.12);
}
#ait-d3 .icon-badge svg{ width:38px; height:38px; }
#ait-d3 .card-tag{
  text-align:center;
  background:linear-gradient(100deg, var(--sage-900), var(--sage-700));
  color:#F5F7F4;
  font-size:16.5px;
  font-weight:700;
  padding:12px 14px;
  border-radius:9px;
  margin-bottom:22px;
  letter-spacing:0.01em;
}
#ait-d3 .card-tag .mark{ color:var(--gold); }
#ait-d3 .card p{
  font-size:13px;
  line-height:1.95;
  color:var(--ink-soft);
}
#ait-d3 .card p + p{
  margin-top:16px;
  padding-top:16px;
  border-top:1px dashed var(--line);
}


@media (max-width:900px){
#ait-d3 .cards{ grid-template-columns:1fr; }
#ait-d3 .header h1{ font-size:22px; }
}


/* ============================================================
   図解コンポーネント 04 ― 生成AI人材変革の設計図（チェンジマネジメント×ADKAR）
   スコープ: #ait-d4
   ============================================================ */
#ait-d4{
  --ink:#0B1220;
  --ink-2:#16233F;
  --river-blue:#2B6E6B;
  --river-cyan:#4FA39D;
  --gold:#C69A3C;
  --gold-soft:#DDBB6E;
  --paper:#F3EFE3;
  --paper-dim:#C9C6BB;
  --line:rgba(244,239,226,0.14);
}
#ait-d4 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d4{
  background:var(--ink);
  color:var(--paper);
  font-family:'Noto Sans JP', sans-serif;
  overflow-x:hidden;
}
#ait-d4{
  background:
    radial-gradient(ellipse at 20% -10%, rgba(63,186,194,0.14), transparent 45%),
    radial-gradient(ellipse at 90% 15%, rgba(240,190,85,0.08), transparent 40%),
    linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 45%, var(--ink) 100%);
}
#ait-d4 .page{
  max-width:1160px;
  margin:0 auto;
  padding:64px 48px 40px;
  position:relative;
}
#ait-d4 .hero{
  text-align:center;
  padding-bottom:56px;
  position:relative;
}
#ait-d4 .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:12.5px;
  letter-spacing:0.42em;
  color:var(--gold-soft);
  text-transform:uppercase;
  margin-bottom:22px;
}
#ait-d4 .eyebrow::before, #ait-d4 .eyebrow::after{
  content:"";
  display:inline-block;
  width:28px;
  height:1px;
  background:var(--gold-soft);
  vertical-align:middle;
  margin:0 12px 3px;
  opacity:0.6;
}
#ait-d4 h1.title{
  font-family:'Shippori Mincho', serif;
  font-weight:800;
  font-size:clamp(34px, 5vw, 54px);
  line-height:1.35;
  letter-spacing:0.03em;
  background:linear-gradient(100deg, var(--paper) 30%, var(--gold-soft) 70%, var(--river-cyan) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
#ait-d4 .subtitle{
  margin-top:18px;
  font-family:'Space Grotesk', sans-serif;
  font-size:15px;
  letter-spacing:0.08em;
  color:var(--paper-dim);
}
#ait-d4 .subtitle b{ color:var(--river-cyan); font-weight:600; }
#ait-d4 .thesis{
  max-width:640px;
  margin:34px auto 0;
  font-size:15px;
  line-height:2.05;
  color:var(--paper-dim);
}
#ait-d4 .thesis strong{
  color:var(--paper);
  font-weight:700;
  border-bottom:1px solid var(--gold);
  padding-bottom:1px;
}
#ait-d4 .section-label{
  display:flex;
  align-items:center;
  gap:16px;
  margin:8px 0 34px;
}
#ait-d4 .section-label .num{
  font-family:'Space Grotesk', sans-serif;
  font-size:13px;
  color:var(--ink);
  background:var(--gold);
  width:30px; height:30px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700;
  flex:none;
}
#ait-d4 .section-label .txt{
  font-family:'Shippori Mincho', serif;
  font-size:22px;
  font-weight:700;
  letter-spacing:0.04em;
}
#ait-d4 .section-label .sub{
  font-family:'Space Grotesk', sans-serif;
  font-size:11.5px;
  letter-spacing:0.18em;
  color:var(--paper-dim);
  text-transform:uppercase;
  margin-left:auto;
}
#ait-d4 .river-wrap{
  position:relative;
  margin:0 0 84px;
}
#ait-d4 .river-svg{
  position:absolute;
  top:0; left:0;
  width:100%; height:100%;
  z-index:0;
}
#ait-d4 .adkar-flow{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  gap:6px;
}
#ait-d4 .adkar-node{
  display:grid;
  grid-template-columns:78px 1fr;
  align-items:center;
  gap:26px;
  padding:22px 26px;
  min-height:118px;
}
#ait-d4 .adkar-node .letter{
  font-family:'Space Grotesk', sans-serif;
  font-weight:700;
  font-size:40px;
  width:78px; height:78px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--ink);
  position:relative;
  box-shadow:0 0 0 5px rgba(244,239,226,0.06), 0 14px 30px -8px rgba(0,0,0,0.55);
}
#ait-d4 .adkar-node .body h3{
  font-family:'Shippori Mincho', serif;
  font-size:20px;
  font-weight:700;
  letter-spacing:0.02em;
  margin-bottom:4px;
}
#ait-d4 .adkar-node .body .en{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.16em;
  color:var(--paper-dim);
  text-transform:uppercase;
  display:block;
  margin-bottom:6px;
}
#ait-d4 .adkar-node .body p{
  font-size:13.5px;
  line-height:1.85;
  color:var(--paper-dim);
  max-width:560px;
}
#ait-d4 .n1 .letter{ background:linear-gradient(135deg,#3FBAC2,#2A8FA6); }
#ait-d4 .n2 .letter{ background:linear-gradient(135deg,#4FC6C4,#2F97A0); }
#ait-d4 .n3 .letter{ background:linear-gradient(135deg,#69C7B0,#3AA391); }
#ait-d4 .n4 .letter{ background:linear-gradient(135deg,#9ECB8E,#6BAE7E); }
#ait-d4 .n5 .letter{ background:linear-gradient(135deg,var(--gold-soft),var(--gold)); }
#ait-d4 .pillars{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin-bottom:78px;
}
#ait-d4 .pillar{
  background:linear-gradient(180deg, rgba(244,239,226,0.045), rgba(244,239,226,0.015));
  border:1px solid var(--line);
  border-radius:14px;
  padding:30px 30px 22px;
  position:relative;
  overflow:hidden;
}
#ait-d4 .pillar::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
}
#ait-d4 .pillar.should::before{ background:linear-gradient(90deg,var(--river-blue),var(--river-cyan)); }
#ait-d4 .pillar.could::before{ background:linear-gradient(90deg,var(--gold),var(--gold-soft)); }
#ait-d4 .pillar-head{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:6px;
}
#ait-d4 .pillar-head .jp{
  font-family:'Shippori Mincho', serif;
  font-size:19px;
  font-weight:700;
}
#ait-d4 .pillar-head .en{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.14em;
  color:var(--paper-dim);
  text-transform:uppercase;
}
#ait-d4 .pillar-desc{
  font-size:12.5px;
  color:var(--paper-dim);
  margin-bottom:18px;
  line-height:1.7;
}
#ait-d4 .pillar ul{ list-style:none; }
#ait-d4 .pillar li{
  padding:12px 0;
  border-top:1px solid var(--line);
  font-size:13.5px;
  line-height:1.6;
  display:flex;
  gap:10px;
}
#ait-d4 .pillar li:first-of-type{ border-top:none; }
#ait-d4 .pillar li .mk{
  flex:none;
  color:var(--gold-soft);
  font-family:'Space Grotesk', sans-serif;
  font-size:12px;
  margin-top:2px;
}
#ait-d4 .pillar.should li .mk{ color:var(--river-cyan); }
#ait-d4 .roadmap{
  margin-bottom:80px;
}
#ait-d4 .roadmap-track{
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  padding:10px 0 26px;
}
#ait-d4 .roadmap-track::before{
  content:"";
  position:absolute;
  top:38px; left:5%; right:5%;
  height:1px;
  background:linear-gradient(90deg, var(--river-blue), var(--gold));
  opacity:0.5;
}
#ait-d4 .rm-step{
  flex:1;
  text-align:center;
  position:relative;
  z-index:1;
}
#ait-d4 .rm-dot{
  width:14px; height:14px;
  border-radius:50%;
  background:var(--paper);
  margin:0 auto 16px;
  box-shadow:0 0 0 5px var(--ink), 0 0 0 6px var(--line);
}
#ait-d4 .rm-step:nth-child(1) .rm-dot{ background:var(--river-cyan); }
#ait-d4 .rm-step:nth-child(2) .rm-dot{ background:#69C7B0; }
#ait-d4 .rm-step:nth-child(3) .rm-dot{ background:#B8CE79; }
#ait-d4 .rm-step:nth-child(4) .rm-dot{ background:var(--gold); }
#ait-d4 .rm-label{
  font-family:'Shippori Mincho', serif;
  font-size:15.5px;
  font-weight:700;
}
#ait-d4 .rm-sub{
  font-family:'Space Grotesk', sans-serif;
  font-size:10px;
  letter-spacing:0.1em;
  color:var(--paper-dim);
  text-transform:uppercase;
  margin-top:4px;
}
#ait-d4 .rm-arrow{
  flex:none;
  color:var(--paper-dim);
  font-size:14px;
  opacity:0.5;
  margin-top:-26px;
}
#ait-d4 .closing{
  border-top:1px solid var(--line);
  padding-top:52px;
  text-align:center;
}
#ait-d4 .closing .lead{
  font-family:'Shippori Mincho', serif;
  font-size:21px;
  line-height:1.9;
  font-weight:700;
  max-width:640px;
  margin:0 auto 22px;
}
#ait-d4 .non-repro{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin:26px 0 22px;
}
#ait-d4 .non-repro span{
  font-family:'Space Grotesk', sans-serif;
  font-size:12.5px;
  letter-spacing:0.05em;
  padding:9px 18px;
  border:1px solid rgba(240,190,85,0.4);
  border-radius:999px;
  color:var(--gold-soft);
  background:rgba(240,190,85,0.06);
}
#ait-d4 .closing .note{
  font-size:12.5px;
  color:var(--paper-dim);
  line-height:1.9;
  max-width:560px;
  margin:0 auto;
}
#ait-d4 .footer-mark{
  margin-top:44px;
  font-family:'Space Grotesk', sans-serif;
  font-size:10.5px;
  letter-spacing:0.3em;
  color:var(--paper-dim);
  text-transform:uppercase;
  opacity:0.55;
}


@media (max-width: 720px){
#ait-d4 .page{ padding:44px 20px 30px; }
#ait-d4 .pillars{ grid-template-columns:1fr; }
#ait-d4 .adkar-node{ grid-template-columns:60px 1fr; gap:16px; padding:16px 14px; }
#ait-d4 .adkar-node .letter{ width:60px; height:60px; font-size:28px; }
#ait-d4 .roadmap-track{ flex-direction:column; align-items:flex-start; gap:26px; }
#ait-d4 .roadmap-track::before{ display:none; }
#ait-d4 .rm-arrow{ display:none; }
}
#ait-d4 .reveal{
  opacity:0;
  transform:translateY(16px);
  transition:opacity 0.7s ease, transform 0.7s ease;
}
#ait-d4 .reveal.in{ opacity:1; transform:translateY(0); }


/* ============================================================
   図解コンポーネント 05 ― 生成AI活用人材を育成するための5ステップ
   スコープ: #ait-d5
   ============================================================ */
#ait-d5{
  --ink:#171F33;
  --ink-soft:#4B5468;
  --sage-900:#1F4D49;
  --sage-800:#2B6E6B;
  --sage-700:#3F8480;
  --sage-600:#5FA39D;
  --sage-400:#9BC4BF;
  --sage-200:#DCEAE7;
  --silver:#F3F0E7;
  --paper:#FBF9F3;
  --line:#D8D1BC;
  --gold:#C69A3C;
}
#ait-d5 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d5{
  background:var(--silver);
  font-family:'Noto Sans JP', sans-serif;
  color:var(--ink);
}
#ait-d5 .sheet{
  max-width:1240px;
  margin:36px auto;
  background:var(--paper);
  border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(38,51,46,0.28), 0 2px 8px rgba(38,51,46,0.06);
  overflow:hidden;
}
#ait-d5 .header{
  background:linear-gradient(100deg, var(--sage-900) 0%, var(--sage-800) 55%, var(--sage-700) 100%);
  padding:30px 44px;
  position:relative;
}
#ait-d5 .header::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:100%; height:4px;
  background:linear-gradient(90deg, var(--gold), var(--sage-400));
}
#ait-d5 .header .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--sage-400);
  text-transform:uppercase;
  margin-bottom:8px;
}
#ait-d5 .header h1{
  color:#F5F7F4;
  font-size:29px;
  font-weight:800;
  letter-spacing:0.01em;
  line-height:1.4;
}
#ait-d5 .header h1 .num{ color:var(--gold); }
#ait-d5 .intro{
  padding:24px 44px 4px;
  font-size:14px;
  line-height:2.0;
  color:var(--ink-soft);
  text-align:center;
  max-width:980px;
  margin:0 auto;
}
#ait-d5 .step-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:34px;
  padding:34px 44px 8px;
}
#ait-d5 .col{ display:flex; flex-direction:column; }
#ait-d5 .step{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:22px;
  padding:18px 0;
}
#ait-d5 .badge{
  width:74px; height:74px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--sage-200), var(--sage-500));
  display:flex; align-items:center; justify-content:center;
  flex:none;
  box-shadow:inset 0 0 0 1px rgba(46,74,63,0.15), 0 6px 14px -6px rgba(46,74,63,0.35);
}
#ait-d5 .badge svg{ width:34px; height:34px; }
#ait-d5 .step-label{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:8px;
}
#ait-d5 .step-label .tag{
  font-family:'Space Grotesk', sans-serif;
  font-size:20px;
  font-weight:700;
  color:var(--sage-900);
  letter-spacing:0.02em;
}
#ait-d5 .step-label .ttl{
  font-size:19px;
  font-weight:700;
  color:var(--ink);
}
#ait-d5 .step p{
  font-size:13px;
  line-height:1.95;
  color:var(--ink-soft);
}
#ait-d5 .step p em{
  font-style:normal;
  font-weight:700;
  color:var(--sage-900);
  background:linear-gradient(180deg, transparent 62%, var(--sage-200) 62%);
  padding:0 1px;
}
#ait-d5 .arrow-down{
  width:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2px 0;
}
#ait-d5 .arrow-down svg{ width:22px; height:34px; }
#ait-d5 .step5{
  margin:14px 44px 40px;
  padding:26px 34px;
  border-radius:14px;
  background:linear-gradient(100deg, var(--sage-900), var(--sage-700));
  display:grid;
  grid-template-columns:74px auto 1fr;
  align-items:center;
  gap:22px;
}
#ait-d5 .step5 .badge{
  background:linear-gradient(135deg, var(--sage-200), var(--gold));
}
#ait-d5 .step5 .step-label{
  margin-bottom:0;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}
#ait-d5 .step5 .step-label .tag{ color:var(--gold); }
#ait-d5 .step5 .step-label .ttl{ color:#F5F7F4; font-size:18px; }
#ait-d5 .step5 p{
  color:#E7ECE8;
  font-size:13px;
  line-height:1.9;
}
#ait-d5 .step5 p em{
  color:#FFFFFF;
  background:none;
  text-decoration:underline;
  text-decoration-color:var(--gold);
  text-underline-offset:3px;
}


@media (max-width:900px){
#ait-d5 .step-grid{ grid-template-columns:1fr; }
#ait-d5 .step5{ grid-template-columns:1fr; text-align:center; }
#ait-d5 .step5 .step-label{ align-items:center; }
}


/* ============================================================
   図解コンポーネント 06 ― 生成AIの活用を促進する3つの仕掛け
   スコープ: #ait-d6
   ============================================================ */
#ait-d6{
  --ink:#171F33;
  --ink-soft:#4B5468;
  --sage-900:#1F4D49;
  --sage-800:#2B6E6B;
  --sage-700:#3F8480;
  --sage-600:#5FA39D;
  --sage-400:#9BC4BF;
  --sage-200:#DCEAE7;
  --silver:#F3F0E7;
  --paper:#FBF9F3;
  --line:#D8D1BC;
  --gold:#C69A3C;
}
#ait-d6 *{box-sizing:border-box; margin:0; padding:0;}
#ait-d6{
  background:var(--silver);
  font-family:'Noto Sans JP', sans-serif;
  color:var(--ink);
}
#ait-d6 .sheet{
  max-width:1240px;
  margin:36px auto;
  background:var(--paper);
  border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(38,51,46,0.28), 0 2px 8px rgba(38,51,46,0.06);
  overflow:hidden;
  padding:44px 50px 48px;
  position:relative;
}
#ait-d6 .sheet::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--sage-900), var(--sage-600), var(--gold));
}
#ait-d6 .header{
  padding-bottom:22px;
  margin-bottom:8px;
  border-bottom:1.5px solid var(--sage-700);
}
#ait-d6 .header .eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--sage-700);
  text-transform:uppercase;
  margin-bottom:10px;
}
#ait-d6 .header h1{
  font-size:30px;
  font-weight:800;
  letter-spacing:0.01em;
  background:linear-gradient(100deg, var(--sage-900) 0%, var(--sage-600) 55%, var(--sage-800) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
#ait-d6 .header h1 .num{ color:var(--gold); -webkit-text-fill-color:var(--gold); }
#ait-d6 .intro{
  padding:22px 0 6px;
  font-size:14.5px;
  line-height:2.0;
  color:var(--ink-soft);
  text-align:center;
}
#ait-d6 .columns{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  margin-top:24px;
}
#ait-d6 .column{
  padding:8px 30px;
  position:relative;
}
#ait-d6 .column + .column{
  border-left:1px solid var(--line);
}
#ait-d6 .icon-badge{
  width:78px; height:78px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--sage-200), var(--sage-500));
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 26px;
  box-shadow:inset 0 0 0 1px rgba(46,74,63,0.15), 0 8px 18px -8px rgba(46,74,63,0.4);
}
#ait-d6 .icon-badge svg{ width:38px; height:38px; }
#ait-d6 .col-head{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:16px;
}
#ait-d6 .col-head .idx{
  font-family:'Space Grotesk', sans-serif;
  font-size:38px;
  font-weight:700;
  color:var(--sage-400);
  line-height:1;
  flex:none;
}
#ait-d6 .col-head .ttl{
  font-size:17px;
  font-weight:700;
  color:var(--ink);
  line-height:1.5;
}
#ait-d6 .column p{
  font-size:12.8px;
  line-height:1.95;
  color:var(--ink-soft);
}
#ait-d6 .column p em{
  font-style:normal;
  font-weight:700;
  color:var(--sage-900);
  background:linear-gradient(180deg, transparent 62%, var(--sage-200) 62%);
  padding:0 1px;
}


@media (max-width:920px){
#ait-d6 .columns{ grid-template-columns:1fr; }
#ait-d6 .column + .column{ border-left:none; border-top:1px solid var(--line); padding-top:30px; margin-top:14px; }
#ait-d6 .header h1{ font-size:23px; }
}

/* ============================================================
   CONTACT（本LP専用CTA / Contact Form 7 #3c0cae4）
   ============================================================ */
.ait-contact{
  background:var(--night);
  color:var(--night-ink);
  padding:clamp(88px,12vw,140px) 40px;
}
.ait-contact__inner{
  max-width:760px; margin:0 auto; text-align:center;
}
.ait-contact .eyebrow{ color:var(--gold); justify-content:center; }
.ait-contact .eyebrow::before{ background:var(--gold); }
.ait-contact .title{ color:#fff; margin-bottom:22px; }
.ait-contact .lead{
  color:#C9C6BB; margin:0 auto 52px; max-width:56ch;
}
.ait-contact__form{
  text-align:left;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(198,154,60,.22);
  border-radius:var(--radius);
  padding:clamp(28px,4vw,44px);
}

/* ---- Contact Form 7 既定マークアップの再スタイル ---- */
.ait-contact__form .wpcf7-form{
  display:flex; flex-direction:column; gap:22px;
  font-family:"Noto Sans JP", sans-serif;
}
.ait-contact__form .wpcf7-form p{ margin:0; }
.ait-contact__form label{
  display:block; font-size:13.5px; color:#C9C6BB; margin-bottom:8px;
  letter-spacing:.02em;
}
.ait-contact__form .wpcf7-form-control{
  width:100%;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(243,239,227,.2);
  border-radius:2px;
  padding:12px 14px;
  font-size:14.5px;
  color:var(--night-ink);
  font-family:"Noto Sans JP", sans-serif;
  transition:border-color .3s, background .3s;
}
.ait-contact__form textarea.wpcf7-form-control{ min-height:140px; resize:vertical; }
.ait-contact__form .wpcf7-form-control:focus{
  outline:none;
  border-color:var(--gold);
  background:rgba(255,255,255,.06);
}
.ait-contact__form .wpcf7-form-control::placeholder{ color:rgba(243,239,227,.4); }
.ait-contact__form .wpcf7-form-control-wrap{ display:block; position:relative; }
.ait-contact__form .wpcf7-not-valid-tip{
  display:block; margin-top:6px;
  font-size:12px; color:#E8846F;
  font-family:"JetBrains Mono", monospace;
}
.ait-contact__form .wpcf7-response-output{
  margin:0; border-radius:2px;
  padding:14px 16px; font-size:13.5px;
  border:1px solid rgba(198,154,60,.35);
  color:var(--night-ink);
}
.ait-contact__form .wpcf7-mail-sent-ok{ border-color:var(--teal); }
.ait-contact__form .wpcf7-validation-errors,
.ait-contact__form .wpcf7-mail-sent-ng{ border-color:#AE3C2C; }

.ait-contact__form input[type="submit"]{
  align-self:flex-start;
  background:var(--gold);
  color:var(--night);
  border:none;
  padding:14px 36px;
  font-family:"JetBrains Mono", monospace;
  font-size:12.5px; font-weight:700; letter-spacing:.08em;
  border-radius:2px; cursor:pointer;
  transition:filter .3s, transform .3s;
}
.ait-contact__form input[type="submit"]:hover{ filter:brightness(1.1); transform:translateY(-2px); }
.ait-contact__form input[type="submit"]:disabled{ opacity:.6; cursor:progress; }

.ait-contact__form .wpcf7-spinner{
  margin-left:12px; vertical-align:middle;
}

@media (max-width:640px){
  .ait-contact{ padding:72px 22px; }
  .ait-contact__form input[type="submit"]{ width:100%; text-align:center; }
}
