/* AI駆動開発コース — Slide Design System (黄×黒×白 エディトリアル) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Roboto:wght@400;700;900&family=Roboto+Mono:wght@400;500;700&display=swap');

:root{
  --primary:      #F3B22A;
  --primary-deep: #E09A00;
  --ink:          #0A0A0A;
  --text:         #0A0A0A;
  --text-muted:   #5A5A5A;
  --bg:           #FFFFFF;
  --bg-soft:      #F5F5F5;
  --bg-tint:      #FAF6EC;
  --border:       #E4E4E4;

  --green:        #2A9D8F;
  --green-lt:     #7EC99B;
  --red:          #E76F51;
  --red-lt:       #F28B6A;
  --blue:         #6FB8D9;

  --fs-sans:  "Noto Sans JP","Roboto",system-ui,sans-serif;
  --fs-roman: "Roboto","Noto Sans JP",system-ui,sans-serif;
  --fs-mono:  "Roboto Mono",ui-monospace,Menlo,monospace;
}

*{ box-sizing:border-box; }
html, body{
  margin:0; padding:0; background:#000;
  font-family:var(--fs-sans); color:var(--text);
  -webkit-font-smoothing:antialiased;
}

deck-stage > section{
  width:1920px; height:1080px;
  background:var(--bg); color:var(--text);
  position:relative; overflow:hidden;
  padding:96px 120px 104px;
  display:flex; flex-direction:column;
  font-family:var(--fs-sans); font-weight:400;
}

/* ——— Variants ——— */
section.soft-slide{ background:var(--bg-soft); }
section.ink-slide{ background:var(--ink); color:#fff; }
section.hero-slide{
  background:var(--primary); color:var(--ink);
  padding:0 120px; justify-content:center;
}

/* ——— Brand mark (左上) ——— */
.brand-mark{
  position:absolute; top:40px; left:120px;
  display:flex; align-items:center; gap:14px;
  font-family:var(--fs-mono); font-size:14px;
  letter-spacing:0.18em; text-transform:uppercase;
  color:var(--text-muted);
  white-space:nowrap;
}
.brand-mark__c{
  width:30px; height:30px;
  background:var(--primary); color:var(--ink);
  display:grid; place-items:center;
  font-family:var(--fs-roman); font-weight:900; font-size:16px;
}
.ink-slide .brand-mark{ color:rgba(255,255,255,.55); }
.hero-slide .brand-mark{ color:var(--ink); opacity:.75; }

/* ——— Slide header ——— */
.slide-head{
  display:flex; align-items:baseline; justify-content:space-between;
  padding-bottom:24px;
  border-bottom:1px solid var(--ink);
  margin-bottom:56px;
}
.slide-head .title{
  font-family:var(--fs-sans); font-weight:900;
  font-size:56px; line-height:1.15; letter-spacing:-0.02em;
  color:var(--ink);
}
.slide-head .meta{
  font-family:var(--fs-mono); font-size:18px;
  letter-spacing:0.12em; text-transform:uppercase;
  color:var(--text-muted);
}
.ink-slide .slide-head{ border-bottom-color:rgba(255,255,255,.18); }
.ink-slide .slide-head .title{ color:#fff; }
.ink-slide .slide-head .meta{ color:rgba(255,255,255,.55); }

.slide-body{ flex:1; display:flex; flex-direction:column; min-height:0; }

/* ——— Signature highlight ——— */
.hl{
  display:inline-block; vertical-align:baseline;
  background:var(--primary); color:var(--ink);
  padding:0.02em 0.26em; line-height:1.12;
  white-space:nowrap; font-weight:900;
}
.hl--tilt{ transform:rotate(-2deg); } /* Hero タイトルのみ */
.hl--ink{ background:var(--ink); color:var(--primary); }

/* ——— Utilities ——— */
.mono{ font-family:var(--fs-mono); }
.roman{ font-family:var(--fs-roman); }
.text-primary{ color:var(--primary-deep); }
.ink-slide .text-primary{ color:var(--primary); }
.text-green{ color:var(--green); }
.text-red{ color:var(--red); }
.text-blue{ color:var(--blue); }
.text-muted{ color:var(--text-muted); }
.ink-slide .text-muted{ color:rgba(255,255,255,.55); }
.text-ink{ color:var(--ink); }

.kicker{
  font-family:var(--fs-mono); font-size:16px;
  letter-spacing:0.24em; text-transform:uppercase;
  color:var(--primary-deep);
}
.ink-slide .kicker{ color:var(--primary); }

.footnote{
  font-size:22px; color:var(--text-muted);
  font-family:var(--fs-sans);
}
.ink-slide .footnote{ color:rgba(255,255,255,.7); }

/* ——— Badges (直角・角丸なし) ——— */
.badge{
  display:inline-flex; align-items:center; justify-content:center;
  padding:6px 14px;
  font-family:var(--fs-mono); font-size:20px; font-weight:700;
  border:1.5px solid currentColor; background:transparent;
}
.badge.lg{ font-size:26px; padding:10px 20px; }
.badge.green{ color:var(--green); }
.badge.red{ color:var(--red); }
.badge.blue{ color:var(--blue); }
.badge.ink{ color:var(--ink); }
.ink-slide .badge.green{ color:var(--green-lt); }
.ink-slide .badge.red{ color:var(--red-lt); }

/* ——— Code (ターミナル意匠・黒地) ——— */
.code{
  background:var(--ink); color:#fff;
  font-family:var(--fs-mono); font-size:22px; line-height:1.75;
  padding:32px 36px;
  border:1px solid var(--ink);
  white-space:pre; overflow:hidden;
}
.code.sm{ font-size:20px; padding:24px 28px; }
.code .c-comment{ color:rgba(255,255,255,.45); }
.code .c-str{ color:var(--primary); }
.code .c-num{ color:var(--blue); }
.code .c-kw{ color:var(--green-lt); }
.code .c-fn{ color:#fff; }

/* ——— Card ——— */
.card{
  border:1px solid var(--border);
  background:#fff;
  padding:32px 36px;
}
.card .ttl{
  font-family:var(--fs-sans); font-weight:900;
  font-size:28px; margin-bottom:14px;
}
.soft-slide .card{ background:#fff; }
.ink-slide .card{
  background:#141414; border-color:rgba(255,255,255,.12); color:#fff;
}

/* ——— Array cell ——— */
.array-cell{
  width:150px; height:130px;
  border:1.5px solid var(--ink);
  background:var(--bg-tint);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--fs-sans); font-weight:700; font-size:28px;
  color:var(--ink);
}
.ink-slide .array-cell{
  background:rgba(243,178,42,.12); border-color:var(--primary); color:#fff;
}

/* ——— Stats row (Trust strip 的) ——— */
.stats{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
}
.stats__cell{
  padding:28px 24px;
  border-left:1px solid var(--ink);
}
.stats__cell:first-child{ border-left:none; }
.stats__num{
  font-family:var(--fs-roman); font-weight:900;
  font-size:64px; letter-spacing:-0.02em; line-height:1;
  color:var(--ink);
}
.stats__lbl{
  font-family:var(--fs-mono); font-size:13px;
  letter-spacing:0.12em; text-transform:uppercase;
  color:var(--text-muted); margin-top:12px;
}
.ink-slide .stats{ border-color:rgba(255,255,255,.2); }
.ink-slide .stats__cell{ border-left-color:rgba(255,255,255,.12); }
.ink-slide .stats__num{ color:#fff; }
.ink-slide .stats__lbl{ color:rgba(255,255,255,.55); }

/* ——— Page dots (右下) ——— */
.page-dots{
  position:absolute; bottom:40px; right:120px;
  font-family:var(--fs-mono); font-size:14px;
  letter-spacing:0.16em; color:var(--text-muted);
  white-space:nowrap;
}
.ink-slide .page-dots{ color:rgba(255,255,255,.45); }
.hero-slide .page-dots{ color:var(--ink); opacity:.7; }

/* ——— Hero / Section title slide ——— */
.hero-slide .num{
  font-family:var(--fs-mono); font-size:22px;
  letter-spacing:0.3em; color:var(--ink);
  margin-bottom:36px;
}
.hero-slide h1{
  font-family:var(--fs-sans); font-weight:900;
  font-size:200px; line-height:1.02; letter-spacing:-0.03em;
  margin:0; color:var(--ink);
}
.hero-slide .sub{
  font-family:var(--fs-sans); font-weight:900;
  font-size:64px; margin-top:32px;
  color:var(--ink);
}
.hero-slide .tag{
  font-family:var(--fs-mono); font-size:18px;
  letter-spacing:0.22em; color:var(--ink); opacity:.7;
  margin-top:64px;
}

/* ——— Table ——— */
.row{
  display:grid; align-items:center;
  padding:24px 28px;
  border-bottom:1px solid var(--border);
}
.row.head{
  font-family:var(--fs-mono); font-size:15px;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--text-muted);
  padding:16px 28px;
  border-bottom:1.5px solid var(--ink);
}
.ink-slide .row{ border-bottom-color:rgba(255,255,255,.1); }
.ink-slide .row.head{
  border-bottom-color:rgba(255,255,255,.3);
  color:rgba(255,255,255,.55);
}

/* ——— Fadein ——— */
.fadein{ opacity:0; transform:translateY(8px); transition:opacity .6s ease, transform .6s ease; }
.fadein.in{ opacity:1; transform:translateY(0); }