/* ════════════════════════════════════════════════════════════════════
   RELICKEEPER — START-MI deck · visual system
   Noir & or, luxe sobre. Cinzel (titres, capitales) + Inter (corps).
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* Marque */
  --bg:         #050505;
  --bg-2:       #0a0a09;
  --panel:      #0e0e0c;
  --gold:       #d4af37;
  --gold-light: #e5c687;
  --gold-deep:  #8c7322;
  --cyan:       #7fe5f0;
  --alert:      #ef4444;

  /* Texte */
  --bone:       #ece9e1;
  --bone-dim:   #b6b2a8;
  --muted:      #79766e;
  --muted-2:    #4d4b45;

  /* Type */
  --serif: "Cinzel", "Trajan Pro", "Times New Roman", serif;
  --sans:  "Inter", system-ui, -apple-system, sans-serif;

  --slide-w: 1920px;
  --slide-h: 1080px;
  --pad: 116px;

  /* tweakables */
  --filet-op: 1;      /* gold hairline intensity */
  --cyan-op: 1;       /* cyan LED dosage */
}

:root[data-grain="off"] section.slide::before { display:none; }
:root[data-chrome="off"] .chrome { display:none; }
:root[data-chrome="off"] .srcfoot { display:none; }

/* ── Source footer (study figures) ─────────────────────────────────── */
.srcfoot {
  position: absolute;
  left: 116px; right: 116px; bottom: 52px;
  z-index: 6; pointer-events: none;
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 20px; letter-spacing: 0.015em; line-height: 1.3;
  color: #79766e;
}
.srcfoot .sf-lbl {
  font-size: 18px; letter-spacing: 0.18em; text-transform: uppercase;
  color: #d4af37; opacity: 0.62; flex: none;
}
.srcfoot .sf-list { color: #79766e; }
/* Concurrence : table haute — on descend le pied pour qu'il ne touche pas le tableau */
.s-compet .srcfoot { bottom: 18px; }

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: var(--bg);
  color: var(--bone);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
}
deck-stage { background: #000; }

/* ── Slide chassis ─────────────────────────────────────────────────── */
section.slide {
  width: var(--slide-w);
  height: var(--slide-h);
  background: radial-gradient(ellipse 90% 70% at 50% 0%, var(--bg-2), var(--bg) 70%);
  color: var(--bone);
  position: relative;
  overflow: hidden;
  padding: var(--pad);
  display: flex;
  flex-direction: column;
}
/* faint film grain */
section.slide::before {
  content: "";
  position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background-image: radial-gradient(circle at center, rgba(255,255,255,0.014) 1px, transparent 1.4px);
  background-size: 30px 30px;
  opacity: 0.5; mix-blend-mode: screen;
}
/* gold vignette breath */
section.slide::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse 70% 50% at 50% 115%, rgba(212,175,55,0.05), transparent 60%);
}
.slide > * { position: relative; z-index: 2; }

/* ── Chrome ────────────────────────────────────────────────────────── */
.chrome {
  position: absolute;
  inset: 56px 72px auto 72px;
  display: flex; justify-content: flex-start; align-items: center;
  z-index: 6; pointer-events: none;
}
.chrome .cm {
  font-family: var(--sans);
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 0.2em;
  color: var(--muted);
  text-indent: 0;
}
.chrome .cm::after { content: "·"; margin: 0 12px; color: var(--muted-2); }
.chrome .pg {
  font-family: var(--sans);
  font-size: 18px;
  letter-spacing: 0.18em;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.chrome .pg .of { color: var(--muted-2); }

/* ── Type primitives ───────────────────────────────────────────────── */
.kicker {
  font-family: var(--sans);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--gold-light);
  display: flex; align-items: center; gap: 18px;
}
.kicker::before {
  content: "";
  width: 30px; height: 1px;
  background: var(--gold);
  opacity: var(--filet-op);
}

.title {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 76px;
  line-height: 1.08;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--bone);
  text-wrap: balance;
}
.title .g { color: var(--gold); }

.title-sm {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 58px;
  line-height: 1.12;
  letter-spacing: 0.015em;
  text-transform: uppercase;
  color: var(--bone);
}

.lead {
  font-family: var(--sans);
  font-weight: 300;
  font-size: 30px;
  line-height: 1.5;
  color: var(--bone-dim);
  letter-spacing: 0.002em;
  max-width: 940px;
}
.body {
  font-family: var(--sans);
  font-weight: 400;
  font-size: 24px;
  line-height: 1.6;
  color: var(--bone-dim);
}
.small {
  font-family: var(--sans);
  font-size: 24px;
  line-height: 1.55;
  color: var(--muted);
}
.label {
  font-family: var(--sans);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold-light);
}
.exergue {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 44px;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: var(--gold);
  font-feature-settings: "smcp";
}

/* hairlines */
.filet {
  height: 1px; border: 0;
  background: linear-gradient(90deg, var(--gold), transparent);
  opacity: var(--filet-op);
}
.filet.full { background: rgba(212,175,55,0.4); }
.filet.v { width: 1px; height: 100%; background: linear-gradient(180deg, transparent, rgba(212,175,55,0.4), transparent); }

