/*
Theme Name: appMeuf
Theme URI: https://appmeuf.fr/
Description: Thème sur mesure d'appMeuf, direction « la coiffeuse » (piste C) : papier rosé poudré, papier soie vergé, encre prune, un seul accent garance.
Version: 1.0.0
Text Domain: appmeuf
*/

/*
 * appMeuf, piste C : « la coiffeuse »
 * Une table de toilette le soir : papier poudré, photo étalonnée chaud,
 * dessins au compas en trait fin, un seul accent garance.
 *
 * Contrastes (WCAG 2.1, calculés avant écriture)
 *   encre   #2A1B19 sur lait #F5EBE7 : 14,1:1   blanc 16,6:1   poudre #EEDCD5 12,5:1   soie #E7E3DD 12,9:1
 *   encre-2 #5E4A46 sur lait         :  7,0:1   blanc  8,3:1   poudre          6,2:1   soie          6,5:1
 *   garance #9B3A27 sur lait         :  5,9:1   blanc  6,9:1   poudre          5,2:1   soie          5,4:1
 *   lait sur garance (bouton)        :  5,9:1
 *   plaque garance profonde #5E2219 : lait 10,4:1, rose #E7C9BE 7,9:1
 *   papier rosé poudré (pas crème) et second papier « soie » gris rosé vergé : on ne confond pas avec domo-malin.
 *   texte courant toujours en encre (au moins 12:1), encre-2 réservée aux métadonnées.
 *
 * Formes : un seul système doux, quatre rayons et pas un de plus : 12 px (vignettes, champs),
 * 20 px (surfaces), pilule (tout ce qui se clique, et les cercles), arche (vitrine, rubrique, test).
 * Gamme typographique fermée : 13, 15, 17, 20, 24, 30, 40, 56, 88 px, plus le logotype du pied.
 */

/* MASQUES:DEBUT */
:root{
  --m-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  --m-bouclier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12l2 2l4-4'/%3E%3C/g%3E%3C/svg%3E");
  --m-sources: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='M12 5v16m8.001-2A2 2 0 0 0 22 17V5a2 2 0 0 0-1.999-2L16 3.002A5 5 0 0 0 12 5a5 5 0 0 0-4-2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 1.999 2H8a5 5 0 0 1 4 2a5 5 0 0 1 4-2z'/%3E%3C/svg%3E");
  --m-maj: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6'%3E%3Cpath d='M3 12a9 9 0 0 1 9-9a9.75 9.75 0 0 1 6.74 2.74L21 8'/%3E%3Cpath d='M21 3v5h-5m5 4a9 9 0 0 1-9 9a9.75 9.75 0 0 1-6.74-2.74L3 16'/%3E%3Cpath d='M8 16H3v5'/%3E%3C/g%3E%3C/svg%3E");
  --m-alerte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='m21.73 18l-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3M12 9v4m0 4h.01'/%3E%3C/svg%3E");
  --m-idee: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='M15 14c.2-1 .7-1.7 1.5-2.5c1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5c.7.7 1.3 1.5 1.5 2.5m0 4h6m-5 4h4'/%3E%3C/svg%3E");
  --m-lien: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/g%3E%3C/svg%3E");
  --m-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  --m-coeur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='M2 9.5a5.5 5.5 0 0 1 9.591-3.676a.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5'/%3E%3C/svg%3E");
  --m-etoile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.12 2.12 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.12 2.12 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.12 2.12 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.12 2.12 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.12 2.12 0 0 0 1.597-1.16z'/%3E%3C/svg%3E");
}
/* MASQUES:FIN */

:root {
  --lait: #F5EBE7;
  --poudre: #EEDCD5;
  --soie: #E7E3DD;
  --argile: #DDC3B9;
  --profond: #5E2219;
  --rose: #E7C9BE;
  --blanc: #FFFFFF;
  --encre: #2A1B19;
  --encre-2: #5E4A46;
  --filet: rgba(42, 27, 25, .13);
  --filet-fort: rgba(42, 27, 25, .26);
  --garance: #9B3A27;
  --garance-voile: rgba(155, 58, 39, .12);
  --etalon: sepia(.12) saturate(.9) contrast(1.02) brightness(1.02);
  --verge: repeating-linear-gradient(0deg, rgba(42, 27, 25, .022) 0 1px, transparent 1px 4px), repeating-linear-gradient(90deg, rgba(42, 27, 25, .04) 0 1px, transparent 1px 44px);
  --f-titre-court: 'Bodoni Moda', Georgia, serif;

  --f-titre: 'Bodoni Moda', 'Didot', Georgia, serif;
  --f-texte: 'Albert Sans', 'Helvetica Neue', Arial, sans-serif;

  --t-13: .8125rem; --t-15: .9375rem; --t-17: 1.0625rem; --t-20: 1.25rem; --t-24: 1.5rem;
  --t-30: 1.875rem; --t-40: 2.5rem; --t-56: 3.5rem; --t-88: 5.5rem;

  --r-s: 12px; --r-m: 20px; --r-pill: 999px; --r-arche: 999px 999px 20px 20px;

  --ombre-1: 0 1px 2px rgba(42, 27, 25, .05), 0 6px 16px -6px rgba(42, 27, 25, .10);
  --ombre-2: 0 1px 2px rgba(42, 27, 25, .04), 0 12px 28px -10px rgba(42, 27, 25, .16), 0 40px 80px -40px rgba(91, 42, 28, .28);
  /* valeurs posees en ligne (lettres du titre, niveau des flacons) ou par le script (jauge du rayon) */
  --i: 0; --lvl: 1; --p: .2;
  --sortie: cubic-bezier(.16, 1, .3, 1);
  --lent: 1.2s;

  --large: 1240px;
  --gouttiere: clamp(16px, 4vw, 48px);
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.16 0 0 0 0 0.12 0 0 0 0 0.1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
}

/* ---------------------------------------------------------------- socle */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; max-width: 100%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
  margin: 0; max-width: 100%;
  background: var(--lait); color: var(--encre);
  font: 400 var(--t-17)/1.6 var(--f-texte);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  font-variant-numeric: lining-nums;
}
.p-accueil { background:
  radial-gradient(55vw 45vw at 95% 2%, rgba(196, 120, 110, .20), transparent 70%),
  radial-gradient(45vw 40vw at -5% 30%, rgba(214, 170, 168, .28), transparent 70%),
  radial-gradient(60vw 50vw at 100% 70%, rgba(231, 227, 221, .9), transparent 70%),
  var(--lait); }
.p-accueil::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 90;
  background-image: var(--grain); opacity: .22; mix-blend-mode: multiply;
}
.p-article { background: var(--blanc); }
.p-article::after { display: none; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-family: var(--f-titre); font-weight: 500; margin: 0; text-wrap: balance; letter-spacing: -.01em; }
/* Bodoni en grand seulement ; à 24 px et moins, l'axe optique est forcé au plus robuste (opsz 6) et la graisse monte à 600 */
.court { font-family: var(--f-titre-court); font-variation-settings: 'opsz' 6; font-weight: 600; letter-spacing: 0; }
h2 em, h1 em { font-style: italic; font-weight: 400; color: var(--garance); }
p { margin: 0; }
button { font: inherit; color: inherit; cursor: pointer; }
::selection { background: var(--garance); color: var(--lait); }
:focus-visible { outline: 2px solid var(--garance); outline-offset: 3px; }
html { scrollbar-color: var(--argile) transparent; }
input::placeholder { color: var(--encre-2); opacity: 1; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.evitement { position: absolute; left: 16px; top: -60px; z-index: 300; background: var(--encre); color: var(--lait); padding: 10px 16px; border-radius: var(--r-pill); }
.evitement:focus { top: 12px; }

.ic { width: 20px; height: 20px; flex: none; }
.ic-s { width: 16px; height: 16px; }

/* Photographie : un seul étalonnage pour les trente images */
.ph { position: relative; margin: 0; overflow: hidden; border-radius: var(--r-m); background: var(--argile); isolation: isolate; }
.ph img { width: 100%; height: 100%; object-fit: cover; filter: var(--etalon); transition: transform 1.4s var(--sortie), filter .8s var(--sortie); }
.ph::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(238, 210, 200, .11), rgba(155, 58, 39, .08)); mix-blend-mode: multiply; }
.ph::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background-image: var(--grain); opacity: .35; mix-blend-mode: soft-light; }
a:hover .ph img, a:focus-visible .ph img { transform: scale(1.045); filter: sepia(.04) saturate(1) contrast(1.03) brightness(1.04); }
.ph-vide, .planche { display: grid; place-items: center; background: var(--poudre); color: var(--garance); }
.planche { width: 100%; height: 100%; aspect-ratio: inherit; }
.planche svg { width: 48%; }

/* Dessins au compas : tracé révélé au défilement */
.trace circle, .trace path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.js .rv .trace circle, .js .rv .trace path, .js .trace.a-tracer circle, .js .trace.a-tracer path { stroke-dashoffset: 1; transition: stroke-dashoffset 2.4s var(--sortie); }
.js .vu .trace circle, .js .vu .trace path, .js .trace.vu circle, .js .trace.vu path { stroke-dashoffset: 0; }
.trace circle:nth-child(2n), .trace path:nth-child(2n) { transition-delay: .25s; }
.trace circle:nth-child(3n) { transition-delay: .5s; }

/* Révélations : contenu visible par défaut, masqué seulement si le JS tourne */
.js .rv { opacity: 0; transform: translateY(22px); filter: blur(6px); transition: opacity 1s var(--sortie), transform 1.2s var(--sortie), filter 1s var(--sortie); transition-delay: var(--d, 0s); }
.js .rv.vu { opacity: 1; transform: none; filter: none; }

/* Métadonnées */
.meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: var(--t-13); color: var(--encre-2); letter-spacing: .01em; }
.rub-mini { display: inline-flex; align-items: center; gap: 6px; color: var(--garance); font-weight: 600; }
.temps, .meta time { display: inline-flex; align-items: center; gap: 5px; }
.sep-meta { width: 3px; height: 3px; border-radius: var(--r-pill); background: var(--filet-fort); }
.lien-fleche { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: var(--t-15); color: var(--garance); background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; padding-bottom: 2px; transition: background-size .6s var(--sortie), gap .4s var(--sortie); }
.lien-fleche:hover { background-size: 100% 1px; gap: 12px; }

.bouton-rond { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: transparent; color: var(--encre); transition: background .3s, border-color .3s, transform .5s var(--sortie), box-shadow .4s; }
.bouton-rond:hover { background: var(--blanc); border-color: var(--blanc); box-shadow: var(--ombre-1); transform: translateY(-2px); }
.bouton-rond:disabled { opacity: .35; cursor: default; transform: none; box-shadow: none; background: transparent; border-color: var(--filet-fort); }

