/* ============================================================
   LES PAGES LÉGALES.
   Même vocabulaire que le reste du site : papier chaud et encre,
   Fraunces en titres. Une seule colonne, large de lecture, parce
   qu'un texte juridique se lit en entier ou pas du tout.

   🔴 AUCUNE ADRESSE POSTALE ne figure sur ces pages, jamais.
   Règle absolue de l'éditeur (contrats.md) : l'adresse déclarée
   est une adresse personnelle. Ne jamais la réintroduire, ici ni
   ailleurs, y compris sur les factures et dans les e mails.

   🔴 Le nom de l'éditeur n'apparaît qu'UNE SEULE FOIS sur tout le
   site, dans les mentions légales (demande d'Adrien, 15 août
   2026). Partout ailleurs on écrit « l'Éditeur » ou « Kandelia ».
   ============================================================ */

:root {
  --sol: #EFEDE4; --carte: #FFFDF7; --encre: #111208;
  --gris: #5E5C52; --gris3: #8B8879; --filet: #D3CFC0;
  --rouille: #A63A1E; --vert: #27512F;
  --serif: 'Fraunces', Georgia, serif;
  --sans: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; background: var(--sol); color: var(--encre); }
body {
  font-family: var(--sans); font-size: 17px; font-weight: 450; line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.dedans { max-width: 780px; margin: 0 auto; padding: 0 28px; }

header {
  border-bottom: 1.5px solid var(--filet); padding: 22px 0;
}
header .dedans { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.logo {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--serif); font-variation-settings: 'SOFT' 20, 'WONK' 1;
  font-size: 20px; font-weight: 700; letter-spacing: -0.015em;
  color: var(--encre); text-decoration: none;
}
.logo .mk {
  width: 30px; height: 30px; border-radius: 9px; overflow: hidden; flex: none;
  position: relative; background: #0A0A08; box-shadow: 0 0 0 2px #0F6E56;
}
.logo .mk img { width: 100%; height: 100%; object-fit: cover; display: block; }
.logo .mk svg { position: absolute; top: 8%; right: 11%; height: 56%; width: auto; }
header .retour { font-size: 15px; font-weight: 600; color: var(--gris); text-decoration: none; }
header .retour:hover { color: var(--encre); }

main { padding: 54px 0 72px; }
h1 {
  font-family: var(--serif); font-variation-settings: 'SOFT' 20, 'WONK' 1;
  font-size: clamp(36px, 5vw, 52px); font-weight: 700;
  letter-spacing: -0.03em; line-height: 1.05; margin: 0 0 10px;
}
.maj { color: var(--gris); font-size: 14.5px; font-weight: 500; margin: 0 0 40px; }
h2 {
  font-family: var(--serif); font-variation-settings: 'SOFT' 20, 'WONK' 1;
  font-size: 25px; font-weight: 700; letter-spacing: -0.02em;
  margin: 44px 0 12px; padding-top: 22px; border-top: 1.5px solid var(--filet);
}
h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 34px; }
h3 { font-size: 17px; font-weight: 700; margin: 26px 0 8px; }
p { margin: 0 0 16px; }
ul { margin: 0 0 16px; padding-left: 22px; }
li { margin-bottom: 7px; }
strong { font-weight: 700; }
a { color: var(--encre); text-underline-offset: 3px; }

/* Le tableau des identités et des sous-traitants. Il scrolle seul
   plutôt que de pousser la page en largeur sur un téléphone. */
.tableau { overflow-x: auto; margin: 0 0 22px; }
table { border-collapse: collapse; width: 100%; font-size: 15.5px; }
th, td {
  text-align: left; vertical-align: top; padding: 11px 14px;
  border-bottom: 1px solid var(--filet);
}
th { font-weight: 700; background: var(--carte); white-space: nowrap; }

.encart {
  background: var(--carte); border: 1.5px solid var(--filet);
  border-radius: 12px; padding: 20px 22px; margin: 0 0 24px;
}
.encart p:last-child { margin-bottom: 0; }
.encart.fort { border-color: var(--vert); background: #E9F0E9; }

footer {
  border-top: 1.5px solid var(--filet); padding: 26px 0 40px;
  font-size: 14.5px; color: var(--gris);
}
footer .dedans { display: flex; gap: 20px; flex-wrap: wrap; align-items: baseline; }
footer a { color: var(--gris); text-decoration: none; }
footer a:hover { color: var(--encre); text-decoration: underline; }
footer .ou { margin-left: auto; color: var(--gris3); }