/* ── Visual placeholder frames ─────────────────────────────────────── */
.vframe {
  position: relative;
  background: #0c0b0a;
  overflow: hidden;
  border: 1px solid rgba(212,175,55,0.16);
}
.vframe img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Intro block (kicker + title) — UNIFORM HEADER ZONE ────────────────
   Same vertical band on every content slide so the title/subtitle never
   move between slides. A hairline anchors the bottom of the header so the
   content region always begins at the same Y. */
.intro {
  display: flex; flex-direction: column; gap: 22px;
  max-width: 1500px;
  min-height: 188px;
  padding-bottom: 28px;
  margin-bottom: 34px;
  border-bottom: 1px solid rgba(212,175,55,0.16);
  justify-content: flex-end;
}
/* Cover and slides that opt out of the header rule */
.cover .intro, .intro.bare { min-height: 0; padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }

/* ── Master split: data/text LEFT, supporting visual RIGHT ───────────── */
.split { display: grid; grid-template-columns: 1.04fr 0.96fr; gap: 88px; flex: 1; align-items: center; }
.split .col-text { display: flex; flex-direction: column; justify-content: center; gap: 34px; min-width: 0; }
.split .col-visual { display: flex; align-items: center; justify-content: center; min-width: 0; }
.split .col-visual .vframe { width: 100%; aspect-ratio: 1180/560; }
.split .col-visual.sq .vframe { aspect-ratio: 1/1; max-width: 520px; }
.split .col-text .exergue { padding-left: 30px; border-left: 2px solid var(--gold); }

/* utility */
.col { display: flex; flex-direction: column; }
.row { display: flex; flex-direction: row; }
.spacer { flex: 1; }
.cyan { color: var(--cyan); opacity: var(--cyan-op); }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 1 · COUVERTURE
   ════════════════════════════════════════════════════════════════════ */
section.slide.cover { padding: 0; flex-direction: row; }
section.slide.cover .cover-left {
  flex: 1.08;
  padding: 78px 116px;
  display: flex; flex-direction: column; justify-content: center;
  gap: 0;
}
.cover .wm {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 78px;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  color: var(--bone);
  line-height: 1;
}
.cover .baseline {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 40px;
  letter-spacing: 0.06em;
  color: var(--gold);
  margin-top: 36px;
}
.cover .csub {
  font-family: var(--sans);
  font-weight: 300;
  font-size: 25px;
  letter-spacing: 0.02em;
  color: var(--bone-dim);
  margin-top: 22px;
  max-width: 620px;
  line-height: 1.5;
}
.cover .cover-meta {
  margin-top: 68px;
  display: flex; flex-direction: column; gap: 18px;
  padding-top: 34px;
  border-top: 1px solid rgba(212,175,55,0.22);
  max-width: 640px;
}
.cover .porteurs { display: flex; flex-direction: column; gap: 8px; }
.cover .porteur {
  font-family: var(--sans); font-size: 25px; color: var(--bone);
  font-weight: 400;
}
.cover .porteur b { color: var(--bone); font-weight: 600; }
.cover .porteur span { color: var(--muted); }
.cover .enconst {
  font-family: var(--sans); font-size: 24px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--muted); margin-top: 4px;
}
.cover .contact {
  font-family: var(--sans); font-size: 25px; color: var(--gold-light);
  letter-spacing: 0.03em; margin-top: 6px;
}
.cover .cover-right {
  flex: 0.92;
  position: relative;
  padding: 64px 64px 64px 0;
}
.cover .cover-right .vframe { width: 100%; height: 100%; }
.cover .glow-edge {
  position: absolute; top: 0; bottom: 0; left: -1px; width: 1px;
  background: linear-gradient(180deg, transparent, var(--gold), transparent);
  opacity: var(--filet-op);
}

/* ════════════════════════════════════════════════════════════════════
   SLIDE 2 · PROBLÈME
   ════════════════════════════════════════════════════════════════════ */
