/*
Theme Name: Pâte à Chou
Theme URI: https://pateachou.fr
Author: Seobooster
Description: Fiche technique d'atelier — la couleur du site, ce sont les photos ; le bleu est l'outil de mesure.
Version: 2.0.0
Text Domain: pateachou
*/

/* ============ RESET ============ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papier);color:var(--encre);font-family:var(--font-corps);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
button{font:inherit;cursor:pointer;background:none;border:0}
table{border-collapse:collapse;width:100%}

/* ============ POLICES (self-hosted, P-086) ============ */
@font-face{font-family:"Young Serif";src:url("assets/fonts/youngserif-regular-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F}
@font-face{font-family:"Young Serif";src:url("assets/fonts/youngserif-regular-latinext.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/instrumentsans-latin.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/instrumentsans-latinext.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}

/* ============ JETONS — 1 fond neutre + 1 accent (P-116), clair ET sombre (P-110/P-351) ============ */
:root{
	--papier:#F0E8D8;
	--surface:#FAF5EA;
	--encre:#1F1A15;
	--encre-2:#5B5148;
	--accent:#1E5266;
	--accent-hover:#163D4C;
	--filet:rgba(31,26,21,.18);
	--bouton-encre:#F4F1EC;

	/* Jetons fixes : ne changent JAMAIS de valeur, ils habillent les bandes
	   perpétuellement sombres (héros, tuiles, "le geste", pied) quel que soit
	   le thème. ⛔ Ne jamais poser --accent/--encre (adaptatifs) sur --four :
	   en clair, --accent (#1E5266) sur --four (#1B140D) ≈ 1.9:1, illisible. */
	--four:#1B140D;
	--papier-fixe:#F4F1EC;
	--encre-fixe:#1B140D;
	--accent-fixe:#8AD0E6;

	--ligne:var(--filet); /* alias de compatibilité : gabarits non repris qui citent l'ancien nom */
	--font-titre:"Young Serif",Georgia,serif;
	--font-corps:"Instrument Sans",-apple-system,"Segoe UI",Arial,sans-serif;
	--laize:1240px;
	--rayon:2px;
}
@media(prefers-color-scheme:dark){
	:root:not([data-theme="light"]){
		--papier:#14100D;
		--surface:#1F1913;
		--encre:#EDE7DD;
		--encre-2:#B8AFA0;
		--accent:#6FA8C4;
		--accent-hover:#8FCBE0;
		--filet:rgba(237,231,221,.16);
		--bouton-encre:#14110C;
	}
}
:root[data-theme="dark"]{
	--papier:#14100D;
	--surface:#1F1913;
	--encre:#EDE7DD;
	--encre-2:#B8AFA0;
	--accent:#6FA8C4;
	--accent-hover:#8FCBE0;
	--filet:rgba(237,231,221,.16);
	--bouton-encre:#14110C;
}

/* ============ TYPOGRAPHIE ============ */
h1,h2,h3,.font-titre{font-family:var(--font-titre);font-weight:400;letter-spacing:-.01em}
h1{font-size:clamp(32px,4.4vw,52px);line-height:1.08}
h2{font-size:clamp(24px,2.6vw,32px);line-height:1.15;margin-bottom:24px}
h3{font-size:19px;line-height:1.25}
.conteneur{max-width:var(--laize);margin-inline:auto;padding-inline:20px}
.section{padding-block:clamp(64px,8vw,128px)}
*,.cote_valeur,.tuile_nombre,.reglette_legende li{font-variant-numeric:lining-nums tabular-nums}

/* ============ UTILITAIRES ============ */
.a11y_masque{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lien_evitement{position:absolute;left:-999px;top:0;background:var(--four);color:var(--papier-fixe);padding:10px 16px;z-index:200}
.lien_evitement:focus{left:12px;top:12px}
.champ_leurre{position:absolute;left:-9999px}

/* ============ LA COTE — le procédé signature (§8.1) ============ */
.cote_filet{display:block;height:1px;background:currentColor;opacity:.7;position:relative;margin-block:4px}
.cote_filet::before,.cote_filet::after{content:"";position:absolute;top:-4.5px;width:1px;height:10px;background:currentColor;opacity:1;transform:rotate(45deg)}
.cote_filet::before{left:0}
.cote_filet::after{right:0}
.cote_valeur{font-variant-numeric:lining-nums tabular-nums;letter-spacing:.01em}

/* ============ BOUTONS ============ */
.bouton{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:var(--bouton-encre);padding:13px 22px;border-radius:var(--rayon);font-weight:500;text-decoration:none;transition:background .15s}
.bouton:hover{background:var(--accent-hover)}
.bouton_fantome{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--encre);border:1px solid var(--filet);padding:12px 20px;border-radius:var(--rayon);text-decoration:none}
.lien_texte{color:var(--accent);text-decoration:underline;text-underline-offset:3px;font-weight:500}

/* ============ MARQUE / LOGO ============ */
.marque{display:inline-flex;align-items:center;gap:10px;color:var(--encre)}
.marque_glyphe{flex:none}
.marque_mot{color:var(--encre)}
.marque_mot text{font-family:var(--font-titre);font-size:22px;letter-spacing:-.02em;fill:currentColor}
.bande_four .marque{color:var(--papier-fixe)}

/* ============ EN-TÊTE — une seule barre, 72px / 60px ============ */
.entete{position:relative;background:var(--papier);border-bottom:1px solid var(--filet)}
.entete_barre{display:flex;align-items:center;gap:0;height:72px;position:relative}
.entete_logo{display:flex;align-items:center;flex:none;margin-right:64px}
.entete_nav{flex:1 1 auto;display:flex;justify-content:flex-end}
.entete_nav_liste{display:flex;gap:28px;align-items:center}
.entete_nav_item{list-style:none}
.entete_nav_lien{display:inline-flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--encre);font-weight:500;font-size:15px;text-transform:lowercase;padding-block:4px}
.entete_nav_lien:hover{color:var(--accent)}
.entete_nav_item.current-menu-item .entete_nav_lien,
.entete_nav_item.current_page_item .entete_nav_lien{color:var(--encre)}
.entete_nav_item.current-menu-item .entete_nav_lien::after,
.entete_nav_item.current_page_item .entete_nav_lien::after{content:"";display:block;height:1px;background:var(--accent);position:relative}
.entete_nav_item.current-menu-item .entete_nav_lien::before,
.entete_nav_item.current_page_item .entete_nav_lien::before{content:none}
.entete_cta{flex:none;font-size:14px;padding:10px 18px;margin-left:32px}
.entete_bascule{display:none;flex:none;color:var(--encre)}
.entete_bascule svg{stroke:currentColor;stroke-width:1.6;fill:none}
.entete_jauge{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--accent);transition:width .1s linear}
.entete_panneau{display:none}

@media(max-width:900px){
	.entete_barre{height:60px;gap:16px}
	.entete_logo{margin-right:0}
	.entete_nav{display:none}
	.entete_cta{display:none}
	.entete_bascule{display:flex}
	.entete_panneau{position:fixed;inset:0;top:60px;background:var(--papier);transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:150;overflow-y:auto}
	.entete_panneau.est_ouvert{opacity:1;transform:translateY(0);pointer-events:auto;display:block}
	.entete_panneau_liste{padding:12px 20px}
	.entete_panneau_liste li{border-bottom:1px solid var(--filet)}
	.entete_panneau_liste a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:20px 4px;text-decoration:none;color:var(--encre);font-family:var(--font-titre);font-size:28px}
	.entete_panneau_texte{display:flex;flex-direction:column;gap:4px}
	.entete_panneau_sous{font-family:var(--font-corps);font-size:13px;color:var(--encre-2);font-weight:400}
	.entete_panneau_compte{flex:none;font-family:var(--font-corps);font-size:14px;color:var(--encre-2)}
}

/* ============ HÉROS — plein cadre, coté ============ */
.hero{position:relative;height:78vh;min-height:520px;display:flex;align-items:flex-end;overflow:hidden}
.hero_photo{position:absolute;inset:0;margin:0}
.hero_photo img{width:100%;height:100%;object-fit:cover}
/* Voile : ne charge que le quart bas-gauche (où vit le texte), laisse le point de
   blanc du papier de cuisson respirer ailleurs sur la photo (corrigé 27/08). */
.hero_voile{position:absolute;inset:0;background:linear-gradient(to top right,color-mix(in srgb,var(--four) 78%,transparent) 0%,transparent 62%)}
/* Les cotes vivent sur la partie CLAIRE de la photo : un accent bleu pâle y disparaît
   (constaté à la capture du 27/08). Encre claire + ombre portée, et la valeur sur une
   pastille sombre pour qu'elle se lise quel que soit le pixel qui passe dessous. */
.hero_cote{position:absolute;color:var(--papier-fixe);font-size:13px;display:none;filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--four) 85%,transparent))}
.hero_cote .cote_valeur{display:inline-block;background:color-mix(in srgb,var(--four) 72%,transparent);padding:2px 7px;border-radius:999px;backdrop-filter:blur(2px)}
@media(min-width:701px){.hero_cote{display:block}}
/* Une seule échelle (≈42px/cm), calées sur la moitié droite — nette — de la photo.
   Les deux cotes restent AU-DESSUS de la ligne du titre : à 46 % la seconde tombait
   en plein sur « huit desserts » (capture du 27/08), pastille et filet compris. */
