/* La carte, v0.1.1 (10.11.2026) : la feuille A4, pour un atelier. Toute la carte sur une page : « Vous » au centre, avec deux
   lignes à écrire à la main ; les sept branches autour, chacune avec ses trois temps et l'adresse de son outil en clair ;
   l'alerte, sa place vide. Indépendante de carte.css (qui ne sert qu'à l'écran) : une branche ouverte à l'écran
   n'empêche pas d'imprimer toute la carte. */

@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 600;font-display:swap;src:url('polices/cormorant-garamond-latin-nvar.woff2') format('woff2');}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:300 600;font-display:swap;src:url('polices/inter-tight-latin-nvar.woff2') format('woff2');}

:root{
  --nuit:#0E2A2F;
  --laiton:#B8975A;
  --laiton-clair:#E6D5A8;
  --encre:#0E2A2F;
  --encre-2:#4A5F5E;
  --filet:#C9D5D0;
  --accent:#8C6D35;
  --alerte:#8A3B12;
  --titre:'Cormorant Garamond', Georgia, serif;
  --texte:'Inter Tight', Arial, sans-serif;
}

@page{size:A4 portrait;margin:9mm 10mm}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff}
body{color:var(--encre);font:400 7.5pt/1.27 var(--texte);-webkit-print-color-adjust:exact;print-color-adjust:exact}
a{color:inherit;text-decoration:none}
ul,ol,p,h1,h2,h3,h4{margin:0}

/* Ce qui ne sert qu'à l'écran */
.evitement,.entete,.intro,.plan__aide,.regles,.page-a-part,.pied,.tuile,.branche__haut,.rappel,.actions,
.temps__sous,.outil__texte,.outil__ouvrir,.methode h2{display:none !important}

/* ---------- le haut de la feuille ---------- */
.feuille-titre{display:flex;align-items:center;gap:3mm;height:12mm;margin:0 0 1.5mm}
.feuille-titre img{width:10mm;height:10mm}
.feuille-titre p{display:flex;flex-direction:column}
.feuille-titre span{font-size:6.5pt;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.feuille-titre b{font:500 22pt/1 var(--titre)}

.principal{display:flex;flex-direction:column}
.methode{order:1;margin:0 0 2mm}
.plan{order:2}
.urgence{order:3}

.methode ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5mm}
.methode li{padding:1.4mm 2.4mm;border-top:.6mm solid var(--laiton);background:#F4F6F4;font-size:7pt}
.methode li b{display:block;font:600 11pt/1.1 var(--titre)}

/* ---------- le plan : 3 × 3 ----------
   Les deux premières rangées prennent la hauteur de leurs textes ; la dernière, plus courte, prend le reste. */
.plan{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto minmax(0,1fr);
  grid-template-areas:"courrier travail sante" "famille centre lien" "suivre alerte logement";
  gap:3mm;height:233mm;background:url('plan.svg') center/100% 100% no-repeat
}
.centre{grid-area:centre}
#courrier{grid-area:courrier}
#travail{grid-area:travail}
#sante{grid-area:sante}
#famille{grid-area:famille}
#lien{grid-area:lien}
#suivre{grid-area:suivre}
#logement{grid-area:logement}
#alerte{grid-area:alerte}

.branche{display:block !important;overflow:hidden;padding:2.4mm 2.8mm;background:#fff;border:.3mm solid var(--filet);border-radius:2mm;break-inside:avoid}
.branche__corps{display:block !important}
.branche h2{margin:0 0 1.4mm;font:600 13.5pt/1 var(--titre)}
.temps{margin:0 0 1.2mm}
.temps h3{display:flex;align-items:center;gap:1.2mm;font:600 6.3pt/1.3 var(--texte);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.temps__numero{display:inline-flex;align-items:center;justify-content:center;width:3.4mm;height:3.4mm;border-radius:50%;background:var(--nuit);color:var(--laiton-clair);font-size:5.6pt;letter-spacing:0}
.temps ul{margin:.5mm 0 0;padding-left:3mm}
.temps li{margin:0 0 .25mm}
.temps li::marker{color:var(--laiton)}
.temps h4{margin:.6mm 0 0;font-size:5.8pt;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--encre-2)}
.outil{margin:0}
.outil__nom b{font:600 9pt/1.1 var(--titre)}
.outil__adresse{color:var(--accent)}
.outil--aucun{color:var(--encre-2)}
a.numero{font-weight:700;color:var(--alerte)}

/* « Vous », avec deux lignes à écrire à la main */
.centre{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5mm;padding:1mm 2mm;background:#fff;border-radius:2mm}
.centre__rond{display:flex;flex-direction:column;align-items:center;justify-content:center;width:27mm;height:27mm;border-radius:50%;background:var(--nuit);color:var(--laiton-clair);text-align:center}
.centre__vous{font:500 17pt/1 var(--titre)}
.centre__sous{margin-top:.6mm;font-size:6.3pt;color:#B9CBC7}
.centre__ecrire{display:block !important;width:100%}
.centre__ecrire p{padding:1mm 0 6.5mm;border-bottom:.3mm solid var(--encre-2);font-size:7pt;font-weight:600}
.centre__ecrire p + p{margin-top:1.5mm}

/* L'alerte : sa place, vide */
.branche--alerte{border:.5mm dashed var(--alerte);background:#fff}
.branche--alerte h2{color:var(--alerte)}
.branche--alerte .branche__corps > p:not(.alerte__place){display:none}
.alerte__place{color:var(--alerte);font-weight:600}

/* ---------- le bas de la feuille ---------- */
.urgence{margin:2.5mm 0 0;padding:1.4mm 3mm;border-left:1mm solid var(--alerte);background:#FBF5F1}
.urgence h2{display:inline;margin-right:2mm;font:600 9pt/1.2 var(--titre);color:var(--alerte)}
.urgence ul{display:inline;list-style:none;padding:0}
.urgence li{display:inline}
.urgence li + li::before{content:" · "}
.feuille-pied{display:block !important;margin:1.6mm 0 0;font-size:6.3pt;color:var(--encre-2);text-align:center}