section.slide.s-problem { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 92px; }
.s-problem .left { display: flex; flex-direction: column; justify-content: center; gap: 38px; }
.s-problem .exergue-wrap {
  margin-top: 14px; padding-left: 32px;
  border-left: 2px solid var(--gold);
}
.s-problem .right { display: flex; align-items: center; justify-content: center; }
.s-problem .right .vframe { width: 100%; max-width: 720px; aspect-ratio: 1/1; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 3 · POURQUOI PAS RÉSOLU   ·   generic 3-points + visual
   ════════════════════════════════════════════════════════════════════ */
.s-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 92px; flex: 1; margin-top: 56px; }
.points { display: flex; flex-direction: column; gap: 30px; justify-content: center; }
.point {
  display: grid; grid-template-columns: 56px 1fr; gap: 26px;
  padding: 26px 0;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.point:first-child { border-top: 0; }
.point .pn {
  font-family: var(--serif); font-weight: 600; font-size: 30px;
  color: var(--gold); line-height: 1;
}
.point .pt {
  font-family: var(--sans); font-weight: 400; font-size: 25px;
  line-height: 1.5; color: var(--bone-dim);
}
.point .pt b { color: var(--bone); font-weight: 600; }
.s-rows .vside { display: flex; align-items: center; }
.s-rows .vside .vframe { width: 100%; aspect-ratio: 1180/560; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 4 · SOLUTION
   ════════════════════════════════════════════════════════════════════ */
.s-solution { display: flex; flex-direction: column; gap: 48px; }
.solution-body { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; flex: 1; align-items: center; margin-top: 8px; }
.triptych { display: flex; flex-direction: column; gap: 28px; }
.tri-row { display: grid; grid-template-columns: 1.35fr 1fr; gap: 28px; }
.tri-row .vframe { width: 100%; }
.tri-row .vframe.a { aspect-ratio: 980/620; }
.tri-row .vframe.b { aspect-ratio: 520/620; }
.sceau-card {
  margin-top: 8px;
  border: 1px solid rgba(212,175,55,0.3);
  background: linear-gradient(180deg, rgba(212,175,55,0.05), transparent);
  padding: 32px 36px;
}
.sceau-card .label { margin-bottom: 12px; }
.sceau-card .sc-text { font-family: var(--sans); font-size: 24px; color: var(--bone); line-height: 1.5; }
.three-words { display: flex; gap: 14px; margin-top: 8px; flex-wrap: wrap; }
.chip {
  font-family: var(--sans); font-size: 24px; letter-spacing: 0.03em;
  color: var(--gold-light); padding: 12px 22px;
  border: 1px solid rgba(212,175,55,0.28); border-radius: 2px;
}

/* ════════════════════════════════════════════════════════════════════
   SLIDE 5 · INNOVATION
   ════════════════════════════════════════════════════════════════════ */
section.slide.s-innov { display: grid; grid-template-columns: 1fr 0.92fr; gap: 92px; }
.s-innov .left { display: flex; flex-direction: column; justify-content: center; gap: 36px; }
.s-innov .right { display: flex; flex-direction: column; justify-content: center; gap: 32px; }
.s-innov .right .vframe { width: 100%; aspect-ratio: 1180/560; }
.ip-line {
  border: 1px solid rgba(212,175,55,0.26);
  background: linear-gradient(180deg, rgba(212,175,55,0.045), transparent);
  padding: 28px 32px;
}
.ip-line .label { margin-bottom: 12px; }
.ip-line p { font-family: var(--sans); font-size: 24px; line-height: 1.55; color: var(--bone-dim); }
.ip-line p b { color: var(--gold-light); font-weight: 600; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 6 · ÉQUIPE
   ════════════════════════════════════════════════════════════════════ */
.s-team { display: flex; flex-direction: column; gap: 28px; }
.team-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; flex: 1; margin-top: 8px; }
.member { display: grid; grid-template-columns: 260px 1fr; gap: 40px; align-items: start; }
.member .vframe { width: 100%; aspect-ratio: 4/5; }
.member .m-body { display: flex; flex-direction: column; gap: 16px; padding-top: 6px; }
.member .m-name { font-family: var(--serif); font-weight: 600; font-size: 33px; letter-spacing: 0.015em; color: var(--bone); text-transform: uppercase; line-height: 1.05; }
.member .m-role { font-family: var(--sans); font-size: 24px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.member .m-bio { font-family: var(--sans); font-size: 24px; line-height: 1.55; color: var(--bone-dim); }
.member .m-bio b { color: var(--bone); font-weight: 600; }
.member .m-body { gap: 14px; }
.m-clients { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; padding-top: 16px; border-top: 1px solid rgba(212,175,55,0.16); }
.m-clients .cl-lbl { font-family: var(--sans); font-size: 24px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); }
.m-clients .cl-list { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); }
.team-anchor {
  display: flex; align-items: center; gap: 20px;
  padding-top: 32px; border-top: 1px solid rgba(212,175,55,0.22);
  font-family: var(--sans); font-size: 24px; color: var(--bone-dim);
}
.team-anchor .label { color: var(--gold-light); }
.team-anchor b { color: var(--gold); font-weight: 600; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 7 · PROPOSITION DE VALEUR
   ════════════════════════════════════════════════════════════════════ */
.s-value { display: flex; flex-direction: column; gap: 40px; }
.value-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; flex: 1; }
.vcol { padding: 0 48px; display: flex; flex-direction: column; gap: 24px; border-left: 1px solid rgba(212,175,55,0.2); }
.vcol:first-child { padding-left: 0; border-left: 0; }
.vcol .vc-for { font-family: var(--sans); font-size: 24px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); }
.vcol .vc-head { font-family: var(--serif); font-weight: 600; font-size: 42px; letter-spacing: 0.015em; color: var(--bone); text-transform: uppercase; line-height: 1.1; }
.vcol .vc-body { font-family: var(--sans); font-size: 24px; line-height: 1.55; color: var(--bone-dim); }
.value-visual { width: 100%; }
.value-visual .vframe { width: 100%; aspect-ratio: 1700/300; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 8 · CAS D'USAGE
   ════════════════════════════════════════════════════════════════════ */
.s-usecase { display: flex; flex-direction: column; gap: 24px; }
.uc-visual .vframe { width: 100%; aspect-ratio: 1700/182; }
.usecase-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; flex: 1; }
.uc-card {
  border: 1px solid rgba(212,175,55,0.18);
  background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
  padding: 28px 34px; display: flex; flex-direction: column; gap: 12px;
  position: relative;
}
.uc-card::before { content: ""; position: absolute; top: 0; left: 0; width: 70px; height: 2px; background: var(--gold); }
.uc-card .uc-n { font-family: var(--serif); font-weight: 600; font-size: 26px; color: var(--gold); }
.uc-card .uc-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-light); }
.uc-card .uc-head { font-family: var(--serif); font-weight: 600; font-size: 36px; letter-spacing: 0.01em; color: var(--bone); text-transform: uppercase; line-height: 1.1; margin-top: 4px; }
.uc-card .uc-body { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); margin-top: 8px; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 9 · MARCHÉ
   ════════════════════════════════════════════════════════════════════ */