.hero_cote_1{top:19%;left:50%;width:189px}
.hero_cote_2{top:31%;left:73%;width:220px}
.hero_texte{position:relative;color:var(--papier-fixe);padding-block:40px 56px;max-width:var(--laize)}
.hero_texte > *{max-width:720px}
.hero_surtitre{color:var(--papier-fixe);font-size:14px;text-shadow:0 1px 3px color-mix(in srgb,var(--four) 70%,transparent);letter-spacing:.03em;margin-bottom:10px;text-transform:lowercase}
.hero_titre{color:var(--papier-fixe);font-size:clamp(40px,6.2vw,84px);line-height:.98;letter-spacing:-.015em;max-width:18ch}
.hero_actions{display:flex;align-items:center;gap:22px;margin-top:26px;flex-wrap:wrap}
.hero_actions .lien_texte{color:var(--papier-fixe);text-decoration-color:var(--accent-fixe)}
@media(max-width:700px){
	.hero{height:auto;min-height:0;flex-direction:column;align-items:stretch}
	.hero_photo{position:relative;height:42vh}
	.hero_texte{background:var(--papier);color:var(--encre);padding:28px 20px 36px;max-width:none}
	.hero_texte > *{max-width:none}
	.hero_titre{color:var(--encre)}
	/* Sous 701px le texte du hero passe sur le PAPIER, plus sur la photo : l'ombre
	   portee heritee y fabrique un halo et delave le surtitre (capture 390px du 27/08). */
	.hero_surtitre{color:var(--accent);text-shadow:none}
	.hero_actions .lien_texte{color:var(--accent);text-decoration-color:var(--accent)}
}