/* ---------------------------------------------------------------- bandeau défilant */
.defile { overflow: hidden; border-bottom: 1px solid var(--filet); background: var(--poudre); font-size: var(--t-13); }
.defile-piste { display: flex; width: max-content; animation: defile 90s linear infinite; }
.defile:hover .defile-piste, .defile:focus-within .defile-piste { animation-play-state: paused; }
.defile-lot { display: flex; }
.defile a { display: inline-flex; align-items: center; gap: 8px; padding: 9px 28px; white-space: nowrap; color: var(--encre-2); transition: color .3s; }
.defile a .ic { color: var(--garance); }
.defile a:hover { color: var(--encre); }
@keyframes defile { to { transform: translateX(-50%); } }

/* ---------------------------------------------------------------- en-tête */
#sentinelle { position: absolute; top: 0; height: 120px; width: 1px; pointer-events: none; }
.coiffe {
  position: sticky; top: 0; z-index: 100;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px;
  height: 76px; padding-inline: var(--gouttiere);
  background: rgba(245, 235, 231, 0); border-bottom: 1px solid transparent;
  transition: background .5s var(--sortie), border-color .5s, box-shadow .5s;
}
.p-article .coiffe { background: rgba(255, 255, 255, 0); }
.coiffe.pose { background: rgba(245, 235, 231, .86); border-color: var(--filet); box-shadow: 0 10px 30px -22px rgba(42, 27, 25, .4); -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2); }
.p-article .coiffe.pose { background: rgba(255, 255, 255, .9); }
.coiffe-rubs { display: flex; gap: 22px; font-size: var(--t-15); }
.coiffe-rubs a, .lien-contact span { position: relative; padding-block: 6px; }
.coiffe-rubs a::after, .lien-contact span::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--garance); transform: scaleX(0); transform-origin: right; transition: transform .5s var(--sortie); }
.coiffe-rubs a:hover::after, .lien-contact:hover span::after { transform: scaleX(1); transform-origin: left; }
.marque { font-family: var(--f-titre); font-size: var(--t-30); font-weight: 500; letter-spacing: -.02em; line-height: 1; }
.marque i, h1 i, .socle-nom i { font-style: normal; color: var(--garance); }
.coiffe-droite { display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
.lien-contact { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding-inline: 18px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); font-size: var(--t-15); transition: background .3s, border-color .3s; }
.lien-contact:hover { background: var(--blanc); border-color: var(--blanc); }
.burger { display: none; width: 44px; height: 44px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: transparent; place-items: center; }

/* menu mobile plein écran */
.tiroir { position: fixed; inset: 0; z-index: 200; background: var(--lait); display: flex; flex-direction: column; padding: 16px var(--gouttiere) 32px; visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity .45s var(--sortie), transform .6s var(--sortie), visibility 0s .6s; overflow: hidden; }
.tiroir.ouvert { visibility: visible; opacity: 1; transform: none; transition: opacity .45s var(--sortie), transform .6s var(--sortie); }
.tiroir-haut { display: flex; justify-content: space-between; align-items: center; height: 56px; }
.tiroir-fermer { width: 44px; height: 44px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: transparent; display: grid; place-items: center; }
.tiroir-nav { display: flex; flex-direction: column; margin-top: 24px; }
.tiroir-nav a { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--filet); font-family: var(--f-titre); font-size: var(--t-30); color: var(--encre); }
.tiroir-nav a .ic { color: var(--garance); }
.tiroir-nav em { font-family: var(--f-texte); font-style: normal; font-size: var(--t-13); color: var(--encre-2); }
.tiroir-deco { position: absolute; right: -80px; bottom: -80px; width: 320px; color: var(--garance); opacity: .35; }

/* ---------------------------------------------------------------- vitrine */
.vitrine { max-width: var(--large); margin: 0 auto; padding: 40px var(--gouttiere) 96px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 24px; align-items: center; }
.vitrine-texte { grid-column: 1 / 7; padding-top: 24px; }
.vitrine h1 { font-size: var(--t-88); line-height: .95; letter-spacing: -.03em; font-weight: 500; }
.vitrine h1 em { display: block; margin-top: 18px; font-size: var(--t-30); line-height: 1.2; letter-spacing: 0; color: var(--encre-2); }
.chapo { margin-top: 24px; max-width: 30ch; font-size: var(--t-20); line-height: 1.5; color: var(--encre); }
.question { --d: .1s; position: relative; display: flex; align-items: center; margin-top: 36px; max-width: 520px; height: 60px; padding: 6px 6px 6px 20px; border-radius: var(--r-pill); background: var(--blanc); box-shadow: var(--ombre-2); border: 1px solid transparent; transition: border-color .4s, box-shadow .4s; }
.question:focus-within { border-color: var(--garance); box-shadow: 0 0 0 5px var(--garance-voile), var(--ombre-2); }
.question .ic-q { color: var(--garance); }
.question input { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; padding: 0 12px; font: inherit; font-size: var(--t-15); color: var(--encre); outline: none; }
.question button { display: inline-flex; align-items: center; gap: 8px; height: 100%; padding: 0 22px; border: 0; border-radius: var(--r-pill); background: var(--garance); color: var(--lait); font-weight: 600; font-size: var(--t-15); transition: gap .4s var(--sortie), background .3s; }
.question button:hover { gap: 12px; background: #8E3725; }
.pistes { --d: .2s; margin-top: 20px; font-size: var(--t-13); color: var(--encre-2); display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.pistes a { color: var(--encre); border-bottom: 1px solid var(--filet-fort); transition: border-color .3s, color .3s; }
.pistes a:hover { color: var(--garance); border-color: var(--garance); }

.vitrine-objet { grid-column: 7 / 13; position: relative; display: grid; grid-template-columns: 1fr; justify-items: center; }
.vitrine-rosace { position: absolute; width: 560px; top: -60px; left: 50%; margin-left: -280px; color: var(--garance); opacity: .32; z-index: 0; }
.arche { position: relative; z-index: 1; display: block; width: min(440px, 100%); }
.arche-ph { aspect-ratio: 4 / 5; border-radius: var(--r-arche); box-shadow: var(--ombre-2); }
.arche-ph img { animation: arche-entre 2s var(--sortie) both; }
@keyframes arche-entre { from { clip-path: inset(100% 0 0 0); transform: scale(1.18); } to { clip-path: inset(0 0 0 0); transform: scale(1); } }
.medaillon { position: absolute; z-index: 2; left: 0; bottom: 120px; width: 148px; height: 148px; margin: 0; border-radius: var(--r-pill); overflow: hidden; border: 6px solid var(--lait); box-shadow: var(--ombre-2); animation: flotte 9s ease-in-out infinite alternate; }
.medaillon img { width: 100%; height: 100%; object-fit: cover; filter: var(--etalon); }
@keyframes flotte { from { transform: translateY(0) rotate(-2deg); } to { transform: translateY(-14px) rotate(2deg); } }
.arche-legende { position: relative; z-index: 1; width: min(440px, 100%); margin-top: 18px; display: grid; gap: 8px; }
.arche-titre { font-family: var(--f-titre); font-size: var(--t-24); line-height: 1.25; transition: color .3s; }
.arche-titre:hover { color: var(--garance); }

/* ---------------------------------------------------------------- nuancier en fioles */
.nuancier { max-width: var(--large); margin: 0 auto; padding: 0 var(--gouttiere) 120px; }
.nuancier-tete { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding-bottom: 28px; border-bottom: 1px solid var(--filet); }
.nuancier h2 { font-size: var(--t-40); line-height: 1.1; }
.nuancier-tete p { max-width: 36ch; font-size: var(--t-15); color: var(--encre-2); }
.fioles { display: grid; grid-template-columns: repeat(5, 1fr); padding: 8px 0 0; background: var(--verge), linear-gradient(180deg, rgba(231, 227, 221, .0), rgba(231, 227, 221, .8)); border-bottom-left-radius: var(--r-m); border-bottom-right-radius: var(--r-m); }
.fiole { position: relative; display: grid; grid-template-columns: 64px 1fr; grid-template-rows: auto 1fr; gap: 0 18px; padding: 32px 22px 28px; border-right: 1px solid var(--filet); min-height: 330px; transition: background .5s var(--sortie); }
.fiole:last-child { border-right: 0; }
.fiole:hover { background: rgba(255, 255, 255, .55); }
.fiole:nth-child(2) { --d: .08s; } .fiole:nth-child(3) { --d: .16s; } .fiole:nth-child(4) { --d: .24s; } .fiole:nth-child(5) { --d: .32s; }
/* Le flacon d'apothicaire : col, épaule, fond plat, bouchon émeri, étiquette. Le niveau = la part d'articles. */
.fiole-tube { grid-row: 1 / 3; position: relative; width: 64px; height: 232px; display: grid; grid-template-rows: 22px 1fr; justify-items: center; }
.fiole-bouchon { position: relative; z-index: 2; width: 22px; height: 24px; margin-bottom: -4px; border-radius: var(--r-arche); background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .95), rgba(231, 227, 221, .7) 45%, rgba(155, 58, 39, .25)); box-shadow: inset 0 0 0 1px rgba(42, 27, 25, .28), 0 2px 3px rgba(42, 27, 25, .12); }
.fiole-verre { position: relative; width: 64px; height: 100%; isolation: isolate; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 150' preserveAspectRatio='none'%3E%3Cpath d='M23 0 H37 V22 C37 30 57 34 57 52 V140 Q57 150 47 150 H13 Q3 150 3 140 V52 C3 34 23 30 23 22 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 150' preserveAspectRatio='none'%3E%3Cpath d='M23 0 H37 V22 C37 30 57 34 57 52 V140 Q57 150 47 150 H13 Q3 150 3 140 V52 C3 34 23 30 23 22 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  background: linear-gradient(90deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, .25) 35%, rgba(255, 255, 255, .45) 80%, rgba(231, 227, 221, .6)); }
.fiole-liquide { position: absolute; left: 0; right: 0; bottom: 0; height: 100%; transform: translateY(calc((1 - var(--lvl) * .78) * 100%)); background: linear-gradient(90deg, rgba(255, 255, 255, .22), transparent 50%), linear-gradient(180deg, rgba(214, 140, 122, .8), rgba(155, 58, 39, .9) 70%); transition: transform 2.6s cubic-bezier(.2, .9, .2, 1); transition-delay: calc(var(--d, 0s) + .3s); }
.fiole-liquide::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: rgba(255, 236, 228, .75); }
.fiole:hover .fiole-liquide { transform: translateY(calc((1 - var(--lvl) * .78) * 100% - 5px)); transition-duration: .9s; transition-delay: 0s; }
.js .fiole:not(.vu) .fiole-liquide { transform: translateY(100%); }
.fiole-reflet { position: absolute; left: 10px; top: 42%; bottom: 10%; width: 5px; border-radius: var(--r-pill); background: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .1)); z-index: 2; }
.fiole-trait { position: absolute; left: 0; top: 22px; width: 64px; height: calc(100% - 22px); fill: none; stroke: rgba(42, 27, 25, .38); stroke-width: 1; vector-effect: non-scaling-stroke; z-index: 3; pointer-events: none; overflow: visible; }
.fiole-etiquette { position: absolute; z-index: 4; left: 9px; right: 9px; top: 58%; display: grid; justify-items: center; padding: 5px 2px 4px; border-radius: 0; background: var(--verge), var(--soie); box-shadow: 0 0 0 1px rgba(42, 27, 25, .18), 0 2px 4px rgba(42, 27, 25, .1); line-height: 1; }
.fiole-etiquette .compte { font-family: var(--f-titre); font-variation-settings: 'opsz' 6; font-weight: 600; font-size: var(--t-17); color: var(--encre); font-variant-numeric: lining-nums tabular-nums; }
.fiole-etiquette small { font-size: 9px; letter-spacing: .08em; color: var(--encre-2); margin-top: 2px; }
.fiole-ombre { position: absolute; left: 50%; bottom: -8px; width: 76px; height: 12px; margin-left: -38px; border-radius: var(--r-pill); background: radial-gradient(closest-side, rgba(94, 34, 25, .22), transparent); z-index: -1; }
.fiole-txt { display: grid; gap: 8px; align-content: start; }
.fiole-ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-pill); background: var(--blanc); color: var(--garance); box-shadow: var(--ombre-1); margin-bottom: 6px; transition: transform .6s var(--sortie); }
.fiole:hover .fiole-ico { transform: rotate(-12deg) scale(1.06); }
.fiole b { font-family: var(--f-titre); font-weight: 500; font-size: var(--t-24); line-height: 1.15; }
.fiole-n { font-size: var(--t-13); color: var(--encre-2); font-variant-numeric: tabular-nums; }
.fiole-n .compte { color: var(--encre); font-weight: 600; }
.fiole-d { margin-top: 6px; font-size: var(--t-15); line-height: 1.45; color: var(--encre-2); }
.fiole-fleche { position: absolute; right: 18px; top: 32px; color: var(--garance); opacity: 0; transform: translate(-6px, 6px); transition: opacity .4s, transform .5s var(--sortie); }
.fiole:hover .fiole-fleche { opacity: 1; transform: none; }

