:root{--fond:#E8E4DA;--fond2:#DED9CD;--fond3:#C2BBAB;--encre:#15141A;--primaire:#15141A;--primaire_sombre:#DED9CD;--accent:#8C2B1C;--accent_sombre:#6E2114;--gris:#4E4B52;--gris_clair:#676359;--clair:#E8E4DA;--papier:#E8E4DA;--cinabre:#8C2B1C;--cinabre_clair:#D9705C;--liturgie_violet:#5b3a7e;--liturgie_vert:#2e6a4f;--liturgie_rouge:#a32a1c;--liturgie_or:#8a6a1f;--liturgie_rose:#a3556a;--serie_1:#114997;--serie_2:#118197;--serie_3:#6e0c2d;--serie_4:#656161;--brique:#8C3B29;--calque:#D9DDE3;--papier3:#DFDACE;--filet2:#D4CEC0;--wash_violet:#DBD2DE;--wash_or:#E7E1CB;--wash_vert:#D4DBCE;--wash_rouge:#E4D2CC;--titre:"Fraunces", 'Bitstream Charter',Charter,Georgia,'Times New Roman',serif;--texte:"Schibsted Grotesk", Carlito,'Helvetica Neue',Helvetica,Arial,sans-serif;--mono:"Martian Mono", ui-monospace,'DejaVu Sans Mono',Menlo,'Courier New',monospace;--rayon:0px;--largeur:1560px}@font-face{font-family:'Fraunces';src:url('/assets/fonts/fraunces-latin-var.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Fraunces';src:url('/assets/fonts/fraunces-latin-ext-var.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Fraunces';src:url('/assets/fonts/fraunces-latin-var-italic.woff2') format('woff2');font-weight:100 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Schibsted Grotesk';src:url('/assets/fonts/schibsted-grotesk-latin-var.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Schibsted Grotesk';src:url('/assets/fonts/schibsted-grotesk-latin-ext-var.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Schibsted Grotesk';src:url('/assets/fonts/schibsted-grotesk-latin-var-italic.woff2') format('woff2');font-weight:400 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Martian Mono';src:url('/assets/fonts/martian-mono-latin-var.woff2') format('woff2');font-weight:100 800;font-style:normal;font-stretch:75% 112.5%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Martian Mono';src:url('/assets/fonts/martian-mono-latin-ext-var.woff2') format('woff2');font-weight:100 800;font-style:normal;font-stretch:75% 112.5%;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--encre);font-family:var(--texte);line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:var(--primaire);text-decoration:none}a:hover{color:var(--accent)}
h1,h2,h3,h4{margin:0;font-family:var(--titre);font-weight:400;line-height:.94;
  text-wrap:balance;hyphens:none;overflow-wrap:normal}
p{margin:0 0 1em;text-wrap:pretty}ul.nu{margin:0;padding:0;list-style:none}
img{max-width:100%;height:auto}
.wrap{max-width:var(--largeur);margin:0 auto;padding:0 24px}
/* Grille de 16 colonnes. Chaque bloc est pose individuellement, section par
   section, jamais par empilement de conteneurs pleine largeur : c'est ce qui
   rend les decrochages asymetriques possibles. */
.g{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));column-gap:var(--gut,1.5rem)}
.c1-4{grid-column:1/5}.c1-6{grid-column:1/7}.c1-8{grid-column:1/9}
.c1-9{grid-column:1/10}.c1-10{grid-column:1/11}.c1-11{grid-column:1/12}
.c1-16{grid-column:1/17}.c2-9{grid-column:2/10}.c5-16{grid-column:5/17}
.c7-16{grid-column:7/17}.c9-16{grid-column:9/17}.c10-16{grid-column:10/17}
.c11-16{grid-column:11/17}.c12-16{grid-column:12/17}

.mono{font-family:var(--mono)}
.skip{position:absolute;left:-9999px;background:var(--primaire);color:var(--clair);padding:12px 18px;z-index:99}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.bandeau{background:var(--primaire_sombre);color:var(--gris_clair);font-size:13px}
.bandeau .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:9px 24px}
header{position:sticky;top:0;z-index:30;background:var(--primaire);color:var(--clair)}
header a{color:var(--clair)}header a:hover{color:var(--accent)}
header .wrap{display:flex;align-items:center;gap:26px;padding:13px 24px;flex-wrap:wrap}
.logo{display:flex;flex-direction:column;line-height:1}
.logo b{font-family:var(--titre);font-size:25px;font-weight:400}
.logo span{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;opacity:.7;margin-top:4px}
nav{margin-left:auto;display:flex;gap:17px;align-items:center;flex-wrap:wrap}
nav a{font-size:14.5px}
.cta{background:var(--accent);color:#fff !important;padding:11px 20px;font-weight:600;font-size:14px}
.cta:hover{background:var(--accent_sombre)}
.hero{background:var(--primaire);color:var(--clair)}
.hero .wrap{padding:56px 24px 62px;display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}
.hero h1{font-size:clamp(31px,4.2vw,52px)}
.hero p{font-size:17.5px;opacity:.92;max-width:60ch}
.kicker{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:16px}
section{padding:52px 0}
.alt{background:var(--fond2);border-top:1px solid var(--fond3);border-bottom:1px solid var(--fond3)}
h2.sec{font-size:clamp(24px,3vw,34px);margin-bottom:8px}
.sub{color:var(--gris);margin-bottom:24px;max-width:78ch}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}.g6{grid-template-columns:repeat(6,1fr)}
.card{background:transparent;border:0;border-top:1px solid var(--fond3);padding:16px 0 20px;display:flex;flex-direction:column;gap:7px;min-width:0}
.card h3{font-size:18px}
.card .meta{font-size:12.5px;color:var(--gris);font-family:var(--mono)}
.card .adr{font-size:13.5px;color:var(--gris)}
.puce{display:flex;gap:8px;align-items:baseline;background:transparent;border:0;border-bottom:1px solid var(--fond3);padding:10px 2px;font-size:13.5px;min-width:0}
.puce:hover{border-color:var(--accent);background:var(--fond2)}
.puce .c{font-size:11px;color:var(--accent);font-family:var(--mono)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:transparent;border:1px solid var(--fond3);padding:8px 13px;font-size:14px}
.chip:hover{background:var(--primaire);color:var(--clair)}
table.rep{width:100%;border-collapse:collapse;background:var(--fond);border:1px solid var(--fond3)}
table.rep th,table.rep td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--fond3);font-size:15px}
table.rep th{width:56%;font-weight:500}
table.rep td{font-weight:600;font-family:var(--mono)}
.prose p,.prose li{font-size:16.5px;line-height:1.74;max-width:74ch}
.prose h2{font-size:27px;margin:34px 0 12px}.prose h3{font-size:21px;margin:26px 0 10px}
.prose ul{margin:0 0 1em 1.1em;padding:0}
.fil{font-size:11.5px;letter-spacing:.05em;color:var(--gris);padding:15px 0;font-family:var(--mono)}
.src{font-size:12.5px;color:var(--gris);margin-top:14px;line-height:1.55}
.faq details{border-bottom:1px solid var(--fond3);padding:14px 0}
.faq summary{cursor:pointer;font-weight:600;font-size:16.5px}
.faq details p{margin:10px 0 0;color:var(--gris)}
.bandeau-cta{background:var(--accent);color:#fff}
.bandeau-cta a{background:var(--encre);color:var(--fond);padding:15px 26px;font-weight:600}
.bandeau-cta .wrap{padding:44px 24px;display:flex;justify-content:space-between;align-items:center;gap:34px;flex-wrap:wrap}
footer{background:var(--primaire_sombre);color:var(--gris_clair)}
footer .wrap{padding:44px 24px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:34px}
footer h4{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-family:var(--mono);margin-bottom:12px}
footer a{color:var(--gris_clair);display:block;margin-bottom:7px;font-size:14px}
footer a:hover{color:var(--accent)}
.copy{border-top:1px solid rgba(255,255,255,.09);font-size:11.5px;font-family:var(--mono)}
.copy .wrap{padding:15px 24px}
/* --- formulaire --- */
.form{background:transparent;color:var(--encre);padding:0;border-top:1px solid var(--encre)}
.form h2{font-size:25px}
.form label{display:grid;gap:6px;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--gris);margin-top:12px;font-family:var(--mono)}
.form input,.form select,.form textarea{padding:12px;border:1px solid var(--fond3);background:#fff;font-family:inherit;font-size:15px;width:100%}
.form button{margin-top:16px;width:100%;background:var(--encre);color:var(--fond);border:0;padding:15px;font-size:16px;font-weight:600;font-family:inherit;cursor:pointer}
.form button:hover{background:var(--primaire_sombre)}
.form .legal{font-size:11.5px;color:var(--gris);margin-top:10px;line-height:1.5}
.form .etapes{display:flex;gap:6px;margin:14px 0 2px}
.form .etapes i{flex:1;height:3px;background:var(--fond3);font-style:normal}
.form .etapes i.on{background:var(--accent)}
.form .pas{display:none}.form .pas.on{display:block}
html.sans-js .form .pas{display:block}
html.sans-js .form .etapes,html.sans-js .form .retour,html.sans-js .form [data-va]{display:none}
.form .retour{background:transparent;color:var(--gris);border:1px solid var(--fond3);margin-top:8px}
.form .retour:hover{background:var(--fond2);color:var(--encre)}
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* --- reveleur au defilement : jamais d'opacite nulle sans classe .vu possible --- */
.rev{clip-path:inset(0 0 calc(100% + 16px) 0)}
.rev.vu{clip-path:inset(0 0 0 0);transition:clip-path .62s cubic-bezier(.2,.7,.3,1)}
html.sans-js .rev{clip-path:none}
@media(prefers-reduced-motion:reduce){.rev,.rev.vu{clip-path:none;transition:none}}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:32px}
.g2,.g3,.g4{grid-template-columns:1fr}.g6{grid-template-columns:repeat(3,1fr)}
footer .wrap{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.g6{grid-template-columns:repeat(2,1fr)}footer .wrap{grid-template-columns:1fr}}
/* =========================================================================
   kelmesse.org — couche d'identite, direction artistique v3 revisee
   (notes/09-da-v3.md, prototype proto/accueil-et-commune.html)

   TROIS REGLES QUI COMMANDENT TOUT CE FICHIER
   -------------------------------------------
   1. AUCUN BLOC DE CONTENU n'a de fond, d'ombre ni de coin arrondi. Zero
      box-shadow, zero border-radius. Le seul separateur du site est un filet de
      1 px pose sur la grille. Trois valeurs : --enc pour ouvrir une section,
      --fil pour separer deux entrees, --fil2 pour un filet de colonne. Les
      seules familles d'aplat sont les six bandes liturgiques et le fond de
      calque des planches de plan-type, et elles ne se rencontrent jamais.
   2. AUCUN INTERLIGNAGE DE TITRE AU-DESSUS DE 0,94, et 0,94 est le plancher des
      titres generes. La raison est mesuree, pas esthetique : sous 0,94, l'accent
      d'une capitale de deuxieme ligne (I, E, A) percute la jambe descendante de
      la ligne precedente. Les 0,86-0,90 de la charte sont reserves aux titres
      dont les coupes sont posees a la main — ici, le seul h1 de l'accueil, et
      seulement parce que ses coupes sont dans la configuration. Corollaire :
      AUCUN `overflow: clip` ni `overflow: hidden` sur un ancetre de titre, sinon
      l'accent qui depasse se fait couper au lieu de se voir.
   3. LE MOUVEMENT EST PRESQUE ABSENT, ET C'EST LA SIGNATURE. Quatre gestes, tous
      en clip-path, jamais en opacity : le reveil a l'encre, le cartel qui se
      deplie, la frise des siecles qui se parcourt, les bandes liturgiques.
      `prefers-reduced-motion` les neutralise tous les quatre et revele tout
      d'emblee. Un inventaire ne gigote pas.

   La couleur porte deux signaux, et deux seulement : --rub signale une
   protection au titre des monuments historiques ; --brq accompagne une image.
   Un filet rouge dans la marge d'une entree veut dire monument historique et
   jamais autre chose ; un filet brique sous une image veut dire que cette image
   appartient a quelqu'un.
   ========================================================================= */