/* ============ BANDE FOUR / SURFACE / TUILES ============ */
.bande_four{background:var(--four);color:var(--papier-fixe)}
.bande_four h2,.bande_four h3{color:var(--papier-fixe)}
.bande_four .cote_valeur{color:var(--accent-fixe)}
.bande_surface{background:var(--surface);padding-block:56px}
.bande_four .conteneur{padding-block:44px 40px}
/* Le seul chevauchement autorisé du site (§4 DA) : la section reste transparente,
   c'est le conteneur (1240px) qui porte le fond "four" — la plaque de choux du
   héros reste visible de part et d'autre du bloc de chiffres. Bug (27/08) : la
   marge négative mangeait le dernier lien du héros en mobile — annulée sous 700px. */
.bande_chevauche{background:transparent;margin-top:-40px;position:relative;z-index:2;padding-block:0}
.bande_chevauche .conteneur{background:var(--four);border-radius:var(--rayon)}
@media(max-width:700px){
	.bande_chevauche{margin-top:0}
	.bande_chevauche .conteneur{padding-block:32px}
}

.tuiles{display:grid;grid-template-columns:repeat(4,1fr)}
.tuile{padding:20px 18px;border-left:1px solid rgba(244,241,236,.18);text-align:left}
.tuile:first-child{border-left:0}
.tuile_nombre{display:block;font-family:var(--font-titre);font-size:clamp(32px,4.2vw,56px);line-height:1;color:var(--papier-fixe)}
.tuile_label{display:block;margin-top:8px;font-size:13px;color:var(--accent-fixe);text-transform:lowercase}
/* En deux colonnes a 390px, 32px coupent « 35 choux » sur deux lignes et la tuile
   n'affiche plus que « 35 » au premier ecran (capture du 27/08). */