/* ---------------------------------------------------------------- fraîchement publiés */
.frais { max-width: var(--large); margin: 0 auto; padding: 0 var(--gouttiere) 128px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 24px; }
.frais > h2 { grid-column: 1 / -1; font-size: var(--t-56); line-height: 1.05; margin-bottom: 48px; }
.frais h3 { font-size: var(--t-30); line-height: 1.15; margin: 12px 0 12px; }
.frais h3 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .7s var(--sortie); }
.frais h3 a:hover { background-size: 100% 1px; }
.frais article p:not(.meta) { font-size: var(--t-17); color: var(--encre-2); max-width: 46ch; }
.frais-grand { grid-column: 1 / 8; }
.frais-grand .frais-txt { position: relative; margin: -72px 40px 0 40px; padding: 28px 32px 32px; background: var(--lait); border-radius: var(--r-m); box-shadow: var(--ombre-2); z-index: 3; }
.frais-moyen { grid-column: 9 / 13; margin-top: 96px; }
.frais-moyen .ph { margin-bottom: 18px; }
.frais-moyen h3 { font-size: var(--t-24); }
.frais-mot { grid-column: 4 / 11; margin-top: 72px; display: grid; grid-template-columns: 200px 1fr; gap: 32px; align-items: center; padding: 28px; border-radius: var(--r-m); border: 1px solid var(--filet); background: rgba(255, 255, 255, .5); }
.frais-rond .ph { border-radius: var(--r-pill); }
.frais-mot .lien-fleche { margin-top: 14px; }
.frais-mot h3 { font-size: var(--t-24); }

/* ---------------------------------------------------------------- le rayon */
.rayon { padding: 0 0 128px; }
.rayon-tete { max-width: var(--large); margin: 0 auto 32px; padding: 0 var(--gouttiere); display: flex; justify-content: space-between; align-items: end; }
.rayon h2 { font-size: var(--t-40); }
.rayon-ctrl { display: flex; gap: 10px; }
.rayon-piste { list-style: none; margin: 0; padding: 12px max(var(--gouttiere), calc((100vw - var(--large)) / 2 + var(--gouttiere))) 28px; display: grid; grid-auto-flow: column; grid-auto-columns: 292px; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--gouttiere), calc((100vw - var(--large)) / 2 + var(--gouttiere))); scrollbar-width: none; }
.rayon-piste::-webkit-scrollbar { display: none; }
.rayon-item { scroll-snap-align: start; }
.rayon-item a { display: grid; gap: 10px; }
.rayon-plateau { display: block; padding: 14px; border-radius: var(--r-m); background: var(--poudre); box-shadow: inset 0 0 0 1px var(--filet); transition: transform .7s var(--sortie), box-shadow .7s var(--sortie), background .5s; }
.rayon-plateau .ph { border-radius: var(--r-s); }
.rayon-item a:hover .rayon-plateau { transform: translateY(-6px); background: var(--blanc); box-shadow: var(--ombre-2); }
.rayon-item .meta { margin-top: 8px; }
.rayon-item b { font-family: var(--f-titre); font-weight: 500; font-size: var(--t-20); line-height: 1.25; }
.rayon-date { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-13); color: var(--encre-2); }
.rayon-jauge { max-width: calc(var(--large) - 2 * var(--gouttiere)); margin: 0 auto; height: 1px; background: var(--filet); position: relative; width: calc(100% - 2 * var(--gouttiere)); }
.rayon-jauge span { position: absolute; left: 0; top: -1px; height: 3px; border-radius: var(--r-pill); width: 100%; background: var(--garance); transform-origin: left; transform: scaleX(var(--p, .2)); transition: transform .8s var(--sortie); }

/* ---------------------------------------------------------------- le petit test */
.test { padding: 0 var(--gouttiere) 128px; }
.test-in { max-width: var(--large); margin: 0 auto; display: grid; grid-template-columns: 5fr 7fr; align-items: center; gap: 48px; padding: 48px 64px; border-radius: var(--r-m); background: linear-gradient(135deg, var(--lait), var(--poudre)); box-shadow: inset 0 0 0 1px var(--filet), var(--ombre-1); position: relative; overflow: hidden; }
.test-in::after { content: ""; position: absolute; inset: 0; background-image: var(--grain); opacity: .25; mix-blend-mode: multiply; pointer-events: none; }
.test-dessin { color: var(--garance); }
.test-dessin svg { width: 100%; max-width: 380px; }
.test h2 { font-size: var(--t-40); }
.test-q { margin-top: 12px; font-family: var(--f-titre); font-size: var(--t-24); font-style: italic; }
.test-choix { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; position: relative; z-index: 1; }
.test-choix button { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 20px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: rgba(255, 255, 255, .6); font-size: var(--t-15); transition: background .3s, color .3s, border-color .3s, transform .5s var(--sortie), box-shadow .4s; }
.test-choix button .ic { color: var(--garance); transition: color .3s; }
.test-choix button:hover { background: var(--blanc); transform: translateY(-2px); box-shadow: var(--ombre-1); }
.test-choix button[aria-pressed="true"] { background: var(--encre); color: var(--lait); border-color: var(--encre); }
.test-choix button[aria-pressed="true"] .ic { color: var(--lait); }
.test-sortie { position: relative; z-index: 1; margin-top: 22px; min-height: 92px; }
.test-sortie p { max-width: 52ch; font-size: var(--t-17); animation: sortie-test .8s var(--sortie) both; }
.test-sortie p[hidden] { display: none; }
.test-sortie .lien-fleche { margin-top: 12px; }
@keyframes sortie-test { from { opacity: 0; transform: translateY(10px); filter: blur(4px); } }

/* ---------------------------------------------------------------- le journal */
.journal { max-width: var(--large); margin: 0 auto; padding: 0 var(--gouttiere) 128px; display: grid; grid-template-columns: 4fr 8fr; gap: 56px; align-items: start; }
.journal-cote { position: sticky; top: 100px; display: grid; gap: 18px; }
.journal h2 { font-size: var(--t-40); line-height: 1.1; }
.journal-cote p { font-size: var(--t-15); color: var(--encre-2); max-width: 34ch; }
.filtres { display: flex; flex-wrap: wrap; gap: 8px; }
.filtres button { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: transparent; font-size: var(--t-13); transition: background .3s, color .3s, border-color .3s; }
.filtres button .ic { color: var(--garance); }
.filtres button:hover { background: var(--blanc); border-color: var(--blanc); }
.filtres button[aria-pressed="true"] { background: var(--encre); border-color: var(--encre); color: var(--lait); }
.filtres button[aria-pressed="true"] .ic { color: var(--lait); }
.lignes { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--filet-fort); }
.ligne { border-bottom: 1px solid var(--filet); transition: opacity .5s var(--sortie); }
.ligne.cache { display: none; }
.ligne a { display: grid; grid-template-columns: 92px 1fr auto 24px; align-items: center; gap: 20px; padding: 20px 4px; transition: background .4s; }
.ligne-corps { transition: transform .6s var(--sortie); }
.ligne time { font-size: var(--t-13); color: var(--encre-2); font-variant-numeric: tabular-nums; }
.ligne-vignette { display: none; }
.ligne-corps { display: grid; gap: 4px; }
.ligne-corps .rub-mini { font-size: var(--t-13); }
.ligne-corps b { font-family: var(--f-titre); font-weight: 500; font-size: var(--t-20); line-height: 1.3; transition: color .3s; }
.ligne .temps { font-size: var(--t-13); color: var(--encre-2); white-space: nowrap; }
.ligne-fleche { color: var(--garance); opacity: .35; transition: opacity .3s, transform .5s var(--sortie); }
.ligne a:hover .ligne-corps { transform: translateX(10px); }
.ligne a:hover { background: linear-gradient(90deg, rgba(255, 255, 255, .7), transparent); }
.ligne a:hover b { color: var(--garance); }
.ligne a:hover .ligne-fleche { opacity: 1; transform: rotate(45deg); }
.journal-vue { margin: 14px 0 0; }
.journal-vue .ph { aspect-ratio: 4 / 5; border-radius: var(--r-arche); box-shadow: var(--ombre-2); }
.journal-vue img { transition: opacity .25s ease, transform 1.4s var(--sortie), filter .8s; }
.journal-vue figcaption { margin-top: 12px; font-family: var(--f-titre); font-style: italic; font-size: var(--t-17); line-height: 1.35; color: var(--encre-2); transition: opacity .25s; min-height: 2.7em; }
.journal-vue.change img, .journal-vue.change figcaption { opacity: 0; }