:root{
  /* Les jetons de la charte, a cote de ceux que consomme la base du moteur.
     Les deux jeux coexistent : le moteur ecrit --fond, --encre, --gris ; la
     charte ecrit --pap, --enc, --enc2. Ce sont les memes valeurs, nommees dans
     les deux langues, pour que ni la base ni l'identite n'ait a ceder. */
  --pap:#E8E4DA; --pap2:#DED9CD; --pap3:#DFDACE;
  --enc:#15141A; --enc2:#4E4B52; --enc3:#676359;
  --rub:#8C2B1C; --brq:#8C3B29; --cal:#D9DDE3;
  --fil:#C2BBAB; --fil2:#D4CEC0;
  --lit-violet:#DBD2DE; --lit-or:#E7E1CB; --lit-vert:#D4DBCE; --lit-rouge:#E4D2CC;

  --gut:1.5rem;
  --filet:1px solid var(--fil);
  --filet-fort:1px solid var(--enc);
  --filet-col:1px solid var(--fil2);

  /* Les cinq instances NOMMEES de Fraunces. C'est la lecon du V&A transposee a
     une seule famille : les axes variables sont traites comme des styles du
     guide de marque, pas comme une animation d'axe. */
  --fr-monument:"opsz" 144,"SOFT" 0,"WONK" 1;
  --fr-titre:"opsz" 72,"SOFT" 24,"WONK" 1;
  --fr-sous:"opsz" 40,"SOFT" 0,"WONK" 0;
  --fr-cartel:"opsz" 11,"SOFT" 0,"WONK" 0;
  --fr-rub:"opsz" 9,"SOFT" 100,"WONK" 1;

  /* Echelle typographique. Base 16,5 px, mesure plafonnee a 62 caracteres. */
  --t-10:9.5px; --t-11:11px; --t-12:12.5px; --t-13:13.5px; --t-14:14px;
  --t-15:15.5px; --t-16:16.5px; --t-18:18px; --t-19:19px; --t-21:21px;
  --t-23:23px; --t-29:29px;
  --t-h1:clamp(34px,4.6vw,58px);
  --t-h2:clamp(26px,3.1vw,44px);
  --e-1:4px; --e-2:8px; --e-3:12px; --e-4:18px; --e-5:26px;
  --e-6:38px; --e-7:56px; --e-8:80px; --e-9:112px;
  color-scheme:light;
}

/* Theme sombre. Les jetons sont redefinis sous prefers-color-scheme ET sous
   [data-theme], le premier garde par :not([data-theme="light"]) pour qu'un choix
   explicite l'emporte sur la preference systeme. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --pap:#141317; --pap2:#1B1A20; --pap3:#1E1D23;
    --enc:#E8E4DA; --enc2:#A5A09A; --enc3:#8E8981;
    --rub:#D9705C; --brq:#D78E7E; --cal:#1F2225;
    --fil:#35333C; --fil2:#2A2830;
    --lit-violet:#241F29; --lit-or:#25211A; --lit-vert:#1A2019; --lit-rouge:#251C1A;
    --fond:#141317; --fond2:#1B1A20; --fond3:#35333C; --clair:#E8E4DA;
    --encre:#E8E4DA; --papier:#141317; --gris:#A5A09A; --gris_clair:#8E8981;
    --primaire:#E8E4DA; --primaire_sombre:#1B1A20;
    --accent:#D9705C; --accent_sombre:#E08A78;
    --cinabre:#D9705C; --cinabre_clair:#E08A78;
    --brique:#D78E7E; --calque:#1F2225; --filet2:#2A2830;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --pap:#141317; --pap2:#1B1A20; --pap3:#1E1D23;
  --enc:#E8E4DA; --enc2:#A5A09A; --enc3:#8E8981;
  --rub:#D9705C; --brq:#D78E7E; --cal:#1F2225;
  --fil:#35333C; --fil2:#2A2830;
  --lit-violet:#241F29; --lit-or:#25211A; --lit-vert:#1A2019; --lit-rouge:#251C1A;
  --fond:#141317; --fond2:#1B1A20; --fond3:#35333C; --clair:#E8E4DA;
  --encre:#E8E4DA; --papier:#141317; --gris:#A5A09A; --gris_clair:#8E8981;
  --primaire:#E8E4DA; --primaire_sombre:#1B1A20;
  --accent:#D9705C; --accent_sombre:#E08A78;
  --cinabre:#D9705C; --cinabre_clair:#E08A78;
  --brique:#D78E7E; --calque:#1F2225; --filet2:#2A2830;
  color-scheme:dark;
}

/* ------------------------------------------------------------------ socle */
body{
  background:var(--pap); color:var(--enc);
  font-size:var(--t-16); line-height:1.55; letter-spacing:.004em;
  text-rendering:optimizeLegibility;
  /* overflow-x:hidden masque un defilement horizontal au lieu de le corriger :
     le controle passerait au vert en cachant le defaut. On ne le pose pas. */
}
::selection{background:var(--rub);color:var(--pap)}

