/* Module Ainga · Fondation H
   La charte de l'espace, reprise des slides du module.

   Relevé fait sur la présentation du Jour 1 :
     fond clair              #F9F6F1
     cartes                  #FBFAF6
     encre et fond sombre    #291B12
     accent terracotta       #9A5238
     accent sur fond sombre  #E8A781
     titres                  Instrument Serif
     texte                   Work Sans
     labels                  IBM Plex Mono

   Les trois polices sont sur Google Fonts, chargées ci-dessous.
   Rien d'autre à modifier : espace.css est entièrement écrit en variables. */

@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Work+Sans:ital,wght@0,300;0,400;0,500;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap");

:root{
  --bleu:#9A5238;        /* l'accent, ce qui etait bleu dans L'Art Month */
  --nuit:#291B12;        /* le brun profond des fonds pleins */
  --encre:#291B12;
  --gris:#7C6A5E;
  --filet:#E2DACF;
  --pointille:#D8C9B8;
  --fond:#F9F6F1;
  --carte:#FBFAF6;
  --pale:#F2ECE3;
  --jaune:#E8A781;

  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --sans:"Work Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Menlo,monospace;
}

/* Les grands titres des slides ne sont pas en italique : on retablit le romain,
   qui est la forme utilisee dans la presentation. */
h1,h2,.marque-ainga{font-style:normal}
h1{letter-spacing:-.005em}

/* Les labels en petites capitales espacees passent en mono, comme sur les slides */
.oeil,.entete__meta,.navsec a,.groupe-titre,.ouverture,.doc__type,.retour,.phase__numero{
  font-family:var(--mono);
}
.oeil{color:var(--bleu)}

/* L'en-tete, avec le A de la couverture */
.marque-ainga{
  font-family:var(--serif);
  font-size:1.4rem;
  color:var(--bleu);
  letter-spacing:.01em;
  text-decoration:none;
}
.marque-ainga span{
  font-family:var(--mono);
  font-size:.6rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gris);
  display:block;
  margin-top:.1rem;
}

/* Les tableaux de la page pratique et de la page participants */
.tableau{width:100%;border-collapse:collapse;margin:1.5rem 0 2.5rem;font-size:.9rem}
.tableau th{text-align:left;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gris);font-weight:400;padding:.7rem .8rem;
  border-bottom:1px solid var(--filet);vertical-align:top;width:14rem}
.tableau td{padding:.7rem .8rem;border-bottom:1px solid var(--filet)}
.tableau tr:last-child td,.tableau tr:last-child th{border-bottom:none}
.tableau a{color:var(--bleu)}

/* Le programme de la journée : une boîte à deux volets, matin et après-midi.
   Volontairement différent des listes de documents et d'exercices,
   pour qu'on ne confonde pas ce qui se lit et ce qui se clique. */
.prog{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--filet);
  border:1px solid var(--filet);border-radius:2px;margin:.5rem 0 1.8rem}
.prog__c{background:var(--carte);padding:1.15rem 1.25rem 1.3rem}
.prog__c--sombre{background:var(--nuit)}
.prog__t{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bleu);margin:0 0 .15rem}
.prog__c--sombre .prog__t{color:var(--jaune)}
.prog__h{font-family:var(--serif);font-size:1.2rem;line-height:1.2;color:var(--encre);margin:0 0 .8rem}
.prog__c--sombre .prog__h{color:var(--fond)}
.prog__l{font-size:.89rem;line-height:1.5;margin:0 0 .4rem;padding-left:.9rem;text-indent:-.9rem;
  color:var(--encre)}
.prog__c--sombre .prog__l{color:#E4D9CE}
.prog__l:last-child{margin-bottom:0}
@media(max-width:680px){.prog{grid-template-columns:1fr}}

/* ---------- L'impression et l'export en PDF ----------
   Deux choses se règlent ici.

   La marge de gauche : les marges @page sont ignorées quand la personne
   imprime avec le réglage « marges : aucune », ce qui colle le texte au bord.
   On ajoute donc une marge intérieure sur le conteneur, qui elle ne dépend
   d'aucun réglage. La gauche est plus large que la droite, pour la reliure
   ou la perforation.

   L'en-tête : la barre du site est masquée à l'impression, on la remplace
   par une ligne qui rappelle qui a écrit, quelle journée, et quand. */

@page{size:A4 portrait;margin:14mm 14mm 16mm 16mm}

@media print{
  html,body{margin:0 !important;padding:0 !important;background:#fff !important}
  .enveloppe{padding:0 6mm 0 8mm !important;max-width:100% !important;margin:0 !important;
    box-sizing:border-box}
  .prog{grid-template-columns:1fr 1fr;break-inside:avoid;page-break-inside:avoid}
  .prog__c--sombre{background:#fff !important}
  .prog__c--sombre .prog__t{color:#000 !important}
  .prog__c--sombre .prog__h,.prog__c--sombre .prog__l{color:#000 !important}
  .print-tete{display:block !important;border-bottom:1px solid #999;padding-bottom:.4rem;
    margin-bottom:1rem;font-family:var(--mono);font-size:7.5pt;letter-spacing:.1em;
    text-transform:uppercase;color:#000}
  .tableau{page-break-inside:auto}
  .tableau tr{page-break-inside:avoid}
}

.print-tete{display:none}