/* ---------------------------------------------------------------- la rédaction */
.redaction { max-width: 760px; margin: 0 auto; padding: 0 var(--gouttiere) 136px; text-align: center; display: grid; justify-items: center; gap: 22px; }
.sceau { position: relative; width: 168px; height: 168px; display: grid; place-items: center; }
.sceau-texte { position: absolute; inset: 0; animation: tourne 48s linear infinite; }
.sceau-texte text { font-family: var(--f-texte); font-size: 12.4px; letter-spacing: .14em; text-transform: uppercase; fill: var(--encre-2); }
.sceau-l { display: grid; place-items: center; width: 92px; height: 92px; border-radius: var(--r-pill); background: var(--garance); color: var(--lait); font-family: var(--f-titre); font-style: italic; font-size: var(--t-40); box-shadow: var(--ombre-2); }
@keyframes tourne { to { transform: rotate(360deg); } }
.redaction h2 { font-size: var(--t-40); }
.redaction-txt { display: grid; gap: 14px; font-size: var(--t-20); line-height: 1.6; }
.redaction-txt p:last-child { font-size: var(--t-17); color: var(--encre-2); }
.redaction-liens { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }
.redaction-liens a { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: var(--r-pill); background: var(--blanc); box-shadow: var(--ombre-1); font-size: var(--t-15); transition: transform .5s var(--sortie), box-shadow .4s; }
.redaction-liens a .ic { color: var(--garance); }
.redaction-liens a:hover { transform: translateY(-3px); box-shadow: var(--ombre-2); }

/* ---------------------------------------------------------------- pied de page */
.socle { background: var(--poudre); border-top: 1px solid var(--filet); overflow: hidden; position: relative; }
.p-article .socle { background: var(--lait); }
.socle-in { max-width: var(--large); margin: 0 auto; padding: 80px var(--gouttiere) 48px; display: grid; grid-template-columns: 7fr 5fr; gap: 64px; }
.socle-phrase { font-family: var(--f-titre); font-size: var(--t-30); line-height: 1.3; }
.socle-titre { font-size: var(--t-13); font-weight: 600; color: var(--encre-2); margin-bottom: 12px; }
.socle-derniers ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.socle-derniers a { display: grid; grid-template-columns: 48px 1fr; gap: 14px; align-items: center; padding: 8px; margin-inline: -8px; border-radius: var(--r-s); transition: background .3s; }
.socle-derniers a:hover { background: rgba(255, 255, 255, .6); }
.socle-derniers img, .pastille-vide { width: 48px; height: 48px; border-radius: var(--r-pill); object-fit: cover; filter: var(--etalon); background: var(--argile); display: block; }
.socle-derniers b { display: block; font-weight: 500; font-size: var(--t-15); line-height: 1.35; }
.socle-derniers small { font-size: var(--t-13); color: var(--encre-2); }
.socle-ligne { max-width: var(--large); margin: 0 auto; padding: 22px var(--gouttiere); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; border-top: 1px solid var(--filet); font-size: var(--t-15); }
.socle-ligne nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.socle-ligne a:hover { color: var(--garance); }
.socle-ligne p { color: var(--encre-2); }
.socle-nom { margin: 0; text-align: center; line-height: .8; height: 15vw; overflow: hidden; }
.socle-nom span { display: inline-block; font-family: var(--f-titre); font-size: 21vw; letter-spacing: -.04em; color: var(--argile); transform: translateY(18%); }
.socle-nom i { color: rgba(155, 58, 39, .28); }

/* ---------------------------------------------------------------- article */
.lecture { max-width: calc(900px + 2 * var(--gouttiere)); margin: 0 auto; padding: 32px var(--gouttiere) 96px; }
.lecture-repere { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; padding-bottom: 16px; border-bottom: 1px solid var(--filet); font-size: var(--t-13); color: var(--encre-2); }
.ariane { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ariane a:hover { color: var(--garance); }
.ic-ariane { transform: rotate(-90deg); opacity: .6; }
.ariane span { color: var(--encre); }
.lecture-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.lecture-meta time, .lecture-meta .temps { display: inline-flex; align-items: center; gap: 6px; }
.etoiles { display: inline-flex; align-items: center; gap: 1px; }
.etoile { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; background: none; color: var(--garance); transition: transform .3s var(--sortie); }
.etoile.pleine svg path { fill: var(--garance); }
.etoile.demi svg path { fill: var(--garance-voile); }
.etoiles:hover .etoile svg path { fill: var(--garance); }
.etoiles .etoile:hover ~ .etoile svg path { fill: none; }
.etoile:hover { transform: scale(1.2); }
.etoiles-n { margin-left: 6px; color: var(--encre); font-weight: 600; }
.rub-pastille { display: inline-flex; align-items: center; gap: 8px; margin-top: 36px; height: 34px; padding: 0 14px; border-radius: var(--r-pill); background: var(--garance-voile); color: var(--garance); font-size: var(--t-13); font-weight: 600; }
.lecture h1 { margin-top: 18px; font-size: var(--t-56); line-height: 1.06; letter-spacing: -.02em; }
.lecture-chapo { margin-top: 22px; font-size: var(--t-24); line-height: 1.45; font-family: var(--f-titre); font-style: italic; color: var(--encre); max-width: 40ch; }
.lecture-signe { display: flex; align-items: center; gap: 12px; margin-top: 24px; font-size: var(--t-15); color: var(--encre-2); }
.lecture-signe a { color: var(--encre); font-weight: 600; border-bottom: 1px solid var(--filet-fort); }
.mono { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--r-pill); background: var(--garance); color: var(--lait); font-family: var(--f-titre); font-style: italic; font-size: var(--t-20); flex: none; }
.mono-g { width: 72px; height: 72px; font-size: var(--t-40); }
.resume-ia { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 22px; font-size: var(--t-13); color: var(--encre-2); }
.resume-ia span { display: inline-flex; align-items: center; gap: 6px; margin-right: 4px; }
.resume-ia span .ic { color: var(--garance); }
.resume-ia a { height: 32px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); color: var(--encre); transition: background .3s, border-color .3s; }
.resume-ia a:hover { background: var(--poudre); border-color: var(--poudre); }
.une { margin: 32px 0 0; }
.une-ph { aspect-ratio: 3 / 2; box-shadow: var(--ombre-2); }
.une figcaption { margin-top: 12px; font-size: var(--t-13); color: var(--encre-2); }
.sommaire { margin-top: 36px; border-radius: var(--r-m); background: var(--lait); box-shadow: inset 0 0 0 1px var(--filet); }
.sommaire summary { display: flex; align-items: center; gap: 10px; padding: 18px 22px; cursor: pointer; list-style: none; font-weight: 600; font-size: var(--t-15); }
.sommaire summary::-webkit-details-marker { display: none; }
.sommaire summary .ic { color: var(--garance); }
.sommaire summary span { flex: 1; }
.ic-ouvre { transition: transform .5s var(--sortie); }
.sommaire[open] .ic-ouvre { transform: rotate(180deg); }
.sommaire ol { margin: 0; padding: 0 22px 20px 44px; display: grid; gap: 8px; font-size: var(--t-15); }
.sommaire ol a:hover { color: var(--garance); }

/* corps : pleine largeur du conteneur, seuls les paragraphes sont plafonnés */
.prose { margin-top: 40px; font-size: var(--t-17); line-height: 1.75; }
.prose > p, .prose > ul > li { max-width: 68ch; }
.prose > p + p { margin-top: 1.1em; }
.prose h2 { margin: 64px 0 18px; font-size: var(--t-30); line-height: 1.2; }
.prose h3 { font-size: var(--t-20); }
.prose a { color: var(--garance); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: rgba(155, 58, 39, .4); transition: text-decoration-color .3s; }
.prose a:hover { text-decoration-color: var(--garance); }
.prose strong { font-weight: 600; }
.prose > ul { margin: 18px 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.prose > ul > li { position: relative; padding-left: 26px; }
.prose > ul > li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: var(--r-pill); border: 1px solid var(--garance); }
.prose [class$="-img"] { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; margin: 36px 0; border-radius: var(--r-m); filter: var(--etalon); }

/* bloc à retenir */
.prose [class$="-key"] { margin: 0 0 40px; border-radius: var(--r-m); background: var(--lait); box-shadow: inset 0 0 0 1px var(--filet); overflow: hidden; }
.prose [class$="-key-bar"] { height: 4px; background: linear-gradient(90deg, var(--garance), rgba(155, 58, 39, .25)); }
.prose [class$="-key-in"] { padding: 28px 32px 22px; }
.prose [class$="-key-top"] { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.prose [class$="-kick"] { display: none; }
.prose [class$="-key-top"] { justify-content: flex-start; margin-bottom: 14px; }
.prose [class$="-badge"] { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: var(--r-pill); background: var(--blanc); font-size: var(--t-13); font-weight: 600; color: var(--encre); box-shadow: var(--ombre-1); }
.prose [class$="-badge"]::before { content: ""; width: 15px; height: 15px; background: var(--garance); -webkit-mask: var(--m-bouclier) center / contain no-repeat; mask: var(--m-bouclier) center / contain no-repeat; }
.prose [class$="-key-h"] { font-family: var(--f-titre); font-size: var(--t-24); line-height: 1.25; margin-bottom: 14px; }
.prose [class$="-key"] ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.prose [class$="-key"] li { position: relative; padding: 8px 0 8px 36px; font-size: var(--t-17); line-height: 1.55; }
.prose [class$="-key"] li::before { content: ""; position: absolute; left: 0; top: 50%; margin-top: -10px; width: 20px; height: 20px; border-radius: var(--r-pill); background: rgba(155, 58, 39, .2); }
.prose [class$="-key"] li::after { content: ""; position: absolute; left: 3px; top: 50%; margin-top: -5px; width: 14px; height: 10px; background: var(--garance); -webkit-mask: var(--m-coche) center / contain no-repeat; mask: var(--m-coche) center / contain no-repeat; }
.prose [class$="-foot"] { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--filet); font-size: var(--t-13); color: var(--encre-2); }
.prose [class$="-foot"] span { display: inline-flex; align-items: center; gap: 6px; }
.prose [class$="-foot"] span::before { content: ""; width: 14px; height: 14px; background: var(--garance); -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; }
.prose [class$="-foot"] span:nth-child(1)::before { -webkit-mask-image: var(--m-bouclier); mask-image: var(--m-bouclier); }
.prose [class$="-foot"] span:nth-child(2)::before { -webkit-mask-image: var(--m-sources); mask-image: var(--m-sources); }
.prose [class$="-foot"] span:nth-child(3)::before { -webkit-mask-image: var(--m-maj); mask-image: var(--m-maj); }

/* cartes de la chaîne : rangée asymétrique, jamais trois égales */
.prose [class$="-grid"] { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 14px; margin: 0 0 48px; }
.prose [class$="-card"] { padding: 24px 22px; border-radius: var(--r-m); background: var(--blanc); box-shadow: inset 0 0 0 1px var(--filet), var(--ombre-1); transition: transform .6s var(--sortie), box-shadow .6s var(--sortie); }
.prose [class$="-card"]:first-child { background: var(--lait); }
.prose [class$="-card"]:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px var(--filet), var(--ombre-2); }
.prose [class$="-num"] { display: none; }
.prose [class$="-ico"] { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-pill); background: var(--garance-voile); color: var(--garance); margin-bottom: 14px; }
.prose [class$="-ico"] svg { width: 22px; height: 22px; stroke-width: 1.5; }
.prose [class$="-card-t"] { font-family: var(--f-titre); font-size: var(--t-20); line-height: 1.25; margin-bottom: 6px; }
.prose [class$="-card-x"] { font-size: var(--t-15); line-height: 1.55; color: var(--encre-2); }