/* Fraunces est variable : `font-optical-sizing:none` neutralise le reglage
   automatique de l'axe opsz par la taille, sans quoi les cinq instances nommees
   ne seraient plus des instances mais des interpolations. */
h1,h2,h3,h4{
  font-family:var(--titre); font-weight:400; font-optical-sizing:none;
  font-variation-settings:var(--fr-sous);
  letter-spacing:-.018em; line-height:.94;
  text-wrap:balance; hyphens:none; overflow-wrap:normal;
}
/* Aucune cesure possible sur les 1 248 pages generees, sur rien de ce qui est
   titre, sur-titre ou nom d'edifice. */
h1,h2,h3,h4,.kick,.lab,.nom,.credit,.plan-cap{hyphens:none}
p{margin:0 0 .85em;text-wrap:pretty}
.prose p,.txt p{max-width:62ch}
em,i,cite{font-style:italic}
strong,b{font-weight:600}
a{color:var(--enc)}
a:hover{color:var(--rub)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,details:focus-visible{
  outline:2px solid var(--rub);outline-offset:3px;
}
hr{border:0;border-top:var(--filet);margin:0}
img{max-width:100%;height:auto}
.skip{background:var(--enc);color:var(--pap);font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.11em;
  text-transform:uppercase}

/* ---------- mono : cotes, siecles, numeros, references Merimee ------------
   La regle du releve, tenue dans les deux sens : plus c'est gros, plus on
   serre ; plus c'est petit, plus on espace. wdth 87,5 pour les libelles et les
   valeurs de cartel, wdth 75 pour les grands nombres et les chiffres romains —
   c'est la chasse resserree qui permet d'aligner un siecle et une cote de
   classement dans une colonne de 2,9 rem. */
.mono,.m{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-feature-settings:"tnum" 1;font-variant-numeric:tabular-nums lining-nums}
.lab{font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  color:var(--enc2);line-height:1.5;margin:0}
.gris{color:var(--enc2)}
.brq{color:var(--brq)}

/* ------------------------------------------------------- tete courante ----
   Un ouvrage de reference n'a pas de bandeau noir : un filet suffit a tenir la
   page. La marque est composee dans la cinquieme instance de Fraunces (SOFT 100,
   WONK actif), le reste de la tete est en micro-libelle. */
.bandeau{background:transparent;color:var(--enc3);border-bottom:var(--filet)}
.bandeau .wrap{padding:7px 24px;font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.1em;
  text-transform:uppercase}
header{background:var(--pap);color:var(--enc);border-bottom:var(--filet-fort)}
header .wrap{padding:.6rem 24px .55rem;gap:1.5rem;align-items:baseline}
header a{color:var(--enc)}
header a:hover{color:var(--rub)}
.logo{flex-direction:row;align-items:baseline;gap:.7rem}
.logo b{font-family:var(--titre);font-variation-settings:var(--fr-rub);
  font-weight:600;font-size:19px;letter-spacing:.02em;line-height:1}
.logo span{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  color:var(--enc2);opacity:1;margin:0}
nav{gap:1.15rem}
nav a{font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-10);letter-spacing:.1em;text-transform:uppercase;
  border-bottom:1px solid transparent;padding-bottom:1px}
nav a:hover{border-bottom-color:var(--rub)}
.cta{background:transparent;color:var(--enc) !important;border:1px solid var(--fil);
  font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-10);letter-spacing:.1em;text-transform:uppercase;padding:.34rem .62rem}
.cta:hover{background:var(--enc);color:var(--pap) !important;border-color:var(--enc)}
/* Le folio ferme la tete courante a droite. Il ne doit JAMAIS faire passer la
   tete sur deux lignes : mesure au rendu, la ligne complete (marque + sous-titre
   + six liens + bouton + folio) deborde des 1 440 px. On retire donc le
   sous-titre de la marque avant le folio — il redit le bandeau juste au-dessus —
   puis le folio lui-meme sous 1 280 px. */
.folio{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-10);letter-spacing:.1em;text-transform:uppercase;
  color:var(--enc3);white-space:nowrap;margin-left:1.4rem}
header .wrap{flex-wrap:nowrap}
@media(max-width:1560px){.logo span{display:none}}
@media(max-width:1280px){.folio{display:none}}
/* Sur telephone, la tete courante prend six liens et un bouton : collante, elle
   mange un cinquieme du viewport pendant toute la traversee d'un listing de 190
   entrees. C'est le SOCLE de recherche qui doit rester colle en bas, pas la tete
   en haut. */
@media(max-width:900px){header .wrap{flex-wrap:wrap}header{position:static}}

/* --------------------------------------------------- fil d'Ariane --------- */
.fil{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-10);letter-spacing:.1em;text-transform:uppercase;
  color:var(--enc3);padding:.8rem 24px 0}
.fil a{color:var(--enc3)}
.fil a:hover{color:var(--rub)}

/* ------------------------------------------------------- frontispice ------
   Titre sur les colonnes 1 a 11, chapo decroche en bas des colonnes 12 a 17 :
   le vide entre les deux EST le motif. Deux colonnes de texte a la meme hauteur,
   c'est un gabarit ; deux colonnes decalees, c'est une page. */
.hero{background:transparent;color:var(--enc);border-bottom:0}
.hero .wrap{padding:clamp(2.2rem,5vw,4.6rem) 24px clamp(2rem,4vw,3.4rem);
  row-gap:clamp(1.6rem,4.2vw,4.6rem);align-items:end}
.hero h1{font-family:var(--titre);font-variation-settings:var(--fr-titre);
  font-weight:350;font-size:var(--t-h1);line-height:.94;letter-spacing:-.026em;
  max-width:22ch}
/* Un mot par titre est compose dans une sixieme instance : SOFT eleve, WONK
   actif, graisse plus forte. Deux instances de la meme famille dans la meme
   ligne de titre — le mecanisme de deux polices alternees mot a mot, ramene a un
   cout nul et a un ecart tenable pour un site de 1 248 pages. */
.hero h1 .w{font-variation-settings:"opsz" 96,"SOFT" 70,"WONK" 1;font-weight:600}
/* L'accueil est la seule page dont les coupes de titre sont posees a la main
   (dans textes.accueil.h1) : c'est la seule qui puisse descendre sous 0,94, et
   la seule qui recoive l'italique. */
body.p-accueil .hero h1{font-variation-settings:var(--fr-monument);
  font-weight:300;font-size:clamp(40px,8.4vw,132px);line-height:.90;
  letter-spacing:-.033em;max-width:none}
body.p-accueil .hero h1 .w{font-variation-settings:"opsz" 144,"SOFT" 60,"WONK" 1;
  font-weight:500;font-style:italic}
.frontis-c{align-self:end}
.chapo{font-size:var(--t-19);line-height:1.45;color:var(--enc);max-width:38ch;margin:0}
.kicker{display:block;border:0;padding:0;margin:0 0 var(--e-4);
  font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  color:var(--enc2)}
/* Le formulaire ne tient PAS dans la seconde colonne du frontispice. Mesure au
   rendu : pose sous le chapo, il descend de 350 px de plus que le titre et
   ouvre a sa gauche une bande de papier vide d'un ecran entier — sur une page de
   hub, sans banniere, c'est la moitie du premier ecran. Le vide du frontispice
   est le motif quand il separe le titre du chapo ; il n'est plus rien quand il
   est simplement de la place restante. Le formulaire prend donc toute la
   largeur, sous le frontispice, en deux colonnes : l'intitule a gauche, la
   saisie a droite. */
