/* =========================================================
   Base — reset léger + typographie globale
   ========================================================= */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--dm-paper);
  color: var(--dm-ink);
  font-family: var(--dm-font-sans);
  font-size: var(--dm-body);
  line-height: var(--dm-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

button {
  font: inherit; color: inherit; background: none;
  border: 0; padding: 0; cursor: pointer;
}

/* Conteneur principal — borne max + gouttière fluide */
.dm-wrap {
  max-width: var(--dm-maxw);
  margin: 0 auto;
  padding-left: var(--dm-gutter);
  padding-right: var(--dm-gutter);
}

/* ---------- Headings ---------- */
.dm-h1 {
  font-family: var(--dm-font-serif);
  font-weight: 300;
  font-size: var(--dm-h1);
  line-height: 0.88;
  letter-spacing: -0.032em;
  margin: 0;
}
.dm-h2 {
  font-family: var(--dm-font-serif);
  font-weight: 400;
  font-size: var(--dm-h2);
  line-height: 1.02;
  letter-spacing: -0.025em;
  margin: 0;
}
.dm-h3 {
  font-family: var(--dm-font-serif);
  font-weight: 400;
  font-size: var(--dm-h3);
  line-height: 1.05;
  letter-spacing: -0.012em;
  margin: 0;
}
.dm-h4 {
  font-family: var(--dm-font-serif);
  font-weight: 400;
  font-size: var(--dm-h4);
  line-height: 1.15;
  margin: 0;
}
.dm-lead {
  font-family: var(--dm-font-serif);
  font-style: italic;
  font-size: var(--dm-lead);
  line-height: 1.4;
  color: var(--dm-slate);
  margin: 0;
}
.dm-body { font-size: var(--dm-body); line-height: 1.85; color: var(--dm-slate); }
.dm-small { font-size: var(--dm-small); line-height: 1.7; color: var(--dm-slate); }

/* Italique éditorial — utilisé dans les titres */
.dm-em { font-style: italic; font-weight: 400; }
.dm-em--gold { font-style: italic; font-weight: 400; color: var(--dm-champagne); }

/* Surtitre mono — chapitres, étiquettes */
.dm-meta {
  font-family: var(--dm-font-mono);
  font-size: var(--dm-meta);
  letter-spacing: var(--dm-tracking-meta);
  text-transform: uppercase;
  color: var(--dm-champagne);
  font-weight: 500;
}

/* Variants sur fond sombre */
.dm-dark { background: var(--dm-ink); color: var(--dm-paper); }
.dm-dark .dm-body { color: rgba(245,244,245,0.72); }
.dm-dark .dm-lead { color: var(--dm-champpale); }
.dm-dark .dm-h1, .dm-dark .dm-h2, .dm-dark .dm-h3 { color: var(--dm-paper); }

/* Filet horizontal — utilisé entre groupes */
.dm-rule {
  height: 1px; border: 0; background: var(--dm-rule-light); margin: 0;
}
.dm-dark .dm-rule { background: rgba(184,164,140,0.32); }

/* Sélection */
::selection { background: var(--dm-champagne); color: var(--dm-ink); }

/* Focus visible — accessibilité */
:focus-visible {
  outline: 2px solid var(--dm-champagne);
  outline-offset: 3px;
}

/* =========================================================
   Contrastes — titres sur fonds clairs
   ========================================================= */

.dm-section--bone .dm-h1,
.dm-section--bone .dm-h2,
.dm-section--bone .dm-h3,
.dm-section--paper .dm-h1,
.dm-section--paper .dm-h2,
.dm-section--paper .dm-h3 {
  color: var(--dm-ink);
}

.dm-section--bone .dm-em,
.dm-section--paper .dm-em {
  color: var(--dm-champagne);
}

.dm-section--ink .dm-h1,
.dm-section--ink .dm-h2,
.dm-section--ink .dm-h3 {
  color: var(--dm-paper);
}

.dm-section--ink .dm-em {
  color: var(--dm-champagne);
}