section.slide.s-market { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 88px; }
.s-market .left { display: flex; flex-direction: column; justify-content: center; gap: 30px; }
.s-market .right { display: flex; align-items: center; }
.s-market .right .vframe { width: 100%; aspect-ratio: 1180/560; }
.mtier { display: grid; grid-template-columns: 280px 1fr; gap: 28px; padding: 22px 0; border-top: 1px solid rgba(255,255,255,0.07); }
.mtier:first-of-type { border-top: 0; }
.mtier .mt-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold); padding-top: 4px; }
.mtier .mt-body { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); }
.mtier .mt-body b { color: var(--bone); font-weight: 600; }
.b2b2c { margin-top: 8px; font-family: var(--sans); font-size: 24px; letter-spacing: 0.03em; color: var(--muted); }
.b2b2c b { color: var(--gold-light); font-weight: 600; letter-spacing: 0.14em; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 9 · MODÈLE ÉCONOMIQUE
   ════════════════════════════════════════════════════════════════════ */
.s-bm { display: flex; flex-direction: column; gap: 52px; }
.bm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; flex: 1; }
.bm-card {
  border: 1px solid rgba(212,175,55,0.18);
  background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
  padding: 44px 38px; display: flex; flex-direction: column; gap: 18px;
  position: relative;
}
.bm-card::before { content: ""; position: absolute; top: 0; left: 0; width: 70px; height: 2px; background: var(--gold); }
.bm-card .bm-n { font-family: var(--serif); font-weight: 600; font-size: 26px; color: var(--gold); }
.bm-card .bm-head { font-family: var(--serif); font-weight: 600; font-size: 34px; letter-spacing: 0.01em; color: var(--bone); text-transform: uppercase; line-height: 1.12; }
.bm-card .bm-desc { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); flex: 1; }
.bm-card .bm-fig { font-family: var(--serif); font-weight: 600; font-size: 36px; color: var(--gold-light); margin-top: 8px; }
.bm-card .bm-fig small { font-family: var(--sans); font-size: 24px; color: var(--muted); font-weight: 400; letter-spacing: 0.02em; display: block; margin-top: 8px; text-transform: none; }
.bm-foot { display: flex; align-items: center; gap: 16px; font-family: var(--sans); font-size: 24px; color: var(--muted); }
.bm-foot b { color: var(--gold-light); }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 10 · AVANCEMENT
   ════════════════════════════════════════════════════════════════════ */