.frontis-f{grid-column:1/17;margin-top:clamp(1.8rem,4vw,3.4rem)}
.frontis-f .form{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  column-gap:var(--gut);align-items:start}
.frontis-f .form h2{grid-column:1;grid-row:1}
.frontis-f .form>p{grid-column:1;grid-row:2;max-width:42ch;color:var(--enc2);
  font-size:var(--t-14)}
.frontis-f .form>form{grid-column:2;grid-row:1/span 3}
@media(max-width:900px){
  .frontis-f .form{grid-template-columns:1fr}
  .frontis-f .form h2,.frontis-f .form>p,.frontis-f .form>form{grid-column:1;grid-row:auto}
}
/* La banniere ouvre la page : la page de titre la SUIT, elle ne recommence pas
   la page. On resserre donc la marge haute du frontispice. */
.ban + .hero .wrap{padding-top:clamp(1.5rem,3.2vw,3rem)}

/* --------------------------------------------------------- sections ------- */
section{padding:clamp(2.4rem,5.5vw,4.6rem) 0}
section:first-child{padding-top:0}
.alt{background:transparent;border-top:var(--filet);border-bottom:0}
/* Le filet fort qui ouvre une section court sur toute la largeur : c'est un
   filet de page, pas un soulignement de mot. Le titre, lui, reste court. */
h2.sec{font-variation-settings:var(--fr-sous);font-weight:400;font-size:var(--t-h2);
  line-height:.94;letter-spacing:-.02em;padding:0 0 var(--e-3);
  border-bottom:var(--filet-fort);margin-bottom:var(--e-4);max-width:none;
  text-wrap:balance}
h2.sec,.prose h2{hyphens:none}
.sub{color:var(--enc2);font-size:var(--t-15);max-width:64ch;margin-bottom:var(--e-5)}
.src{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-10);letter-spacing:.09em;text-transform:uppercase;
  color:var(--enc3);line-height:1.62;margin-top:var(--e-5);
  border-top:var(--filet);padding-top:.5rem;max-width:none}

/* ================================================================== */
/* L'INVENTAIRE — flux multi-colonnes, pas grille                     */
/* ================================================================== */
/* Les hauteurs d'entree sont dictees par la donnee elle-meme : une photographie
   en portrait, une en paysage, un plan de chapelle, un plan de cathedrale. Les
   colonnes ne s'alignent donc jamais horizontalement, et c'est precisement ce
   desalignement qui donne l'air d'un catalogue et non d'un gabarit. */
.inventaire .wrap{padding-bottom:0}
.inv-tete{display:flex;flex-wrap:wrap;align-items:baseline;gap:.9rem 1.6rem;
  border-top:var(--filet-fort);padding:.7rem 0 .8rem}
.inv-releve{flex:1;min-width:210px;max-width:52ch;text-transform:none;
  letter-spacing:.02em;font-size:var(--t-11);line-height:1.55}
.portees{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--fil)}
.portees button{background:none;border:0;border-left:1px solid var(--fil);
  cursor:pointer;color:var(--enc2);padding:.34rem .62rem;font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.1em;
  text-transform:uppercase}
.portees button:first-child{border-left:0}
.portees button[aria-pressed="true"]{background:var(--enc);color:var(--pap)}

.inv{columns:3;column-gap:2.2rem;column-rule:var(--filet-col);
  border-top:var(--filet);padding-top:.35rem}
.ent{break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;
  border-bottom:var(--filet);position:relative;padding:.75rem 0 .85rem;display:block}
.ent .kick{display:block;margin:0 0 .45rem;color:var(--enc2)}
.ent .kick .num{color:var(--enc3)}
.ent .kick .kd{color:var(--fil);padding:0 .12em}
/* Le filet MH ne survit pas a 1 px le long d'une photographie de 300 px de haut.
   Il passe a 2 px et il court sur TOUTE la hauteur de l'entree, planche
   comprise : un trait vertical rouge le long d'une photographie se lit comme une
   annotation portee sur une planche. L'annee de classement reste en --rub dans
   le sur-titre, ce qui donne au signal deux supports au lieu d'un. */
.ent .kick .mh-m{color:var(--rub);white-space:nowrap}
.ent.mh::before{content:"";position:absolute;left:-.7rem;top:.75rem;bottom:.85rem;
  width:2px;background:var(--rub)}
.ent .fold{margin:0}
.ent .fold>summary{list-style:none;cursor:pointer;display:block;padding:.05rem 0 0}
.ent .fold>summary::-webkit-details-marker{display:none}
.ent .nom{font-family:var(--titre);font-variation-settings:var(--fr-cartel);
  font-weight:500;font-size:var(--t-18);line-height:.94;letter-spacing:-.005em;
  display:inline;overflow-wrap:break-word;text-wrap:pretty;color:var(--enc)}
.ent .fold>summary:hover .nom{color:var(--rub)}
.ent.ill .fold>summary:hover .nom{color:var(--brq)}
.ent .sie{font-family:var(--mono);font-variation-settings:"wdth" 75;font-weight:300;
  font-size:var(--t-14);line-height:1;letter-spacing:-.01em;color:var(--enc);
  float:right;margin-left:.6rem;padding-top:.15rem}
.ent .sie.vide{color:var(--fil)}
.ent .adr{display:block;font-size:var(--t-13);line-height:1.35;color:var(--enc2);
  margin-top:.28rem}
.ent .cartel{overflow:hidden}
.ent .cartel-in{padding:.7rem 0 .2rem;border-top:var(--filet-col);margin-top:.6rem}
/* Deuxieme geste : le cartel se deplie en clip-path, 500 ms. */
.ent .fold[open] .cartel-in{animation:encre .5s cubic-bezier(.2,.7,.3,1) both}
@keyframes encre{from{clip-path:inset(0 0 calc(100% + 14px) 0)}to{clip-path:inset(0 0 0 0)}}
.cartel dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 1.4rem;margin:0}
.cartel dt{margin-top:.45rem}
.cartel dd{margin:.1rem 0 0;font-size:var(--t-14);line-height:1.35}
.cartel dd.cart-ph{grid-column:auto}
.cartel .note{margin:.8rem 0 0;font-size:var(--t-13);color:var(--enc2);max-width:52ch}
.cartel .lien-fiche{text-decoration:underline;text-underline-offset:2.5px;
  text-decoration-thickness:1px;text-decoration-color:var(--fil)}
.cartel .lien-fiche:hover{text-decoration-color:var(--rub)}
.cart-cred{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-10);letter-spacing:.1em;text-transform:uppercase;
  line-height:1.6;color:var(--enc2);display:block;overflow-wrap:anywhere}
.cart-cred a{text-decoration:underline;text-underline-offset:2px;
  text-decoration-thickness:1px;text-decoration-color:var(--brq)}
.cart-cred a:hover{color:var(--brq)}
button.signaler{background:none;border:0;padding:0;cursor:pointer;
  color:var(--enc2);font-family:inherit;font-size:var(--t-13);text-align:left;
  border-bottom:1px solid var(--fil)}
button.signaler:hover{color:var(--rub);border-bottom-color:var(--rub)}
.inv-pied{display:flex;flex-wrap:wrap;align-items:baseline;gap:1rem 1.6rem;
  border-top:var(--filet-fort);padding:.75rem 0 1rem}

/* ---------- socle de recherche, ancre en bas du viewport ------------------ */
.socle{position:sticky;bottom:0;z-index:70;background:var(--pap);
  border-top:var(--filet-fort)}
.socle-in{max-width:var(--largeur);margin-inline:auto;display:flex;flex-wrap:wrap;
  align-items:center;gap:.7rem 1.1rem;padding:.55rem 24px}
.socle label{white-space:nowrap}
.socle input[type=search]{flex:1;min-width:190px;background:transparent;
  color:var(--enc);border:1px solid var(--fil);padding:.42rem .6rem;font:inherit;
  font-size:var(--t-14)}
.socle input[type=search]::placeholder{color:var(--enc3)}
.socle .compteur{white-space:nowrap;color:var(--enc)}

/* ---------- cle typologique : la legende de l'atlas, donnee une fois ------ */
.cle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  border-top:var(--filet-fort);border-bottom:var(--filet);margin-bottom:var(--e-5)}
.cle>div{display:block;padding:1rem 1.4rem 1.1rem 0;margin:0;
  border-left:var(--filet-col);padding-left:1.4rem}
