/* ==========================================================================
   ClimaScan — jetons de design
   Source normative : DESIGN.md (frontmatter YAML) à la racine du projet.
   Ce fichier est la traduction CSS de ces jetons. Si les deux divergent,
   DESIGN.md fait foi.

   Direction retenue : V2 « Cadastre » — North Star « Le Registre ».
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300..600;1,6..72,300..500&family=Inter+Tight:wght@400;500;600&display=swap");

:root {
  /* ---------- Couleurs ---------- */
  --cs-creme: #F7F3EC;          /* fond par défaut — jamais #FFFFFF */
  --cs-creme-appuyee: #EDE7DC;  /* cartouches, lignes alternées */
  --cs-sauge: #BCD1D4;          /* aplats, cartouches, en-têtes */
  --cs-sauge-profonde: #8FAFB4; /* tracés posés SUR un aplat de sauge */
  --cs-nuit: #293A4A;           /* texte, filets, fonds sombres */
  --cs-nuit-profonde: #1B2833;  /* surface reculant derrière un aplat nuit */
  --cs-nuit-pale: #5A6C7C;      /* texte secondaire, sous le seuil */
  --cs-terre: #B5540F;          /* accent — 3 emplois par page maximum */
  --cs-ambre-clair: #D98A4A;    /* le même, sur fond nuit uniquement */
  --cs-filet: #CFC7B8;          /* traits sur fond clair */
  --cs-filet-nuit: #3E5163;     /* traits sur fond nuit */
  --cs-plan-travail: #DAD5CC;   /* ÉCRAN SEULEMENT — surface sous une feuille mise en scène */

  /* ---------- Familles ---------- */
  --cs-serif: "Newsreader", Georgia, serif;
  --cs-sans: "Inter Tight", system-ui, -apple-system, sans-serif;

  /* ---------- Échelle typographique ---------- */
  --cs-display: 400 clamp(2.5rem, 6.4vw, 4.75rem) / 1.08 var(--cs-serif);
  --cs-headline: 400 clamp(1.75rem, 3.4vw, 2.625rem) / 1.1 var(--cs-serif);
  --cs-subhead: 300 clamp(1.125rem, 1.8vw, 1.5rem) / 1.45 var(--cs-serif);
  --cs-title: 600 1rem / 1.4 var(--cs-sans);
  --cs-body: 400 1rem / 1.62 var(--cs-sans);
  --cs-numeral: 500 2rem / 1.1 var(--cs-sans);
  --cs-label: 600 0.6875rem / 1.9 var(--cs-sans);
  --cs-note: 400 0.9375rem / 1.5 var(--cs-sans);
  --cs-mention: 400 0.875rem / 1.5 var(--cs-sans);
  --cs-label-small: 600 0.625rem / 1.8 var(--cs-sans);

  --cs-tracking-display: -0.018em;
  --cs-tracking-label: 0.2em;
  --cs-tracking-numeral: -0.02em;

  /* ---------- Espacement ---------- */
  --cs-space-xs: 4px;
  --cs-space-sm: 8px;
  --cs-space-md: 16px;
  --cs-space-lg: 24px;
  --cs-space-xl: 40px;
  --cs-space-section: clamp(56px, 7vw, 104px);

  /* ---------- Mise en page ---------- */
  --cs-contenant: 1180px;
  --cs-gouttiere: clamp(1.5rem, 4vw, 4rem);
  --cs-marge-appareil: 11rem;   /* colonne d'étiquettes, à gauche */
  --cs-mesure: 64ch;            /* longueur de ligne du texte courant */

  /* ---------- Forme ---------- */
  --cs-rayon: 0;                /* invariante — ne jamais surcharger */
  --cs-trait: 1px;

  /* ---------- Mouvement ---------- */
  --cs-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --cs-duree: 180ms;

  /* ---------- Ombre ---------- */
  /* Unique ombre du système. Réservée à la mise en scène d'un document
     imprimé posé sur un fond nuit. Interdite sur tout élément d'interface. */
  --cs-ombre-document: 0 20px 50px -20px rgba(10, 20, 30, 0.6);
}

/* ==========================================================================
   Base
   ========================================================================== */

body {
  background: var(--cs-creme);
  color: var(--cs-nuit);
  font: var(--cs-body);
  -webkit-font-smoothing: antialiased;
}

h1, h2 {
  font: var(--cs-headline);
  letter-spacing: var(--cs-tracking-display);
  text-wrap: balance;
}

h1 { font-size: clamp(2.5rem, 6.4vw, 4.75rem); }

/* La règle du serif maigre : Newsreader ne dépasse jamais 400. */
h1, h2, h3 { font-weight: 400; }

p { max-width: var(--cs-mesure); }

/* ==========================================================================
   Formes signature
   ========================================================================== */

/* La règle du filet double : trait, blanc, trait.
   Ouvre une section, ferme un en-tête ou un pied de tableau.
   JAMAIS en cadre fermé sur les quatre côtés. */
.cs-filet-double {
  height: 3px;
  border-top: var(--cs-trait) solid var(--cs-filet);
  border-bottom: var(--cs-trait) solid var(--cs-filet);
}

.cs-sur-nuit .cs-filet-double {
  border-color: var(--cs-filet-nuit);
}

/* Étiquette de marge. La règle de la marge d'appareil :
   elle vit à GAUCHE du titre, jamais au-dessus. */
.cs-etiquette {
  font: var(--cs-label);
  letter-spacing: var(--cs-tracking-label);
  text-transform: uppercase;
  color: var(--cs-nuit-pale);
}

/* Chiffre comparable : tabulaire, aligné à droite. */
.cs-chiffre {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* ==========================================================================
   Impression — le rapport est le livrable central
   ========================================================================== */

@media print {
  :root { --cs-gouttiere: 0; }

  /* La règle du papier : à l'impression on ne peint pas le fond,
     le papier est le support. Un aplat imprimé ne survit que s'il
     porte une information (couverture nuit, cartouche sauge). */
  body {
    background: none;
    font-size: 10.5pt;
  }

  /* La règle du feu tricolore rend ceci sans perte : aucune information
     de niveau ne dépend de la couleur. */
  @page {
    size: A4 portrait;
    margin: 18mm;
  }
}