section.slide.s-adv { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 80px; }
.s-adv .left { display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.adv-block { display: flex; flex-direction: column; gap: 13px; }
.adv-block .ab-head { display: flex; align-items: center; gap: 16px; font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.adv-block.done .ab-head { color: var(--gold); }
.adv-block.next .ab-head { color: var(--cyan); opacity: var(--cyan-op); }
.adv-block .ab-head .dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; box-shadow: 0 0 14px currentColor; }
.adv-block .ab-list { display: flex; flex-direction: column; gap: 9px; padding-left: 25px; }
.adv-block .ab-item { font-family: var(--sans); font-size: 24px; line-height: 1.34; color: var(--bone-dim); position: relative; }
.adv-block .ab-item b { color: var(--bone); font-weight: 600; }
.adv-numbers { display: flex; gap: 48px; padding-left: 25px; margin-top: 4px; }
.adv-stat .as-n { font-family: var(--serif); font-weight: 600; font-size: 48px; color: var(--gold); line-height: 1; }
.adv-stat .as-l { font-family: var(--sans); font-size: 24px; letter-spacing: 0.04em; color: var(--muted); margin-top: 8px; text-transform: uppercase; }
.adv-foot { font-family: var(--sans); font-size: 24px; letter-spacing: 0.03em; color: var(--muted); padding-top: 16px; border-top: 1px solid rgba(212,175,55,0.2); }
.adv-foot b { color: var(--gold-light); font-weight: 600; }
.s-adv .right { display: flex; flex-direction: column; gap: 20px; justify-content: center; }
.s-adv .right .vframe.a { width: 100%; aspect-ratio: 6/5; }
.s-adv .right .vframe.b { width: 100%; aspect-ratio: 2/1; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 11 · CALENDRIER
   ════════════════════════════════════════════════════════════════════ */
.s-cal { display: flex; flex-direction: column; gap: 48px; }
.timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; flex: 1; align-content: center; position: relative; }
.timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 11px; height: 1px; background: linear-gradient(90deg, var(--gold) 0%, var(--gold) 62%, rgba(127,229,240,0.5) 62%, rgba(127,229,240,0.3) 100%); }
.tstep { display: flex; flex-direction: column; gap: 18px; padding-top: 46px; position: relative; }
.tstep::before { content: ""; position: absolute; top: 0; left: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 18px rgba(212,175,55,0.55); }
.tstep.future::before { background: transparent; border: 1.5px solid var(--cyan); box-shadow: none; opacity: var(--cyan-op); }
.timeline.tl-3 { grid-template-columns: repeat(3, 1fr); }
.timeline.tl-3::before { background: linear-gradient(90deg, var(--gold) 0%, var(--gold) 30%, rgba(127,229,240,0.5) 30%, rgba(127,229,240,0.3) 100%); }
.timeline.tl-4 { grid-template-columns: repeat(4, 1fr); }
.timeline.tl-4::before { background: linear-gradient(90deg, var(--gold) 0%, var(--gold) 44%, rgba(127,229,240,0.5) 56%, rgba(127,229,240,0.3) 100%); }
.tl-accent { font-family: var(--sans); font-size: 24px; line-height: 1.4; color: var(--bone-dim); margin-top: 8px; padding-top: 24px; border-top: 1px solid rgba(212,175,55,0.2); }
.tl-accent .g { color: var(--gold); }
.tstep .ts-date { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold); }
.tstep.future .ts-date { color: var(--cyan); opacity: var(--cyan-op); }
.tstep .ts-head { font-family: var(--serif); font-weight: 600; font-size: 30px; letter-spacing: 0.01em; color: var(--bone); text-transform: uppercase; line-height: 1.1; }
.tstep .ts-body { font-family: var(--sans); font-size: 24px; line-height: 1.45; color: var(--bone-dim); }
.cal-visual .vframe { width: 100%; aspect-ratio: 1700/220; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 12 · POURQUOI MI & VISION
   ════════════════════════════════════════════════════════════════════ */
.s-vision { display: flex; flex-direction: column; gap: 44px; }
.vision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; flex: 1; align-items: center; }
.vision-list { display: flex; flex-direction: column; gap: 24px; }
.vrow { display: grid; grid-template-columns: 40px 1fr; gap: 22px; align-items: baseline; }
.vrow .vk { color: var(--gold); font-family: var(--serif); font-size: 24px; }
.vrow .vt { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); }
.vrow .vt b { color: var(--bone); font-weight: 600; }
.usage { border: 1px solid rgba(212,175,55,0.24); background: linear-gradient(180deg, rgba(212,175,55,0.04), transparent); padding: 34px 38px; display: flex; flex-direction: column; gap: 24px; }
.usage .label { margin-bottom: 4px; }
.usage-bar { display: flex; height: 14px; border-radius: 2px; overflow: hidden; border: 1px solid rgba(212,175,55,0.3); }
.usage-bar .seg-a { width: 80%; background: linear-gradient(90deg, var(--gold), var(--gold-light)); }
.usage-bar .seg-b { width: 20%; background: rgba(127,229,240,0.5); }
.usage .ulegend { display: flex; flex-direction: column; gap: 16px; }
.uleg { display: grid; grid-template-columns: 70px 1fr; gap: 18px; align-items: baseline; }
.uleg .up { font-family: var(--serif); font-weight: 600; font-size: 30px; color: var(--gold); }
.uleg .up.cy { color: var(--cyan); opacity: var(--cyan-op); }
.uleg .ud { font-family: var(--sans); font-size: 24px; line-height: 1.45; color: var(--bone-dim); }
.eco-note { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--muted); padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.08); }
.eco-note b { color: var(--gold-light); font-weight: 600; }
.vision-close {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 36px; border-top: 1px solid rgba(212,175,55,0.3);
}
.vision-close .vc-line { font-family: var(--serif); font-weight: 400; font-size: 52px; letter-spacing: 0.04em; color: var(--gold); }
.vision-close .vc-wm { font-family: var(--serif); font-weight: 700; font-size: 26px; letter-spacing: 0.32em; color: var(--bone); text-indent: 0.32em; }

/* ════════════════════════════════════════════════════════════════════
   KEY-FIGURE COMPONENTS (image-first hierarchy: figures > keywords > text)
   ════════════════════════════════════════════════════════════════════ */
/* Big metric (innovation, etc.) */
.metric-row { display: flex; gap: 80px; align-items: flex-end; }
.metric { display: flex; flex-direction: column; gap: 8px; }
.metric .m-fig { font-family: var(--serif); font-weight: 600; font-size: 100px; line-height: 0.82; letter-spacing: -0.02em; color: var(--gold); }
.metric .m-fig .u { font-size: 46px; color: var(--gold-light); }
.metric .m-lbl { font-family: var(--sans); font-size: 24px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bone-dim); }