.cle>div:nth-child(3n+1){border-left:0;padding-left:0}
.cle>div:nth-child(-n+3){border-bottom:var(--filet-col)}
.cle .cle-pl{display:block;background:var(--cal);padding:.4rem .45rem;
  margin-bottom:.55rem}
.cle .cle-pl svg.pl{width:100%;height:auto}
.cle .cle-t{display:block}
.cle .n{font-family:var(--mono);font-variation-settings:"wdth" 75;font-size:17px;
  letter-spacing:-.02em}
.cle .lab{display:inline}
.cle .cle-leg{display:block;margin-top:.3rem;color:var(--enc2);text-transform:none;
  letter-spacing:.02em;font-size:var(--t-11);max-width:34ch}
.cle-note{margin:0 0 var(--e-5);max-width:82ch;text-transform:none;
  letter-spacing:.02em;font-size:var(--t-11);line-height:1.6;color:var(--enc2)}

/* ---------- index numerote (voisines, hubs, maillage) --------------------- */
.grid{gap:0}
.grid.g3,.grid.g4,.grid.g2,.grid.g6{display:block;columns:4;column-gap:2rem;
  column-rule:var(--filet-col);border-top:var(--filet)}
.grid.g3{columns:3}
.grid.g2{columns:2}
.puce{display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:baseline;
  padding:.44rem 0 .48rem;border-bottom:var(--filet-col);break-inside:avoid}
.puce span:last-child{font-size:var(--t-15);font-family:var(--texte)}
.puce .c{order:2;font-family:var(--mono);font-variation-settings:"wdth" 75;
  font-size:var(--t-11);color:var(--enc2);white-space:nowrap;letter-spacing:0}
.puce:hover{background:transparent;border-bottom-color:var(--enc)}
.puce:hover span:last-child{color:var(--rub)}
.chips{gap:0;border-top:var(--filet)}
.chip{border:0;border-bottom:var(--filet-col);padding:.5rem .8rem .5rem 0;
  font-size:var(--t-15);margin-right:1.2rem}
.chip:hover{background:transparent;color:var(--rub);border-color:var(--fil2)}

/* ---------- cartes residuelles : aucune n'est une carte ------------------- */
.card{background:transparent;border:0;border-top:var(--filet-fort);
  padding:var(--e-4) 0 var(--e-5);gap:var(--e-2);min-width:0}
.card h3{font-family:var(--titre);font-variation-settings:var(--fr-cartel);
  font-weight:500;font-size:var(--t-19);line-height:.94}
.card .adr{font-size:var(--t-14);color:var(--enc2)}
.card .meta{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-11);color:var(--enc2);letter-spacing:.02em}

/* --------------------------------------- cartouche de donnees / reperes ---
   Le tableau de reperes EST le cartouche : intitule a gauche en micro-libelle,
   donnee a droite en chasse resserree. Filets seuls, pas de zebre — on lit une
   notice, pas un tableur. */
table.rep{border:0;border-top:var(--filet-fort);background:transparent}
table.rep th{width:42%;font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-10);text-transform:uppercase;letter-spacing:.11em;
  color:var(--enc2);padding:.62rem 1rem .68rem 0;vertical-align:top;
  border-bottom:var(--filet)}
table.rep td{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-15);color:var(--enc);padding:.62rem 0 .68rem;
  border-bottom:var(--filet);font-weight:400}
table.rep thead th{color:var(--enc);border-bottom:var(--filet-fort);width:auto}
table.rep tr:last-child th,table.rep tr:last-child td{border-bottom:var(--filet-fort)}
.prose table.rep td{font-family:var(--texte);font-size:var(--t-15)}
.prose table.rep th{width:auto}

/* ------------------------------------------------------------------ prose */
.prose p,.prose li{font-size:var(--t-16);line-height:1.7;max-width:62ch}
.prose>*:first-child{margin-top:0}
.prose h2{font-variation-settings:var(--fr-sous);font-size:var(--t-29);
  line-height:.94;margin:var(--e-7) 0 var(--e-3);max-width:28ch}
.prose h3{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-11);line-height:1.4;text-transform:uppercase;
  letter-spacing:.11em;color:var(--enc2);margin:var(--e-6) 0 var(--e-2)}
.prose a{text-decoration:underline;text-decoration-color:var(--fil);
  text-decoration-thickness:1px;text-underline-offset:.2em}
.prose a:hover{text-decoration-color:var(--rub)}
.prose ul{list-style:none;margin-left:0;padding:0}
.prose ul li{position:relative;padding-left:20px;margin-bottom:7px}
.prose ul li::before{content:"—";position:absolute;left:0;color:var(--enc3)}
.prose ol{padding-left:20px}
.prose blockquote{margin:var(--e-6) 0;padding-left:var(--e-4);
  border-left:2px solid var(--rub)}
.prose blockquote p{font-family:var(--titre);
  font-variation-settings:"opsz" 24,"SOFT" 0,"WONK" 1;font-size:var(--t-21);
  line-height:1.3;color:var(--enc);max-width:54ch;margin:0}

/* -------------------------------------------------------------------- FAQ */
.faq{border-top:var(--filet-fort)}
.faq details{border-bottom:var(--filet);padding:var(--e-4) 0}
.faq summary{list-style:none;display:flex;gap:var(--e-4);
  justify-content:space-between;font-family:var(--titre);
  font-variation-settings:"opsz" 20,"SOFT" 0,"WONK" 1;font-weight:500;
  font-size:var(--t-19);line-height:.94}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--enc2);
  font-size:var(--t-16);line-height:1}
.faq details[open] summary::after{content:"\2013";color:var(--rub)}
.faq details[open] p{animation:encre .5s cubic-bezier(.2,.7,.3,1) both}
.faq details p{color:var(--enc2);max-width:62ch;font-size:var(--t-15);
  margin:var(--e-3) 0 0}

/* ================================================================== */
/* LE CLASSEUR LITURGIQUE — six bandes chanfreinees                   */
/* ================================================================== */
/* Le chanfrein remplace l'arrondi : il produit la meme lecture d'onglet et il ne
   reintroduit pas de coin arrondi dans le document. Les bandes se recouvrent de
   26 px et s'empilent par z-index croissant vers le bas : l'ensemble a la forme
   physique d'un classeur a onglets. Ce n'est ni un menu, ni un accordeon. */
.classeur{margin-top:var(--e-4)}
.bande{position:relative;margin-top:-26px;
  clip-path:polygon(0 34px, 46px 0, 100% 0, 100% 100%, 0 100%)}
.bande:first-child{margin-top:0}
.bande>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;
  gap:1rem;padding:2.9rem 1.2rem 2.5rem 2rem;border-top:var(--filet)}
.bande>summary::-webkit-details-marker{display:none}
.bande .nom{font-family:var(--titre);
  font-variation-settings:"opsz" 30,"SOFT" 0,"WONK" 1;font-weight:500;
  font-size:clamp(19px,2.1vw,28px);line-height:.92;letter-spacing:-.015em}
.bande .dts{flex:1;text-align:right}
.bande .plus{width:1.4rem;text-align:right;color:var(--enc2)}
.bande .plus::after{content:"+"}
.bande[open] .plus::after{content:"\2013"}
.bande[open] .plus{color:var(--rub)}
.bande-corps{padding:0 1.6rem 3.1rem 2rem}
.bande-corps .defs{border-top:1px solid color-mix(in srgb,var(--enc) 22%,transparent)}
.b-violet{background:var(--lit-violet)}
.b-or{background:var(--lit-or)}
.b-vert{background:var(--lit-vert)}
.b-rouge{background:var(--lit-rouge)}
.b-blanc{background:var(--pap3)}
.bande[open] .bande-corps{animation:encre .55s cubic-bezier(.2,.7,.3,1) both}

/* ---------- grille de definitions (reperes, cartel, bandes) --------------- */
.defs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;
  border-top:var(--filet-fort)}
.defs>div{padding:.62rem 1rem .68rem 0;border-bottom:var(--filet)}
.defs>div:nth-child(odd){border-right:var(--filet)}
.defs>div:nth-child(even){padding-left:1rem}
.defs.un{grid-template-columns:1fr}
.defs.un>div{border-right:0;padding-right:0;padding-left:0}
.defs .v{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-15);line-height:1.25;margin-top:.18rem;display:block}
.defs .v.z{color:var(--rub)}