/* encadrés */
.prose [class$="-quote"] { position: relative; margin: 32px 0; padding: 22px 26px 22px 64px; border-radius: var(--r-m); background: var(--lait); font-size: var(--t-17); line-height: 1.6; }
.prose [class$="-quote"]::before { content: ""; position: absolute; left: 22px; top: 50%; margin-top: -11px; width: 22px; height: 22px; background: var(--garance); -webkit-mask: var(--m-alerte) center / contain no-repeat; mask: var(--m-alerte) center / contain no-repeat; }
.prose [class$="-quote"]:nth-of-type(2)::before { -webkit-mask-image: var(--m-idee); mask-image: var(--m-idee); }

/* tableau */
.prose [class$="-tab"] { width: 100%; margin: 24px 0 32px; border-collapse: separate; border-spacing: 0; font-size: var(--t-15); border-radius: var(--r-m); overflow: hidden; box-shadow: inset 0 0 0 1px var(--filet); }
.prose [class$="-tab"] th { text-align: left; padding: 14px 18px; background: var(--lait); font-weight: 600; font-size: var(--t-13); color: var(--encre); }
.prose [class$="-tab"] td { padding: 14px 18px; border-top: 1px solid var(--filet); vertical-align: top; line-height: 1.5; }
.prose [class$="-tab"] td:first-child { font-family: var(--f-titre); font-size: var(--t-17); }
.prose [class$="-tab"] tbody tr { transition: background .3s; }
.prose [class$="-tab"] tbody tr:hover { background: rgba(238, 227, 220, .45); }

/* FAQ */
.prose [class$="-faq"] { display: grid; gap: 10px; }
.prose [class$="-q"] { border-radius: var(--r-m); box-shadow: inset 0 0 0 1px var(--filet); background: var(--blanc); transition: background .4s, box-shadow .4s; }
.prose [class$="-q"][open] { background: var(--lait); }
.prose [class$="-q"] summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; cursor: pointer; list-style: none; }
.prose [class$="-q"] summary::-webkit-details-marker { display: none; }
.prose [class$="-q"] summary h3 { font-size: var(--t-20); font-weight: 500; }
.prose [class$="-q"] summary::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--garance); -webkit-mask: var(--m-plus) center / contain no-repeat; mask: var(--m-plus) center / contain no-repeat; transition: transform .5s var(--sortie); }
.prose [class$="-q"][open] summary::after { transform: rotate(180deg); }
.prose [class$="-q"] p { padding: 0 22px 20px; max-width: 68ch; color: var(--encre-2); }

/* quiz de la chaîne */
.prose [class$="-tool"] { margin: 48px 0; padding: 32px; border-radius: var(--r-m); background: linear-gradient(135deg, var(--lait), var(--poudre)); box-shadow: inset 0 0 0 1px var(--filet); }
.prose [class$="-tool"] [class$="-key-h"] { font-style: italic; }
.prose [class$="-pick"] { display: flex; flex-wrap: wrap; gap: 10px; }
.prose [class$="-pick"] button { height: 46px; padding: 0 20px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); background: var(--blanc); font-size: var(--t-15); transition: background .3s, color .3s, transform .5s var(--sortie), box-shadow .4s; }
.prose [class$="-pick"] button:hover { transform: translateY(-2px); box-shadow: var(--ombre-1); }
.prose [class$="-pick"] button.on { background: var(--encre); color: var(--lait); border-color: var(--encre); }
.prose [class$="-out"] p { padding: 4px 0 0; font-size: var(--t-17); }

/* sources */
.prose [class$="-src"] { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--filet-fort); }
.prose [class$="-src"] h2 { margin: 0 0 16px; font-size: var(--t-24); display: flex; align-items: center; gap: 10px; }
.prose [class$="-src"] h2::before { content: ""; width: 22px; height: 22px; background: var(--garance); -webkit-mask: var(--m-sources) center / contain no-repeat; mask: var(--m-sources) center / contain no-repeat; }
.prose [class$="-src"] ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.prose [class$="-src"] li { display: grid; grid-template-columns: 200px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--filet); font-size: var(--t-15); }
.prose [class$="-tag"] { font-size: var(--t-13); font-weight: 600; color: var(--encre-2); }
.prose [class$="-src"] a { text-decoration: none; color: var(--encre); display: inline-flex; gap: 8px; }
.prose [class$="-src"] a::after { content: ""; flex: none; width: 14px; height: 14px; margin-top: 4px; background: var(--garance); -webkit-mask: var(--m-lien) center / contain no-repeat; mask: var(--m-lien) center / contain no-repeat; }
.prose [class$="-src"] a:hover { color: var(--garance); }

/* bloc auteur */
.auteur { display: grid; grid-template-columns: 72px 1fr; gap: 22px; margin-top: 64px; padding: 28px; border-radius: var(--r-m); background: var(--lait); }
.auteur-nom { font-family: var(--f-titre); font-size: var(--t-24); margin-bottom: 6px; }
.auteur p { font-size: var(--t-15); color: var(--encre-2); max-width: 64ch; }
.auteur-liens { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 14px; }
.auteur-liens a { display: inline-flex; align-items: center; gap: 6px; color: var(--encre); font-weight: 600; }
.auteur-liens a .ic { color: var(--garance); }
.auteur-liens a:hover { color: var(--garance); }

/* articles similaires : un grand, deux petits */
.voisins { padding: 0 var(--gouttiere) 112px; }
.voisins-in { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: 7fr 5fr; grid-template-rows: auto auto 1fr; gap: 20px 40px; }
.voisins h2 { grid-column: 1 / -1; font-size: var(--t-40); margin-bottom: 16px; }
.voisins h3 { font-size: var(--t-24); line-height: 1.2; margin-top: 8px; }
.voisins h3 a:hover { color: var(--garance); }
.voisin-grand { grid-row: 2 / 4; display: grid; gap: 16px; align-content: start; }
.voisin-petit { align-self: start; display: grid; grid-template-columns: 140px 1fr; gap: 20px; align-items: center; padding-bottom: 20px; border-bottom: 1px solid var(--filet); }
.voisin-petit h3 { font-size: var(--t-20); }

/* ================================================================ finition */

/* Titres courts (24 px et moins) : Bodoni en corps optique robuste */
.ligne-corps b, .rayon-item b, .arche-titre, .frais-moyen h3, .frais-mot h3, .voisins h3, .fiole b, .socle-phrase,
.prose [class$="-card-t"], .prose [class$="-q"] summary h3, .prose [class$="-tab"] td:first-child, .auteur-nom, .prose [class$="-key-h"], .frais h3 {
  font-variation-settings: 'opsz' 6; font-weight: 600; letter-spacing: 0;
}
.ligne-corps b { font-size: var(--t-20); line-height: 1.32; }
.rayon-item b { font-size: var(--t-20); line-height: 1.3; }
.socle-phrase { font-weight: 500; }

/* Vitrine : lettres qui montent, papier vergé, cerne qui se trace, parallaxe pilotée par le défilement CSS */
.titre-vitrine { font-size: var(--t-88); line-height: .95; letter-spacing: -.03em; font-weight: 500; }
.lettres { display: inline-flex; overflow: hidden; padding: 0 .04em .12em; margin: 0 -.04em -.12em; }
.lettres > * { display: inline-block; font-style: normal; animation: lettre 1.3s var(--sortie) both; animation-delay: calc(.15s + var(--i) * .07s); }
@keyframes lettre { from { transform: translateY(105%) rotate(6deg); opacity: 0; } }
.titre-vitrine em { animation: monte 1.2s var(--sortie) .75s both; }
.chapo, .question, .pistes { animation: monte 1.2s var(--sortie) both; }
.chapo { animation-delay: .9s; } .question { animation-delay: 1.02s; } .pistes { animation-delay: 1.14s; }
@keyframes monte { from { opacity: 0; transform: translateY(16px); filter: blur(4px); } }
.vitrine-papier { position: absolute; z-index: 0; left: 14%; right: -6%; top: 9%; bottom: 13%; border-radius: var(--r-m); background: var(--verge), var(--soie); box-shadow: var(--ombre-1); color: var(--garance); display: grid; place-items: end; overflow: hidden; animation: monte 1.6s var(--sortie) .2s both; }
.vitrine-papier svg { width: 300px; margin: 0 -70px -70px 0; opacity: .55; }
.arche { isolation: isolate; }
.arche-cerne { position: absolute; overflow: visible; inset: -14px; width: calc(100% + 28px); height: calc(100% + 28px); fill: none; stroke: var(--garance); stroke-width: 1; vector-effect: non-scaling-stroke; z-index: 3; pointer-events: none; stroke-dasharray: 1; stroke-dashoffset: 1; animation: cerne 2.8s var(--sortie) .6s forwards; }
@keyframes cerne { to { stroke-dashoffset: 0; } }
.fige .arche-cerne { stroke-dashoffset: 0; }
.arche-ph { aspect-ratio: 4 / 5.2; }
.arche-ph img { object-position: 60% 80%; }
@supports (animation-timeline: view()) {
  .arche-ph img { animation: arche-entre 2s var(--sortie) both, derive linear both; animation-timeline: auto, view(); animation-range: normal, cover 0% cover 100%; }
  @keyframes derive { from { object-position: 60% 70%; } to { object-position: 60% 95%; } }
}
.medaillon { border-color: var(--soie); }

/* Fraîchement publiés : cartouche sur papier soie */
.frais-grand .frais-txt { background: var(--verge), var(--soie); }
.frais-mot { background: var(--verge), rgba(231, 227, 221, .7); }

/* Le rayon : plateaux de papier soie vergé */
.rayon-plateau { background: var(--verge), var(--soie); }

/* Le petit test : plaque garance profonde, le seul aplat sombre de la page */
.test-in { background: radial-gradient(70% 90% at 15% 50%, rgba(180, 82, 58, .45), transparent 70%), var(--profond); color: var(--lait); box-shadow: var(--ombre-2); }
.test-in::after { mix-blend-mode: soft-light; opacity: .5; }
.test h2 em { color: var(--rose); }
.test-q { color: var(--rose); }
.test-dessin { color: var(--rose); }
.test-choix button { border-color: rgba(245, 235, 231, .35); background: rgba(245, 235, 231, .06); color: var(--lait); }
.test-choix button .ic { color: var(--rose); }
.test-choix button:hover { background: rgba(245, 235, 231, .14); box-shadow: none; }
.test-choix button[aria-pressed="true"] { background: var(--lait); color: var(--profond); border-color: var(--lait); }
.test-choix button[aria-pressed="true"] .ic { color: var(--garance); }
.test .lien-fleche { color: var(--lait); }
.test :focus-visible { outline-color: var(--rose); }