@media(max-width:700px){.tuiles{grid-template-columns:repeat(2,1fr)}.tuile_nombre{font-size:26px}.tuile{border-left:0;border-top:1px solid rgba(244,241,236,.18)}.tuile:nth-child(1),.tuile:nth-child(2){border-top:0}}

.reglette{margin-top:32px;margin-bottom:40px}
.reglette_titre{display:block;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--encre-2);margin-bottom:10px}
.bande_four .reglette_titre{color:var(--accent-fixe)}
.reglette_barre{position:relative;display:flex;height:14px;width:100%;overflow:hidden;border-radius:0}
.reglette_barre::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(to right,var(--papier) 0 1px,transparent 1px 10%)}
.reglette_segment{display:block;height:100%}
/* --papier-fixe est correct dans .bande_four (accueil, fond sombre fixe) mais le
   même composant est réutilisé tel quel dans l'article, posé sur --papier
   (adaptatif) : texte quasi invisible en clair. .article rétablit une couleur
   adaptative sans toucher à l'usage accueil (mesuré 27/08/2026). */
.reglette_legende{display:flex;flex-wrap:wrap;gap:16px 24px;margin-top:14px;font-size:14px;color:var(--papier-fixe)}
.reglette_legende li{display:flex;align-items:center;gap:8px}
.reglette_pastille{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none}
.article .reglette_legende{color:var(--encre-2)}

/* ============ GRILLES / CARTES ============ */
.grille{display:grid;gap:24px}
.grille_3{grid-template-columns:repeat(3,1fr)}
.grille_4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grille_3,.grille_4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.grille_3,.grille_4{grid-template-columns:1fr}}
.carte_lien{text-decoration:none;color:var(--encre);display:block}
.carte_photo{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:var(--rayon);margin-bottom:12px}
.carte_photo img{width:100%;height:100%;object-fit:cover}
.carte_titre{font-size:17px;font-weight:400}
/* La pastille de cote en surimpression (§8.7) — remplace les toques (interdit
   nommé de la DA, corrigé 27/08) : elle porte la vraie cote de la pièce. */
.pastille_cote{position:absolute;left:8px;bottom:8px;background:color-mix(in srgb,var(--four) 82%,transparent);color:var(--papier-fixe);padding:4px 8px;border-radius:var(--rayon);font-size:12px;line-height:1}

/* ============ PAS À PAS ============ */
.pas_a_pas{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pas_a_pas_etape img{aspect-ratio:1/1;object-fit:cover;border-radius:var(--rayon)}
.pas_a_pas_etape figcaption{margin-top:10px;color:var(--papier-fixe);font-size:14px}
.pas_a_pas_etape figcaption .cote_valeur{color:var(--accent-fixe);margin-right:8px}
@media(max-width:700px){.pas_a_pas{grid-template-columns:1fr}}

/* ============ POURQUOI ÇA RATE (sans orange — plus de couleur sémantique) ============ */
.pourquoi_ca_rate{border-left:2px solid var(--accent);padding:10px 16px;margin-block:14px;background:var(--papier)}

/* ============ SORTIES DU FOUR ============ */
.sorties_liste{border-top:1px solid rgba(244,241,236,.18)}
.sorties_item{border-bottom:1px solid rgba(244,241,236,.18)}
.sorties_item a{display:flex;justify-content:space-between;padding:16px 4px;text-decoration:none;color:var(--papier-fixe)}
.sorties_item .cote_valeur{color:var(--accent-fixe)}

/* ============ FORMULAIRES ============ */
.formulaire{margin-top:20px}
.champ{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}
.champ label{font-size:13px;color:var(--encre-2)}
.champ input,.champ textarea{font:inherit;padding:11px 12px;border:1px solid var(--filet);border-radius:var(--rayon);background:var(--papier);color:var(--encre)}
.bande_four .champ input{background:rgba(244,241,236,.08);color:var(--papier-fixe);border-color:rgba(244,241,236,.25)}
.champ_ligne{flex-direction:row;gap:10px}
.champ_ligne input{flex:1}
.confirmation{color:var(--accent-fixe);margin-bottom:12px}
.bande_surface .confirmation{color:var(--accent)}

/* ============ FIL D'ARIANE ============ */
.fil_ariane{display:flex;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--encre-2);padding-block:16px}
.fil_ariane a{color:var(--encre-2);text-decoration:none}
.fil_ariane_separateur{opacity:.5}