/* ---------- la ligne des trois nombres ------------------------------------
   Le troisieme nombre est un zero compose au meme corps que les deux autres,
   dans la meme ligne, sans un mot d'explication au-dela de sa legende factuelle.
   C'est le seul endroit de l'accueil ou la couleur porte un commentaire. */
.compte{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:var(--filet-fort);border-bottom:var(--filet)}
.compte>div{padding:1.1rem 1.1rem 1.3rem 0;border-left:var(--filet);
  padding-left:1.1rem}
.compte>div:first-child{border-left:0;padding-left:0}
.nombre{font-family:var(--mono);font-variation-settings:"wdth" 75;font-weight:300;
  font-size:clamp(34px,5.4vw,76px);line-height:.88;letter-spacing:-.05em;display:block}
.nombre.z{color:var(--rub)}
.compte .lab{margin-top:.7rem;max-width:26ch;text-transform:none;
  letter-spacing:.02em;font-size:var(--t-11);line-height:1.5}

/* ---------- frise des siecles : une trame d'inventaire, pas un graphique --- */
.frise-wrap{overflow-x:auto;padding-bottom:.4rem;-webkit-overflow-scrolling:touch}
.frise{display:flex;align-items:flex-end;gap:0;min-width:640px;
  border-bottom:var(--filet-fort);height:210px}
.frise button{flex:1;background:none;border:0;border-left:var(--filet-col);
  padding:0;cursor:pointer;display:flex;flex-direction:column;
  justify-content:flex-end;align-items:stretch;height:100%;color:inherit}
.frise button:first-child{border-left:0}
.hach{background-image:repeating-linear-gradient(to bottom,currentColor 0 1px,transparent 1px 4px);
  color:var(--enc3);margin:0 4px;min-height:3px}
.frise button[aria-pressed="true"] .hach,.frise button:hover .hach{color:var(--rub)}
.frise .sc{font-family:var(--mono);font-variation-settings:"wdth" 75;
  font-size:var(--t-10);letter-spacing:.04em;color:var(--enc3);
  padding:.4rem 0 .5rem;text-align:center}
.frise button[aria-pressed="true"] .sc{color:var(--rub)}
.lecture{border-top:var(--filet);padding-top:.7rem;font-size:var(--t-15)}
.frise-note{margin-top:.5rem}
@media(min-width:901px){.frise-note{display:none}}

/* -------------------------------------------------------------- formulaire */
.form{background:transparent;border:0;border-top:var(--filet-fort);
  padding:var(--e-4) 0 0}
.form h2{font-variation-settings:var(--fr-sous);font-size:var(--t-23);
  line-height:.94;border:0;padding:0;margin:0 0 2px;max-width:none}
.form label{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-10);letter-spacing:.11em;color:var(--enc2);
  text-transform:uppercase}
.form input,.form select,.form textarea{border:1px solid var(--fil);
  background:transparent;color:var(--enc);font-size:var(--t-14)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--enc)}
.form button{background:var(--enc);color:var(--pap);font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-weight:500;font-size:var(--t-11);
  letter-spacing:.11em;text-transform:uppercase;padding:.75rem 1.2rem}
.form button:hover{background:var(--rub)}
.form .retour{background:transparent;color:var(--enc2);border:1px solid var(--fil)}
.form .retour:hover{background:transparent;color:var(--enc);border-color:var(--enc)}
.form .etapes i{height:2px;background:var(--fil2)}
.form .etapes i.on{background:var(--rub)}
.form .legal{font-size:var(--t-11);color:var(--enc2);line-height:1.5}

/* -------------------------------------------------------- bandeau d'appel */
.bandeau-cta{background:transparent;color:var(--enc);
  border-top:var(--filet-fort);border-bottom:var(--filet)}
.bandeau-cta .wrap{padding:var(--e-6) 24px}
.bandeau-cta a{background:var(--enc);color:var(--pap);font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-weight:500;font-size:var(--t-11);
  letter-spacing:.11em;text-transform:uppercase;padding:.8rem 1.4rem}
.bandeau-cta a:hover{background:var(--rub)}

/* ------------------------------------------------------------------- pied */
/* Un pied noir sur un papier teinte est un bloc de couleur : on le remplace par
   un filet fort et la meme encre que le reste. */
footer{background:transparent;color:var(--enc2);border-top:var(--filet-fort);
  margin-top:clamp(3rem,7vw,6rem)}
footer .wrap{padding:var(--e-5) 24px var(--e-4)}
footer h4{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-10);letter-spacing:.11em;
  text-transform:uppercase;color:var(--enc2);margin-bottom:var(--e-3)}
footer a{color:var(--enc2);font-size:var(--t-14);margin-bottom:6px}
footer a:hover{color:var(--rub)}
.copy{border-top:var(--filet)}
.copy .wrap{padding:.8rem 24px 2.4rem;font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.1em;
  text-transform:uppercase;color:var(--enc3)}

/* ==========================================================================
   OUTILS ET QUIZ — meme regle : aucun fond de bloc, aucune ombre, aucun coin
   arrondi. Un filet de 1 px separe, un filet de 2 px signale. La couleur ne
   porte jamais seule une information : les etats juste et faux portent aussi un
   signe et un mot.
   ========================================================================== */
.outil{border-top:2px solid var(--enc);padding-top:var(--e-4);margin-top:var(--e-3)}
.outil-note{font-size:var(--t-12);color:var(--enc2);line-height:1.55;
  border-top:var(--filet);padding-top:var(--e-3);margin-top:var(--e-4);max-width:78ch}
.outil .champs{display:flex;flex-wrap:wrap;align-items:flex-end;
  gap:var(--e-3) var(--e-4);padding-bottom:var(--e-4);border-bottom:var(--filet)}
.outil .champs label{display:block;font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-weight:500;font-size:var(--t-10);
  letter-spacing:.11em;text-transform:uppercase;color:var(--enc2);
  margin-bottom:var(--e-1)}
.outil input,.outil select{border:1px solid var(--fil);background:transparent;
  color:var(--enc);font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-size:var(--t-16);padding:9px 12px;min-width:12ch;
  font-variant-numeric:tabular-nums}
.outil input:focus,.outil select:focus{border-color:var(--enc)}
.outil input[type=text]{font-family:var(--texte);min-width:26ch}
.bouton-plat{background:none;border:1px solid var(--enc);color:var(--enc);
  font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  padding:.62rem 1rem;cursor:pointer}
.bouton-plat:hover{background:var(--enc);color:var(--pap)}
.outil .res{margin-top:var(--e-4);min-height:3em}
.outil .reponse{font-family:var(--titre);
  font-variation-settings:"opsz" 24,"SOFT" 0,"WONK" 1;font-weight:500;
  font-size:var(--t-23);line-height:.94;margin:0 0 var(--e-4)}
.outil .erreur{font-size:var(--t-15);color:var(--rub);
  border-left:2px solid var(--rub);padding-left:var(--e-3);margin:0}
table.tab{width:100%;border-collapse:collapse;background:transparent;border:0}
table.tab thead th{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  color:var(--enc2);border-bottom:var(--filet-fort);text-align:left;
  padding:.55rem 1rem .6rem 0}
table.tab td{font-weight:400;font-family:var(--texte);font-size:var(--t-15);
  vertical-align:top;border-bottom:var(--filet);padding:.55rem 1rem .6rem 0}
table.tab td:first-child{font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;white-space:nowrap}
.comput-boite{margin-top:var(--e-5);border-top:var(--filet);padding-top:var(--e-3)}
.comput-boite summary{cursor:pointer;font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-weight:500;font-size:var(--t-10);
  letter-spacing:.11em;text-transform:uppercase;color:var(--enc2)}
ol.comput{margin:var(--e-3) 0 0 1.3em;padding:0;max-width:74ch}
ol.comput li{margin-bottom:var(--e-3);font-size:var(--t-15);line-height:1.6}
.pastille{display:inline-block;width:.68em;height:.68em;margin-right:.5em;
  border:1px solid var(--enc);vertical-align:baseline}
.lit-violet{background:var(--liturgie_violet)}
.lit-blanc{background:var(--pap)}
.lit-rouge{background:var(--liturgie_rouge)}
.lit-vert{background:var(--liturgie_vert)}
.lit-rose{background:var(--liturgie_rose)}