/* Le journal : neuf lignes face à la colonne, les neuf suivantes en deux colonnes pleine largeur */
.journal { grid-template-columns: 4fr 8fr; }
.journal-cote { position: static; }
.lignes-b { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 56px; border-top: 0; margin-top: -24px; }
.lignes-b .ligne a { grid-template-columns: 104px 1fr 24px; }
.lignes-b .ligne .temps { display: none; }
.lignes-b .ligne:nth-child(-n+2) { border-top: 1px solid var(--filet-fort); }

/* Pied de page : second papier */
.socle { background: var(--verge), var(--soie); }
.socle-nom span { color: rgba(155, 58, 39, .14); }
.socle-nom i { color: rgba(155, 58, 39, .32); }


/* Le titre vient toujours en premier ; rubrique, date et temps de lecture dessous */
.frais-txt, .frais-moyen, .frais-mot > div, .voisin-grand > div, .voisin-petit > div, .arche-legende, .rayon-item a, .ligne-corps { display: flex; flex-direction: column; }
.frais-txt h3, .frais-moyen h3, .frais-mot h3, .voisins h3, .arche-titre, .rayon-item b, .ligne-corps b { order: -1; }
.frais-moyen > a:first-child, .rayon-plateau { order: -2; }
.frais h3 { margin: 0 0 10px; }
.frais-txt .meta, .frais-moyen .meta, .frais-mot .meta { margin-bottom: 12px; }
.frais-moyen > a:first-child { margin-bottom: 18px; }
.rayon-item a { gap: 8px; } .rayon-item b { margin-top: 6px; }
.ligne-corps { gap: 6px; }
.voisins h3 { margin: 0 0 8px; }
.arche-legende { gap: 8px; }

/* Trio de l'article : trois colonnes de texte séparées d'un filet, sans boîte */
.prose [class$="-grid"] { grid-template-columns: repeat(3, 1fr); gap: 0; margin: 8px 0 48px; padding: 4px 0; border-block: 1px solid var(--filet); }
.prose [class$="-card"], .prose [class$="-card"]:first-child { padding: 18px 22px; border-radius: 0; background: none; box-shadow: none; transform: none; }
.prose [class$="-card"]:hover { transform: none; box-shadow: none; }
.prose [class$="-card"] + [class$="-card"] { border-left: 1px solid var(--filet); }
.prose [class$="-card"]:first-child { padding-left: 0; }
.prose [class$="-ico"] { display: none; }
.prose [class$="-card-t"] { font-size: var(--t-20); }

/* Mouvement : trois moments signés, le reste est calme */
.defile-piste { animation: none; width: auto; }
.defile { -webkit-mask: linear-gradient(90deg, #000 85%, transparent); mask: linear-gradient(90deg, #000 85%, transparent); }
.medaillon { animation: none; transform: rotate(-3deg); }
.sceau-texte { animation: none; }
.js .rv { filter: none; transition: opacity 1s var(--sortie), transform 1.2s var(--sortie); }
@keyframes monte { from { opacity: 0; transform: translateY(16px); } }

/* Le petit test : la photo de l'étreinte en arche */
.test-photo { display: grid; justify-items: center; }
.test-ph { width: min(300px, 100%); aspect-ratio: 4 / 5; border-radius: var(--r-arche); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .55); outline: 1px solid rgba(231, 201, 190, .5); outline-offset: 10px; }
.test-choix { flex-direction: column; align-items: flex-start; }

/* Fraîchement publiés : la troisième pièce ancrée sous l'article principal */
.frais-grand { grid-row: 2; }
.frais-moyen { grid-row: 2 / span 2; margin-top: 96px; }
.frais-mot { grid-row: 3; grid-column: 1 / 8; margin-top: 56px; }

.redaction { max-width: 880px; }

/* ---------------------------------------------------------------- paliers */
@media (max-width: 1100px) {
  .coiffe-rubs { display: none; }
  .coiffe { grid-template-columns: auto 1fr; }
  .marque { order: -1; }
  .burger { display: inline-grid; }
  .lien-contact span { display: none; }
  .lien-contact { width: 44px; padding: 0; justify-content: center; }
  .fioles { grid-template-columns: repeat(3, 1fr); }
  .fiole:nth-child(3) { border-right: 0; }
  .fiole:nth-child(n+4) { border-top: 1px solid var(--filet); }
}
@media (max-width: 900px) {
  .vitrine { grid-template-columns: 1fr; padding-top: 24px; padding-bottom: 72px; }
  .vitrine-texte, .vitrine-objet { grid-column: 1 / -1; }
  .vitrine-objet { margin-top: 56px; }
  .vitrine h1 { font-size: var(--t-56); }
  .vitrine h1 em { font-size: var(--t-24); margin-top: 12px; }
  .vitrine-rosace { width: 320px; right: -110px; top: -30px; }
  .medaillon { width: 112px; height: 112px; bottom: 140px; left: 4px; }
  .arche-ph { aspect-ratio: 1 / 1; }
  .frais-moyen .ph { aspect-ratio: 4 / 3 !important; }
  .nuancier-tete { flex-direction: column; align-items: start; }
  .nuancier h2, .rayon h2, .test h2, .journal h2, .redaction h2, .voisins h2 { font-size: var(--t-30); }
  .fioles { grid-template-columns: 1fr; }
  .fiole { grid-template-columns: 48px 1fr 24px; grid-template-rows: auto auto; min-height: 0; padding: 22px 0; border-right: 0; border-top: 0 !important; border-bottom: 1px solid var(--filet); gap: 14px 16px; }
  .fiole-txt { grid-column: 2; grid-row: 1 / 3; align-self: center; grid-template-columns: 40px 1fr; align-items: center; gap: 2px 14px; }
  .fiole-ico { grid-row: 1 / 3; margin: 0; }
  .fiole-d { grid-column: 1 / -1; margin-top: 8px; }
  .fiole-tube { grid-column: 1; grid-row: 1 / 3; width: 48px; height: 150px; grid-template-rows: 18px 1fr; }
  .fiole-bouchon { width: 17px; height: 19px; }
  .fiole-verre { width: 48px; }
  .fiole-trait { top: 18px; width: 48px; height: calc(100% - 18px); }
  .fiole-etiquette { left: 6px; right: 6px; }
  .fiole-etiquette .compte { font-size: var(--t-15); }
  .fiole-etiquette small { font-size: 8px; }
  .fiole-fleche { position: static; grid-column: 3; grid-row: 1; opacity: 1; transform: none; }
  .frais > h2 { font-size: var(--t-40); margin-bottom: 28px; }
  .frais-grand, .frais-moyen, .frais-mot { grid-column: 1 / -1; grid-row: auto; }
  .frais-grand .frais-txt { margin: -40px 12px 0; padding: 22px; }
  .frais h3 { font-size: var(--t-24); }
  .frais-moyen { margin-top: 48px; }
  .frais-mot { grid-template-columns: 96px 1fr; gap: 18px; padding: 18px; margin-top: 40px; align-items: start; }
  .rayon-piste { grid-auto-columns: 74%; }
  .test-in { grid-template-columns: 1fr; padding: 32px 22px; gap: 8px; }
  .test-dessin svg { max-width: 200px; }
  .journal { grid-template-columns: 1fr; gap: 28px; }
  .journal-cote { position: static; }
  .ligne a { grid-template-columns: 64px 1fr 20px; gap: 14px; padding: 16px 0; }
  .ligne time, .ligne .temps { display: none; }
  .ligne-vignette { display: block; width: 64px; height: 64px; border-radius: var(--r-s); object-fit: cover; filter: var(--etalon); }
  .ligne-vide { display: grid; place-items: center; background: var(--poudre); color: var(--garance); }
  .ligne-vide svg { width: 44px; }
  .ligne-corps b { font-size: var(--t-17); }
  .ligne a:hover .ligne-corps { transform: none; }
  .journal-vue { display: none; }
  .arche-cerne { display: none; }
  .lignes-b { grid-template-columns: 1fr; margin-top: -28px; }
  .lignes-b .ligne a { grid-template-columns: 64px 1fr 20px; }
  .lignes-b .ligne:nth-child(2) { border-top: 0; }
  .titre-vitrine { font-size: var(--t-56); }
  .vitrine-papier { left: 8%; right: -4%; }
  .redaction-txt { font-size: var(--t-17); }
  .socle-in { grid-template-columns: 1fr; gap: 40px; padding-top: 56px; }
  .socle-phrase { font-size: var(--t-24); }
  .socle-ligne { flex-direction: column; }
  .socle-nom { height: 19vw; }
  .socle-nom span { font-size: 27vw; }

  .lecture h1 { font-size: var(--t-40); }
  .lecture-chapo { font-size: var(--t-20); }
  .prose [class$="-grid"] { grid-template-columns: 1fr; border-top: 0; }
  .prose [class$="-card"], .prose [class$="-card"]:first-child { padding: 16px 0; border-left: 0 !important; border-bottom: 1px solid var(--filet); }
  .test-ph { width: 200px; }
  .prose [class$="-key-in"] { padding: 22px 20px 18px; }
  .prose [class$="-tab"] { display: block; overflow-x: auto; }
  .prose [class$="-src"] li { grid-template-columns: 1fr; gap: 4px; }
  .prose [class$="-tool"] { padding: 22px; }
  .voisins-in { grid-template-columns: 1fr; }
  .voisin-grand { grid-row: auto; }
  .voisin-petit { grid-template-columns: 96px 1fr; }
}
@media (max-width: 768px) {
  /* le flou d'arrière-plan crée un contexte d'empilement : coupé en mobile */
  .coiffe.pose { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(245, 235, 231, .97); }
  .p-article .coiffe.pose { background: rgba(255, 255, 255, .97); }
  .tiroir-nav a { color: var(--encre) !important; }
  .question { height: 56px; }
  .question input { font-size: 16px; }
  .question button span, .question button { padding: 0 16px; }
}

/* capture figée */
.fige *, .fige *::before, .fige *::after { animation: none !important; transition: none !important; }

/* mouvement réduit : tout est coupé */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .js .rv { opacity: 1; transform: none; filter: none; }
  .js .fiole:not(.vu) .fiole-liquide { transform: translateY(calc((1 - var(--lvl) * .78) * 100%)); }
  .trace circle, .trace path, .js .rv .trace circle, .js .rv .trace path { stroke-dashoffset: 0 !important; }
  .defile-piste { transform: none; }
  .arche-cerne { stroke-dashoffset: 0; }
}

/* ================================================================ portage WordPress */

[hidden] { display: none !important; }