/* ============ FICHE RECETTE — 4 cases à filets verticaux (§3.9) ============ */
.fiche_recette{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--filet);border-radius:var(--rayon);margin-block:24px}
.fiche_recette > div{padding:16px 18px;border-left:1px solid var(--filet)}
.fiche_recette > div:first-child{border-left:0}
.fiche_recette dt{font-size:12px;color:var(--encre-2)}
.fiche_recette dd{margin:2px 0 0;font-family:var(--font-titre);font-size:20px}
@media(max-width:600px){
	.fiche_recette{grid-template-columns:repeat(2,1fr)}
	.fiche_recette > div:nth-child(3){border-left:0}
}
/* Difficulté — sort des photos (interdit de la DA), devient 3 traits de cote,
   pleins ou vides, dans la fiche de l'article seulement (§3.3). */
.fiche_difficulte{display:flex;align-items:center;gap:10px;margin-block:0 24px;font-size:12px;color:var(--encre-2)}
.toques{display:inline-flex;gap:6px;align-items:center}
.toque{width:14px;height:2px;border:1px solid var(--accent);border-radius:0}
.toque.est_active{background:var(--accent)}

/* ============ BANDEAU DE RUBRIQUE (photographique) ============ */
.rubrique_bandeau{position:relative;height:38vh;min-height:280px;display:flex;align-items:flex-end;overflow:hidden}
.rubrique_bandeau_photo{position:absolute;inset:0;margin:0}
.rubrique_bandeau_photo::after{content:"";position:absolute;inset:0;background:var(--four);opacity:.5}
.rubrique_bandeau_photo img{width:100%;height:100%;object-fit:cover}
.rubrique_bandeau_texte{position:relative;color:var(--papier-fixe);padding-block:28px}
.rubrique_bandeau_texte h1{color:var(--papier-fixe)}
.rubrique_bandeau_texte .hero_surtitre{color:var(--accent-fixe)}
.rubrique_bandeau .hub_compteur{color:var(--papier-fixe);opacity:.85}
@media(max-width:700px){.rubrique_bandeau{height:26vh;min-height:200px}}

/* ============ HUB (rubriques) ============ */
.hub_compteur{color:var(--encre-2);font-size:14px;margin-bottom:28px}
.arbre_famille{margin-top:48px;padding-top:32px;border-top:1px solid var(--filet)}
.mot_lexique{border-bottom:1px dotted var(--encre-2);cursor:help}

/* ============ TABLEAUX (le socle enveloppe, on style) ============ */
.sbs_tableau{overflow-x:auto;margin-block:20px}
.sbs_tableau table{min-width:480px}
.sbs_tableau th,.sbs_tableau td{padding:10px 12px;border-bottom:1px solid var(--filet);text-align:left;font-size:14px}
.sbs_tableau th{color:var(--encre-2);font-weight:500}