.quiz{border-top:2px solid var(--enc);padding-top:var(--e-4)}
.quiz .q{border:0;border-top:var(--filet);margin:0;padding:var(--e-4) 0 var(--e-3)}
.quiz .q:first-of-type{border-top:0}
.quiz legend{font-family:var(--titre);
  font-variation-settings:"opsz" 20,"SOFT" 0,"WONK" 1;font-weight:500;
  font-size:var(--t-19);line-height:.94;padding:0;margin-bottom:var(--e-3)}
.quiz .choix{display:flex;gap:var(--e-3);align-items:baseline;padding:9px 0 9px 2px;
  border-bottom:var(--filet);cursor:pointer;font-size:var(--t-15)}
.quiz .choix:hover{color:var(--rub)}
.quiz .choix input{margin:0;accent-color:var(--rub)}
.quiz .choix.juste{border-bottom:2px solid var(--enc)}
.quiz .choix.juste span::after{content:" — bonne réponse";font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.09em;
  text-transform:uppercase;color:var(--enc)}
.quiz .choix.faux{border-bottom:2px solid var(--rub)}
.quiz .choix.faux span::after{content:" — votre réponse";font-family:var(--mono);
  font-variation-settings:"wdth" 87.5;font-size:var(--t-10);letter-spacing:.09em;
  text-transform:uppercase;color:var(--rub)}
.quiz .corr,.quiz-terrain .corr{margin-top:var(--e-3);padding-left:var(--e-4);
  border-left:2px solid var(--fil);font-size:var(--t-15);line-height:1.62;
  max-width:76ch}
.quiz-actions{display:flex;gap:var(--e-3);margin-top:var(--e-5);flex-wrap:wrap}
.quiz-actions button[type=submit]{background:var(--enc);color:var(--pap);border:0;
  font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-11);letter-spacing:.11em;text-transform:uppercase;
  padding:.8rem 1.4rem;cursor:pointer}
.quiz-actions button[type=submit]:hover{background:var(--rub)}
.bilan{margin-top:var(--e-4);border-top:2px solid var(--enc);
  padding-top:var(--e-3);font-size:var(--t-16);max-width:76ch}
.quiz-rang{font-family:var(--mono);font-variation-settings:"wdth" 87.5;
  font-weight:500;font-size:var(--t-10);letter-spacing:.11em;text-transform:uppercase;
  color:var(--enc2);margin-bottom:var(--e-3)}
.choix-styles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--e-2);margin-top:var(--e-3)}
.choix-style{background:none;border:1px solid var(--fil);color:var(--enc);
  font-family:var(--texte);font-size:var(--t-14);padding:12px 10px;cursor:pointer;
  text-align:left;line-height:1.3}
.choix-style:hover:not(:disabled){border-color:var(--enc)}
.choix-style:disabled{cursor:default}
.choix-style.juste{border:2px solid var(--enc)}
.choix-style.juste::after{content:" ✓";color:var(--enc)}
.choix-style.faux{border:2px solid var(--rub)}
.choix-style.faux::after{content:" ✕";color:var(--rub)}

/* ------------------------------------------------- images hors inventaire */
figure.photo{margin:0 0 var(--e-4)}
figure.photo img{display:block;width:100%;height:auto}
.styles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--e-6) var(--e-5)}
.fiche-style h3{font-family:var(--titre);
  font-variation-settings:"opsz" 24,"SOFT" 0,"WONK" 1;font-weight:500;
  font-size:var(--t-23);line-height:.94;margin-bottom:var(--e-3)}
.fiche-style .periode{font-family:var(--mono);font-variation-settings:"wdth" 75;
  font-size:var(--t-11);color:var(--enc2);white-space:nowrap}
.fiche-style p{font-size:var(--t-15);line-height:1.62}