/* Team inline metric */
.m-metric { display: flex; align-items: baseline; gap: 14px; margin-top: 2px; }
.m-metric .mm-fig { font-family: var(--serif); font-weight: 600; font-size: 52px; color: var(--gold); line-height: 1; }
.m-metric .mm-lbl { font-family: var(--sans); font-size: 24px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); }

/* Value-prop wide visual band */
.s-value .value-visual .vframe { aspect-ratio: 1700/300; }

/* ── Market: figure-led layout ──────────────────────────────────────── */
section.slide.s-market { display: flex; flex-direction: column; gap: 40px; }
.market-body { display: grid; grid-template-columns: 1.12fr 0.88fr; gap: 80px; flex: 1; align-items: center; }
.mkt-stats { display: flex; flex-direction: column; }
.mkt-stat { display: grid; grid-template-columns: 290px 1fr; gap: 36px; align-items: center; padding: 26px 0; border-top: 1px solid rgba(255,255,255,0.08); }
.mkt-stat:first-child { border-top: 0; }
.ms-fig { font-family: var(--serif); font-weight: 600; font-size: 84px; line-height: 0.9; letter-spacing: -0.02em; color: var(--gold); }
.ms-fig .u { font-size: 38px; color: var(--gold-light); margin-left: 4px; letter-spacing: 0; }
.ms-txt { display: flex; flex-direction: column; gap: 8px; }
.ms-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--gold-light); }
.ms-sub { font-family: var(--sans); font-size: 24px; color: var(--bone-dim); line-height: 1.35; }
.ms-src { font-family: var(--sans); font-size: 24px; color: var(--muted); letter-spacing: 0.02em; }
.mkt-right { display: flex; flex-direction: column; gap: 24px; }
.mkt-right .vframe { width: 100%; aspect-ratio: 1180/600; }
.mkt-foot { display: flex; gap: 14px; flex-wrap: wrap; }

/* ── Business model: 4 layers ───────────────────────────────────────── */
.s-bm .bm-grid { grid-template-columns: repeat(4, 1fr); gap: 24px; }
.s-bm .bm-card { padding: 40px 30px; }
.s-bm .bm-card .bm-head { font-size: 34px; }
.s-bm .bm-card .bm-desc { font-size: 24px; margin-bottom: 28px; }
.s-bm .bm-card .bm-fig { font-size: 34px; }

/* ════════════════════════════════════════════════════════════════════
   SLIDE 11 · PROJECTION FINANCIÈRE (very graphical)
   ════════════════════════════════════════════════════════════════════ */
section.slide.s-fin { display: flex; flex-direction: column; gap: 22px; }
.fin-note { font-family: var(--sans); font-size: 24px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.fin-grid { display: grid; grid-template-columns: 1.28fr 0.72fr; gap: 72px; flex: 1; align-items: stretch; }
.fin-chart { display: flex; flex-direction: column; gap: 22px; justify-content: center; }
.chart-head { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; }
.ch-title { font-family: var(--serif); font-weight: 400; font-size: 32px; color: var(--bone); letter-spacing: 0.01em; white-space: nowrap; }
.ch-sub { font-family: var(--sans); font-size: 24px; color: var(--gold-light); letter-spacing: 0.03em; }
.bars { display: grid; grid-template-columns: repeat(5, 1fr); gap: 40px; align-items: end; height: 380px; }
.bar-col { display: flex; flex-direction: column; align-items: center; gap: 16px; height: 100%; justify-content: flex-end; }
.bar { width: 96px; display: flex; flex-direction: column-reverse; border-radius: 3px; overflow: hidden; box-shadow: 0 0 32px rgba(212,175,55,0.14); }
.seg { width: 100%; }
.seg.m { background: var(--gold-deep); }
.seg.c { background: var(--gold); }
.seg.u { background: var(--gold-light); }
.seg.s { background: var(--cyan); }
.bar-yr { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.06em; color: var(--bone-dim); }
.fin-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 32px; padding-top: 6px; }
.leg { display: flex; align-items: center; gap: 12px; font-family: var(--sans); font-size: 24px; color: var(--bone-dim); }
.leg .sw { width: 18px; height: 18px; border-radius: 3px; flex: none; }
.leg .sw.m { background: var(--gold-deep); }
.leg .sw.c { background: var(--gold); }
.leg .sw.u { background: var(--gold-light); }
.leg .sw.s { background: var(--cyan); }
.kpi-col { display: flex; flex-direction: column; gap: 28px; justify-content: center; border-left: 1px solid rgba(212,175,55,0.18); padding-left: 64px; }
.kpi-hero { display: flex; flex-direction: column; gap: 10px; }
.kh-fig { font-family: var(--serif); font-weight: 600; font-size: 108px; line-height: 0.82; color: var(--gold); letter-spacing: -0.02em; }
.kh-lbl { font-family: var(--sans); font-size: 24px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--bone-dim); }
.kpi-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.kpi-tile { border: 1px solid rgba(212,175,55,0.16); background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent); padding: 24px 26px; display: flex; flex-direction: column; gap: 10px; }
.kpi-tile .kt-fig { font-family: var(--serif); font-weight: 600; font-size: 46px; color: var(--gold-light); line-height: 1; }
.kpi-tile .kt-lbl { font-family: var(--sans); font-size: 24px; color: var(--muted); letter-spacing: 0.02em; line-height: 1.3; }