/* Marque : arche au compas et mot-symbole */
.marque { display: inline-flex; align-items: center; gap: 10px; color: var(--encre); }
.marque-signe { width: 18px; height: 24px; flex: none; color: var(--garance); }
.marque-mot { display: inline-block; }

/* Les cartes portent le titre en premier dans le balisage : on garde le même rendu */
.arche-legende .arche-titre { order: 0; }

/* Image à la une : pas de grain sur la colonne de lecture */
.une-ph::after, .une-ph::before { display: none; }
.une-ph img { width: 100%; height: 100%; object-fit: cover; }

/* Révélations des rubriques : le niveau s'affiche sans attendre sur la page de rubrique */
.fiole-seule { display: block; min-height: 0; padding: 0 28px 12px; border-right: 0; }
.fiole-seule .fiole-tube { height: 232px; }
.fiole-seule .fiole-liquide { transform: translateY(calc((1 - var(--lvl) * .78) * 100%)); }

/* ---------------------------------------------------------------- notation kk Star Ratings */
.etoiles .kk-star-ratings { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.etoiles .kksr-stars { display: inline-flex; position: relative; }
.etoiles .kksr-star { padding-right: 2px !important; cursor: pointer; }
.etoiles .kksr-icon { width: 16px !important; height: 16px !important; background: var(--rose) !important; -webkit-mask: var(--m-etoile) center / contain no-repeat; mask: var(--m-etoile) center / contain no-repeat; }
.etoiles .kksr-stars-active .kksr-icon { background: var(--garance) !important; }
.etoiles .kksr-legend { font-size: var(--t-13) !important; color: var(--encre); font-weight: 600; opacity: 1 !important; }

/* ---------------------------------------------------------------- résumé par les assistants (extension) */
.resume-ia .share-with-ai { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0 !important; background: none !important; border: 0 !important; }
.resume-ia .share-ai-text, .resume-ia .share-ai-text span { display: inline-flex; align-items: center; gap: 6px; margin-right: 4px; font-size: var(--t-13) !important; font-weight: 400 !important; color: var(--encre-2) !important; background: none !important; }
.resume-ia .share-ai { margin: 0 !important; padding: 0 !important; background: none !important; }
.resume-ia .share-ai a { display: inline-flex !important; align-items: center; gap: 6px; height: 32px; padding: 0 12px !important; border-radius: var(--r-pill); border: 1px solid var(--filet-fort) !important; background: transparent !important; color: var(--encre) !important; font-size: var(--t-13) !important; text-decoration: none !important; box-shadow: none !important; }
.resume-ia .share-ai a:hover { background: var(--poudre) !important; border-color: var(--poudre) !important; }
.resume-ia .share-ai img { width: 14px; height: 14px; }

/* ---------------------------------------------------------------- sommaire Easy Table of Contents */
.prose #ez-toc-container { width: 100% !important; margin: 0 0 40px; padding: 0; border: 0; border-radius: var(--r-m); background: var(--lait); box-shadow: inset 0 0 0 1px var(--filet); }
.prose #ez-toc-container .ez-toc-title-container { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 22px; }
.prose #ez-toc-container .ez-toc-title { margin: 0; font-family: var(--f-texte); font-size: var(--t-15); font-weight: 600; color: var(--encre); }
.prose #ez-toc-container .ez-toc-title::before { content: ""; display: inline-block; vertical-align: -3px; width: 16px; height: 16px; margin-right: 10px; background: var(--garance); -webkit-mask: var(--m-sources) center / contain no-repeat; mask: var(--m-sources) center / contain no-repeat; }
.prose #ez-toc-container .ez-toc-btn, .prose #ez-toc-container .ez-toc-pull-right { border: 0 !important; background: none !important; box-shadow: none !important; }
.prose #ez-toc-container nav { padding: 0 22px 18px 48px; }
.prose #ez-toc-container ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.prose #ez-toc-container ul ul { margin: 6px 0 0 16px; }
.prose #ez-toc-container li { max-width: none; padding: 0; font-size: var(--t-15); line-height: 1.45; }
.prose #ez-toc-container li::before { display: none; }
.prose #ez-toc-container a { color: var(--encre); text-decoration: none; }
.prose #ez-toc-container a:hover { color: var(--garance); }

/* ---------------------------------------------------------------- corps des anciens articles (balisage d'avant la chaîne) */
.prose > article > p, .prose > article > ul > li { max-width: 68ch; }
.prose p + p, .prose ul + p, .prose ol + p, .prose blockquote + p, .prose table + p { margin-top: 1.1em; }
.prose h3 { margin: 40px 0 12px; line-height: 1.3; font-variation-settings: 'opsz' 6; font-weight: 600; letter-spacing: 0; }
.prose h4 { margin: 28px 0 8px; font-family: var(--f-texte); font-size: var(--t-17); font-weight: 600; }
.prose > ol, .prose > article > ol { margin: 18px 0; padding-left: 1.4em; display: grid; gap: 8px; }
.prose > article > ul { margin: 18px 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.prose > article > ul > li { position: relative; padding-left: 26px; }
.prose > article > ul > li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: var(--r-pill); border: 1px solid var(--garance); }
.prose img { height: auto; border-radius: var(--r-s); clip-path: inset(0 round var(--r-s)); filter: var(--etalon); }
.prose blockquote { margin: 32px 0 !important; padding: 22px 26px !important; border: 0 !important; border-radius: var(--r-m); clip-path: inset(0 round var(--r-m)); background: var(--lait) !important; color: var(--encre) !important; font-style: normal; }
.prose blockquote p { margin: 0; }
.prose table:not([class]) { width: 100%; margin: 24px 0 32px; border-collapse: collapse; font-size: var(--t-15); }
.prose table:not([class]) th, .prose table:not([class]) td { padding: 12px 14px !important; border: 0 !important; border-bottom: 1px solid var(--filet) !important; text-align: left; vertical-align: top; background: transparent !important; color: var(--encre) !important; }
.prose table:not([class]) th, .prose table:not([class]) thead td { background: var(--lait) !important; font-weight: 600; }

/* Ancien format « Les infos à retenir » : boîte reconnue par le thème (classe posée à l'affichage) */
.prose .boite-retenir { position: relative; margin: 0 0 40px; padding: 30px 32px 22px; overflow: hidden; border-radius: var(--r-m); background: var(--lait); box-shadow: inset 0 0 0 1px var(--filet); color: var(--encre); }
.prose .boite-retenir::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--garance), rgba(155, 58, 39, .25)); }
.prose .boite-retenir > h2 { margin: 0 0 12px; font-size: var(--t-24); line-height: 1.25; font-variation-settings: 'opsz' 6; font-weight: 600; letter-spacing: 0; }
.prose .boite-retenir ul { list-style: none !important; margin: 0 !important; padding: 0 !important; line-height: 1.55 !important; display: grid; gap: 4px; }
.prose .boite-retenir li { position: relative; max-width: none; padding: 8px 0 8px 36px; font-size: var(--t-17); }
.prose .boite-retenir li::before { content: ""; position: absolute; left: 0; top: 50%; margin-top: -10px; width: 20px; height: 20px; border-radius: var(--r-pill); background: rgba(155, 58, 39, .2); }
.prose .boite-retenir li::after { content: ""; position: absolute; left: 3px; top: 50%; margin-top: -5px; width: 14px; height: 10px; background: var(--garance); -webkit-mask: var(--m-coche) center / contain no-repeat; mask: var(--m-coche) center / contain no-repeat; }

/* Encarts « À lire aussi » de l'extension d'articles liés : repris dans la palette (l'extension pose ses couleurs en ligne) */
.prose a:has(> .centered-text-area), .prose a:has(> .centered-text-area):visited { display: block; position: relative; margin: 28px 0; padding: 18px 56px 18px 22px !important; border: 0 !important; border-radius: var(--r-m); background: var(--garance-voile) !important; box-shadow: none !important; text-decoration: none !important; opacity: 1 !important; }
.prose a:has(> .centered-text-area):hover { background: rgba(155, 58, 39, .18) !important; }
.prose a:has(> .centered-text-area)::after { content: ""; position: absolute; right: 22px; top: 50%; margin-top: -9px; width: 18px; height: 18px; background: var(--garance); -webkit-mask: var(--m-lien) center / contain no-repeat; mask: var(--m-lien) center / contain no-repeat; }
.prose a:has(> .centered-text-area) .centered-text-area, .prose a:has(> .centered-text-area) .centered-text { display: block !important; float: none !important; min-height: 0 !important; padding: 0 !important; background: none !important; }
.prose a:has(> .centered-text-area) .ctaText { display: block; margin-bottom: 4px; font-family: var(--f-texte) !important; font-size: var(--t-13) !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--garance) !important; }
.prose a:has(> .centered-text-area) .postTitle { font-family: var(--f-titre) !important; font-variation-settings: 'opsz' 6; font-size: var(--t-17) !important; font-weight: 600 !important; color: var(--encre) !important; text-decoration: none !important; }
.prose a:has(> .centered-text-area) .ctaButton, .prose a:has(> .centered-text-area) .postImageUrl { display: none !important; }

/* ---------------------------------------------------------------- outils et quiz de la chaîne (scripts du contenu, hors Elementor) */
.prose [class$="-step"], .prose [class*="-step "] { display: none; margin-top: 18px; }
.prose [class*="-step"].on { display: block; animation: sortie-test .8s var(--sortie) both; }
.prose [class$="-nav"], .prose [class*="-nav "] { display: none; margin-top: 16px; text-align: right; }
.prose [class*="-nav"].on { display: block; }
.prose [class$="-nav"] button, .prose [class*="-nav "] button { height: 46px; padding: 0 22px; border: 0; border-radius: var(--r-pill); background: var(--garance) !important; color: var(--lait) !important; font-weight: 600; font-size: var(--t-15); }
.prose [class$="-done"], .prose [class*="-done "] { display: none; margin-top: 16px; padding: 16px 20px; border-radius: var(--r-s); background: var(--blanc); box-shadow: inset 0 0 0 1px var(--filet-fort); font-weight: 600; }
.prose [class*="-done"].on { display: block; }
.prose [class$="-out"] { margin-top: 12px; }
.prose [class$="-out"]:empty { display: none; }
.prose [class$="-pick"] button:disabled { opacity: 1; cursor: default; }
.prose [class$="-pick"] button.on:hover { box-shadow: none; transform: none; }
.prose [class$="-tool"] label { display: block; margin: 0 0 6px; font-size: var(--t-15); font-weight: 600; }
.prose [class$="-tool"] p + p { margin-top: .6em; }
.prose [class$="-rng"] { width: 100%; margin: 6px 0 16px; accent-color: var(--garance); }
.prose [class$="-val"] { font-family: var(--f-titre); font-size: var(--t-30); line-height: 1.1; color: var(--garance); }
.prose [class$="-gauge"] { height: 10px; margin: 14px 0; overflow: hidden; border-radius: var(--r-pill); background: var(--blanc); box-shadow: inset 0 0 0 1px var(--filet); }
.prose [class$="-gauge"] i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, rgba(155, 58, 39, .5), var(--garance)); transition: width .25s; }
.prose [class$="-quiz-item"] { margin: 14px 0; padding-bottom: 14px; border-bottom: 1px solid var(--filet); }
.prose [class$="-quiz-item"]:last-child { border-bottom: 0; padding-bottom: 0; }
.prose [class$="-quiz-item"] > p { font-weight: 600; margin: 0 0 8px; }
.prose [class$="-cnt"] { font-size: var(--t-13); color: var(--encre-2); }
.prose [class$="-tool"] select, .prose [class$="-tool"] input[type="number"], .prose [class$="-tool"] input[type="text"] { height: 46px; padding: 0 16px; border: 1px solid var(--filet-fort); border-radius: var(--r-s); background: var(--blanc); font: inherit; color: var(--encre); }

