/* ASKYM — deck « De quoi cette situation est-elle le moyen ? »
   Charte du 14/09/2026 : noir #1D1D1B, lime #C7FF3D, gris #939692 / #B6B7B6, blanc #FAFAFA.
   Code couleur : gris = PPE et logique causale ; lime = moteur effectual.
   Tailles de police en pt (slides 1280 x 720). */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --ink: #1D1D1B;
  --lime: #C7FF3D;
  --grey: #939692;
  --grey-light: #B6B7B6;
  --paper: #FAFAFA;
  --paper-2: #EFEFEE;
  --line: #DCDDDB;
  --white: #FFFFFF;

  --heading-font: Georgia, "Times New Roman", serif;
  --body-font: "Avenir Next", "Inter", system-ui, -apple-system, sans-serif;
  --mono-font: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

/* ---------- base ---------- */
.reveal-viewport { background: var(--paper); }
.reveal { font-family: var(--body-font); color: var(--ink); font-size: 32px; }
.reveal .slides section {
  text-align: left;
  padding: 42px 64px 34px 64px;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.reveal .slides section.dark { color: var(--paper); }

.reveal h1, .reveal h2 {
  font-family: var(--heading-font);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.01em;
  text-transform: none;
}
.reveal h1 { font-size: 40pt; line-height: 1.08; margin: 0 0 18px 0; }
.reveal h2 { font-size: 25pt; line-height: 1.15; margin: 0 0 6px 0; }
.reveal h3 { font-family: var(--body-font); font-size: 12.5pt; font-weight: 600; color: var(--ink); margin: 0 0 6px 0; text-transform: none; }
.reveal section.dark h1, .reveal section.dark h2 { color: var(--lime); }
.reveal section.dark h3 { color: var(--paper); }

.reveal p, .reveal li { font-size: 12.5pt; line-height: 1.45; margin: 0 0 8px 0; }
.reveal ul, .reveal ol { list-style: none; margin: 0; padding: 0; }
.reveal strong { font-weight: 600; }
.reveal em { font-style: italic; }
.reveal .text-lg { font-size: 14.5pt; }
.reveal .text-xl { font-size: 17pt; }
.reveal .small { font-size: 10.5pt; color: var(--grey); }
.reveal section.dark .small { color: var(--grey-light); }

/* ---------- pièces ---------- */
.label {
  font-family: var(--mono-font);
  font-size: 8.5pt;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--grey);
  margin: 0 0 10px 0;
}
.label.lime { color: var(--ink); background: var(--lime); display: inline-block; padding: 3px 9px; }
.rule { height: 3px; width: 72px; background: var(--lime); margin: 0 0 16px 0; }
.rule.grey { background: var(--grey); }
.content { flex: 1; display: flex; flex-direction: column; min-height: 0; }
#ppe .content, #ppe-etages .content, #ppe-limites .content, #tri .content, #nigeria .content, #recherche .content { justify-content: center; padding-bottom: 24px; }
.lead { font-family: var(--heading-font); font-size: 17pt; line-height: 1.3; margin: 0 0 14px 0; }
.q { font-family: var(--heading-font); font-size: 20pt; line-height: 1.25; margin: 0 0 10px 0; }

.foot {
  margin-top: auto;
  padding-top: 12px;
  font-family: var(--mono-font);
  font-size: 7.5pt;
  color: var(--grey);
  letter-spacing: 0.02em;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
}
.foot .src { max-width: 78%; line-height: 1.4; }
.brand { display: inline-flex; align-items: center; gap: 8px; }
.brand svg { height: 16px; width: auto; }
.brand span { font-family: var(--body-font); font-weight: 600; font-size: 7.5pt; letter-spacing: 0.32em; color: var(--ink); }
.reveal section.dark .brand span { color: var(--paper); }
.reveal section.dark .foot { color: var(--grey-light); }

.tile { background: var(--white); border: 1px solid var(--line); padding: 14px 18px; }
.tile .num { font-family: var(--heading-font); font-size: 24pt; line-height: 1.1; margin: 0 0 4px 0; }
.tile .vs { font-family: var(--mono-font); font-size: 8.5pt; color: var(--grey); letter-spacing: 0.06em; margin: 0 0 6px 0; }
.tile p { font-size: 10.5pt; margin: 0; color: var(--ink); }
.tile.grey { background: var(--paper-2); border-color: var(--paper-2); }
.tile.lime { background: var(--lime); border-color: var(--lime); }
.tile.ink { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.tile.ink p, .tile.ink h3 { color: var(--paper); }

.col { padding-left: 18px; border-left: 6px solid var(--line); }
.col.grey { border-left-color: var(--grey); }
.col.lime { border-left-color: var(--lime); }
.col h3 { margin-bottom: 8px; }

.note { background: var(--paper-2); border-left: 4px solid var(--lime); padding: 10px 14px; font-size: 11pt; line-height: 1.4; }
.note.grey { border-left-color: var(--grey); }
.reveal .note p { font-size: 11pt; margin: 0; }
.reveal section.dark .note { background: #2A2A28; color: var(--paper); }

.steps { display: grid; gap: 18px; }
.step .n { font-family: var(--mono-font); font-size: 8.5pt; color: var(--grey); letter-spacing: 0.1em; margin: 0 0 6px 0; }
.step h3 { margin-bottom: 4px; }
.reveal .step p { font-size: 11pt; margin: 0; }

.quote { font-family: var(--heading-font); font-size: 15pt; line-height: 1.35; padding: 12px 18px; background: var(--white); border: 1px solid var(--line); }
.quote.lime { background: var(--lime); border-color: var(--lime); }
.quote.grey { background: var(--paper-2); border-color: var(--paper-2); }
.reveal .quote p { font-size: 11.5pt; font-family: var(--body-font); margin: 6px 0 0 0; }
.tag { font-family: var(--mono-font); font-size: 8pt; letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey); }

.ill { display: flex; align-items: center; justify-content: center; min-height: 0; }
.ill img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }

/* ---------- SVG ---------- */
.fig { width: 100%; height: auto; display: block; }
.fig text { font-family: var(--body-font); }
.fig .mono { font-family: var(--mono-font); letter-spacing: 0.08em; }
.fig .serif { font-family: var(--heading-font); }

/* ---------- reveal chrome ---------- */
.reveal .progress { color: var(--lime); height: 4px; }
.reveal .controls { color: var(--grey); }
.reveal section.dark .controls { color: var(--grey-light); }
