:root{--wine:#8A2B1F;--ink:#26282B;--cream:#F2EFE6;--paper:#FAF8F2;--gold:#E7E2D5;--line:#D8D2C2;--serif:'Fraunces',Georgia,serif;--mono:'Karla',system-ui,sans-serif;--max:1180px;
  /* Alias sémantiques de la direction artistique (project-spec.json -> art_direction) */
  --primary-color: #8A2B1F;
  --primary-hover: #6F211A;
  --on-primary: #FFFFFF;
  --secondary-color: #26282B;
  --secondary-hover: #34373B;
  --light-color: #F2EFE6;
  --surface: #FAF8F2;
  --dark-color: #26282B;
  --dark-light: #4A4D52;
  --gray-800: #16181A;
  --gray-600: #63666C;
  --gray-300: #C9C3B4;
  --gray-200: #D8D2C2;
  --gray-100: #E7E2D5;
  --white: #FFFFFF;
  --callout-bg: #F6EDE6;
  --callout-text: #7A2A1C;
  --callout-border: #E0CBBF;
  --font-heading: 'Fraunces', Georgia, serif;
  --font-body: 'Karla', system-ui, sans-serif;
  /* Alias de la convention sémantique : consommés par les blocs posés par
     l'orchestrateur (sous-menu outils, largeur unifiée). Sans eux ces blocs
     sont posés mais inertes. */
  --primary: #8A2B1F;
  --secondary: #26282B;
  --on-primary: #FFFFFF;
  --bg: #F2EFE6;
  --text: #26282B;
  --text-secondary: #4A4D52;
  --text-strong: #16181A;
  --text-muted: #63666C;
  --text-faint: #C9C3B4;
  --fill: #E7E2D5;
  --border: #D8D2C2;
}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.65 var(--mono)}a{color:inherit;text-decoration:none}.site-header{padding:18px 5%;border-bottom:1px solid var(--line);background:rgba(242,239,230,.94);position:sticky;top:0;z-index:5;backdrop-filter:blur(8px)}.header-inner{max-width:var(--max);margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font:600 16px/1 var(--serif);letter-spacing:-.04em}.brand em{color:var(--wine);font-style:italic}.brand-mark{display:grid;place-items:center;border-radius:50%;height:36px;width:36px;background:var(--wine);color:#fff;font:500 11px var(--mono);letter-spacing:-1px}.main-nav{display:flex;gap:28px;font-size:12px}.main-nav a{transition:color .2s}.main-nav a:hover{color:var(--wine)}.menu-toggle{display:none;border:0;background:transparent;color:var(--wine)}.hero{max-width:var(--max);margin:auto;display:grid;grid-template-columns:1.08fr .92fr;min-height:650px;align-items:center;padding:62px 0}.hero-copy{padding:40px 28px 40px 4px}.eyebrow{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--wine);margin:0 0 18px;font-weight:500}.hero h1,.page-intro h1{font:600 clamp(42px,5.4vw,78px)/.98 var(--serif);letter-spacing:-.065em;margin:0 0 28px}.hero h1 em,h2 em,h1 em{font-style:italic;color:var(--wine)}.lead{font-size:15px;max-width:550px;margin:0 0 30px}.button{display:inline-flex;align-items:center;gap:10px;padding:13px 18px;background:var(--wine);color:#fff;font-size:12px;border:1px solid var(--wine);transition:.25s}.button:hover{background:#6F211A;transform:translateY(-2px)}.button svg,.text-link svg{height:16px;width:16px}.micro{font-size:10px;color:#63666C;margin-top:24px}.hero-image{margin:0;height:540px;position:relative}.hero-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.05)}figcaption{position:absolute;bottom:15px;left:15px;color:#fff;font-size:10px;background:rgba(38,40,43,.75);padding:8px}.manifesto,.selection,.process,.quote-band,.page-shell{max-width:var(--max);margin-left:auto;margin-right:auto}.manifesto{padding:112px 0;display:grid;grid-template-columns:1fr 2fr;border-top:1px solid var(--line)}.manifesto h2,.section-heading h2,.process h2,.page-intro h1,.note h2,.prose h2{font:600 clamp(30px,3.8vw,52px)/1.05 var(--serif);letter-spacing:-.055em;margin:0 0 22px}.manifesto p:last-child{max-width:600px;margin:0}.selection{padding:18px 0 112px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:32px}.text-link{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--wine)}.dish-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:1px;background:var(--line)}.dish-card{min-height:310px;padding:27px;background:var(--paper);display:flex;flex-direction:column;transition:.25s}.dish-card:hover{background:#EFEBE0}.dish-card.featured{background:var(--wine);color:#fff}.dish-no{font-size:11px;color:var(--wine)}.featured .dish-no{color:var(--gold)}.dish-card h3{font:600 33px/1 var(--serif);letter-spacing:-.05em;margin:34px 0 16px}.dish-card p{font-size:12px;max-width:220px;margin:0}.dish-card>span:last-child{margin-top:auto;font-size:10px;display:flex;gap:6px;align-items:center}.dish-card svg{width:14px}.process{display:grid;grid-template-columns:1fr 1.3fr;padding:105px 0;border-top:1px solid var(--line)}.process-list article{display:grid;grid-template-columns:50px 1fr;border-bottom:1px solid var(--line);padding:0 0 21px;margin-bottom:21px}.process-list span{color:var(--wine);font-size:11px}.process-list h3{font:600 25px/1 var(--serif);margin:0 0 10px}.process-list p{font-size:12px;margin:0}.quote-band{background:var(--gold);padding:80px 10%;text-align:center}.quote-band p{font:600 clamp(29px,4vw,48px)/1.1 var(--serif);letter-spacing:-.05em;margin:0 0 20px}.quote-band em{color:var(--wine)}.quote-band span{font-size:10px}.site-footer{background:#26282B;color:#E7E2D5;padding:62px max(5%,calc((100% - var(--max))/2)) 25px;margin-top:100px}.footer-grid{display:grid;grid-template-columns:1.5fr .85fr .95fr .95fr 1fr;gap:34px;padding-bottom:50px}.footer-brand{color:#fff}.site-footer p,.site-footer a{font-size:11px;display:block;max-width:310px;margin:12px 0}.site-footer .eyebrow{color:var(--gold)}.footer-bottom{border-top:1px solid #3F4247;padding-top:20px;display:flex;justify-content:space-between;font-size:10px;color:#A8ABB0}.page-shell{padding:80px 0 0}.page-intro{max-width:820px;padding-bottom:72px}.directory-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}.directory-card{padding:34px 28px;border-bottom:1px solid var(--line);min-height:240px;transition:.2s}.directory-card:nth-child(odd){border-right:1px solid var(--line)}.directory-card:hover{background:var(--paper)}.directory-card h2{font:600 32px/1.05 var(--serif);letter-spacing:-.05em;margin:0 0 14px}.directory-card>p:not(.eyebrow){font-size:12px;max-width:370px}.directory-card span{font-size:10px;color:var(--wine);display:flex;gap:8px;align-items:center;margin-top:24px}.directory-card svg{width:14px}.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.method-grid article{padding:30px;background:var(--paper)}.method-grid span{color:var(--wine);font-size:11px}.method-grid h2{font:600 28px/1.05 var(--serif);letter-spacing:-.05em}.method-grid p,.prose p{font-size:13px}.note{margin-top:72px;padding:62px;background:var(--wine);color:#fff}.note .eyebrow{color:var(--gold)}.note h2{max-width:620px}.note p{max-width:590px;font-size:13px;margin-bottom:28px}.button-light{color:var(--wine);background:var(--cream);border-color:var(--cream)}.prose{max-width:750px}.prose h2{font-size:33px;margin-top:48px}.prose a{color:var(--wine);text-decoration:underline;text-underline-offset:3px}.not-found{max-width:var(--max);min-height:60vh;margin:auto;padding:110px 0}.not-found h1{font:600 clamp(43px,6vw,74px)/1 var(--serif);letter-spacing:-.06em;margin:0 0 24px}.not-found p:not(.eyebrow){font-size:13px;margin-bottom:26px}.crumb{font-size:10px;margin-bottom:40px;color:#63666C}.crumb a{color:var(--wine)}.crumb span{padding:0 8px}.dish-head{max-width:830px;padding-bottom:62px}.dish-head h1{font:600 clamp(46px,6vw,84px)/.95 var(--serif);letter-spacing:-.07em;margin:0 0 24px}.fact-row{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr}.fact-row div{padding:24px}.fact-row div+div{border-left:1px solid var(--line)}.fact-row span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--wine);margin-bottom:8px}.fact-row strong{font:500 13px/1.5 var(--mono)}.dish-content{display:grid;grid-template-columns:1fr 1.6fr;gap:9%;padding:90px 0}.dish-content aside{border-top:2px solid var(--wine);padding-top:18px}.dish-content ul{margin:0;padding:0;list-style:none;font-size:12px}.dish-content li{padding:9px 0;border-bottom:1px solid var(--line)}.dish-content h2{font:600 42px/1.05 var(--serif);letter-spacing:-.055em;margin:0 0 25px}.dish-content p:not(.eyebrow){font-size:13px}.execution{background:var(--paper);padding:55px;display:grid;grid-template-columns:1fr 1.5fr}.execution h2{font:600 42px/1.05 var(--serif);letter-spacing:-.055em;margin:0}.execution ol{list-style:none;margin:0;padding:0}.execution li{display:grid;grid-template-columns:45px 1fr;border-top:1px solid var(--line);padding:17px 0}.execution li span{font-size:11px;color:var(--wine)}.execution li p{font-size:12px;margin:0}.breakpoint{margin:80px 0;padding:52px;background:var(--wine);color:#fff}.breakpoint .eyebrow{color:var(--gold)}.breakpoint h2{font:600 34px/1.12 var(--serif);letter-spacing:-.045em;max-width:780px;margin:0 0 18px}.breakpoint p{font-size:12px;max-width:650px;margin:0}.next-dish{text-align:center;padding:20px 0}.next-dish h2{font:600 34px/1.08 var(--serif);letter-spacing:-.05em;margin:0 0 23px}.reveal-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}.reveal-on-scroll.revealed{opacity:1;transform:translateY(0)}
@media(max-width:800px){.site-header{padding:14px 5%}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:68px;left:0;right:0;padding:20px 5%;background:var(--cream);border-bottom:1px solid var(--line);flex-direction:column;gap:14px}.main-nav.is-open{display:flex}.hero{grid-template-columns:1fr;padding:22px 5% 0;min-height:0}.hero-copy{padding:42px 0}.hero-image{height:360px;margin:0 -5vw}.manifesto,.selection,.process,.page-shell{margin-left:5%;margin-right:5%}.manifesto{display:block;padding:75px 0}.manifesto .eyebrow{margin-bottom:28px}.selection{padding-bottom:75px}.dish-grid,.method-grid{grid-template-columns:1fr}.dish-card{min-height:245px}.process{grid-template-columns:1fr;padding:75px 0}.process-aside{margin-bottom:38px}.quote-band{margin-left:0;margin-right:0;padding:62px 7%}.page-shell{padding-top:55px}.page-intro{padding-bottom:48px}.directory-grid{grid-template-columns:1fr}.directory-card:nth-child(odd){border-right:0}.footer-grid{grid-template-columns:1fr;gap:25px}.footer-bottom{display:block}.footer-bottom span{display:block;margin:7px 0}.not-found{padding:80px 5%}.site-footer{margin-top:70px}.section-heading{align-items:flex-start;flex-direction:column;gap:10px}.fact-row,.dish-content,.execution{grid-template-columns:1fr}.fact-row div+div{border-left:0;border-top:1px solid var(--line)}.dish-content{gap:36px;padding:60px 0}.execution{padding:32px 24px;gap:30px}.breakpoint{margin:60px 0;padding:36px 25px}}
/* ===== BLOC OUTILS (étape 05) — fil d'ariane, formulaires, tableaux, FAQ ===== */
.outil{padding-bottom:40px}
.breadcrumb{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-600,#63666C);padding:28px 0 6px}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.breadcrumb li+li::before{content:"/";padding-right:8px;color:var(--gray-300,#C9C3B4)}
.breadcrumb a{color:var(--primary-color,#8A2B1F)}
.breadcrumb a:hover{text-decoration:underline;text-underline-offset:3px}
.outil .page-intro{padding-bottom:40px}
.outil-avertissement{margin:0 0 34px;padding:14px 18px;border-left:3px solid var(--primary-color,#8A2B1F);background:var(--callout-bg,#F6EDE6);color:var(--callout-text,#7A2A1C);font-size:12px}
.outil-form{background:var(--paper);padding:38px;margin-bottom:40px}
.outil-form h2,.outil-resultat h2{font:600 32px/1.05 var(--serif);letter-spacing:-.05em;margin:0 0 26px}
.outil-form form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 26px;align-items:end}
.champ{display:flex;flex-direction:column;gap:7px;min-width:0}
.champ label{font-size:11px;letter-spacing:.04em;color:var(--gray-600,#63666C)}
.champ input,.champ select{max-width:100%;padding:11px 12px;border:1px solid var(--line);background:var(--white,#FFFFFF);color:var(--ink);font:400 13px/1.4 var(--mono)}
.champ input:focus,.champ select:focus{outline:2px solid var(--primary-color,#8A2B1F);outline-offset:1px}
.outil-form button{grid-column:1/-1;justify-self:start;cursor:pointer}
.outil-resultat{padding:0 0 20px;scroll-margin-top:90px}
.outil-resultat:focus{outline:none}
.outil-table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:13px}
.outil-table caption{text-align:left;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--primary-color,#8A2B1F);padding-bottom:12px}
.outil-table th,.outil-table td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.outil-table thead th{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-600,#63666C);border-bottom:1px solid var(--ink)}
.outil-table tbody th{font-weight:500;width:34%}
.outil-resultat p,.outil-faq p,.prose p{font-size:13px}
.outil-alerte{padding:16px 18px;background:var(--callout-bg,#F6EDE6);border:1px solid var(--callout-border,#E0CBBF);color:var(--callout-text,#7A2A1C)}
.outil-source-pending{padding:16px 18px;background:var(--white,#FFFFFF);border:1px dashed var(--line);color:var(--gray-600,#63666C);font-size:12px}
.outil-faq{padding:56px 0 0;border-top:1px solid var(--line);margin-top:56px}
.outil-faq h2{font:600 32px/1.05 var(--serif);letter-spacing:-.05em;margin:0 0 22px}
.outil-faq details{border-bottom:1px solid var(--line);padding:15px 0}
.outil-faq summary{cursor:pointer;font:500 14px/1.45 var(--mono);list-style:none}
.outil-faq summary::-webkit-details-marker{display:none}
.outil-faq summary::before{content:"+";color:var(--primary-color,#8A2B1F);padding-right:11px}
.outil-faq details[open] summary::before{content:"–"}
.outil-faq details>div{padding:8px 0 4px 24px}
@media(max-width:800px){.outil-form{padding:26px 20px}.outil-form form{grid-template-columns:1fr}.outil-table th,.outil-table td{padding:11px 10px}.outil-table tbody th{width:40%}}
/* ===== FIN BLOC OUTILS ===== */

/* ===== BLOC SOUS-MENU OUTILS — sans JavaScript (hover + focus-within) ===== */
.nav-item{position:relative;display:inline-flex;align-items:center}
.has-sub>a::after{content:"";display:inline-block;width:5px;height:5px;margin-left:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.has-sub::after{content:"";position:absolute;top:100%;left:0;right:0;height:18px}
.sub-nav{position:absolute;top:calc(100% + 18px);left:-16px;z-index:30;min-width:296px;flex-direction:column;gap:1px;padding:8px;background:var(--surface);border:1px solid var(--line);box-shadow:0 18px 34px rgba(31,58,77,.14);display:none}
.has-sub:hover>.sub-nav,.has-sub:focus-within>.sub-nav{display:flex}
.sub-nav a{display:block;padding:9px 12px;font-size:13px;font-weight:700;line-height:1.25;white-space:nowrap;border-left:2px solid transparent}
.sub-nav a small{display:block;margin-top:2px;font-family:var(--font-body);font-size:11px;font-weight:400;color:var(--text-muted)}
.sub-nav a:hover,.sub-nav a:focus{background:var(--fill);color:var(--primary);border-left-color:var(--primary)}
.sub-nav a:hover small,.sub-nav a:focus small{color:var(--text-secondary)}
.sub-nav-all{margin-top:5px;border-top:1px solid var(--line);padding-top:11px!important;color:var(--primary)}
@media(max-width:800px){
.nav-item{display:block}
.has-sub::after{display:none}
.has-sub>a::after{transform:rotate(45deg) translateY(-2px)}
.sub-nav{position:static;display:flex;min-width:0;margin:9px 0 4px 2px;padding:2px 0 2px 14px;border:0;border-left:2px solid var(--line);box-shadow:none;background:transparent;gap:0}
.sub-nav a{white-space:normal;padding:7px 0;font-size:13px;border-left:0}
.sub-nav a small{display:none}
.sub-nav a:hover,.sub-nav a:focus{background:transparent}
.sub-nav-all{padding-top:8px!important}
}

/* ===== BLOC LARGEUR UNIFIÉE — toutes les pages à la largeur de la home ===== */
/*
 * Posé par 06a2-largeur-contenu. Les sélecteurs ci-dessous ont été RELEVÉS
 * dans les feuilles réellement chargées par le front, pas devinés : c'est la
 * correction du défaut d'origine, où une liste de classes supposées rendait
 * le bloc inerte sans que rien ne le signale.
 *
 * Largeur de référence relevée sur `.container` : la largeur de `.container`.
 *
 * `!important` est délibéré. Une contrainte peut être déclarée dans une
 * feuille chargée APRÈS celle-ci, ou plus bas dans ce même fichier par un
 * bloc appendu ultérieurement : à spécificité égale elle gagnerait, et le
 * bloc serait posé, validé, et sans effet.
 *
 * Les contrôles de formulaire, les images et les cartes sont épargnés.
 *
 * Ce qui suit la borne « relevé automatique : fin » est CONSERVÉ au rejeu :
 * c'est là que vivent les règles tranchées à la main. N'écris rien au-dessus.
 */

/* --- relevé automatique : début --- */
.header-inner{max-width:none!important}   /* styles.css : var(--max) */
.hero{max-width:none!important}   /* styles.css : var(--max) */
.lead{max-width:none!important}   /* styles.css : 550px */
.manifesto p:last-child{max-width:none!important}   /* styles.css : 600px */
.page-intro{max-width:none!important}   /* styles.css : 820px */
.note h2{max-width:none!important}   /* styles.css : 620px */
.note p{max-width:none!important}   /* styles.css : 590px */
.prose{max-width:none!important}   /* styles.css : 750px */
.not-found{max-width:none!important}   /* styles.css : var(--max) */
.dish-head{max-width:none!important}   /* styles.css : 830px */
.breakpoint h2{max-width:none!important}   /* styles.css : 780px */
.breakpoint p{max-width:none!important}   /* styles.css : 650px */
.pilier .page-intro{max-width:none!important}   /* styles.css : 860px */
.pilier-essentiel{max-width:none!important}   /* styles.css : 860px */
.pilier-outil p{max-width:none!important}   /* styles.css : 620px */
.pilier-suite>p{max-width:none!important}   /* styles.css : 760px */
.source-list{max-width:none!important}   /* styles.css : 820px */
.page-sources{max-width:none!important}   /* styles.css : 860px */
.hero .lead{max-width:none!important}   /* styles.css : 620px */

/* Grilles à deux colonnes relevées, NON collapsées d'office : une grille de
   cartes se collapserait à tort. À trancher au brief 06a2, puis à écrire
   SOUS la borne de fin ci-dessous. */
/*   .hero { grid-template-columns: 1.08fr .92fr }  (styles.css) */
/*   .fact-row { grid-template-columns: 1fr 2fr }  (styles.css) */
/*   .dish-content { grid-template-columns: 1fr 1.6fr }  (styles.css) */
/* --- relevé automatique : fin --- */

/* Règles tranchées à la main, conservées au rejeu de 06a2. */
/* Règles tranchées à la main, conservées au rejeu de 06a2. */
/* Règles tranchées à la main, conservées au rejeu de 06a2. */
.content-narrow{max-width:none!important}
.content-narrow select,.content-narrow input[type=number],.content-narrow input[type=text]{max-width:520px}
.article-layout{width:min(1140px,calc(100% - 40px));margin-inline:auto}
.article-body{max-width:72ch}
.article-layout{width:min(100% - 28px,1140px)}

/* Arbitrage 06a2 des grilles à deux colonnes — tranché page par page.
 * COLLAPSÉES (un intitulé à gauche, le corps à droite : la colonne de gauche
 * ne porte qu'un titre, elle bride le texte sans rien apporter) :
 *   .manifesto · .process · .execution
 * CONSERVÉES (les deux colonnes portent du contenu, ou le collapse dégrade) :
 *   .hero        image éditoriale à droite, pas du texte bridé ;
 *   .fact-row    ligne de données libellé/valeur, séparée par un filet vertical ;
 *   .dish-content aside de contenu + corps ; à 1fr la ligne dépasse 1100 px,
 *                 ce qui est une régression de lisibilité, pas un gain.
 * Les media queries du front posent déjà 1fr sous 800 px : ces règles ne les
 * neutralisent pas, elles s'alignent dessus. */
.manifesto{grid-template-columns:1fr!important;gap:18px!important}
.process{grid-template-columns:1fr!important;gap:34px!important}
.execution{grid-template-columns:1fr!important;gap:28px!important}

/* ===== BLOC PAGES PILIER (étape 06) ===== */
.pilier .page-intro{max-width:860px}
.pilier-essentiel{background:var(--paper);padding:34px 38px;margin-bottom:44px;max-width:860px}
.pilier-essentiel h2{font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--primary-color,#8A2B1F);margin:0 0 18px}
.pilier-essentiel ul{margin:0;padding:0;list-style:none}
.pilier-essentiel li{position:relative;padding:0 0 12px 20px;font-size:13px;line-height:1.6}
.pilier-essentiel li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;background:var(--primary-color,#8A2B1F)}
.pilier-perimetre{margin:16px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:12px;color:var(--gray-600,#63666C)}
.pilier-sommaire{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;margin-bottom:56px}
.pilier-sommaire ol{margin:0;padding:0;list-style:none;counter-reset:som;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 34px}
.pilier-sommaire li{counter-increment:som;font-size:13px}
.pilier-sommaire li::before{content:counter(som,decimal-leading-zero);color:var(--primary-color,#8A2B1F);font-size:11px;padding-right:11px}
.pilier-sommaire a:hover{color:var(--primary-color,#8A2B1F);text-decoration:underline;text-underline-offset:3px}
.pilier .prose section{scroll-margin-top:90px;padding-bottom:14px}
.pilier .prose h2{font:600 clamp(27px,3.2vw,40px)/1.1 var(--serif);letter-spacing:-.05em;margin:46px 0 20px}
.pilier .prose section:first-child h2{margin-top:0}
.pilier-outil{margin:64px 0;padding:52px;background:var(--wine);color:#fff;max-width:100%}
.pilier-outil .eyebrow{color:var(--gold)}
.pilier-outil h2{font:600 clamp(26px,3vw,38px)/1.08 var(--serif);letter-spacing:-.05em;margin:0 0 16px}
.pilier-outil p{font-size:13px;max-width:620px;margin:0 0 26px}
.pilier-suite{border-top:1px solid var(--line);padding-top:44px}
.pilier-suite h2{font:600 clamp(26px,3vw,38px)/1.08 var(--serif);letter-spacing:-.05em;margin:0}
.pilier-filles{margin:0 0 26px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line)}
.pilier-filles li{background:var(--cream);padding:24px 26px}
.pilier-filles strong{display:block;font:600 19px/1.25 var(--serif);letter-spacing:-.035em;margin-bottom:9px}
.pilier-filles span{font-size:12px;color:var(--gray-600,#63666C)}
.pilier-suite>p{font-size:12px;color:var(--gray-600,#63666C);max-width:760px}
.pilier-suite>p a{color:var(--primary-color,#8A2B1F);text-decoration:underline;text-underline-offset:3px}
@media(max-width:800px){.pilier-essentiel{padding:26px 22px}.pilier-sommaire ol{grid-template-columns:1fr}.pilier-outil{padding:34px 24px}.pilier-filles{grid-template-columns:1fr}}
/* ===== FIN BLOC PAGES PILIER ===== */

/* ===== ENVELOPPE + OUVERTURE NORMÉE (couches 1 et 2 du gabarit) ===== */
.author-card{display:flex;gap:18px;align-items:flex-start;margin:0 0 22px;padding:20px 22px;background:var(--fill);border-left:3px solid var(--primary)}
.author-card .author-avatar{flex:0 0 auto;line-height:0}
.author-card .author-img{object-fit:cover}
.author-footer .author-card .author-img{width:88px;height:88px;object-fit:cover;border-radius:var(--radius-round, 50%)}
.author-footer .author-card .author-monogram{width:88px;height:88px;font-size:30px}
.author-name{margin:0;font-family:var(--font-heading);font-size:16px;font-weight:700;line-height:1.3}
.author-name a{color:var(--text-strong)}
.author-name a:hover{color:var(--primary)}
.author-job{display:block;margin-top:3px;font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:1.1px;color:var(--text-muted)}
.author-legit{margin:11px 0 0;font-size:14.5px;line-height:1.5;font-weight:600;color:var(--text-strong)}
.author-bio{margin:7px 0 0;font-size:13.5px;line-height:1.55;color:var(--text-secondary)}
.author-links{margin:10px 0 0;font-size:13px}
.author-links a{color:var(--primary);font-weight:700;border-bottom:1px solid currentColor}
.page-dates{display:flex;flex-wrap:wrap;gap:6px 20px;margin:0 0 22px;font-size:12px;color:var(--text-muted)}
.page-dates time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-secondary)}
.method-note{margin:0 0 26px;padding:17px 19px;background:var(--callout-bg);border:1px solid var(--callout-border);border-left:3px solid var(--primary)}
.method-note-title{margin:0 0 6px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--callout-text)}
.method-note p:last-child{margin:0;font-size:14px;line-height:1.6;color:var(--callout-text)}
.opening{margin:0 0 34px}
.opening .answer{margin:0;padding:22px 24px;background:var(--secondary);color:var(--white);font-family:var(--font-heading);font-size:clamp(17px,1.9vw,20px);line-height:1.45;letter-spacing:-.2px}
.essentials{margin:0;padding:20px 24px;background:var(--surface);border:1px solid var(--border);border-top:0}
.essentials-title{margin:0 0 10px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted)}
.essentials ul{margin:0;padding:0;list-style:none}
.essentials li{position:relative;padding:7px 0 7px 22px;font-size:15px;line-height:1.5;color:var(--text)}
.essentials li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:2px;background:var(--primary)}
.scope{margin:0;padding:14px 24px;background:var(--fill);border:1px solid var(--border);border-top:0;font-size:13.5px;line-height:1.55;color:var(--text-secondary)}
.scope span{font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.1px;color:var(--text-muted);margin-right:6px}
.scope a{color:var(--secondary);font-weight:700;border-bottom:1px solid currentColor}
.scope a:hover{color:var(--primary)}
.update-log{margin:0;padding:20px 22px;border-top:2px solid var(--secondary);background:var(--fill)}
.update-log-title{margin:0 0 9px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted)}
.update-log ul{margin:0;padding:0;list-style:none}
.update-log li{padding:6px 0;font-size:13.5px;line-height:1.5;color:var(--text-secondary);border-bottom:1px solid var(--border)}
.update-log li:last-child{border-bottom:0}
.update-log time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:500;color:var(--text-strong)}
@media(max-width:640px){.author-card{padding:16px}.opening .answer{padding:18px}.essentials,.scope{padding:16px 18px}}

/* Signature de tête — identité et dates sur une seule ligne. Le parcours de
   l'auteur n'est pas ici : il se lit en pied, via .author-footer. */
.author-byline{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:0 0 26px;padding-bottom:14px;border-bottom:1px solid var(--border,#D3CEC1);font-size:13px;color:var(--text-secondary,#4A554D)}
.byline-author a{color:var(--secondary,#3A4A3F);font-weight:700;border-bottom:1px solid currentColor}
.byline-author a:hover{color:var(--primary,#A65E2E)}
.author-byline .page-dates{margin:0;gap:6px 18px}

/* Pied d'article — la carte auteur complète, détachée du corps du texte. */
.author-footer{margin:38px 0 22px;border-top:2px solid var(--secondary,#3A4A3F)}
.author-footer .author-card{margin:0}

/* Signature dans le hero d'article (blog) : le hero est un aplat sombre, la
   signature doit y passer en blanc. Sans cette règle, elle hérite des couleurs
   pensées pour un fond clair et devient illisible (contraste ~1,1:1). */
.guide-hero .author-byline,
.guide-hero .author-byline .page-dates,
.guide-hero .byline-author a,
.guide-hero .page-dates time{color:#FFFFFF}
.guide-hero .author-byline{border-bottom-color:rgba(255,255,255,.28)}

/* ===== SOURCES — liens sortants cités près de l'affirmation ===== */
.source-note a[rel~="nofollow"]{color:var(--secondary);font-weight:600;border-bottom:1px solid var(--text-faint)}
.source-note a[rel~="nofollow"]:hover{color:var(--primary);border-bottom-color:var(--primary)}
.tool-table a[rel~="nofollow"]{font-weight:600;text-decoration:none;border-bottom:1px solid var(--text-faint)}
.tool-table a[rel~="nofollow"]:hover{color:var(--primary);border-bottom-color:var(--primary)}
.source-list{list-style:none;margin:0;padding:0;max-width:820px}
.source-list li{padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.source-list li:last-child{border-bottom:0}
.source-list span{display:block;margin-top:2px;font-size:11px;color:var(--text-muted)}

/* ===== BLOC 06a — compléments front (sources, article, citation) ===== */
.page-article{max-width:100%}
.page-sources{margin:56px 0 0;padding:34px 38px;background:var(--paper);max-width:860px}
.page-sources h2{font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--primary-color,#8A2B1F);margin:0 0 18px}
.source-list{margin:0;padding:0;list-style:none}
.source-list li{padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}
.source-list li:last-child{border-bottom:0}
.source-list a{color:var(--primary-color,#8A2B1F);text-decoration:underline;text-underline-offset:3px}
.source-list span{display:block;margin-top:3px;font-size:11px;color:var(--gray-600,#63666C)}
.prose blockquote{margin:34px 0;padding:26px 30px;border-left:3px solid var(--primary-color,#8A2B1F);background:var(--paper)}
.prose blockquote p{margin:0;font:600 20px/1.35 var(--serif);letter-spacing:-.03em}
.prose h2{font:600 clamp(27px,3.2vw,40px)/1.1 var(--serif);letter-spacing:-.05em;margin:46px 0 20px}
.prose h2:first-child{margin-top:0}
@media(max-width:800px){.page-sources{padding:24px 20px}}
/* ===== FIN BLOC 06a ===== */

/* ===== BLOC DONNEES SOURCEES — citation au plus près du chiffre ===== */
.outil-source{margin:0 0 26px;font-size:11px;line-height:1.7;color:var(--gray-600,#63666C)}
.outil-source a,.source-note a{color:var(--primary-color,#8A2B1F);text-decoration:underline;text-underline-offset:2px}
.source-note{display:inline}
.outil-table .petit{display:block;margin-top:5px;font-size:11px;line-height:1.55;color:var(--gray-600,#63666C)}
.outil-resultat h3{font:600 22px/1.15 var(--serif);letter-spacing:-.04em;margin:34px 0 18px}
/* ===== FIN BLOC DONNEES SOURCEES ===== */

/* ===== BLOC HERO PLEINE SECTION =====
 * L'image occupe toute la section et le texte se pose dessus. Placé en fin de
 * feuille : ce bloc doit gagner sur les règles .hero d'origine ET sur leurs
 * media queries, sinon la mise en page mobile du builder reprend la main.
 *
 * Le voile ardoise n'est pas décoratif : il garantit le contraste du texte quelle
 * que soit la photo servie. Sur une zone d'image entièrement blanche, le fond
 * effectif reste autour de #646464, soit 5,9:1 en blanc — au-dessus du seuil AA.
 * C'est ce qui permet de remplacer la photo en 07c sans repasser sur le contraste.
 *
 * Un seul bandeau sombre par page, celui du titre (direction artistique) : c'est
 * celui-ci. Le reste de la home reste sur fond craie.
 */
.hero{position:relative;display:grid;place-items:center;grid-template-columns:1fr!important;
      min-height:min(76vh,700px);padding:0;margin:0;overflow:hidden;isolation:isolate}
.hero-image{position:absolute;inset:0;z-index:0;margin:0;height:100%;width:100%}
.hero-image img{width:100%;height:100%;object-fit:cover;
                filter:saturate(.62) contrast(1.04) brightness(.78)}
.hero-image::after{content:"";position:absolute;inset:0;
                   background:linear-gradient(180deg,rgba(38,40,43,.62) 0%,rgba(38,40,43,.70) 55%,rgba(38,40,43,.80) 100%)}
.hero-copy{position:relative;z-index:2;width:min(var(--max),100% - 10vw);margin-inline:auto;
           padding:104px 0;text-align:left}
/* Sur le bandeau sombre, l'accent grenat devient illisible : la craie prend le
   relais, comme sur les autres blocs sombres du front (.note, .breakpoint, footer). */
.hero .eyebrow{color:var(--cream)}
.hero h1{color:var(--cream)}
.hero h1 em{color:var(--cream)}
.hero .lead{color:var(--cream);max-width:620px}
.hero .micro{color:var(--cream);margin-top:26px}
.hero .button{background:var(--wine);border-color:var(--wine);color:#fff}
.hero .button:hover{background:#6F211A;border-color:#6F211A}
.hero figcaption{position:absolute;right:18px;bottom:16px;left:auto;z-index:3;
                 color:var(--cream);background:rgba(38,40,43,.72);padding:8px 11px}
@media(max-width:800px){
  .hero{min-height:min(70vh,560px);padding:0;margin:0}
  .hero-image{position:absolute;inset:0;height:100%;margin:0}
  .hero-copy{width:min(100% - 10vw,var(--max));padding:72px 0}
  .hero .lead{max-width:none}
  .hero figcaption{right:5vw;bottom:12px}
}
/* ===== FIN BLOC HERO PLEINE SECTION ===== */

/* ===== VISUELS 07c — marque et figures illustrées =====
   Le front n'avait aucune règle d'image hors .hero-image : le lockup de marque
   était typographique et les pages pilier n'avaient aucun emplacement. */
.brand-logo{height:34px;width:auto;display:block}
.footer-brand .brand-logo{height:32px}
@media(max-width:800px){.brand-logo{height:27px}}

/* Hero de pilier : sous l ouverture normée, donc jamais au-dessus du pli. */
.pilier-hero-figure{margin:8px 0 44px;max-width:none}
.pilier-hero-figure img{display:block;width:100%;height:auto;
  filter:saturate(.72) contrast(1.04)}

/* Illustration de section : logée dans .prose (750px), hauteur libre. */
.pilier-figure{margin:26px 0 30px}
.pilier-figure img{display:block;width:100%;height:auto;border:1px solid var(--line);
  filter:saturate(.72) contrast(1.04)}