/* ============ CARTOUCHE D'ATELIER (bloc auteur, §8.6) ============ */
.cartouche{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--filet);margin-block:40px}
.cartouche_cellule{padding:14px 18px;border-left:1px solid var(--filet)}
.cartouche_cellule:first-child{border-left:0}
.cartouche_label{display:block;font-size:11px;color:var(--encre-2);text-transform:lowercase;margin-bottom:4px}
.cartouche_valeur{font-family:var(--font-titre);font-size:16px}
.cartouche_legende{grid-column:1/-1;border-top:1px solid var(--filet);padding:12px 18px;font-size:13px;color:var(--encre-2)}
@media(max-width:600px){.cartouche{grid-template-columns:1fr}.cartouche_cellule{border-left:0;border-top:1px solid var(--filet)}.cartouche_cellule:first-child{border-top:0}}

/* ============ SOMMAIRE ARTICLE ============ */
/* Séparation d'avec la barre de pesée au-dessus (elle est illisible sans ça, mesuré
   27/08/2026) + le sommaire traité comme un encadré à part sur mobile, avec son
   libellé — pas la suite de la légende. */
.article_mise_en_page{display:grid;grid-template-columns:1fr;gap:28px;margin-top:40px}
.sommaire{border:1px solid var(--filet);border-radius:var(--rayon);padding:20px 22px}
.sommaire::before{content:"sommaire";display:block;font-size:13px;font-weight:500;color:var(--encre-2);margin-bottom:14px;padding-left:32px;background:linear-gradient(var(--filet),var(--filet)) no-repeat left center;background-size:24px 1px}
.sommaire ul{display:flex;flex-direction:column;gap:10px}
.sommaire a{text-decoration:none;color:var(--encre-2);display:block}
.sommaire a:hover,.sommaire a.est_actif{color:var(--encre)}
@media(min-width:1200px){
	/* justify-content:start (et non center) : la grille se cale sur le bord gauche
	   du .conteneur (120px), au lieu de se recentrer pour elle-même — c'était la
	   cause des trois bords gauches de la page article (corrigé 27/08). */
	.article_mise_en_page{grid-template-columns:200px minmax(0,68ch);gap:48px;justify-content:start}
	.sommaire{position:sticky;top:96px;align-self:start;font-size:13px;border:0;padding:0}
	.sommaire::before{margin-bottom:16px}
	.sommaire ul{gap:10px}
	.sommaire a{border-left:1px solid var(--filet);padding-left:10px}
	.sommaire a:hover,.sommaire a.est_actif{border-left-color:var(--accent)}
}
.contenu_article{max-width:68ch;margin-inline:auto}
.contenu_article p{font-size:18px;line-height:1.72}
.contenu_article img,.contenu_article figure{max-width:min(100vw,900px);width:100%;margin-inline:auto;border-radius:var(--rayon)}
@media(min-width:1200px){.contenu_article img,.contenu_article figure{margin-inline:calc(50% - 50vw + (100vw - min(100vw,900px))/2)}}

/* 520 px repoussaient la recette entiere sous la ligne de flottaison en 1440x900
   (capture du 27/08) : la photo doit situer la piece, pas occuper l ecran. */
.hero_article{max-height:min(42vh,380px);overflow:hidden;border-radius:var(--rayon);margin-bottom:24px}
.hero_article img{width:100%;object-fit:cover;max-height:min(42vh,380px)}

/* ============ PIED ============ */
.pied{background:var(--four);color:var(--papier-fixe);padding-block:48px 28px}
.pied a{color:var(--papier-fixe);text-decoration:none}
.pied_grille{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.pied_colonne h3{font-size:14px;color:var(--accent-fixe);margin-bottom:14px;text-transform:lowercase;font-family:var(--font-corps);font-weight:500}
.pied_colonne ul{display:flex;flex-direction:column;gap:8px;font-size:14px}
.pied_bas{margin-top:36px;padding-top:20px;border-top:1px solid rgba(244,241,236,.18);font-size:13px;color:var(--accent-fixe)}
@media(max-width:800px){.pied_grille{grid-template-columns:repeat(2,1fr)}}

/* ============ PARTENAIRE ============ */
.partenaire{background:var(--papier);border-top:1px solid var(--filet)}
.partenaire_ligne{display:flex;gap:10px;align-items:baseline;padding-block:16px;font-size:13px;color:var(--encre-2)}
.partenaire_ligne a{color:var(--encre);text-decoration:underline}
.partenaire_etiquette{text-transform:lowercase}