/* ════════════════════════════════════════════════════════════════════
   WHY NOW (Pourquoi maintenant) — 3 converging forces
   ════════════════════════════════════════════════════════════════════ */
.s-whynow { display: flex; flex-direction: column; gap: 48px; }
.wn-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; flex: 1; }
.wn-card { border: 1px solid rgba(212,175,55,0.18); background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent); padding: 44px 38px; display: flex; flex-direction: column; gap: 16px; position: relative; }
.wn-card::before { content: ""; position: absolute; top: 0; left: 0; width: 70px; height: 2px; background: var(--gold); }
.wn-card .wn-n { font-family: var(--mono); font-size: 24px; letter-spacing: 0.2em; color: var(--gold); }
.wn-card .wn-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-light); }
.wn-card .wn-fig { font-family: var(--serif); font-weight: 600; font-size: 64px; line-height: 0.92; color: var(--gold); letter-spacing: -0.02em; margin-top: 6px; }
.wn-card .wn-fig small { display: block; font-family: var(--sans); font-size: 24px; color: var(--muted); font-weight: 400; letter-spacing: 0.02em; margin-top: 12px; text-transform: none; line-height: 1.3; }
.wn-card .wn-desc { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--bone-dim); margin-top: 4px; }

/* ════════════════════════════════════════════════════════════════════
   COMPETITION (Concurrence & positionnement) — comparison matrix
   ════════════════════════════════════════════════════════════════════ */
.s-compet { display: flex; flex-direction: column; gap: 44px; }
.ctable { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 1fr; border: 1px solid rgba(212,175,55,0.18); border-radius: 4px; overflow: hidden; }
.ctable .cc { padding: 9px 16px; border-top: 1px solid rgba(255,255,255,0.06); border-left: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: center; min-height: 58px; text-align: center; }
.ctable .cc:nth-child(6n+1) { justify-content: flex-start; border-left: 0; text-align: left; }
.ctable .cc:nth-child(-n+6) { border-top: 0; }
.ctable .ch { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.03em; color: var(--gold-light); line-height: 1.25; }
.ctable .rh { font-family: var(--serif); font-size: 30px; color: var(--bone); letter-spacing: 0.01em; line-height: 1.1; }
.ctable .rk { background: rgba(212,175,55,0.10); }
.ctable .rh.rk { color: var(--gold-light); font-weight: 600; }
.ctable .yes { font-size: 42px; color: var(--gold); line-height: 1; text-shadow: 0 0 18px rgba(212,175,55,0.4); }
.ctable .no { font-size: 34px; color: var(--muted); line-height: 1; }

/* ════════════════════════════════════════════════════════════════════
   CAMPAIGN MODEL (Modèle de campagne) — near-term concrete anchor
   ════════════════════════════════════════════════════════════════════ */
.s-campaign { display: flex; flex-direction: column; gap: 40px; }
.camp-flow { display: grid; grid-template-columns: 1fr 64px 1fr 64px 1fr; align-items: center; flex: 1; }
.cf-step { display: flex; flex-direction: column; gap: 16px; padding: 0 12px; }
.cf-step .cf-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-light); }
.cf-step .cf-fig { font-family: var(--serif); font-weight: 600; font-size: 92px; line-height: 0.86; letter-spacing: -0.02em; color: var(--gold); }
.cf-step .cf-fig small { display: block; font-family: var(--sans); font-size: 30px; font-weight: 400; color: var(--gold-light); letter-spacing: 0; margin-top: 4px; }
.cf-step .cf-desc { font-family: var(--sans); font-size: 24px; line-height: 1.45; color: var(--bone-dim); }
.cf-step .cf-desc b { color: var(--bone); font-weight: 600; }
.cf-step.kept .cf-fig { color: var(--cyan); }
.cf-arrow { display: flex; align-items: center; justify-content: center; color: var(--gold); font-size: 44px; line-height: 1; opacity: 0.7; }
.camp-foot { font-family: var(--sans); font-size: 24px; line-height: 1.5; color: var(--muted); padding-top: 26px; border-top: 1px solid rgba(212,175,55,0.2); }
.camp-foot b { color: var(--gold-light); font-weight: 600; }
.fin-note .vlt { color: var(--cyan); }

/* ════════════════════════════════════════════════════════════════════
   REPOSITIONING (pop culture / entertainment) — added components
   ════════════════════════════════════════════════════════════════════ */
/* Problem hero stat (right column) */
.stat-hero {
  width: 100%;
  border: 1px solid rgba(212,175,55,0.24);
  background: linear-gradient(180deg, rgba(212,175,55,0.06), transparent);
  padding: 56px 52px; display: flex; flex-direction: column; gap: 18px;
}
.stat-hero .sh-fig { font-family: var(--serif); font-weight: 600; font-size: 112px; line-height: 0.86; letter-spacing: -0.02em; color: var(--gold); }
.stat-hero .sh-fig .from { display: block; font-size: 40px; color: var(--muted); letter-spacing: 0; margin-bottom: 10px; }
.stat-hero .sh-cap { font-family: var(--sans); font-size: 24px; line-height: 1.4; color: var(--bone-dim); }
.stat-hero .sh-cap b { color: var(--bone); font-weight: 600; }
.stat-hero .sh-src { font-family: var(--sans); font-size: 24px; color: var(--muted); }