/* ---------------------------------------------------------------- mots-clés de l'article */
.etiquettes { display: flex; flex-wrap: wrap; gap: 8px; margin: 48px 0 0; padding: 0; list-style: none; }
.etiquettes a { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); font-size: var(--t-13); transition: background .3s, border-color .3s; }
.etiquettes a:hover { background: var(--poudre); border-color: var(--poudre); }
.lecture-signe b { color: var(--encre); font-weight: 600; }

/* ---------------------------------------------------------------- page de rubrique et recherche */
.p-liste { background: radial-gradient(55vw 45vw at 95% 0%, rgba(196, 120, 110, .16), transparent 70%), var(--lait); }
.rayonnage { max-width: var(--large); margin: 0 auto; padding: 32px var(--gouttiere) 56px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 24px 64px; }
.rayonnage .ariane { margin-bottom: 36px; font-size: var(--t-13); color: var(--encre-2); }
.rayonnage h1 { display: flex; align-items: center; gap: 18px; font-size: var(--t-56); line-height: 1.05; letter-spacing: -.02em; }
.rayonnage-ico { width: 40px; height: 40px; color: var(--garance); }
.rayonnage-n { margin-top: 14px; font-size: var(--t-15); color: var(--encre-2); }
.rayonnage-desc { margin-top: 18px; max-width: 60ch; font-size: var(--t-17); }
.rayonnage-desc p + p { margin-top: .8em; }
.rayonnage .question { margin-top: 28px; }
.rayonnage-arche { width: 260px; aspect-ratio: 4 / 5; border-radius: var(--r-arche); box-shadow: var(--ombre-2); }
.rayonnage-liste { max-width: var(--large); margin: 0 auto; padding: 0 var(--gouttiere) 120px; }
.lignes-rub { display: grid; grid-template-columns: 1fr 1fr; column-gap: 56px; }
.lignes-rub .ligne a { grid-template-columns: 72px 1fr 20px; }
.lignes-rub .ligne time, .lignes-rub .ligne .temps { display: none; }
.lignes-rub .ligne-vignette { display: block; width: 72px; height: 72px; border-radius: var(--r-s); object-fit: cover; filter: var(--etalon); }
.lignes-rub .ligne-vide { display: grid; place-items: center; background: var(--poudre); color: var(--garance); }
.lignes-rub .ligne-vide svg { width: 48px; }
.rayonnage-vide { max-width: 60ch; font-size: var(--t-17); }
.rayonnage-liste .nav-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 40px; }
.rayonnage-liste .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 14px; border-radius: var(--r-pill); border: 1px solid var(--filet-fort); font-size: var(--t-15); }
.rayonnage-liste .page-numbers.current { background: var(--encre); border-color: var(--encre); color: var(--lait); }
.rub-pied { max-width: 72ch; margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--filet); font-size: var(--t-15); color: var(--encre-2); }
.rub-pied p + p { margin-top: .8em; }

/* ---------------------------------------------------------------- pages (fiche auteur, charte, corrections, contact, plan, mentions) */
.feuillet > h1 { margin-top: 36px; }
.feuillet .prose { margin-top: 32px; }
.feuillet .prose h2 { margin-top: 48px; }
.feuillet .prose > :first-child { margin-top: 0; }

.guichet { display: grid; grid-template-columns: 5fr 7fr; gap: 48px; margin-top: 40px; }
.guichet-mots h2 { font-size: var(--t-24); line-height: 1.25; font-variation-settings: 'opsz' 6; font-weight: 600; letter-spacing: 0; }
.guichet-mots p { margin-top: 10px; font-size: var(--t-17); color: var(--encre-2); }
.guichet-mots p + h2 { margin-top: 36px; }
.guichet-mots a { color: var(--garance); text-decoration: underline; text-underline-offset: 3px; }
.guichet-form { padding: 32px; border-radius: var(--r-m); background: var(--lait); box-shadow: inset 0 0 0 1px var(--filet); }
.guichet-note { font-size: var(--t-15); color: var(--encre-2); }
.guichet-form .wpcf7-form p { display: flex; flex-direction: column; gap: 6px; margin: 0 0 16px; }
.guichet-form .wpcf7-form br { display: none; }
.guichet-form .wpcf7-form label { font-size: var(--t-15); font-weight: 600; }
.guichet-form .wpcf7-form-control-wrap { display: block; }
.guichet-form input[type="text"], .guichet-form input[type="email"], .guichet-form input[type="tel"], .guichet-form textarea, .guichet-form select { width: 100%; padding: 12px 18px; border: 1px solid var(--filet-fort); border-radius: var(--r-s); background: var(--blanc); font: inherit; font-size: 16px; color: var(--encre); }
.guichet-form textarea { min-height: 160px; resize: vertical; }
.guichet-form input:focus, .guichet-form textarea:focus { outline: none; border-color: var(--garance); box-shadow: 0 0 0 4px var(--garance-voile); }
.guichet-form input.wpcf7-submit { width: auto; height: 50px; padding: 0 28px; border: 0; border-radius: var(--r-pill); background: var(--garance); color: var(--lait); font: 600 var(--t-15) var(--f-texte); cursor: pointer; }
.guichet-form input.wpcf7-submit:hover { background: #8E3725; }
.guichet-form .wpcf7-not-valid-tip { margin-top: 4px; font-size: var(--t-13); color: var(--garance); }
.guichet-form .wpcf7-response-output { margin: 16px 0 0 !important; padding: 12px 16px !important; border: 1px solid var(--filet-fort) !important; border-radius: var(--r-s); font-size: var(--t-15); }

.legal .prose h2 { font-size: var(--t-24); }
.prose .editeur img { width: 100%; max-width: 900px; margin: 12px 0 8px; border-radius: 0; clip-path: none; filter: none; }

.plan-rub h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 56px 0 14px; font-size: var(--t-30); }
.plan-rub h2 a { display: inline-flex; align-items: center; gap: 12px; }
.plan-rub h2 .ic { color: var(--garance); }
.plan-rub h2 span { font-family: var(--f-texte); font-size: var(--t-13); color: var(--encre-2); }
.plan-rub ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 48px; }
.plan-rub li { break-inside: avoid; padding: 8px 0; border-bottom: 1px solid var(--filet); font-size: var(--t-15); line-height: 1.4; }
.plan-rub li a:hover, .signature-liste a:hover, .signature-rubs a:hover { color: var(--garance); }

.signature { display: flex; align-items: center; gap: 22px; margin-top: 36px; }
.signature-photo { width: 120px; height: 120px; border-radius: var(--r-pill); object-fit: cover; filter: var(--etalon); }
.signature h1 { margin: 0; font-size: var(--t-56); line-height: 1.05; }
.signature-titre { margin-top: 6px; font-size: var(--t-17); color: var(--encre-2); }
.signature-faits { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 12px 56px; margin: 40px 0 0; padding: 22px 0; border-block: 1px solid var(--filet); }
.signature-faits dt { font-size: var(--t-13); color: var(--encre-2); }
.signature-faits dd { margin: 4px 0 0; font-family: var(--f-titre); font-size: var(--t-30); line-height: 1.1; }
.signature-faits dd a { color: var(--garance); font-size: var(--t-20); }
.signature-liste h2 { margin: 56px 0 14px; font-size: var(--t-30); }
.signature-liste ul { list-style: none; margin: 0; padding: 0; }
.signature-liste li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 24px; padding: 12px 0; border-bottom: 1px solid var(--filet); font-size: var(--t-15); }
.signature-liste li span { color: var(--encre-2); font-size: var(--t-13); }
.signature-rubs { margin-top: 20px; font-size: var(--t-15); color: var(--encre-2); }
.signature-rubs a { color: var(--encre); }

@media (max-width: 900px) {
  .rayonnage { grid-template-columns: 1fr; padding-top: 24px; }
  .rayonnage h1, .signature h1 { font-size: var(--t-40); }
  .rayonnage-arche, .fiole-seule { display: none; }
  .lignes-rub { grid-template-columns: 1fr; }
  .lignes-rub .ligne a { grid-template-columns: 64px 1fr 20px; }
  .lignes-rub .ligne-vignette { width: 64px; height: 64px; }
  .guichet { grid-template-columns: 1fr; gap: 32px; }
  .guichet-form { padding: 22px; }
  .plan-rub ul { columns: 1; }
  .plan-rub h2, .signature-liste h2 { font-size: var(--t-24); }
  .signature-faits { grid-template-columns: 1fr 1fr; gap: 16px 32px; }
  .prose table:not([class]) { display: block; overflow-x: auto; }
  .prose .boite-retenir { padding: 26px 20px 18px; }
}

/* Ligne de repères d'article : le fil d'Ariane se tronque, date, durée et étoiles restent sur la même ligne (v1.0.1) */
.lecture-repere { flex-wrap: nowrap; }
.lecture-repere .ariane { flex-wrap: nowrap; flex: 1 1 0; min-width: 0; }
.lecture-repere .ariane > a, .lecture-repere .ariane > svg { flex: 0 0 auto; }
.lecture-repere .ariane > span:last-child { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lecture-meta { flex-wrap: nowrap; flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 760px) {
  .lecture-repere { flex-wrap: wrap; }
  .lecture-meta { flex-wrap: wrap; white-space: normal; }
}

/* Encadré de cartes de la chaîne : 3 ou 4 cartes tiennent sur une seule rangée, jamais une carte orpheline */
.prose [class$="-grid"] { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.prose [class$="-card"]:first-child { padding-left: 0; }
.prose [class$="-out"]:empty { display: none; }
@media (max-width: 760px) {
  .prose [class$="-grid"] { grid-template-columns: 1fr; }
  .prose [class$="-card"] + [class$="-card"] { border-left: 0; border-top: 1px solid var(--filet); }
  .prose [class$="-card"], .prose [class$="-card"]:first-child { padding-left: 0; padding-right: 0; }
}

/* Portrait photo à la place du monogramme (v1.0.2) */
img.portrait { object-fit: cover; object-position: center 22%; background: var(--poudre); filter: var(--etalon); }
img.mono, img.sceau-l { padding: 0; display: block; }