/* ------------------------------------------------------------- reprises --- */
@media(max-width:1200px){
  .inv{columns:2}
  .grid.g3,.grid.g4,.grid.g6{columns:3}
}
@media(max-width:900px){
  :root{--gut:1rem}
  .g{grid-template-columns:repeat(8,minmax(0,1fr))}
  .c1-4,.c1-6,.c1-8,.c1-9,.c1-10,.c1-11,.c1-16,.c2-9,.c5-16,.c7-16,.c9-16,
  .c10-16,.c11-16,.c12-16{grid-column:1/-1}
  .hero .wrap{row-gap:1.6rem}
  .cle{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cle>div{border-left:0;padding-left:0;border-bottom:var(--filet-col)}
  .cle>div:nth-child(3n+1){border-left:0}
  .grid.g3,.grid.g4,.grid.g6,.grid.g2{columns:2}
  .styles{grid-template-columns:1fr}
  .choix-styles{grid-template-columns:repeat(2,minmax(0,1fr))}
  footer .wrap{padding:var(--e-5) 24px var(--e-3)}
  table.rep th{width:46%}
}
@media(max-width:620px){
  body{font-size:16px}
  .inv{columns:1;column-rule:0}
  .grid.g3,.grid.g4,.grid.g6,.grid.g2{columns:1;column-rule:0}
  .compte{grid-template-columns:1fr}
  .compte>div{border-left:0;padding-left:0;border-top:var(--filet)}
  .compte>div:first-child{border-top:0}
  .defs,.cartel dl{grid-template-columns:1fr}
  .defs>div:nth-child(odd){border-right:0;padding-right:0}
  .defs>div:nth-child(even){padding-left:0}
  .cle{grid-template-columns:1fr}
  .ent.mh::before{left:-.5rem}
  .lic{grid-template-columns:1fr}
  .socle-in{padding:.45rem 24px}
  .socle label{display:none}
  .choix-styles{grid-template-columns:1fr}
  .outil .champs{gap:var(--e-3)}
  .outil input,.outil select{width:100%}
  .bande>summary{padding:2.6rem .9rem 2.1rem 1.4rem}
  .bande-corps{padding:0 .9rem 2.4rem 1.4rem}
  .credit,.plan-cap,.cart-cred{letter-spacing:.075em}
}

/* -------------------------------------------- mouvement neutralise -------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;
    animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .rev,.rev.vu,.ink,.ink.vu{clip-path:none !important}
}

@media print{
  header,.bandeau,footer,.form,nav,.skip,.socle,.portees{display:none !important}
  body{background:#fff;color:#000;font-size:11pt}
  .rev,.ink{clip-path:none !important}
  .inv{columns:2}
  a::after{content:" (" attr(href) ")";font-size:8pt;color:#555}
}

/* page contact : le formulaire suit la mesure du texte, pas la largeur de la grille */
.contact-form{max-width:62ch;margin-top:var(--e-6,3rem)}

/* ---------------------------------------------- signalement (02/10/2026) --
   Le formulaire ne s'affiche plus en tete de page : il vit dans une fenetre
   <dialog>, ouverte par un lien discret sous le chapo, par le bouton d'en-tete
   et par les boutons « Signaler une erreur sur cette fiche ». Pas d'ombre, pas
   d'arrondi : un filet rouge en tete, comme une fiche qu'on sort du casier. */
.frontis-sig{margin:var(--e-4) 0 0}
.sig-btn{font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:var(--t-11);letter-spacing:.1em;text-transform:uppercase;color:var(--enc2);
  text-decoration:none;border-bottom:1px solid var(--fil);padding-bottom:2px}
.sig-btn:hover{color:var(--rub);border-bottom-color:var(--rub)}
.sig-dlg{border:0;border-top:3px solid var(--rub);padding:0;margin:auto;
  background:var(--pap);color:var(--enc);width:min(760px,calc(100vw - 32px));
  max-height:calc(100vh - 48px);overflow:auto}
.sig-dlg::backdrop{background:rgba(21,20,26,.58)}
.sig-in{position:relative;padding:clamp(1.4rem,4vw,2.4rem)}
.sig-dlg .form{border-top:0;margin:0;padding:0}
.sig-dlg .form h2{padding-right:2.2rem}
.sig-x{position:absolute;top:.4rem;right:.7rem;background:none;border:0;padding:.2rem .4rem;
  font-size:30px;line-height:1;cursor:pointer;color:var(--enc2)}
.sig-x:hover{color:var(--rub)}

/* ------------------------------------------- lecture longue (02/10/2026) --
   Articles, guides piliers, pages d'auteur : une colonne de lecture centree,
   plus large, en corps plus grand. La ligne passe de ~62 a ~80 signes ; au-dela
   de 820 px, la page reste centree au lieu de laisser un desert a droite. */
body.p-article .prose,body.p-pilier .prose,body.p-auteur .prose{
  max-width:860px;margin-inline:auto}
body.p-article .prose p,body.p-article .prose li,
body.p-pilier .prose p,body.p-pilier .prose li,
body.p-auteur .prose p,body.p-auteur .prose li{
  max-width:none;font-size:var(--t-18);line-height:1.68}
body.p-article .prose h2,body.p-pilier .prose h2,body.p-auteur .prose h2{max-width:none}
body.p-article .prose blockquote p,body.p-pilier .prose blockquote p{max-width:none}
body.p-article .hero .wrap,body.p-pilier .hero .wrap{display:block;max-width:860px;
  margin-inline:auto}
body.p-article .hero h1,body.p-pilier .hero h1{max-width:none}
body.p-article .frontis-c,body.p-pilier .frontis-c{margin-top:var(--e-5)}
body.p-article .chapo,body.p-pilier .chapo{max-width:none;font-size:var(--t-21)}

/* ------------------------------------- illustrations generees (02/10/2026) --
   Scenes en tete d'article et de guide, boucles video muettes, portraits de la
   redaction. Pleine largeur de la colonne de lecture, aucun arrondi, aucune
   ombre : la photographie fait le travail, le filet le reste. */
.illu{margin:0 0 var(--e-6);padding:0}
.illu img,.illu video{display:block;width:100%;height:auto;aspect-ratio:16/9;
  object-fit:cover;background:var(--pap2)}
.illu .credit{margin-top:6px}
.ban-video{margin:0}
.ban-video video{display:block;width:100%;height:clamp(240px,46vw,620px);
  object-fit:cover;background:var(--pap2)}
.ban-video .credit{max-width:var(--largeur);margin:6px auto 0;padding:0 24px}
.sig-auteur{display:flex;align-items:center;gap:12px;margin-bottom:var(--e-5)}
.sig-portrait img{display:block;width:44px;height:58px;object-fit:cover}
.portrait-auteur{float:right;width:min(280px,42%);margin:0 0 var(--e-4) var(--e-5)}
.portrait-auteur img{display:block;width:100%;height:auto}
@media(max-width:700px){.portrait-auteur{float:none;width:100%;margin:0 0 var(--e-5)}}
@media(prefers-reduced-motion:reduce){video.boucle{animation:none}}
/* Article et guide : le frontispice centre enchaine directement sur
   l'illustration, sans la double marge (bas du frontispice + haut de section). */
body.p-article .hero .wrap,body.p-pilier .hero .wrap{padding-bottom:var(--e-4)}
body.p-article .hero + section,body.p-pilier .hero + section{padding-top:var(--e-4)}

/* ---- photographies : deux registres de planche, un seul gabarit ----
   Rien n'est cadre. Chaque objet occupe sur le papier la place que sa taille lui
   vaut : la photographie a son ratio natif, plafonnee en HAUTEUR et jamais en
   largeur ; le plan-type a l'echelle reelle de sa typologie. Le seul ecart entre
   les deux registres est la couleur du filet qui ouvre le cartouche. */

/* ---- banniere pleine largeur, en frontispice ---- */
.ban{margin:0;padding:0;display:block}
.ban-img{display:block;width:100%;height:auto;max-height:min(56vh,520px);
  aspect-ratio:1920/823;object-fit:cover;object-position:50% 30%;background:var(--fond2)}
.ban .wrap{padding-top:0}
.credit-ban{max-width:none;padding-bottom:.2rem}

/* ---- le credit : quatre elements, jamais cache, jamais derriere un survol ----
   9,5 px capitales, wdth 87,5, graisse 500, tracking +0,105 em, interlignage
   1,62 — et en --gris (l'encre secondaire, 6,75:1), pas en tertiaire : un credit
   EST du texte, il porte un nom propre et une reference juridique, il doit etre
   lu et pas devine. Les liens sont soulignes a 1 px en brique. */
.credit{font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:9.5px;line-height:1.62;letter-spacing:.105em;text-transform:uppercase;
  color:var(--gris);margin:0;padding:.4rem 0 .1rem;
  border-top:1px solid var(--brique);text-wrap:pretty;overflow-wrap:anywhere}
.credit a{color:var(--gris);text-decoration:underline;text-underline-offset:2.5px;
  text-decoration-thickness:1px;text-decoration-color:var(--brique)}
.credit a:hover{color:var(--brique)}
.credit .suj,.credit .aut{color:var(--encre)}

/* ---- planche : photographie, non recadree ----
   `width:max-content` : le <figure> fait exactement la largeur de la
   photographie, et le filet brique qui ouvre le credit fait donc la largeur de
   l'IMAGE, jamais celle de la colonne. Sur une page qui compte 45 credits, c'est
   ce qui empeche 45 traits rouges de longueur egale de devenir une trame — le
   filet mesure ce qu'il annonce. `max-width:100%` est obligatoire avec lui :
   sans cette borne, une image large elargit sa colonne au-dela de la page et
   TOUTE LA PAGE defile horizontalement. Mesure avant correction : 1 681 px pour
   une fenetre de 1 400, et 499 px pour une fenetre de 390. Invisible sur le HTML,
   qui est correct, et sur la CSS lue isolement. */
.plate{margin:0 0 .75rem;padding:0}
.plate-ph{width:max-content;max-width:100%}
.plate-ph picture{display:block;max-width:100%}
.plate-ph img{display:block;width:auto;height:auto;max-width:100%;max-height:29rem;
  background:var(--fond2)}

/* ---- planche : plan-type, dessine en grand, sur son fond de calque ----
   Trait de 1 px non mis a l'echelle (`non-scaling-stroke`), jonctions en angle
   vif, trois epaisseurs : mur porteur 1,4 px, trame de travees et bas-cotes
   1 px, axe de symetrie tirete. Le fond de calque est la seule teinte froide du
   site : sur un papier chaud, il dit « ceci est un autre papier » — un calque,
   pas une photographie ratee. */
.plate-pl{min-width:min(100%,13.5rem)}
.plate-pl .pl-fond{display:block;background:var(--calque);padding:.42rem .45rem}
.pl{display:block;width:100%;height:auto}
.pl g *{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:square;
  stroke-linejoin:miter}
.pl .pl-mur *{stroke:var(--gris);stroke-width:1.4}
.pl .pl-tr *{stroke:var(--gris_clair);stroke-width:1}
.pl .pl-ax *{stroke:var(--gris_clair);stroke-width:1;stroke-dasharray:16 4 3 4}
.plan-cap{font-family:var(--mono);font-variation-settings:"wdth" 87.5;font-weight:500;
  font-size:9.5px;line-height:1.62;letter-spacing:.105em;text-transform:uppercase;
  color:var(--gris);margin:0;padding:.4rem 0 .1rem;
  border-top:1px solid var(--gris_clair)}

/* ---- illustration d'article ---- */
.art-illu{margin:0 0 1.6rem}
.art-illu .plate-ph img{max-height:26rem}

/* ---- les quatre nombres de la page de credits ---- */
.lic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
  border-top:1px solid var(--encre);border-bottom:1px solid var(--fond3);
  margin:1.2rem 0}
.lic>div{padding:.9rem 1rem 1rem;border-left:1px solid var(--fond3)}
.lic>div:first-child{border-left:0;padding-left:0}
.lic .n{font-family:var(--mono);font-variation-settings:"wdth" 75;font-weight:300;
  font-size:clamp(24px,3vw,38px);line-height:.92;letter-spacing:-.04em;display:block}
.lic .lab{margin-top:.5rem;display:block;text-transform:uppercase}

@media (max-width:1200px){
  .plate-ph img{max-height:26rem}
  .lic{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lic>div:nth-child(3){border-left:0;padding-left:0}
}
@media (max-width:900px){
  .ban-img{max-height:min(42vh,320px)}
}
@media (max-width:620px){
  .ban-img{aspect-ratio:3/2;max-height:250px;object-position:50% 32%}
  .plate-ph img{max-height:22rem}
  .lic{grid-template-columns:1fr}
  .lic>div{border-left:0;padding-left:0;border-bottom:1px solid var(--fond3)}
  .credit,.plan-cap{letter-spacing:.075em}
}