/* État de l'art — fracture → réponse cards */
.frac-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; flex: 1; }
.frac-card { display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
.frac-card .fc-top { padding: 34px 32px 30px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.frac-card .fc-tag { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.frac-card .fc-head { font-family: var(--serif); font-weight: 600; font-size: 34px; line-height: 1.08; color: var(--bone); }
.frac-card .fc-body { font-family: var(--sans); font-size: 24px; line-height: 1.4; color: var(--bone-dim); }
.frac-card .fc-ans { padding: 26px 32px; background: linear-gradient(180deg, rgba(212,175,55,0.09), rgba(212,175,55,0.03)); border-top: 1px solid rgba(212,175,55,0.28); display: flex; flex-direction: column; gap: 8px; }
.frac-card .fc-ans .fa-lbl { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); }
.frac-card .fc-ans .fa-txt { font-family: var(--sans); font-size: 24px; line-height: 1.38; color: var(--gold-light); }

/* Go-to-market */
.s-gtm { display: flex; flex-direction: column; gap: 40px; }
.gtm-body { display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 80px; flex: 1; align-items: center; }
.gtm-lead { font-family: var(--sans); font-weight: 300; font-size: 30px; line-height: 1.5; color: var(--bone-dim); }
.gtm-lead b { color: var(--bone); font-weight: 600; }
.gtm-pivot { font-family: var(--serif); font-weight: 400; font-size: 32px; line-height: 1.35; color: var(--gold); padding-left: 28px; border-left: 2px solid var(--gold); margin-top: 6px; }
.gtm-targets { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.gtm-target { border: 1px solid rgba(212,175,55,0.18); background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent); padding: 26px 28px; display: flex; flex-direction: column; gap: 8px; }
.gtm-target .gt-h { font-family: var(--serif); font-weight: 600; font-size: 28px; color: var(--bone); line-height: 1.1; }
.gtm-target .gt-d { font-family: var(--sans); font-size: 24px; line-height: 1.32; color: var(--bone-dim); }
.gtm-foot { display: flex; align-items: center; gap: 16px; font-family: var(--sans); font-size: 24px; color: var(--muted); padding-top: 24px; border-top: 1px solid rgba(212,175,55,0.2); flex-wrap: wrap; }
.gtm-foot b { color: var(--gold-light); font-weight: 600; }

/* Team: third advisor card support */
.team-grid.t3 { grid-template-columns: repeat(3, 1fr); gap: 36px; margin-top: 4px; }
.team-grid.t3 .member { grid-template-columns: 1fr; gap: 18px; align-content: start; }
.team-grid.t3 .member .vframe { aspect-ratio: 16/9; max-height: 150px; }
.team-grid.t3 .member .m-body { gap: 10px; }
.team-grid.t3 .member .m-name { font-size: 29px; }
.team-grid.t3 .member .m-bio { font-size: 24px; }
.team-grid.t3 .m-clients { margin-top: 4px; padding-top: 12px; }
.team-grid.t3 .m-clients .cl-list { font-size: 24px; }
.s-team .team-anchor { padding-top: 18px; margin-top: 2px; }

.two-faces { display: flex; flex-direction: column; gap: 12px; }
.two-faces .tf-row { display: flex; align-items: baseline; gap: 14px; padding: 14px 0; border-top: 1px solid rgba(212,175,55,0.16); }
.two-faces .tf-row:first-child { border-top: 0; }
.two-faces .tf-k { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: 0.04em; color: var(--gold); min-width: 230px; }
.two-faces .tf-v { font-family: var(--sans); font-size: 24px; color: var(--bone-dim); }

/* ── Entrance: subtle rise on the active slide ─────────────────────────
   Animates TRANSFORM ONLY — opacity stays 1 throughout — so content is
   always visible in screenshots, PDF and PPTX exports (which freeze CSS
   animations at frame 0), while still gliding in on the live deck. */
@media (prefers-reduced-motion: no-preference) {
  section.slide[data-deck-active] .intro,
  section.slide[data-deck-active] .kicker,
  section.slide[data-deck-active] .title,
  section.slide[data-deck-active] .title-sm,
  section.slide[data-deck-active] .lead,
  section.slide[data-deck-active] [data-rise] {
    animation: rk-rise 0.7s cubic-bezier(.2,.7,.2,1) both;
  }
  section.slide[data-deck-active] [data-rise="2"] { animation-delay: 0.09s; }
  section.slide[data-deck-active] [data-rise="3"] { animation-delay: 0.18s; }
  section.slide[data-deck-active] [data-rise="4"] { animation-delay: 0.27s; }
}
@keyframes rk-rise {
  from { transform: translateY(14px); }
  to   { transform: none; }
}
