/*
Theme Name: Virtual Writer
Theme URI: https://virtualwriter.net
Author: Virtual Writer
Description: Le carnet d'atelier joyeux d'un rédacteur qui publie. Magazine sur l'écriture assistée par IA, le marketing de contenu, la création de sites et la formation numérique.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: virtual-writer
*/

:root { color-scheme: light; }

*, *::before, *::after { box-sizing: border-box; min-width: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}
body { margin: 0; overflow-x: hidden; }
img, svg { max-width: 100%; display: block; }
a { color: inherit; }
button { font: inherit; }
ul, ol { margin: 0; padding: 0; }
figure { margin: 0; }

:root {
	
	--papier: #FAF9FC;
	--papier-creux: #F2EFF6;
	--lignes-bloc: #EEEAF3;
	--carte: #FFFFFF;
	--encre: #221325;
	--encre-douce: #5A4A5C;
	--filet: #E3DCE8;

	--magenta: #B5009F;
	--magenta-fonce: #8F0080;
	--magenta-vif: #D41BC0;
	--surligneur: #F6BDEE;
	--magenta-pale: #FBE3F6;
	--rose-nuit: #F59BE8;
	--lilas-nuit: #C9BFCB;

	--erreur: #B42318;
	--succes: #16781F;
	--focus: #B5009F;

	--f-titre: 'Calistoga', Georgia, 'Times New Roman', serif;
	--f-corps: 'Ysabeau Office', Georgia, 'Times New Roman', serif;
	--f-machine: 'Courier Prime', 'Courier New', monospace;

	--rayon-s: 6px;
	--rayon-m: 14px;
	--rayon-full: 50%;
	--conteneur: 1240px;
	--gouttiere: 24px;
	--marge-copie: 2px;

	--ombre-encre: 4px 4px 0 0 var(--encre);
	--ombre-encre-survol: 6px 6px 0 0 var(--encre);
}

body {
	background: var(--papier);
	color: var(--encre);
	font-family: var(--f-corps);
	font-weight: 400;
	font-size: 18px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	
	font-variant-ligatures: no-common-ligatures;
}

h1, h2, h3, .jr-titre-carte {
	font-family: var(--f-titre);
	font-weight: 400;
	font-synthesis: none; 
	line-height: 1.1;
	margin: 0 0 0.5em;
	color: var(--encre);
	letter-spacing: -0.01em;
}
h3 { font-family: var(--f-corps); font-weight: 700; font-size: 22px; line-height: 1.3; }

h1 { font-size: 48px; }
h1.jr-h1-accueil { font-size: 60px; line-height: 1.05; }
h2 { font-size: 30px; line-height: 1.2; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

.jr-chapo, .jr-chapo-article { font-family: var(--f-corps); font-weight: 500; font-size: 21px; line-height: 1.5; color: var(--encre-douce); }

.jr-tapuscrit, .jr-fil-heure, .jr-date-machine { font-family: var(--f-machine); font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--encre-douce); }
.jr-tapuscrit-court { display: none; }

@media (max-width: 640px) {
	
	h1.jr-h1-accueil { font-size: 38px; line-height: 1.1; }
	h1 { font-size: 32px; }
	h2 { font-size: 25px; }
	.jr-chapo, .jr-chapo-article { font-size: 19px; }
	.jr-tapuscrit-long { display: none; }
	.jr-tapuscrit-court { display: inline; }
}

.jr-corps p { max-width: 66ch; }

.jr-enveloppe { max-width: var(--conteneur); margin: 0 auto; padding: 0 16px; }
@media (min-width: 700px) { .jr-enveloppe { padding: 0 24px; } }

.jr-bande { padding: 96px 0; }
@media (max-width: 640px) { .jr-bande { padding: 56px 0; } }
.jr-bande + .jr-bande { border-top: none; } 

.jr-fond-blanc.jr-bande + .jr-fond-blanc.jr-bande { padding-top: 48px; }
@media (max-width: 640px) { .jr-fond-blanc.jr-bande + .jr-fond-blanc.jr-bande { padding-top: 28px; } }

.jr-fond-papier { background: var(--papier); }
.jr-fond-blanc { background: var(--carte); }
.jr-fond-aubergine { background: var(--encre); color: var(--lilas-nuit); }
.jr-fond-aubergine h2, .jr-fond-aubergine h1 { color: #FFFFFF; }
.jr-fond-magenta-pale { background: var(--magenta-pale); }
.jr-fond-papier-creux { background: var(--papier-creux); }
.jr-fond-magenta { background: var(--magenta); color: #FFFFFF; }
.jr-fond-magenta h2 { color: #FFFFFF; }

.jr-papier-regle {
	background-color: var(--papier);
	background-image: repeating-linear-gradient(to bottom, transparent 0 31px, var(--lignes-bloc) 31px 32px);
}

.jr-marge-copie { position: relative; padding-left: 20px; }
.jr-marge-copie::before {
	content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--marge-copie);
	background: var(--magenta);
}
@media (max-width: 640px) { .jr-marge-copie { padding-left: 8px; } }

.jr-pied-mouche { color: var(--magenta); font-family: var(--f-titre); font-size: 0.75em; margin-right: 0.3em; }

.jr-mot-surligne { display: inline; }

.jr-surlign-hote { position: relative; display: inline-block; white-space: nowrap; isolation: isolate; }
.jr-surlign-forme {
	position: absolute; left: -4px; right: -4px; bottom: 0; top: 40%;
	width: calc(100% + 8px); height: 60%;
	transform: rotate(-1.5deg);
	z-index: -1; pointer-events: none;
}
.jr-surlign-forme path { fill: var(--surligneur); }
.jr-surlign-texte { position: relative; }

.jr-fond-magenta .jr-surlign-texte,
.jr-fond-aubergine .jr-surlign-texte { color: #FFFFFF; }
.jr-fond-magenta .jr-surlign-forme path { fill: var(--encre); }
.jr-fond-aubergine .jr-surlign-forme path { fill: #B5009F; }

.jr-bouton {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5em;
	font-family: var(--f-corps); font-weight: 700; font-size: 16px;
	min-height: 44px; padding: 0.75em 1.4em;
	border: 2px solid var(--encre); border-radius: var(--rayon-s);
	text-decoration: none; cursor: pointer;
	transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
}
.jr-bouton--pleine { background: var(--magenta); color: #FFFFFF; border-color: var(--encre); box-shadow: var(--ombre-encre); }
.jr-bouton--pleine:hover, .jr-bouton--pleine:focus-visible { box-shadow: var(--ombre-encre-survol); transform: translate(-1px, -1px); background: var(--magenta-fonce); }
.jr-bouton--pleine:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 0 var(--encre); }

.jr-bouton--secondaire { background: var(--carte); color: var(--encre); box-shadow: var(--ombre-encre); }
.jr-bouton--secondaire:hover, .jr-bouton--secondaire:focus-visible { box-shadow: var(--ombre-encre-survol); transform: translate(-1px, -1px); }
.jr-bouton--secondaire:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 0 var(--encre); }

.jr-fond-magenta .jr-bouton--pleine, .jr-fond-aubergine .jr-bouton--pleine { background: #FFFFFF; color: var(--encre); border-color: var(--encre); }
.jr-fond-magenta .jr-bouton--secondaire, .jr-fond-aubergine .jr-bouton--secondaire { background: transparent; color: #FFFFFF; border-color: #FFFFFF; box-shadow: 4px 4px 0 0 rgba(255,255,255,.5); }

.jr-lien-texte { color: var(--magenta); font-weight: 700; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.jr-lien-texte:hover { text-decoration-style: wavy; }

a, button, input, select, textarea, summary { min-height: 24px; }
.jr-bouton, .jr-nav-lien, .jr-nav-mobile-item, .jr-loupe-bouton { min-height: 44px; }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 2px; }

.jr-vignette { position: relative; display: block; overflow: visible; border-radius: var(--rayon-m); }
.jr-vignette--carte { aspect-ratio: 4 / 3; }
.jr-vignette--une { aspect-ratio: 3 / 2; }
.jr-vignette-img, .jr-vignette-repli { width: 100%; height: 100%; object-fit: cover; border-radius: var(--rayon-m); display: block; }
.jr-vignette-repli { display: grid; place-items: center; background: var(--rub-fond, var(--magenta-pale)); color: var(--rub, var(--magenta)); }
.jr-vignette-repli .jr-picto { width: 40%; height: 40%; }

.jr-onglet {
	position: absolute; top: -10px; left: 14px; z-index: 2;
	background: var(--rub, var(--magenta)); color: #FFFFFF;
	font-family: var(--f-machine); font-weight: 700; font-size: 11px; letter-spacing: 0.06em;
	text-transform: uppercase; padding: 6px 10px 5px; border-radius: 6px 6px 0 0;
}

.jr-annotation { position: absolute; z-index: 3; right: 8%; bottom: 10%; width: 90px; color: var(--magenta-vif); }
.jr-annotation-trace path { fill: none; stroke: var(--magenta-vif); stroke-width: 3; stroke-linecap: round; }
.jr-annotation-bulle {
	position: absolute; left: 55%; top: -6px; transform: translateY(-100%);
	background: var(--papier); color: var(--encre); border: 1.5px solid var(--encre);
	border-radius: var(--rayon-s); padding: 4px 8px; font-family: var(--f-machine); font-weight: 700;
	font-size: 11px; text-transform: uppercase; white-space: nowrap;
}
@media (max-width: 640px) { .jr-annotation { width: 64px; } }

.jr-picto, .jr-illustration { overflow: visible; }

.jr-illustration--scene { width: 100%; height: auto; display: block; min-width: 260px; }
.jr-p-trait { fill: none; stroke: var(--encre); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.jr-p-aplat { fill: var(--magenta-pale); transform: translate(3px, 3px); }
.jr-p-aplat-trait { fill: var(--magenta-pale); stroke: var(--encre); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.jr-p-vif { fill: var(--magenta-vif); }
.jr-p-vif-trait { fill: none; stroke: var(--magenta-vif); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.jr-vignette-repli .jr-p-trait, .jr-vignette-repli .jr-p-aplat-trait, .jr-vignette-repli .jr-p-vif-trait { stroke: var(--rub, var(--encre)); }
.jr-vignette-repli .jr-p-aplat { fill: var(--carte); }

.jr-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--encre); text-decoration: none; }
.jr-logo-mark { flex: none; }
.jr-logo-mot { font-family: var(--f-titre); font-size: 21px; line-height: 1.02; white-space: nowrap; }
.jr-fond-aubergine .jr-logo, .jr-fond-aubergine .jr-logo-mark { color: #FFFFFF; }
.jr-fond-aubergine .jr-logo-mark { --logo-aplat: #3A2140; --logo-accent: var(--rose-nuit); }

.jr-tete { position: sticky; top: 0; z-index: 40; background: var(--carte); border-bottom: 1.5px solid color-mix(in srgb, var(--encre) 14%, transparent); }
.jr-barre { display: flex; align-items: center; gap: 24px; height: 72px; }
.jr-oeil { position: absolute; left: -9999px; top: 0; background: var(--magenta); color: #FFFFFF; padding: 10px 16px; z-index: 100; }
.jr-oeil:focus { left: 8px; top: 8px; }
.jr-oeil-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.jr-nav { display: flex; align-items: center; gap: 4px; flex: 1; }
.jr-nav-lien {
	display: inline-flex; align-items: center; gap: 6px; padding: 0 10px;
	font-family: var(--f-corps); font-weight: 600; font-size: 16px; text-decoration: none; color: var(--encre);
	position: relative;
}
.jr-nav-point { width: 8px; height: 8px; border-radius: 50%; background: var(--rub, var(--magenta)); flex: none; }
.jr-nav-lien.is-actif { text-decoration: none; }
.jr-nav-lien.is-actif::after {
	content: ""; position: absolute; left: 10px; right: 10px; bottom: 8px; height: 3px;
	background: var(--magenta);
	clip-path: polygon(0% 40%, 15% 0%, 30% 60%, 45% 10%, 60% 70%, 75% 20%, 90% 55%, 100% 30%, 100% 100%, 0% 100%);
}

.jr-barre-fin { display: flex; align-items: center; gap: 10px; }
.jr-loupe { position: relative; }
.jr-loupe-bouton { background: none; border: none; cursor: pointer; padding: 8px; display: grid; place-items: center; }
.jr-loupe-champ { display: none; position: absolute; right: 0; top: calc(100% + 10px); background: var(--carte); border: 2px solid var(--encre); border-radius: var(--rayon-s); box-shadow: var(--ombre-encre); padding: 10px; }
.jr-loupe.is-ouvert .jr-loupe-champ { display: flex; gap: 8px; }
.jr-loupe-champ input { border: 1.5px solid var(--filet); border-radius: var(--rayon-s); padding: 8px 10px; font: inherit; min-width: 220px; }

.jr-burger { display: none; background: none; border: 2px solid var(--encre); border-radius: var(--rayon-s); padding: 8px; cursor: pointer; }
.jr-burger span { display: block; width: 20px; height: 2px; background: var(--encre); margin: 4px 0; }

@media (max-width: 980px) {
	.jr-nav { display: none; }
	.jr-burger { display: block; }
	.jr-nav.is-ouvert {
		display: flex; flex-direction: column; align-items: flex-start; gap: 0;
		position: absolute; left: 0; right: 0; top: 72px; background: var(--carte);
		border-bottom: 1.5px solid var(--filet); padding: 8px 16px 16px;
	}
	.jr-nav.is-ouvert .jr-nav-lien { font-size: 20px; padding: 12px 0; width: 100%; }
	.jr-barre { padding-bottom: 76px; }
}
@media (min-width: 981px) { .jr-barre { padding-bottom: 0; } }

@media (max-width: 459px) { .jr-logo-mot { font-size: 14px; line-height: 1.1; } }

.jr-garde { padding: 56px 0 72px; }
.jr-garde-grille { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--gouttiere); align-items: stretch; }
.jr-garde-texte { display: flex; flex-direction: column; justify-content: center; gap: 20px; min-width: 0; }
.jr-garde-image { position: relative; min-width: 0; }
.jr-garde-image .jr-vignette { height: 100%; }
.jr-garde-carte-titre { position: absolute; left: 5%; right: 5%; bottom: -24px; background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 16px 20px; box-shadow: var(--ombre-encre); }
.jr-garde-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

@media (max-width: 900px) {
	.jr-garde-grille { grid-template-columns: minmax(0, 1fr); }
	
	.jr-garde-image { margin-top: 32px; }
}

.jr-grille-cartes { display: grid; gap: var(--gouttiere); }
.jr-grille-cartes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.jr-grille-cartes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.jr-grille-cartes--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jr-grille-cartes > * { min-width: 0; }
@media (max-width: 900px) { .jr-grille-cartes--3, .jr-grille-cartes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .jr-grille-cartes--3, .jr-grille-cartes--4, .jr-grille-cartes--2 { grid-template-columns: 1fr; } }

.jr-carte { display: flex; flex-direction: column; gap: 10px; border: 1.5px solid color-mix(in srgb, var(--encre) 14%, transparent); border-radius: var(--rayon-m); padding: 12px; background: var(--carte); transition: box-shadow 150ms ease, transform 150ms ease, border-color 150ms ease; }
.jr-carte:hover { border-color: var(--encre); box-shadow: var(--ombre-encre-survol); transform: translate(-1px, -1px); }
.jr-carte a { text-decoration: none; }
.jr-carte h3, .jr-carte h2 { font-size: 20px; margin: 0; }
.jr-carte h3 a, .jr-carte h2 a,
.jr-rub-majeure h2 a, .jr-rub-majeure h3 a,
.jr-classeur-nom a, .jr-pilier h2 a { text-decoration: none; }
.jr-carte h3 a:hover, .jr-carte h2 a:hover,
.jr-rub-majeure h2 a:hover, .jr-rub-majeure h3 a:hover,
.jr-pilier h2 a:hover { text-decoration: underline wavy var(--magenta); text-underline-offset: 4px; }
.jr-carte-apport { color: var(--encre-douce); font-size: 15px; margin: 0; }

.jr-carte--majeure { flex-direction: column; }
.jr-carte--majeure h2 { font-size: 28px; }
@media (max-width: 640px) { .jr-carte--majeure h2 { font-size: 22px; } }

.jr-section-tete { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; }
.jr-section-onglet { display: inline-flex; align-items: center; gap: 8px; font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; font-weight: 700; color: var(--rub, var(--magenta)); margin-bottom: 6px; }
.jr-section-chapo { color: var(--encre-douce); max-width: 60ch; }

.jr-grille-une-fil { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 40px; }
@media (max-width: 900px) { .jr-grille-une-fil { grid-template-columns: minmax(0, 1fr); } }
.jr-fil { list-style: none; display: flex; flex-direction: column; gap: 14px; }
.jr-fil li { display: flex; gap: 10px; align-items: flex-start; }
.jr-fil li > div { min-width: 0; }
.jr-fil li h3 a { overflow-wrap: anywhere; }

.jr-une-grille-petites { margin-top: 24px; }
.jr-fil-vignette { width: 72px; height: 72px; border-radius: var(--rayon-s); overflow: hidden; flex: none; }
.jr-fil-vignette img, .jr-fil-vignette .jr-vignette-repli { width: 100%; height: 100%; object-fit: cover; }
.jr-fil-point { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--magenta-vif); margin-right: 6px; }
@media (prefers-reduced-motion: no-preference) { .jr-fil-point { animation: jr-pulse 2.4s ease-in-out infinite; } }
@keyframes jr-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.jr-tuiles-chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; text-align: left; }
.jr-tuile-chiffre b { font-family: var(--f-titre); font-size: clamp(44px, 5vw, 76px); white-space: nowrap; line-height: 1; color: var(--rose-nuit); display: block; }
.jr-tuile-chiffre span { font-family: var(--f-corps); font-weight: 600; color: var(--lilas-nuit); }
.jr-tuile-chiffre { border-bottom: 3px solid; border-image: repeating-linear-gradient(90deg, var(--magenta-vif) 0 8px, transparent 8px 14px) 3; padding-bottom: 10px; }
@media (max-width: 900px) { .jr-tuiles-chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .jr-tuile-chiffre b { font-size: clamp(34px, 10.5vw, 56px); } }

.jr-classeur { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 16px; }
.jr-classeur-item { text-decoration: none; display: block; }

.jr-classeur-carte { background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 12px; }
.jr-classeur-nom { display: flex; align-items: center; gap: 8px; margin: 10px 0 4px; }
.jr-classeur-nom .jr-picto { width: 22px; height: 22px; }
.jr-classeur-nom span { font-weight: 700; font-family: var(--f-corps); }
.jr-classeur-phrase { color: var(--encre-douce); font-size: 14px; margin: 0 0 6px; }
.jr-classeur-compte { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--rub, var(--magenta)); }
@media (max-width: 900px) {
	.jr-classeur { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
	.jr-classeur { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; margin: 0 -16px; padding-left: 16px; padding-right: 16px; }
	.jr-classeur-item { scroll-snap-align: start; flex: none; }
}

.jr-atelier { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: center; }
@media (max-width: 900px) { .jr-atelier { grid-template-columns: 1fr; text-align: left; } }

.jr-deux-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
@media (max-width: 900px) { .jr-deux-colonnes { grid-template-columns: 1fr; } }

.jr-lettre { display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: center; }
.jr-lettre-form { display: flex; gap: 10px; flex-wrap: wrap; }
.jr-lettre-form input[type="email"] { flex: 1; min-width: 220px; min-height: 44px; border-radius: var(--rayon-s); border: none; padding: 0 14px; font: inherit; }
.jr-lettre-note { font-size: 13px; color: var(--lilas-nuit); margin-top: 8px; }
@media (max-width: 900px) { .jr-lettre { grid-template-columns: minmax(0, 1fr); text-align: center; } .jr-lettre-form { justify-content: center; } }
@media (max-width: 480px) { .jr-lettre-form input[type="email"] { min-width: 0; flex-basis: 100%; } }

.jr-rub-tete { padding: 40px 0; border-top: 6px solid var(--rub, var(--magenta)); max-height: none; }
.jr-rub-tete-in { display: flex; align-items: center; gap: 20px; }
.jr-rub-tete-in > div { min-width: 0; }
@media (max-width: 480px) { .jr-rub-tete-in { flex-direction: column; align-items: flex-start; } }
.jr-rub-picto { flex: none; width: 64px; height: 64px; border-radius: var(--rayon-s); background: var(--rub-fond, var(--magenta-pale)); display: grid; place-items: center; }
.jr-rub-picto .jr-picto { color: var(--rub, var(--magenta)); }
.jr-rub-picto .jr-p-trait, .jr-rub-picto .jr-p-aplat-trait, .jr-rub-picto .jr-p-vif-trait { stroke: var(--rub, var(--magenta)); }
.jr-rub-compte { font-family: var(--f-machine); text-transform: uppercase; font-size: 12px; color: var(--encre-douce); }

.jr-filtres { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; }
.jr-filtre { font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; font-weight: 700; padding: 8px 14px; border: 1.5px solid var(--filet); border-radius: var(--rayon-s); text-decoration: none; color: var(--encre); }
.jr-filtre.is-actif, .jr-filtre:hover { border-color: var(--magenta); color: var(--magenta); }

.jr-rub-majeure { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; align-items: center; margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1.5px solid var(--filet); }
@media (max-width: 800px) { .jr-rub-majeure { grid-template-columns: minmax(0, 1fr); } }

.jr-lignes-compact { display: flex; flex-direction: column; gap: 12px; }
.jr-ligne-compacte { display: flex; align-items: center; gap: 14px; text-decoration: none; padding: 10px; border: 1.5px solid var(--filet); border-radius: var(--rayon-s); }
.jr-ligne-compacte .jr-vignette { width: 64px; height: 64px; flex: none; }
.jr-ligne-compacte span { font-weight: 600; }

.jr-pagination { display: flex; gap: 10px; justify-content: center; margin: 48px 0; list-style: none; }
.jr-pagination a, .jr-pagination span { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--filet); display: grid; place-items: center; font-family: var(--f-machine); text-decoration: none; color: var(--encre); }
.jr-pagination .is-actif { border-color: var(--magenta); color: var(--magenta); font-weight: 700; }

.jr-pilier { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; align-items: center; margin: 56px 0; padding: 32px; background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); }
@media (max-width: 800px) { .jr-pilier { grid-template-columns: 1fr; } }

.jr-accordeon { border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 18px 20px; margin: 32px 0; background: var(--carte); }
.jr-accordeon summary { cursor: pointer; font-weight: 700; list-style: none; }
.jr-accordeon summary::-webkit-details-marker { display: none; }
.jr-accordeon summary::after { content: "+"; float: right; font-family: var(--f-titre); font-size: 20px; color: var(--magenta); }
.jr-accordeon[open] summary::after { content: "×"; }
.jr-accordeon-corps { margin-top: 12px; color: var(--encre-douce); }

.jr-faq { margin: 32px 0; }
.jr-faq-item { border: 1.5px solid var(--encre); border-radius: var(--rayon-s); padding: 14px 18px; margin-bottom: 10px; background: var(--carte); }
.jr-faq-item summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.jr-faq-item summary::-webkit-details-marker { display: none; }
.jr-faq-icone { width: 18px; height: 18px; flex: none; position: relative; }
.jr-faq-icone::before, .jr-faq-icone::after { content: ""; position: absolute; background: var(--magenta); top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform 200ms ease; }
.jr-faq-icone::before { width: 14px; height: 2.5px; }
.jr-faq-icone::after { width: 2.5px; height: 14px; }
.jr-faq-item[open] .jr-faq-icone::after { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; }
.jr-faq-reponse { margin-top: 10px; color: var(--encre-douce); }

.jr-ariane { font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; color: var(--encre-douce); margin-bottom: 16px; }
.jr-ariane a { color: var(--encre-douce); text-decoration: none; }
.jr-art-tete { padding: 40px 0 32px; }
.jr-art-titre { max-width: 20ch; }
.jr-art-signe { display: flex; align-items: center; gap: 10px; margin-top: 16px; font-size: 14px; color: var(--encre-douce); }
.jr-art-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.jr-art-point { opacity: 0.6; }

.jr-art-une { margin-bottom: 40px; }
.jr-art-une figcaption { font-family: var(--f-machine); font-size: 12px; color: var(--encre-douce); margin-top: 10px; text-transform: uppercase; }

@media (min-width: 900px) {
	.jr-art-une .jr-vignette--une { aspect-ratio: auto; height: 380px; }
}

.jr-art-grille { display: grid; grid-template-columns: minmax(0, 680px) minmax(0, 300px); gap: 32px; align-items: start; }
@media (max-width: 1024px) { .jr-art-grille { grid-template-columns: minmax(0, 1fr); } }

.jr-corps { font-size: 19px; line-height: 1.7; overflow-wrap: anywhere; }
.jr-corps img, .jr-corps svg, .jr-corps video, .jr-corps iframe { max-width: 100%; height: auto; }
.jr-corps pre { overflow-x: auto; }
.jr-corps h2 { margin-top: 2.2em; }
.jr-corps h3 { margin-top: 1.6em; }
.jr-corps a { color: var(--magenta); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.jr-corps blockquote { font-family: var(--f-titre); font-size: 26px; line-height: 1.35; color: var(--encre); border: none; margin: 1.6em 0; padding: 0 0 0 24px; position: relative; }
.jr-corps blockquote::before { content: "«"; color: var(--magenta); position: absolute; left: -6px; top: -6px; font-size: 1.4em; }
.jr-corps figure { margin: 2em 0; }
.jr-corps figure img { border-radius: var(--rayon-m); }
.jr-corps table { width: 100%; border-collapse: collapse; margin: 1.6em 0; font-size: 16px; }
.jr-corps table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.jr-corps th, .jr-corps td { border: 1px solid var(--filet); padding: 10px 12px; text-align: left; }
.jr-corps thead th { background: var(--papier-creux); font-family: var(--f-corps); font-weight: 700; }
.jr-corps ul:not([class]), .jr-corps ol:not([class]) { padding-left: 1.4em; }
.jr-corps ul:not([class]) li { margin-bottom: 0.4em; }
.jr-corps strong { font-weight: 700; }
.jr-corps em { font-style: italic; }

.jr-cote { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 24px; }
.jr-minutes-restantes { margin: 0; font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--magenta); }
.jr-encart { border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 18px 20px; background: var(--carte); }
.jr-encart-titre { font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; font-weight: 700; color: var(--magenta); margin-bottom: 10px; }
.jr-sommaire { list-style: none; counter-reset: som; }
.jr-sommaire li { counter-increment: som; display: flex; gap: 10px; align-items: baseline; margin-bottom: 10px; }
.jr-sommaire li::before { content: counter(som); flex: none; width: 22px; height: 22px; border: 1.5px solid var(--encre); border-radius: 50%; display: grid; place-items: center; font-family: var(--f-machine); font-size: 11px; }
.jr-sommaire a { text-decoration: none; font-size: 14px; }
.jr-sommaire a:hover { text-decoration: underline wavy var(--magenta); }

.jr-mini-vignette { display: flex; gap: 10px; margin-bottom: 12px; text-decoration: none; align-items: center; }
.jr-mini-vignette .jr-vignette { width: 64px; height: 64px; flex: none; }
.jr-mini-vignette span { font-size: 14px; font-weight: 600; }

@media (max-width: 1024px) {
	.jr-cote { position: static; order: 3; }
	.jr-corps { order: 2; }
}

.jr-etapes { list-style: none; display: flex; flex-direction: column; gap: 20px; margin: 2em 0; }
.jr-etape { display: flex; gap: 16px; position: relative; }
.jr-etape-num { flex: none; width: 40px; height: 40px; border: 2px solid var(--encre); border-radius: 50%; display: grid; place-items: center; font-family: var(--f-titre); font-size: 18px; background: var(--carte); }
.jr-etape:not(:last-child)::after { content: ""; position: absolute; left: 19px; top: 40px; bottom: -20px; width: 2px; background: var(--filet); }

.jr-avant-apres { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 2em 0; }
.jr-avant-apres > div { border-radius: var(--rayon-m); padding: 16px 18px; }
.jr-avant { background: var(--papier-creux); }
.jr-avant p { text-decoration: line-through; text-decoration-color: var(--magenta); color: var(--encre-douce); }
.jr-apres { background: var(--magenta-pale); }
@media (max-width: 640px) { .jr-avant-apres { grid-template-columns: 1fr; } }

.jr-chiffre-cle { text-align: left; margin: 2em 0; padding: 20px 0; border-top: 1.5px solid var(--filet); border-bottom: 1.5px solid var(--filet); }
.jr-chiffre-cle b { font-family: var(--f-titre); font-size: 64px; color: var(--magenta); display: block; line-height: 1; }
.jr-chiffre-cle cite { font-family: var(--f-machine); font-size: 12px; color: var(--encre-douce); font-style: normal; }

.jr-jauges { margin: 2em 0; display: flex; flex-direction: column; gap: 14px; }
.jr-jauge-ligne { display: grid; grid-template-columns: 140px 1fr; gap: 12px; align-items: center; }
.jr-jauge-piste { height: 14px; border-radius: 7px; background: var(--papier-creux); overflow: hidden; }
.jr-jauge-valeur { height: 100%; background: var(--rub, var(--magenta)); border-radius: 7px 3px 3px 7px; clip-path: polygon(0 0, 98% 4%, 100% 100%, 2% 96%); }
@media (max-width: 640px) { .jr-jauge-ligne { grid-template-columns: 1fr; } }

.jr-a-retenir { background-color: var(--papier); background-image: repeating-linear-gradient(to bottom, transparent 0 31px, var(--lignes-bloc) 31px 32px); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 20px 24px; margin: 2em 0; position: relative; }
.jr-a-retenir-titre { font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; font-weight: 700; color: var(--magenta); }

.jr-encart-lire-aussi { margin: 2.2em 0; padding: 16px; border: 1.5px solid var(--filet); border-radius: var(--rayon-m); background: var(--carte); }
.jr-lire-aussi-lien { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.jr-lire-aussi-lien .jr-vignette { width: 96px; flex: none; }
.jr-lire-aussi-lien span { font-weight: 700; font-size: 16px; color: var(--encre); }
.jr-lire-aussi-lien:hover span { color: var(--magenta); }
@media (max-width: 480px) { .jr-lire-aussi-lien .jr-vignette { width: 72px; } }

.jr-sources { border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 18px 20px; margin: 2.5em 0; }
.jr-sources .jr-encart-titre { margin-bottom: 10px; }
.jr-sources ol { list-style: none; counter-reset: src; display: flex; flex-direction: column; gap: 8px; }
.jr-sources li { counter-increment: src; display: flex; gap: 10px; align-items: baseline; }
.jr-sources li::before {
	content: counter(src); flex: none; width: 20px; height: 20px; border-radius: 50%;
	background: var(--magenta-pale); color: var(--magenta); font-family: var(--f-machine);
	font-size: 11px; display: grid; place-items: center;
}
.jr-sources a { font-size: 14px; overflow-wrap: anywhere; }

.jr-signature { display: flex; gap: 18px; align-items: flex-start; border: 1.5px solid var(--encre); border-radius: var(--rayon-m); padding: 22px 88px 22px 22px; margin: 3em 0 2em; position: relative; background: var(--carte); }
@media (max-width: 480px) { .jr-signature { padding: 22px; } }
.jr-signature-photo .jr-avatar { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; }
.jr-signature-nom { font-family: var(--f-titre); font-size: 20px; margin: 0; }
.jr-signature-role { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--magenta); margin: 2px 0 8px; }
.jr-signature-bio { color: var(--encre-douce); font-size: 15px; }
.jr-signature-lien { color: var(--magenta); font-weight: 700; font-size: 14px; text-decoration: none; }

.jr-tampon { position: absolute; right: 14px; top: 14px; width: 58px; height: 58px; color: var(--magenta); transform: rotate(-8deg); opacity: 0.9; }
.jr-tampon circle { fill: none; stroke: currentColor; stroke-width: 2; }
.jr-tampon path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.jr-tampon text { fill: currentColor; font-family: var(--f-machine); font-size: 8.5px; letter-spacing: 0.02em; }
@media (max-width: 480px) { .jr-tampon { display: none; } } 
@media (max-width: 640px) { .jr-signature { flex-direction: column; } }

.sb-maillage { margin: 48px 0 8px; padding: 22px 24px; background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); }
.sb-maillage h2 { font-size: 20px; margin: 0 0 14px; }
.sb-maillage h2::before { content: none; }
.sb-maillage ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sb-maillage li { margin: 0; padding: 0; border: 0; background: none; }
.sb-maillage li a { display: block; padding: 10px 14px; border: 1.5px solid var(--filet); border-left: 4px solid var(--magenta); border-radius: var(--rayon-s); text-decoration: none; color: var(--encre); font-weight: 600; background: var(--papier); }
.sb-maillage li a:hover, .sb-maillage li a:focus-visible { border-color: var(--magenta); }
@media (max-width: 640px) { .sb-maillage ul { grid-template-columns: minmax(0, 1fr); } }
.sbs_tableau { overflow-x: auto; max-width: 100%; }

.jr-suite { padding: 56px 0; }

.jr-auteur-tete { display: flex; gap: 28px; align-items: center; padding: 48px 0; }
.jr-auteur-photo { position: relative; flex: none; }
.jr-auteur-photo .jr-avatar { width: 160px; height: 160px; border-radius: var(--rayon-s); object-fit: cover; transform: rotate(-2deg); box-shadow: var(--ombre-encre); }
.jr-auteur-ruban { position: absolute; top: -10px; right: -14px; width: 46px; height: 20px; background: var(--magenta-pale); border: 1px solid var(--encre); transform: rotate(8deg); opacity: 0.9; }
.jr-auteur-rubs { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
@media (max-width: 640px) { .jr-auteur-tete { flex-direction: column; text-align: center; } }

.jr-page-annexe { max-width: 760px; margin: 0 auto; padding: 56px 16px; }
.jr-page-annexe .jr-illustration { margin-bottom: 24px; }
.jr-form { display: flex; flex-direction: column; gap: 16px; max-width: 32rem; }
.jr-form label { font-weight: 700; margin-bottom: 6px; display: block; }
.jr-form input, .jr-form textarea { width: 100%; border: 1.5px solid var(--filet); border-radius: var(--rayon-s); padding: 12px 14px; font: inherit; background: var(--papier-creux); min-height: 44px; }
.jr-form input:focus, .jr-form textarea:focus { border-color: var(--magenta); background: var(--carte); }
.jr-form textarea { min-height: 140px; resize: vertical; }
.jr-form-statut { background: var(--succes); color: #fff; padding: 10px 14px; border-radius: var(--rayon-s); }
.jr-equipe-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 32px; }
@media (max-width: 640px) { .jr-equipe-grille { grid-template-columns: minmax(0, 1fr); } }
.jr-carte--equipe { flex-direction: row; align-items: flex-start; gap: 14px; }
.jr-carte--equipe .jr-avatar { border-radius: 50%; }

.jr-rubriques-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 800px) { .jr-rubriques-grille { grid-template-columns: 1fr; } }
.jr-rubriques-carte { border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 20px; background: var(--carte); }
.jr-rubriques-carte-articles { list-style: none; margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.jr-rubriques-carte-articles a { text-decoration: none; font-size: 15px; font-weight: 600; }
.jr-rubriques-carte-articles a:hover { text-decoration: underline wavy var(--magenta); }

.jr-outil { max-width: 900px; margin: 0 auto; padding: 48px 16px 80px; }
.jr-outil-zone { width: 100%; min-height: 240px; border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 16px; font: inherit; font-size: 16px; background: var(--carte); }
.jr-outil-actions { display: flex; gap: 12px; margin: 16px 0 32px; flex-wrap: wrap; }
.jr-outil-resultats { display: none; }
.jr-outil-resultats.is-visible { display: block; }
.jr-outil-stat { display: flex; gap: 24px; flex-wrap: wrap; margin-bottom: 24px; }
.jr-outil-stat div { background: var(--magenta-pale); border-radius: var(--rayon-s); padding: 10px 16px; }
.jr-outil-stat b { display: block; font-family: var(--f-titre); font-size: 26px; }
.jr-outil-tic { border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 16px 20px; margin-bottom: 14px; }
.jr-outil-tic h3 { font-size: 17px; margin-bottom: 6px; }
.jr-outil-tic mark { background: var(--surligneur); color: var(--encre); padding: 0 2px; border-radius: 2px; }
.jr-outil-extrait { font-size: 15px; color: var(--encre-douce); background: var(--papier-creux); padding: 10px 14px; border-radius: var(--rayon-s); margin: 8px 0; }
.jr-outil-conseil { font-size: 14px; font-weight: 600; }
.jr-outil-vide { color: var(--succes); font-weight: 700; }
.jr-outil-newsletter { display: none; }
.jr-outil-newsletter.is-visible { display: block; margin-top: 40px; }

.jr-404 { text-align: left; padding: 64px 0; }
.jr-404 h1 { max-width: none; }

.jr-recherche-form { display: flex; gap: 10px; max-width: 32rem; margin: 24px 0 40px; }
.jr-recherche-form input { flex: 1; border: 1.5px solid var(--filet); border-radius: var(--rayon-s); padding: 0 14px; min-height: 44px; font: inherit; }

.jr-pied { padding: 56px 0 24px; }
.jr-pied-grille { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 32px; align-items: start; }
.jr-pied-liste a { overflow-wrap: anywhere; }
.jr-pied-titre { font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; font-weight: 700; color: var(--rose-nuit); margin-bottom: 14px; }
.jr-pied-liste { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.jr-pied-liste a { text-decoration: none; color: var(--lilas-nuit); font-size: 15px; }
.jr-pied-liste a:hover { color: #FFFFFF; }
.jr-pied-point { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; }
.jr-pied-baseline { color: var(--lilas-nuit); margin-top: 10px; max-width: 32ch; }
.jr-pied-actu-heure { font-family: var(--f-machine); font-size: 11px; opacity: 0.75; margin-left: 8px; }
.jr-ours { border-top: 1px solid rgba(255,255,255,0.15); margin-top: 40px; padding-top: 20px; font-size: 13px; color: var(--lilas-nuit); }
@media (max-width: 900px) { .jr-pied-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .jr-pied-grille { grid-template-columns: minmax(0, 1fr); } }

.jr-nav-mobile { display: none; }
@media (max-width: 640px) {
	.jr-nav-mobile {
		display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; height: 60px;
		background: var(--carte); border-top: 1.5px solid color-mix(in srgb, var(--encre) 14%, transparent);
	}
	
	.jr-pied { padding-bottom: 76px; }
	.jr-nav-mobile-item {
		flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
		gap: 4px; text-decoration: none; color: var(--encre-douce);
		font-family: var(--f-corps); font-weight: 600; font-size: 11px; text-transform: none;
	}
	.jr-nav-mobile-item svg { width: 24px; height: 24px; }
	.jr-nav-mobile-item.is-actif { color: var(--magenta); }
	.jr-nav-mobile-item.is-actif span {
		position: relative; padding-bottom: 3px;
	}
	.jr-nav-mobile-item.is-actif span::after {
		content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 2px; background: var(--magenta);
		clip-path: polygon(0% 40%, 15% 0%, 30% 60%, 45% 10%, 60% 70%, 75% 20%, 90% 55%, 100% 30%, 100% 100%, 0% 100%);
	}
}

sbs-jauges, sbs-tarifs, sbs-frise, sbs-lieu, sbs-jauge, sbs-tarif, sbs-etape { display: block; }

.sbs_jauges, .sbs_tarifs, .sbs_frise, .sbs_lieu {
	background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m);
	padding: 22px 24px; margin: 2em 0; max-width: 100%;
}
.sbs_jauges_titre, .sbs_tarifs_titre, .sbs_frise_titre {
	display: block; font-family: var(--f-titre); font-weight: 400; font-size: 22px;
	margin-bottom: 16px; color: var(--encre);
}
.sbs_source {
	display: block; margin-top: 16px; font-family: var(--f-machine); font-size: 11px;
	text-transform: uppercase; letter-spacing: 0.04em; color: var(--encre-douce);
}

.sbs_jauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 20px 28px; }
.sbs_jauges .sbs_jauges_titre, .sbs_jauges .sbs_source { grid-column: 1 / -1; margin-bottom: 0; }
.sbs_jauges .sbs_jauges_titre { margin-bottom: 4px; }
.sbs_jauge { min-width: 0; }
.sbs_jauge_libelle {
	display: block; font-family: var(--f-corps); font-weight: 600; font-size: 14px;
	color: var(--encre-douce); margin-bottom: 2px;
}
.sbs_jauge_valeur {
	font-family: var(--f-titre); font-weight: 400; font-size: 40px; line-height: 1;
	color: var(--magenta); font-variant-numeric: tabular-nums;
}
.sbs_jauge_unite {
	font-family: var(--f-machine); font-size: 13px; text-transform: uppercase;
	color: var(--encre-douce); margin-left: 6px;
}
@media (max-width: 480px) { .sbs_jauge_valeur { font-size: 32px; } }

.sbs_tarif { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding: 10px 0; border-bottom: 1px solid var(--filet); }
.sbs_tarif:last-of-type { border-bottom: none; }
.sbs_tarif_libelle { flex: 1 1 160px; min-width: 0; font-family: var(--f-corps); font-weight: 600; font-size: 15px; color: var(--encre); overflow-wrap: anywhere; }
.sbs_tarif_barre {
	appearance: none; -webkit-appearance: none; -moz-appearance: none;
	width: 100%; flex: 1 1 100%; height: 14px; border: none; border-radius: 7px;
	background: var(--papier-creux); vertical-align: middle;
}
.sbs_tarif_barre::-webkit-meter-bar { background: var(--papier-creux); border: none; border-radius: 7px; height: 14px; }
.sbs_tarif_barre::-webkit-meter-optimum-value,
.sbs_tarif_barre::-webkit-meter-suboptimum-value,
.sbs_tarif_barre::-webkit-meter-even-less-good-value { background: var(--magenta); border-radius: 7px; }
.sbs_tarif_barre::-moz-meter-bar { background: var(--magenta); border-radius: 7px; }

.sbs_tarif_prix { flex: 0 0 auto; margin-left: auto; font-family: var(--f-titre); font-size: 19px; line-height: 1.2; color: var(--encre); text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 480px) { .sbs_tarif_prix { flex: 1 1 100%; margin-left: 0; text-align: left; font-size: 17px; } }
.sbs_tarifs_notes { display: block; margin-top: 14px; font-size: 13px; color: var(--encre-douce); }

.sbs_frise { padding-left: 24px; }
.sbs_etape { position: relative; padding: 0 0 24px 24px; border-left: 2px solid var(--magenta-pale); }
.sbs_etape:last-of-type { padding-bottom: 0; border-left-color: transparent; }
.sbs_etape::before {
	content: ""; position: absolute; left: -7px; top: 4px; width: 12px; height: 12px;
	border-radius: 50%; background: var(--magenta); border: 2px solid var(--carte);
}
.sbs_etape_date {
	display: block; font-family: var(--f-machine); font-size: 12px; text-transform: uppercase;
	letter-spacing: 0.04em; color: var(--magenta); margin-bottom: 4px;
}
.sbs_etape_titre { display: block; font-family: var(--f-corps); font-weight: 700; font-size: 17px; color: var(--encre); margin-bottom: 4px; }
.sbs_etape_desc { display: block; font-size: 15px; color: var(--encre-douce); }

.sbs_lieu_nom { display: block; font-family: var(--f-titre); font-size: 20px; color: var(--encre); margin-bottom: 6px; }
.sbs_lieu_adresse { display: block; font-style: normal; font-size: 15px; color: var(--encre-douce); margin-bottom: 4px; }
.sbs_lieu_acces { display: block; font-size: 14px; color: var(--encre-douce); margin-bottom: 12px; }
.sbs_lieu_carte {
	display: inline-flex; align-items: center; gap: 8px; font-family: var(--f-corps); font-weight: 700;
	font-size: 14px; color: var(--magenta); text-decoration: none; padding: 8px 14px;
	border: 1.5px solid var(--magenta); border-radius: var(--rayon-s); min-height: 44px;
}
.sbs_lieu_carte:hover { background: var(--magenta-pale); }
.sbs_icone_repere { fill: currentColor; flex: none; }

.jr-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.jr-garde-image .jr-vignette { width: 100%; height: 100%; aspect-ratio: auto; min-height: 360px; }
.jr-annotation-bulle { left: auto; right: 0; }
@media (max-width: 640px) {
	.jr-surlign-hote { white-space: normal; display: inline; }
	.jr-surlign-forme { display: none; }
	.jr-surlign-texte { background: linear-gradient(transparent 55%, var(--surligneur) 55%, var(--surligneur) 92%, transparent 92%); -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 2px; }
	.jr-fond-magenta .jr-surlign-texte { background: linear-gradient(transparent 55%, var(--encre) 55%, var(--encre) 92%, transparent 92%); }
	.jr-fond-aubergine .jr-surlign-texte { background: linear-gradient(transparent 55%, #B5009F 55%, #B5009F 92%, transparent 92%); }
	.jr-garde-image .jr-vignette { min-height: 0; aspect-ratio: 3 / 2; height: auto; }
	.jr-rub-tete-in > div { align-self: stretch; }
}

@media (min-width: 901px) {
	.jr-grille-cartes--3 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.jr-grille-cartes--3 > * { grid-column: span 2; }
	.jr-grille-cartes--3 > :last-child:nth-child(3n+2),
	.jr-grille-cartes--3 > :nth-last-child(2):nth-child(3n+1) { grid-column: span 3; }
	.jr-grille-cartes--3 > :last-child:nth-child(3n+1) { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); column-gap: 28px; align-items: center; }
	.jr-grille-cartes--3 > :last-child:nth-child(3n+1) > a:first-child { grid-row: span 3; }
}

.jr-corps ul:not([class]) { list-style: none; padding-left: 0; display: grid; gap: 10px; margin: 1.2em 0 1.6em; }
.jr-corps ul:not([class]) > li { margin: 0; background: var(--carte); border: 1.5px solid var(--filet); border-left: 4px solid var(--rub, var(--magenta)); border-radius: var(--rayon-s); padding: 10px 14px; }

.jr-art-grille .jr-corps > ul:not([class]):has(> li:first-child > a[href^="#"]:only-child):has(> li:last-child > a[href^="#"]:only-child) { display: none; }

/* Fiches numérotées dans le corps */
.jr-corps .jr-fiches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 1.6em 0 2em; counter-reset: none; }
.jr-corps .jr-fiche { position: relative; background: var(--carte); border: 1.5px solid var(--encre); border-radius: var(--rayon-m); padding: 18px 18px 16px 18px; box-shadow: 4px 4px 0 var(--encre); }
.jr-corps .jr-fiche-n { display: inline-block; font-family: var(--f-titre); font-size: 30px; line-height: 1; color: var(--magenta); margin-bottom: 8px; }
.jr-corps .jr-fiche-titre { font-family: var(--f-titre); font-size: 19px; line-height: 1.25; margin: 0 0 8px; color: var(--encre); }
.jr-corps .jr-fiche p:last-child { margin: 0; font-size: 16px; line-height: 1.6; color: var(--encre-douce); }
.jr-corps .jr-fiches > .jr-fiche:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 640px) { .jr-corps .jr-fiches { grid-template-columns: minmax(0, 1fr); } .jr-corps .jr-fiche { box-shadow: 3px 3px 0 var(--encre); } }

/* Encart « À lire aussi » : vignette sans onglet, liens du corps bien visibles */
.jr-encart-lire-aussi .jr-onglet { display: none; }
.jr-corps a:not(.jr-bouton):not(.jr-lire-aussi-lien):not(.vw-decouvrir-carte):not(.vw-lien-fleche) { text-decoration: underline; text-decoration-color: var(--magenta); text-decoration-thickness: 3px; text-underline-offset: 4px; font-weight: 600; }
.jr-corps a:not(.jr-bouton):not(.jr-lire-aussi-lien):not(.vw-decouvrir-carte):not(.vw-lien-fleche):hover { background: var(--magenta-pale); }

/* Contact : le formulaire d'abord */
.jr-contact-grille { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 48px; align-items: start; }
.jr-contact-form .jr-form { margin-top: 20px; }
.jr-contact-infos { background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-m); padding: 24px; }
.jr-contact-infos .jr-corps { font-size: 16px; }
.jr-contact-infos .jr-corps h2 { font-size: 19px; }
@media (max-width: 900px) { .jr-contact-grille { grid-template-columns: minmax(0, 1fr); gap: 32px; } }

/* Réassurance du premier écran */
.jr-garde-preuves { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 0; list-style: none; font-family: var(--f-machine); font-size: 13px; text-transform: uppercase; letter-spacing: .03em; color: var(--encre); }
.jr-garde-preuves li { display: inline-flex; align-items: center; gap: 8px; }
.jr-garde-preuves li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--magenta); flex: none; }
.jr-corps figcaption { font-family: var(--f-machine); font-size: 11px; color: var(--encre-douce); margin-top: 6px; text-align: right; letter-spacing: .02em; }
.jr-corps figure img { width: 100%; box-shadow: 4px 4px 0 var(--encre); }

/* Page Rubriques : chaque rubrique liste tous ses articles */
.jr-dossier { margin: 64px 0 0; padding-top: 28px; border-top: 4px solid var(--rub, var(--magenta)); scroll-margin-top: 90px; }
.jr-dossier-tete { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.jr-dossier-tete h2 { margin: 0; font-size: 26px; }
.jr-dossier-tete h2 a { text-decoration: none; color: var(--encre); }
.jr-dossier-tete .jr-picto { color: var(--rub, var(--magenta)); }
.jr-dossier-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.jr-dossier-liste a { display: flex; align-items: center; gap: 12px; padding: 10px; background: var(--carte); border: 1.5px solid var(--filet); border-radius: var(--rayon-s); text-decoration: none; color: var(--encre); min-height: 76px; }
.jr-dossier-liste a:hover, .jr-dossier-liste a:focus-visible { border-color: var(--rub, var(--magenta)); }
.jr-dossier-vignette { flex: none; width: 56px; height: 56px; border-radius: 6px; overflow: hidden; display: grid; place-items: center; background: var(--papier); }
.jr-dossier-vignette img { width: 56px; height: 56px; object-fit: cover; display: block; }
.jr-dossier-titre { font-weight: 600; font-size: 15px; line-height: 1.35; }
@media (max-width: 900px) { .jr-dossier-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .jr-dossier-liste { grid-template-columns: minmax(0, 1fr); } }

/* =========================================================================
   RETOURS ROXANE — 30/09/2026
   Plus de jaune (jetons --papier*), plus de bandes sombres hors pied de page.
   ========================================================================= */

@keyframes vw-monte { from { opacity: 0; translate: 0 18px; } }
@keyframes vw-pop { from { opacity: 0; scale: .6; } }
@keyframes vw-flotte { 50% { translate: 0 -8px; } }
@keyframes vw-derive { to { transform: translate(-40px, 30px) scale(1.08); } }
@keyframes vw-tourne { to { transform: rotate(360deg); } }
@keyframes vw-rebond { 50% { transform: translateY(6px); } }
@keyframes vw-agite { 25% { transform: rotate(-12deg); } 75% { transform: rotate(10deg); } }

.vw-entree { animation: vw-monte .7s cubic-bezier(.2, .8, .2, 1) both; }
.vw-art-hero-texte > :nth-child(2), .vw-rub-hero-texte > :nth-child(2), .vw-auteur-texte > :nth-child(2) { animation-delay: .06s; }
.vw-art-hero-texte > :nth-child(3), .vw-rub-hero-texte > :nth-child(3), .vw-auteur-texte > :nth-child(3) { animation-delay: .12s; }
.vw-art-hero-texte > :nth-child(4), .vw-rub-hero-texte > :nth-child(4), .vw-auteur-texte > :nth-child(4) { animation-delay: .18s; }
.vw-art-hero-texte > :nth-child(5), .vw-rub-hero-texte > :nth-child(5), .vw-auteur-texte > :nth-child(5) { animation-delay: .24s; }
.vw-art-hero-texte > :nth-child(n+6), .vw-rub-hero-texte > :nth-child(n+6), .vw-auteur-texte > :nth-child(n+6) { animation-delay: .3s; }

/* ---- Menu : survol vivant (R3), bouton lettre fin (R1) ---- */
.jr-nav { gap: 2px; }
.jr-nav-lien { padding: 0 14px; isolation: isolate; transition: transform .2s ease; }
.jr-nav-lien::before {
	content: ""; position: absolute; inset: 6px 0; z-index: -1; border-radius: 999px;
	background: color-mix(in srgb, var(--rub, var(--magenta)) 13%, #FFFFFF);
	opacity: 0; transform: scale(.55); transition: transform .32s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease;
}
.jr-nav-lien:hover::before, .jr-nav-lien:focus-visible::before { opacity: 1; transform: scale(1); }
.jr-nav-lien:hover { transform: translateY(-1px); }
.jr-nav-point { transition: transform .32s cubic-bezier(.34, 1.56, .64, 1), box-shadow .32s ease; }
.jr-nav-lien:hover .jr-nav-point, .jr-nav-lien:focus-visible .jr-nav-point { transform: scale(1.45); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rub, var(--magenta)) 22%, transparent); }
.jr-nav-lien.is-actif::after { left: 14px; right: 14px; bottom: 6px; background: var(--rub, var(--magenta)); }

.vw-bouton-lettre {
	display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 20px 0 5px;
	border-radius: 999px; background: var(--magenta); color: #FFFFFF; text-decoration: none;
	font-family: var(--f-corps); font-weight: 700; font-size: 15.5px; white-space: nowrap;
	box-shadow: 0 10px 22px -12px rgba(181, 0, 159, .9); transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.vw-bouton-lettre-icone { width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .2); display: grid; place-items: center; }
.vw-bouton-lettre:hover, .vw-bouton-lettre:focus-visible { background: var(--magenta-fonce); transform: translateY(-1px); box-shadow: 0 14px 26px -12px rgba(181, 0, 159, .95); }
.vw-bouton-lettre:hover svg { animation: vw-agite .5s ease; }
@media (max-width: 420px) {
	.vw-bouton-lettre { padding: 0 5px; }
	.vw-bouton-lettre > span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* barre de progression de lecture (article) */
.vw-progression { position: absolute; left: 0; right: 0; bottom: -2px; height: 3px; background: transparent; }
.vw-progression > span { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, var(--magenta), var(--magenta-vif)); transform: scaleX(0); transform-origin: left; }

/* ---- Accueil : hero plein écran (R5) ---- */
.vw-garde-pleine { position: relative; min-height: calc(100vh - 72px); min-height: calc(100svh - 72px); display: flex; flex-direction: column; justify-content: center; padding: 40px 0 96px; }
.vw-garde-pleine .jr-garde-grille { width: 100%; }
.vw-garde-pleine .jr-garde-image .jr-vignette { min-height: min(62vh, 560px); }
.vw-defiler {
	position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%);
	display: inline-flex; flex-direction: column; align-items: center; gap: 4px; text-decoration: none;
	font-family: var(--f-machine); font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--encre-douce);
}
.vw-defiler svg { width: 22px; height: 22px; fill: none; stroke: var(--magenta); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; animation: vw-rebond 1.8s ease-in-out infinite; }
.vw-defiler:hover { color: var(--magenta); }
@media (max-width: 900px) { .vw-garde-pleine { min-height: 0; padding-bottom: 72px; } .vw-defiler { display: none; } }

/* ---- Accueil : les chiffres en tickets clairs (R6) ---- */
.vw-chiffres-tete { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 40px; }
.vw-chiffres-tete h2 { margin: 0; font-size: 38px; }
.vw-chiffres-tete .jr-section-chapo { margin: 0; }
.vw-tickets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.vw-ticket {
	position: relative; display: flex; flex-direction: column; gap: 6px; padding: 26px 26px 28px;
	background: var(--rub-fond); border-radius: 22px; transform: rotate(-1.2deg);
	transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), box-shadow .35s ease;
}
.vw-ticket:nth-child(even) { transform: rotate(1deg); }
.vw-ticket:hover { transform: rotate(0) translateY(-6px); box-shadow: 0 22px 40px -22px color-mix(in srgb, var(--rub) 70%, transparent); }
.vw-ticket::before, .vw-ticket::after { content: ""; position: absolute; top: 50%; width: 26px; height: 26px; margin-top: -13px; border-radius: 50%; background: #FFFFFF; }
.vw-ticket::before { left: -13px; }
.vw-ticket::after { right: -13px; }
.vw-ticket-picto { width: 54px; height: 54px; border-radius: 16px; background: #FFFFFF; display: grid; place-items: center; margin-bottom: 12px; box-shadow: 0 6px 14px -8px rgba(34, 19, 37, .35); }
.vw-ticket-picto .jr-p-trait, .vw-ticket-picto .jr-p-aplat-trait, .vw-ticket-picto .jr-p-vif-trait { stroke: var(--rub); }
.vw-ticket-picto .jr-p-aplat { fill: var(--rub-fond); }
.vw-ticket b { font-family: var(--f-titre); font-weight: 400; font-size: clamp(40px, 4.3vw, 62px); line-height: 1; white-space: nowrap; color: var(--rub); font-variant-numeric: tabular-nums; }
.vw-ticket-libelle { font-weight: 700; font-size: 18px; color: var(--encre); }
.vw-ticket-phrase { font-size: 15px; line-height: 1.45; color: var(--encre-douce); }
@media (max-width: 900px) { .vw-tickets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
	.vw-tickets { gap: 14px; }
	.vw-ticket { padding: 18px 16px 20px; border-radius: 18px; }
	.vw-ticket b { font-size: clamp(30px, 9vw, 44px); }
	.vw-ticket-phrase { display: none; }
	.vw-ticket-picto { width: 44px; height: 44px; margin-bottom: 6px; }
	.vw-chiffres-tete h2 { font-size: 28px; }
}

/* ---- Grande carte équilibrée (R8) : image et texte à la même hauteur ---- */
.vw-majeure {
	display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); margin-bottom: 32px;
	background: var(--rub-fond); border-radius: 24px; overflow: hidden;
	border: 1.5px solid color-mix(in srgb, var(--rub) 22%, transparent); transition: box-shadow .3s ease;
}
.vw-majeure:hover { box-shadow: 0 26px 50px -30px color-mix(in srgb, var(--rub) 75%, transparent); }
.vw-majeure-image { display: block; overflow: hidden; }
.vw-majeure-image .jr-vignette { height: 100%; min-height: 360px; aspect-ratio: auto; border-radius: 0; }
.vw-majeure-image .jr-vignette-img, .vw-majeure-image .jr-vignette-repli { border-radius: 0; transition: transform .7s ease; }
.vw-majeure:hover .jr-vignette-img { transform: scale(1.04); }
.vw-majeure-texte { display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 40px 44px; }
.vw-majeure-sur { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-family: var(--f-machine); font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: color-mix(in srgb, var(--rub) 78%, #000); }
.vw-majeure-sur .jr-p-trait, .vw-majeure-sur .jr-p-aplat-trait, .vw-majeure-sur .jr-p-vif-trait { stroke: var(--rub); }
.vw-majeure-titre { font-family: var(--f-titre); font-weight: 400; font-size: clamp(26px, 2.5vw, 36px); line-height: 1.12; margin: 0; }
.vw-majeure-titre a { color: var(--encre); text-decoration: none; }
.vw-majeure-titre a:hover { text-decoration: underline wavy var(--rub); text-underline-offset: 6px; text-decoration-thickness: 2px; }
.vw-majeure-chapo { margin: 0; font-size: 17px; line-height: 1.55; color: var(--encre-douce); }
.vw-majeure-meta { display: flex; align-items: center; gap: 10px; margin: 2px 0 0; font-size: 15px; }
.vw-majeure-meta .jr-avatar { border-radius: 50%; border: 2px solid #FFFFFF; }
.vw-majeure-meta > span { display: flex; flex-direction: column; line-height: 1.3; }
.vw-majeure-meta .jr-tapuscrit { font-size: 11px; }
.vw-majeure-bouton { align-self: flex-start; margin-top: 8px; }
.jr-grille-une-fil .vw-majeure { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-bottom: 0; }
.jr-grille-une-fil .vw-majeure-texte { padding: 28px 30px; }
.jr-grille-une-fil .vw-majeure-image .jr-vignette { min-height: 320px; }
@media (max-width: 800px) {
	.vw-majeure, .jr-grille-une-fil .vw-majeure { grid-template-columns: minmax(0, 1fr); }
	.vw-majeure-image .jr-vignette, .jr-grille-une-fil .vw-majeure-image .jr-vignette { min-height: 0; aspect-ratio: 16 / 10; }
	.vw-majeure-texte, .jr-grille-une-fil .vw-majeure-texte { padding: 24px 22px 26px; }
}

/* ---- Accueil : « Se former, puis en vivre » (R11) ---- */
.vw-duo-bande { background: linear-gradient(180deg, #FFFFFF 0%, var(--papier-creux) 100%); }
.vw-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.vw-duo-panneau {
	position: relative; display: flex; flex-direction: column; gap: 18px; padding: 30px 28px 28px; overflow: hidden;
	background: #FFFFFF; border-radius: 24px; border: 1.5px solid color-mix(in srgb, var(--rub) 22%, transparent);
	box-shadow: 0 24px 44px -34px rgba(34, 19, 37, .45);
}
.vw-duo-panneau::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--rub); }
.vw-duo-tete { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px; align-items: start; }
.vw-duo-picto { width: 64px; height: 64px; border-radius: 18px; background: var(--rub-fond); display: grid; place-items: center; }
.vw-duo-picto .jr-p-trait, .vw-duo-picto .jr-p-aplat-trait, .vw-duo-picto .jr-p-vif-trait { stroke: var(--rub); }
.vw-duo-picto .jr-p-aplat { fill: #FFFFFF; }
.vw-duo-tete h3 { font-family: var(--f-titre); font-weight: 400; font-size: 26px; line-height: 1.15; margin: 0 0 6px; }
.vw-duo-tete h3 a { text-decoration: none; color: var(--encre); }
.vw-duo-tete h3 a:hover { text-decoration: underline wavy var(--rub); text-underline-offset: 5px; }
.vw-duo-tete p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--encre-douce); }
.vw-duo-compte { padding: 8px 12px; border-radius: 14px; background: var(--rub-fond); text-align: center; font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }
.vw-duo-compte b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 26px; line-height: 1.1; color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-duo-liste { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.vw-duo-ligne {
	display: grid; grid-template-columns: 34px 104px minmax(0, 1fr) 24px; gap: 14px; align-items: center;
	padding: 10px; border-radius: 16px; text-decoration: none; color: var(--encre);
	transition: background .2s ease, transform .2s ease;
}
.vw-duo-ligne:hover, .vw-duo-ligne:focus-visible { background: var(--rub-fond); transform: translateX(4px); }
.vw-duo-n { font-family: var(--f-titre); font-size: 22px; color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-duo-image .jr-vignette { aspect-ratio: 4 / 3; border-radius: 12px; }
.vw-duo-image .jr-vignette-img { border-radius: 12px; }
.vw-duo-texte { display: flex; flex-direction: column; gap: 4px; }
.vw-duo-texte b { font-size: 16.5px; line-height: 1.3; font-weight: 700; }
.vw-duo-texte .jr-tapuscrit { font-size: 11px; }
.vw-duo-fleche { width: 22px; height: 22px; fill: none; stroke: var(--rub); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.vw-duo-ligne:hover .vw-duo-fleche { transform: translateX(4px); }
.vw-lien-fleche { align-self: flex-start; font-weight: 700; color: var(--magenta-fonce); text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; }
.vw-duo-panneau .vw-lien-fleche { color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-lien-fleche:hover { border-bottom-style: dashed; }
@media (max-width: 900px) { .vw-duo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) {
	.vw-duo-panneau { padding: 26px 16px 20px; }
	.vw-duo-tete { grid-template-columns: auto minmax(0, 1fr); }
	.vw-duo-compte { display: none; }
	.vw-duo-ligne { grid-template-columns: 26px 76px minmax(0, 1fr); gap: 10px; padding: 8px 4px; }
	.vw-duo-fleche { display: none; }
}

/* ---- La lettre de l'atelier, refaite (R12) ---- */
.vw-lettre {
	position: relative; overflow: hidden; padding: 96px 0; border-top: 1.5px solid var(--filet);
	background: radial-gradient(circle at 10% 15%, #FBE3F6 0, transparent 40%), radial-gradient(circle at 92% 85%, #E9E7F8 0, transparent 44%), #FFFFFF;
}
.vw-lettre-grille { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px; align-items: center; }
.vw-sur-titre {
	display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 6px 14px;
	border-radius: 999px; background: #FFFFFF; border: 1.5px solid color-mix(in srgb, var(--magenta) 30%, transparent);
	font-family: var(--f-machine); font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--magenta-fonce);
}
.vw-sur-titre-point { width: 8px; height: 8px; border-radius: 50%; background: var(--magenta-vif); }
@media (prefers-reduced-motion: no-preference) { .vw-sur-titre-point { animation: jr-pulse 2.4s ease-in-out infinite; } }
.vw-lettre h2 { font-size: clamp(34px, 4vw, 54px); line-height: 1.05; margin: 0 0 14px; }
.vw-lettre-chapo { font-size: 19px; line-height: 1.55; color: var(--encre-douce); max-width: 52ch; }
.vw-lettre-atouts { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 20px 0 26px; }
.vw-lettre-atouts li { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15.5px; }
.vw-lettre-atouts svg { width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: #E3EFE4; fill: none; stroke: var(--succes); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.vw-lettre-form {
	position: relative; display: flex; align-items: center; max-width: 540px; padding: 6px;
	background: #FFFFFF; border: 2px solid var(--encre); border-radius: 999px;
	box-shadow: 0 18px 32px -22px rgba(34, 19, 37, .5); transition: border-color .2s ease, box-shadow .2s ease;
}
.vw-lettre-form:focus-within { border-color: var(--magenta); box-shadow: 0 0 0 4px #FBE3F6, 0 18px 32px -22px rgba(34, 19, 37, .5); }
.vw-lettre-form-icone { flex: none; width: 22px; height: 22px; margin-left: 14px; fill: none; stroke: var(--encre-douce); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vw-lettre-form input[type="email"] { flex: 1; min-width: 0; min-height: 50px; padding: 0 12px; border: 0; outline: 0; background: transparent; font: inherit; font-size: 17px; color: var(--encre); }
.vw-lettre-form button {
	flex: none; min-height: 50px; padding: 0 26px; border: 0; border-radius: 999px; cursor: pointer;
	background: var(--magenta); color: #FFFFFF; font: inherit; font-weight: 700; font-size: 16px; transition: background .2s ease, transform .2s ease;
}
.vw-lettre-form button:hover, .vw-lettre-form button:focus-visible { background: var(--magenta-fonce); transform: translateY(-1px); }
.vw-lettre-note { margin-top: 12px; font-size: 13px; color: var(--encre-douce); }
.vw-lettre-note a { color: var(--magenta-fonce); }
.vw-lettre-apercu { position: relative; display: grid; place-items: center; min-height: 400px; }
.vw-apercu-dos { position: absolute; width: 80%; height: 84%; border-radius: 28px; background: #E9E7F8; transform: rotate(6deg); }
.vw-apercu-feuille {
	position: relative; width: min(420px, 100%); padding: 26px; background: #FFFFFF;
	border: 1.5px solid var(--encre); border-radius: 20px; box-shadow: 10px 12px 0 var(--magenta);
	transform: rotate(-2.5deg); transition: transform .45s cubic-bezier(.34, 1.56, .64, 1);
}
@media (prefers-reduced-motion: no-preference) { .vw-apercu-feuille { animation: vw-flotte 6s ease-in-out infinite; } }
.vw-lettre-apercu:hover .vw-apercu-feuille { transform: rotate(0deg); }
.vw-apercu-tete { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1.5px dashed var(--filet); }
.vw-apercu-tete b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 20px; line-height: 1.1; }
.vw-apercu-tete span { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--encre-douce); }
.vw-apercu-liste { list-style: none; display: flex; flex-direction: column; gap: 14px; }
.vw-apercu-liste li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 15px; font-weight: 600; line-height: 1.35; }
.vw-apercu-n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--rub); color: #FFFFFF; font-family: var(--f-machine); font-size: 12px; font-weight: 700; }
.vw-apercu-liste em { display: block; font-style: normal; font-family: var(--f-machine); font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rub); margin-bottom: 2px; }
.vw-apercu-signe { margin: 18px 0 0; font-size: 14px; color: var(--encre-douce); }
.vw-apercu-signe b { font-family: var(--f-titre); font-weight: 400; font-size: 17px; color: var(--encre); }
.vw-apercu-timbre { position: absolute; top: 2%; right: 6%; width: 74px; height: 86px; display: grid; place-items: center; background: #FFFFFF; border: 2px dashed var(--magenta); border-radius: 8px; transform: rotate(10deg); z-index: 2; }
@media (max-width: 900px) {
	.vw-lettre { padding: 64px 0; }
	.vw-lettre-grille { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.vw-lettre-apercu { min-height: 0; padding: 12px 18px 20px; }
}
@media (max-width: 480px) {
	.vw-lettre-form { flex-wrap: wrap; border-radius: 20px; }
	.vw-lettre-form input[type="email"] { flex-basis: calc(100% - 50px); }
	.vw-lettre-form button { flex-basis: 100%; }
	.vw-apercu-timbre { display: none; }
}

/* ---- Pied de page : point de chaque rubrique visible (R13) ---- */
.jr-pied-point { box-shadow: 0 0 0 2px rgba(255, 255, 255, .15); }

/* ---- Article : en-tête (R14) ---- */
.vw-art-hero, .vw-rub-hero, .vw-auteur-hero, .vw-outil-hero { position: relative; overflow: hidden; }
.vw-art-hero { padding: 32px 0 60px; background: linear-gradient(160deg, var(--rub-fond) 0%, #FFFFFF 60%); }
.vw-art-hero-deco i { position: absolute; border-radius: 50%; pointer-events: none; }
.vw-art-hero-deco i:nth-child(1) { width: 460px; height: 460px; right: -140px; top: -160px; background: radial-gradient(circle, color-mix(in srgb, var(--rub) 24%, transparent), transparent 70%); }
.vw-art-hero-deco i:nth-child(2) { width: 320px; height: 320px; left: -110px; bottom: -140px; background: radial-gradient(circle, rgba(212, 27, 192, .16), transparent 70%); }
.vw-art-hero-deco i:nth-child(3) { width: 14px; height: 14px; left: 47%; top: 16%; background: var(--rub); opacity: .45; }
@media (prefers-reduced-motion: no-preference) {
	.vw-art-hero-deco i:nth-child(1) { animation: vw-derive 18s ease-in-out infinite alternate; }
	.vw-art-hero-deco i:nth-child(2) { animation: vw-derive 23s ease-in-out infinite alternate-reverse; }
	.vw-art-hero-deco i:nth-child(3) { animation: vw-flotte 5s ease-in-out infinite; }
}
.vw-art-hero-grille { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 60px; align-items: center; min-height: min(calc(100vh - 170px), 700px); }
.vw-art-hero-grille--seul { grid-template-columns: minmax(0, 1fr); min-height: 0; }
.vw-art-titre { font-size: clamp(38px, 4.1vw, 60px); line-height: 1.04; max-width: 18ch; margin: 16px 0 18px; }
.vw-art-hero .jr-chapo-article { font-size: 20px; max-width: 56ch; margin: 0; }
.vw-art-rubrique {
	display: inline-flex; align-items: center; gap: 8px; padding: 7px 16px 7px 10px; border-radius: 999px;
	background: #FFFFFF; border: 1.5px solid color-mix(in srgb, var(--rub) 40%, transparent);
	color: var(--encre); text-decoration: none; font-weight: 700; font-size: 14px; margin: 0; transition: transform .2s ease, border-color .2s ease;
}
a.vw-art-rubrique:hover { transform: translateY(-2px); border-color: var(--rub); }
.vw-art-rubrique .jr-p-trait, .vw-art-rubrique .jr-p-aplat-trait, .vw-art-rubrique .jr-p-vif-trait { stroke: var(--rub); }
.vw-art-rubrique .jr-p-aplat { fill: var(--rub-fond); }
.vw-art-auteur { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 24px; }
.vw-art-auteur-lien { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--encre); }
.vw-art-auteur-lien .jr-avatar { border-radius: 50%; border: 2px solid #FFFFFF; box-shadow: 0 0 0 2px var(--rub); }
.vw-art-auteur-lien > span { display: flex; flex-direction: column; line-height: 1.25; }
.vw-art-auteur-lien b { font-size: 16px; }
.vw-art-auteur-lien > span > span { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }
.vw-art-auteur-lien:hover b { text-decoration: underline wavy var(--rub); text-underline-offset: 4px; }
.vw-art-puces { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.vw-art-puces li { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: rgba(255, 255, 255, .85); border: 1.5px solid var(--filet); font-size: 14px; font-weight: 600; }
.vw-art-puces svg { width: 16px; height: 16px; fill: none; stroke: var(--rub); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.vw-art-go { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; font-weight: 700; color: var(--encre); text-decoration: none; }
.vw-art-go span { border-bottom: 2px solid var(--rub); padding-bottom: 2px; }
.vw-art-go svg { width: 34px; height: 34px; padding: 7px; border-radius: 50%; background: var(--encre); fill: none; stroke: #FFFFFF; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; animation: vw-rebond 1.8s ease-in-out infinite; }
.vw-art-hero-image { position: relative; margin: 0; }
.vw-art-hero-cadre { display: block; overflow: hidden; border-radius: 26px; border: 2px solid var(--encre); box-shadow: 12px 14px 0 var(--rub); transform: rotate(1.5deg); background: #FFFFFF; }
@media (prefers-reduced-motion: no-preference) { .vw-art-hero-cadre { animation: vw-monte .9s .1s cubic-bezier(.2, .8, .2, 1) both; } }
.vw-art-hero-cadre .jr-vignette { aspect-ratio: 5 / 4; border-radius: 0; }
.vw-art-hero-cadre .jr-vignette-img, .vw-art-hero-cadre .jr-vignette-repli { border-radius: 0; }
.vw-art-badge { position: absolute; z-index: 2; font-weight: 700; }
.vw-art-badge--minutes {
	left: -28px; top: -24px; width: 96px; height: 96px; border-radius: 50%; display: grid; place-content: center; text-align: center;
	background: var(--magenta); color: #FFFFFF; border: 2px solid var(--encre); transform: rotate(-8deg);
	font-family: var(--f-machine); font-size: 12px; text-transform: uppercase; line-height: 1;
}
.vw-art-badge--minutes b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 36px; line-height: 1; }
.vw-art-badge--relu {
	right: -16px; bottom: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px;
	background: #FFFFFF; border: 2px solid var(--encre); border-radius: 999px; font-size: 14px; transform: rotate(-4deg);
}
.vw-art-badge--relu svg { width: 18px; height: 18px; fill: none; stroke: var(--succes); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }
@media (prefers-reduced-motion: no-preference) {
	.vw-art-badge--minutes { animation: vw-pop .5s .5s both, vw-flotte 5s 1s ease-in-out infinite; }
	.vw-art-badge--relu { animation: vw-pop .5s .75s both, vw-flotte 6s 1.3s ease-in-out infinite; }
}
.vw-art-hero-image figcaption { margin-top: 24px; text-align: right; font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }
@media (max-width: 900px) {
	.vw-art-hero { padding: 24px 0 44px; }
	.vw-art-hero-grille { grid-template-columns: minmax(0, 1fr); gap: 36px; min-height: 0; }
	.vw-art-hero-image { margin: 0 12px; }
	.vw-art-badge--minutes { left: -10px; top: -18px; width: 72px; height: 72px; font-size: 10px; }
	.vw-art-badge--minutes b { font-size: 26px; }
	.vw-art-badge--relu { right: -8px; bottom: 30px; font-size: 12px; padding: 6px 12px; }
	.vw-art-go { display: none; }
}

/* ---- Article : corps (R15, R16) ---- */
.jr-art-grille { grid-template-columns: minmax(0, 700px) minmax(0, 320px); gap: 56px; justify-content: space-between; align-items: stretch; padding-top: 56px; scroll-margin-top: 80px; }
.jr-corps { font-size: 20px; line-height: 1.75; }
.jr-corps strong { font-weight: 700; color: var(--encre); padding: 0 2px; background: linear-gradient(transparent 62%, var(--surligneur) 62%, var(--surligneur) 94%, transparent 94%); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.jr-corps em { font-style: italic; color: var(--magenta-fonce); }
.jr-corps a strong, .jr-corps .jr-fiche-titre strong, .jr-corps h2 strong, .jr-corps h3 strong { background: none; padding: 0; }
@media (max-width: 640px) { .jr-corps { font-size: 18.5px; } }

/* ---- Article : colonne collante et sommaire lisible (R18, R19) ---- */
.jr-cote { position: relative; top: auto; display: block; }
.vw-cote-colle { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 16px; max-height: calc(100vh - 116px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 2px 8px 8px 2px; }
.jr-cote .jr-minutes-restantes { display: inline-flex; align-self: flex-start; padding: 6px 12px; border-radius: 999px; background: var(--magenta-pale); font-size: 12px; font-weight: 700; }
.vw-sommaire { background: #FFFFFF; border: 1.5px solid var(--encre); border-radius: 18px; padding: 20px 16px 14px; box-shadow: 6px 6px 0 var(--magenta-pale); }
.vw-sommaire-titre { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 0 6px; font-family: var(--f-titre); font-size: 23px; line-height: 1; }
.vw-sommaire-titre svg { width: 22px; height: 22px; fill: none; stroke: var(--magenta); stroke-width: 2.4; stroke-linecap: round; }
.vw-sommaire-titre span { margin-left: auto; font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }
.vw-sommaire .jr-sommaire li { margin: 0 0 2px; gap: 6px; align-items: center; }
.vw-sommaire .jr-sommaire li::before { width: 26px; height: 26px; font-size: 12px; font-weight: 700; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.vw-sommaire .jr-sommaire a { display: block; flex: 1; padding: 8px 10px; border-radius: 10px; font-size: 16px; font-weight: 600; line-height: 1.35; color: var(--encre); transition: background .2s ease, color .2s ease; }
.vw-sommaire .jr-sommaire a:hover { background: var(--papier-creux); text-decoration: none; }
.vw-sommaire .jr-sommaire li.is-actif::before { background: var(--magenta); border-color: var(--magenta); color: #FFFFFF; }
.vw-sommaire .jr-sommaire li.is-actif a { background: var(--magenta-pale); color: var(--magenta-fonce); }
.vw-cote-lettre { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--magenta-pale); color: var(--encre); text-decoration: none; font-size: 14px; line-height: 1.35; transition: transform .2s ease; }
.vw-cote-lettre:hover { transform: translateY(-2px); }
.vw-cote-lettre svg { flex: none; width: 30px; height: 30px; fill: none; stroke: var(--magenta); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vw-cote-lettre b { display: block; font-size: 15.5px; }
@media (max-width: 1024px) {
	.jr-art-grille { grid-template-columns: minmax(0, 1fr); padding-top: 32px; }
	.vw-cote-colle { position: static; max-height: none; overflow: visible; }
}

/* ---- « À découvrir également » en cartes illustrées (R17) ---- */
.sb-maillage.vw-decouvrir { margin: 52px 0 8px; padding: 28px; border: 1.5px solid var(--encre); border-radius: 22px; background: linear-gradient(135deg, #FFFFFF 0%, var(--magenta-pale) 160%); box-shadow: 8px 8px 0 var(--magenta-pale); }
.vw-decouvrir-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 10px 20px; flex-wrap: wrap; margin-bottom: 18px; }
.vw-decouvrir-tete h2 { margin: 0; font-size: 27px; }
.vw-decouvrir-tete .vw-lien-fleche { font-size: 15px; }
.vw-decouvrir-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.vw-decouvrir-carte {
	position: relative; display: flex; flex-direction: column; overflow: hidden; background: #FFFFFF;
	border: 1.5px solid var(--filet); border-radius: 16px; color: var(--encre); text-decoration: none; font-weight: 400;
	transition: transform .28s cubic-bezier(.34, 1.56, .64, 1), box-shadow .28s ease, border-color .28s ease;
}
.vw-decouvrir-carte:hover, .vw-decouvrir-carte:focus-visible { transform: translateY(-4px); border-color: var(--rub); box-shadow: 0 18px 30px -20px rgba(34, 19, 37, .55); }
.vw-decouvrir-image .jr-vignette { aspect-ratio: 16 / 10; border-radius: 0; }
.vw-decouvrir-image .jr-vignette-img, .vw-decouvrir-image .jr-vignette-repli { border-radius: 0; box-shadow: none; }
.vw-decouvrir-texte { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px 16px; }
.vw-decouvrir-texte em { font-style: normal; font-family: var(--f-machine); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rub); }
.vw-decouvrir-texte b { font-size: 16px; line-height: 1.3; }
.vw-decouvrir-texte .jr-tapuscrit { font-size: 11px; }
.vw-decouvrir-fleche { position: absolute; right: 10px; top: 10px; width: 34px; height: 34px; padding: 7px; border-radius: 50%; background: #FFFFFF; fill: none; stroke: var(--encre); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transform: translateX(-6px); transition: opacity .25s ease, transform .25s ease; }
.vw-decouvrir-carte:hover .vw-decouvrir-fleche { opacity: 1; transform: translateX(0); }
@media (max-width: 760px) {
	.sb-maillage.vw-decouvrir { padding: 20px 16px; }
	.vw-decouvrir-grille { grid-template-columns: minmax(0, 1fr); }
	.vw-decouvrir-carte { flex-direction: row; align-items: stretch; }
	.vw-decouvrir-image { flex: none; width: 112px; }
	.vw-decouvrir-image .jr-vignette { height: 100%; aspect-ratio: auto; min-height: 96px; }
	.vw-decouvrir-fleche { display: none; }
}

/* ---- Rubriques, étiquettes, page Rubriques : en-tête (R20, R22) ---- */
.vw-rub-hero { padding: 36px 0 60px; background: linear-gradient(160deg, var(--rub-fond) 0%, #FFFFFF 70%); border-bottom: 1.5px solid var(--filet); }
.vw-rub-hero-grille { position: relative; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr); gap: 48px; align-items: center; min-height: 400px; }
.vw-rub-titre { font-size: clamp(42px, 5.2vw, 74px); line-height: 1.02; margin: 16px 0 16px; }
.vw-rub-hero .jr-chapo, .vw-auteur-hero .jr-chapo { max-width: 56ch; margin: 0; }
.vw-rub-hero .vw-art-puces { margin-top: 20px; }
.vw-rub-boutons { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.vw-rub-medaillon { position: relative; justify-self: center; width: 300px; height: 300px; display: grid; place-items: center; }
.vw-rub-anneau { position: absolute; inset: 0; border-radius: 50%; border: 2.5px dashed color-mix(in srgb, var(--rub) 55%, transparent); }
@media (prefers-reduced-motion: no-preference) { .vw-rub-anneau { animation: vw-tourne 40s linear infinite; } }
.vw-rub-disque { width: 220px; height: 220px; border-radius: 50%; display: grid; place-items: center; background: #FFFFFF; border: 2px solid var(--encre); box-shadow: 10px 12px 0 var(--rub); animation: vw-pop .7s .1s both; }
.vw-rub-disque .jr-picto { width: 120px; height: 120px; }
.vw-rub-disque .jr-p-trait, .vw-rub-disque .jr-p-aplat-trait, .vw-rub-disque .jr-p-vif-trait { stroke: var(--rub); }
.vw-rub-disque .jr-p-aplat { fill: var(--rub-fond); }
.vw-rub-flottant { position: absolute; z-index: 2; padding: 7px 14px; border-radius: 999px; background: #FFFFFF; border: 2px solid var(--encre); font-size: 14px; font-weight: 600; white-space: nowrap; }
.vw-rub-flottant b { font-family: var(--f-titre); font-weight: 400; font-size: 18px; color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-rub-flottant--1 { top: 4%; left: -22%; transform: rotate(-6deg); }
.vw-rub-flottant--2 { bottom: 14%; right: -18%; transform: rotate(5deg); }
.vw-rub-flottant--3 { bottom: -3%; left: 2%; transform: rotate(-3deg); background: var(--rub); border-color: var(--encre); color: #FFFFFF; }
@media (prefers-reduced-motion: no-preference) {
	.vw-rub-flottant--1 { animation: vw-pop .5s .35s both, vw-flotte 5s 1s ease-in-out infinite; }
	.vw-rub-flottant--2 { animation: vw-pop .5s .55s both, vw-flotte 6s 1.4s ease-in-out infinite; }
	.vw-rub-flottant--3 { animation: vw-pop .5s .75s both, vw-flotte 5.5s 1.8s ease-in-out infinite; }
}
.vw-rub-liste { padding-top: 44px; padding-bottom: 16px; }
@media (max-width: 900px) {
	.vw-rub-hero { padding: 24px 0 36px; }
	.vw-rub-hero-grille { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	.vw-rub-medaillon { display: none; }
	.vw-rub-liste { padding-top: 28px; }
}

/* ---- Pages auteurs (R21) ---- */
.vw-auteur-hero { --rub: var(--magenta); --rub-fond: var(--magenta-pale); padding: 44px 0 64px; background: linear-gradient(160deg, #FBE3F6 0%, #FFFFFF 65%); border-bottom: 1.5px solid var(--filet); }
.vw-auteur-grille { position: relative; display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 64px; align-items: center; }
.vw-auteur-portrait { position: relative; justify-self: center; }
.vw-auteur-cadre { display: block; width: 300px; height: 350px; overflow: hidden; border-radius: 28px; border: 2px solid var(--encre); box-shadow: 14px 16px 0 var(--magenta); transform: rotate(-2.5deg); background: #FFFFFF; }
.vw-auteur-cadre .jr-avatar { width: 100% !important; height: 100% !important; object-fit: cover; border-radius: 0; }
.vw-auteur-portrait .jr-auteur-ruban { top: -12px; right: 34px; width: 84px; height: 28px; }
.vw-auteur-sticker {
	position: absolute; left: -34px; bottom: 28px; width: 112px; height: 112px; border-radius: 50%;
	display: grid; place-content: center; text-align: center; background: var(--magenta); color: #FFFFFF; border: 2px solid var(--encre);
	font-family: var(--f-machine); font-size: 11px; font-weight: 700; text-transform: uppercase; line-height: 1.2; transform: rotate(-10deg);
}
.vw-auteur-sticker b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 38px; line-height: 1; }
@media (prefers-reduced-motion: no-preference) { .vw-auteur-sticker { animation: vw-pop .5s .5s both, vw-flotte 5s 1s ease-in-out infinite; } }
.vw-auteur-rubs { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 18px; }
.vw-puce-rub { display: inline-flex; align-items: center; gap: 8px; padding: 5px 6px 5px 14px; border-radius: 999px; background: var(--rub-fond); color: var(--encre); font-weight: 700; font-size: 14px; text-decoration: none; transition: transform .2s ease; }
.vw-puce-rub:hover { transform: translateY(-2px); }
.vw-puce-rub b { min-width: 26px; height: 26px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center; background: var(--rub); color: #FFFFFF; font-size: 13px; }
.vw-auteur-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 180px)); gap: 12px; }
.vw-auteur-stats div { padding: 14px 16px; border-radius: 16px; background: #FFFFFF; border: 1.5px solid var(--filet); }
.vw-auteur-stats b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 30px; line-height: 1.1; color: var(--magenta); }
.vw-auteur-stats span { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }
@media (max-width: 900px) {
	.vw-auteur-hero { padding: 28px 0 44px; }
	.vw-auteur-grille { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.vw-auteur-cadre { width: 230px; height: 260px; }
	.vw-auteur-sticker { left: -22px; width: 88px; height: 88px; font-size: 9px; }
	.vw-auteur-sticker b { font-size: 28px; }
	.vw-auteur-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* cadres à ratio imposé : l'image ne doit pas agrandir la boîte (min-height:auto) */
.vw-decouvrir-image .jr-vignette, .vw-art-hero-cadre .jr-vignette { position: relative; overflow: hidden; min-height: 0; }
.vw-decouvrir-image .jr-vignette-img, .vw-art-hero-cadre .jr-vignette-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---- L'atelier « Votre texte sonne-t-il IA ? » (R23-R25) ---- */
.vw-outil-hero { --rub: var(--magenta); --rub-fond: var(--magenta-pale); padding: 32px 0 120px; background: linear-gradient(160deg, #FBE3F6 0%, #FFFFFF 70%); }
.vw-outil-hero-in { position: relative; max-width: 980px; }
.vw-outil-hero .jr-chapo { max-width: 62ch; margin: 0; }
.vw-outil-hero .vw-art-puces { margin-top: 20px; }
.vw-outil-zone { margin-top: -84px; position: relative; z-index: 2; padding-bottom: 72px; }

.vw-app { background: #FFFFFF; border: 2px solid var(--encre); border-radius: 22px; box-shadow: 12px 14px 0 var(--magenta); overflow: hidden; }
.vw-app-barre { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 12px 18px; border-bottom: 1.5px solid var(--filet); background: var(--papier); }
.vw-app-points { display: inline-flex; gap: 7px; }
.vw-app-points i { width: 12px; height: 12px; border-radius: 50%; background: #FF5F57; }
.vw-app-points i:nth-child(2) { background: #FEBC2E; }
.vw-app-points i:nth-child(3) { background: #28C840; }
.vw-app-titre { font-family: var(--f-machine); font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--encre-douce); }
.vw-app-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.vw-app-bouton { min-height: 38px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--encre); background: #FFFFFF; color: var(--encre); font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.vw-app-bouton:hover:not(:disabled) { background: var(--magenta-pale); transform: translateY(-1px); }
.vw-app-bouton:disabled { opacity: .45; cursor: default; }
.vw-app-bouton--discret { border-color: var(--filet); color: var(--encre-douce); }

.vw-app-grille { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); min-height: 560px; }
.vw-app-editeur { display: flex; flex-direction: column; border-right: 1.5px solid var(--filet); min-width: 0; }
.vw-app-onglets { display: flex; gap: 4px; padding: 12px 18px 0; }
.vw-app-onglets button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 0; border-radius: 12px 12px 0 0; background: transparent; font: inherit; font-weight: 700; font-size: 15px; color: var(--encre-douce); cursor: pointer; }
.vw-app-onglets button.is-actif { background: var(--magenta-pale); color: var(--magenta-fonce); }
.vw-app-onglets button:disabled { opacity: .45; cursor: default; }
.vw-app-onglets span { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--magenta); color: #FFFFFF; font-size: 12px; display: inline-grid; place-items: center; }
.vw-app-texte, .vw-app-surlignage {
	flex: 1; width: 100%; min-height: 440px; max-height: 620px; margin: 0; padding: 22px 24px; border: 0; border-top: 3px solid var(--magenta-pale);
	font-family: var(--f-corps); font-size: 18px; line-height: 1.75; color: var(--encre); background: #FFFFFF; resize: vertical; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere;
}
.vw-app-texte:focus { outline: none; box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--magenta) 35%, transparent); }
.vw-app-texte::placeholder { color: color-mix(in srgb, var(--encre-douce) 75%, #FFFFFF); }
.vw-app-texte[hidden], .vw-app-surlignage[hidden] { display: none; }
.vw-app-pied { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 12px 18px; border-top: 1.5px solid var(--filet); font-size: 14px; color: var(--encre-douce); }
.vw-app-pied b { color: var(--encre); font-variant-numeric: tabular-nums; }
.vw-app-lancer { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--magenta); color: #FFFFFF; font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; box-shadow: 0 10px 22px -12px rgba(181, 0, 159, .9); transition: background .2s ease, transform .2s ease; }
.vw-app-lancer:hover { background: var(--magenta-fonce); transform: translateY(-1px); }
.vw-app-lancer kbd, .vw-app-astuce kbd { font-family: var(--f-machine); font-size: 11px; padding: 2px 6px; border-radius: 6px; background: rgba(255, 255, 255, .22); }
.vw-app-astuce kbd { background: var(--papier-creux); color: var(--encre); }

/* marques de surlignage, une couleur par signal */
.vw-m { border-radius: 4px; padding: 0 2px; color: var(--encre); transition: opacity .2s ease, box-shadow .2s ease; }
.vw-m--formules { background: #F6BDEE; }
.vw-m--gonfles { background: #FFD8B5; }
.vw-m--connecteurs { background: #CFE3F5; }
.vw-m--triades { background: #D8F0DA; }
.vw-m--ponctuation { background: #E5DEFA; box-shadow: 0 0 0 2px #E5DEFA; }
.vw-m--debuts { background: #FBE2A0; }
.vw-m--adverbes { background: #E4EBF2; }
.vw-m--anglicismes { background: #FAD0D6; }
.vw-m--traces { background: #FFB4AB; }
.vw-m--uniformite, .vw-m--vocabulaire { background: #EDE7F4; }
.vw-m--humain { background: #CDEFD0; }
.vw-app-surlignage.is-filtre .vw-m:not(.is-cible) { background: transparent; box-shadow: none; opacity: .55; }
.vw-app-surlignage .vw-m.is-cible { box-shadow: 0 0 0 2px var(--encre); }

.vw-app-resultat { display: flex; flex-direction: column; gap: 10px; padding: 24px 22px; background: linear-gradient(180deg, #FFFFFF 0%, var(--papier) 100%); min-width: 0; }
.vw-jauge { --vw-score: 0; position: relative; width: 168px; height: 168px; align-self: center; }
.vw-jauge svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.vw-jauge circle { fill: none; stroke-width: 11; }
.vw-jauge-fond { stroke: var(--papier-creux); }
.vw-jauge-valeur { stroke: var(--succes); stroke-linecap: round; stroke-dasharray: 326.7; stroke-dashoffset: calc(326.7 - 326.7 * var(--vw-score) / 100); transition: stroke-dashoffset .8s cubic-bezier(.2, .8, .2, 1), stroke .3s ease; }
.vw-jauge[data-niveau="orange"] .vw-jauge-valeur { stroke: #C26A00; }
.vw-jauge[data-niveau="rouge"] .vw-jauge-valeur { stroke: #D7263D; }
.vw-jauge-centre { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; }
.vw-jauge-centre b { font-family: var(--f-titre); font-weight: 400; font-size: 54px; line-height: 1; font-variant-numeric: tabular-nums; }
.vw-jauge-centre span { font-family: var(--f-machine); font-size: 12px; color: var(--encre-douce); }
.vw-verdict { margin: 4px 0 0; text-align: center; font-family: var(--f-titre); font-size: 24px; line-height: 1.15; }
.vw-verdict-phrase { margin: 0 0 6px; text-align: center; font-size: 15px; line-height: 1.5; color: var(--encre-douce); }
.vw-signaux { list-style: none; display: flex; flex-direction: column; gap: 4px; }
.vw-signal button { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; align-items: center; padding: 7px 10px; border: 1.5px solid transparent; border-radius: 12px; background: transparent; font: inherit; text-align: left; color: var(--encre); cursor: pointer; transition: background .2s ease, border-color .2s ease; }
.vw-signal button:hover:not(:disabled) { background: #FFFFFF; border-color: var(--filet); }
.vw-signal button:disabled { cursor: default; }
.vw-signal.is-cible button { background: #FFFFFF; border-color: var(--encre); }
.vw-signal-nom { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14.5px; }
.vw-signal-nom i, .vw-correction-tete i { width: 12px; height: 12px; border-radius: 4px; flex: none; }
.vw-signal-info { font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); white-space: nowrap; }
.vw-signal-barre { grid-column: 1 / -1; height: 6px; border-radius: 3px; background: var(--papier-creux); overflow: hidden; }
.vw-signal-barre span { display: block; height: 100%; border-radius: 3px; background: var(--succes); transition: width .6s cubic-bezier(.2, .8, .2, 1); }
.vw-signal--orange .vw-signal-barre span { background: #C26A00; }
.vw-signal--rouge .vw-signal-barre span { background: #D7263D; }
.vw-signal[data-type="humain"] .vw-signal-barre span { background: var(--succes); }
.vw-app-sorties { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; margin-top: auto; padding-top: 10px; }
.vw-app-astuce { font-size: 13px; color: var(--encre-douce); }

.vw-corrections { margin-top: 56px; }
.vw-corrections h2 { font-size: 34px; margin-bottom: 20px; }
.vw-corrections-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.vw-correction { padding: 20px 22px; border-radius: 18px; background: #FFFFFF; border: 1.5px solid var(--filet); border-top: 5px solid #C26A00; }
.vw-correction--rouge { border-top-color: #D7263D; }
.vw-correction-tete { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-weight: 700; font-size: 17px; }
.vw-correction-tete span { margin-left: auto; font-family: var(--f-machine); font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--encre-douce); }
.vw-correction-extrait { margin: 0 0 8px; padding: 10px 12px; border-radius: 10px; background: var(--papier); font-size: 15px; line-height: 1.55; color: var(--encre-douce); }
.vw-correction-extrait mark { background: var(--surligneur); color: var(--encre); border-radius: 3px; padding: 0 2px; }
.vw-correction-piste { display: block; margin-top: 4px; font-weight: 700; color: var(--magenta-fonce); }
.vw-correction-conseil { margin: 10px 0 0; font-size: 15px; font-weight: 600; }
.vw-correction-vide { padding: 18px 20px; border-radius: 16px; background: #E3EFE4; font-weight: 700; color: var(--succes); }

.vw-historique { margin-top: 48px; }
.vw-historique-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.vw-historique-tete h2 { margin: 0; font-size: 26px; }
.vw-historique-note { font-size: 14px; color: var(--encre-douce); margin: 6px 0 14px; }
.vw-historique-liste { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vw-historique-liste button { width: 100%; display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: auto auto; gap: 2px 12px; align-items: center; padding: 10px 14px; border: 1.5px solid var(--filet); border-radius: 14px; background: #FFFFFF; font: inherit; text-align: left; color: var(--encre); cursor: pointer; transition: border-color .2s ease, transform .2s ease; }
.vw-historique-liste button:hover { border-color: var(--encre); transform: translateY(-2px); }
.vw-histo-score { grid-row: span 2; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-family: var(--f-titre); font-weight: 400; font-size: 22px; color: #FFFFFF; background: var(--succes); }
.vw-histo-score--orange { background: #C26A00; }
.vw-histo-score--rouge { background: #D7263D; }
.vw-historique-liste span { font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vw-historique-liste em { font-style: normal; font-family: var(--f-machine); font-size: 11px; text-transform: uppercase; color: var(--encre-douce); }

.vw-outil-explique { background: var(--papier); border-top: 1.5px solid var(--filet); }
.vw-explique-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.vw-outil-explique h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.1; }
.vw-explique-chapo { font-size: 19px; }
.vw-outil-explique em { color: var(--magenta-fonce); }
.vw-explique-non { margin-top: 24px; padding: 18px 22px; border-radius: 18px; background: #FFFFFF; border: 1.5px dashed var(--magenta); }
.vw-explique-non-titre { margin: 0 0 8px; font-family: var(--f-machine); font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--magenta-fonce); }
.vw-explique-non ul { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.vw-explique-non li { position: relative; padding-left: 26px; font-size: 16px; }
.vw-explique-non li::before { content: "×"; position: absolute; left: 4px; top: -1px; font-family: var(--f-titre); color: var(--magenta); font-size: 20px; line-height: 1.2; }
.vw-signaux-explique { list-style: none; counter-reset: sig; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.vw-signaux-explique li { counter-increment: sig; position: relative; padding: 16px 16px 16px 58px; border-radius: 16px; background: #FFFFFF; border: 1.5px solid var(--filet); transition: transform .2s ease, border-color .2s ease; }
.vw-signaux-explique li:hover { transform: translateY(-2px); border-color: var(--magenta); }
.vw-signaux-explique li::before { content: counter(sig, decimal-leading-zero); position: absolute; left: 14px; top: 14px; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--magenta-pale); color: var(--magenta-fonce); font-family: var(--f-machine); font-weight: 700; font-size: 12px; }
.vw-signaux-explique b { display: block; font-size: 16px; margin-bottom: 2px; }
.vw-signaux-explique span { font-size: 14px; line-height: 1.45; color: var(--encre-douce); }
.vw-outil-guides { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1000px) {
	.vw-app-grille { grid-template-columns: minmax(0, 1fr); }
	.vw-app-editeur { border-right: 0; border-bottom: 1.5px solid var(--filet); }
	.vw-app-texte, .vw-app-surlignage { min-height: 300px; }
	.vw-explique-grille { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.vw-outil-guides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.vw-outil-hero { padding-bottom: 96px; }
	.vw-outil-zone { margin-top: -64px; }
	.vw-app { border-radius: 18px; box-shadow: 6px 7px 0 var(--magenta); }
	.vw-app-titre { display: none; }
	.vw-app-actions { margin-left: 0; }
	.vw-app-texte, .vw-app-surlignage { padding: 16px; font-size: 17px; }
	.vw-app-lancer { width: 100%; justify-content: center; }
	.vw-app-lancer kbd, .vw-app-astuce { display: none; }
	.vw-corrections-grille, .vw-historique-liste, .vw-signaux-explique, .vw-outil-guides { grid-template-columns: minmax(0, 1fr); }
}

/* ---- Contact (R26) : tient dans le premier écran ---- */
.vw-contact { --rub: var(--magenta); --rub-fond: var(--magenta-pale); position: relative; overflow: hidden; padding: 32px 0 40px; background: linear-gradient(160deg, #FBE3F6 0%, #FFFFFF 55%, #E0EDF3 130%); }
.vw-contact-grille { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 36px; align-items: stretch; }
.vw-contact-carte { padding: 30px 34px; background: #FFFFFF; border: 2px solid var(--encre); border-radius: 24px; box-shadow: 12px 14px 0 var(--magenta); }
.vw-contact-carte .vw-sur-titre { margin-bottom: 10px; }
.vw-contact-carte h1 { font-size: clamp(34px, 3.4vw, 46px); line-height: 1.05; margin: 0 0 18px; }
.vw-contact-form { display: flex; flex-direction: column; gap: 14px; }
.vw-contact-ligne { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.vw-champ label, .vw-contact-sujets legend { display: block; margin-bottom: 6px; font-weight: 700; font-size: 15px; }
.vw-champ input, .vw-champ textarea { width: 100%; min-height: 48px; padding: 11px 14px; border: 1.5px solid var(--filet); border-radius: 12px; background: var(--papier); font: inherit; font-size: 16px; color: var(--encre); transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.vw-champ textarea { min-height: 118px; resize: vertical; }
.vw-champ input:focus, .vw-champ textarea:focus { outline: none; border-color: var(--magenta); background: #FFFFFF; box-shadow: 0 0 0 4px var(--magenta-pale); }
.vw-contact-sujets { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.vw-contact-sujets legend { width: 100%; }
.vw-puce-choix { position: relative; cursor: pointer; }
.vw-puce-choix input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.vw-puce-choix span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--filet); background: #FFFFFF; font-weight: 600; font-size: 14.5px; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.vw-puce-choix:hover span { border-color: var(--magenta); }
.vw-puce-choix input:checked + span { background: var(--magenta); border-color: var(--magenta); color: #FFFFFF; }
.vw-puce-choix input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 2px; }
.vw-contact-envoi { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; }
.vw-contact-envoi .vw-app-lancer { margin-left: 0; }
.vw-contact-envoi p { margin: 0; font-size: 13px; color: var(--encre-douce); }
.vw-contact-envoi a { color: var(--magenta-fonce); }
.vw-contact-panneau { display: flex; flex-direction: column; gap: 16px; padding: 28px; border-radius: 24px; background: rgba(255, 255, 255, .72); border: 1.5px solid color-mix(in srgb, var(--magenta) 22%, transparent); backdrop-filter: blur(4px); }
.vw-contact-lecteurs p { margin: 12px 0 0; font-size: 15.5px; line-height: 1.55; color: var(--encre-douce); }
.vw-contact-lecteurs b { color: var(--encre); }
.vw-contact-avatars { display: flex; align-items: center; }
.vw-contact-avatars > * { margin-right: -12px; border-radius: 50%; border: 3px solid #FFFFFF; box-shadow: 0 6px 14px -8px rgba(34, 19, 37, .5); }
.vw-contact-avatar-logo { width: 56px; height: 56px; display: grid; place-items: center; background: var(--magenta-pale); }
.vw-contact-engagements { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.vw-contact-engagements li { display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; line-height: 1.4; color: var(--encre-douce); }
.vw-contact-engagements svg { flex: none; width: 38px; height: 38px; padding: 8px; border-radius: 12px; background: #FFFFFF; fill: none; stroke: var(--magenta); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; box-shadow: 0 4px 10px -6px rgba(34, 19, 37, .4); }
.vw-contact-engagements b { display: block; color: var(--encre); font-size: 15.5px; }
.vw-contact-volets { display: flex; flex-direction: column; gap: 6px; margin-top: auto; }
.vw-volet { border-radius: 14px; background: #FFFFFF; border: 1.5px solid var(--filet); padding: 0 14px; }
.vw-volet summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; cursor: pointer; list-style: none; font-weight: 700; font-size: 14.5px; }
.vw-volet summary::-webkit-details-marker { display: none; }
.vw-volet[open] .jr-faq-icone::after { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; }
.vw-volet-corps { padding-bottom: 12px; font-size: 14.5px; line-height: 1.55; color: var(--encre-douce); }
.vw-volet-corps p { margin: 0; }
@media (max-width: 900px) {
	.vw-contact-grille { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.vw-contact-carte { padding: 24px 18px; box-shadow: 6px 7px 0 var(--magenta); }
	.vw-contact-panneau { padding: 22px 18px; }
}
@media (max-width: 560px) { .vw-contact-ligne { grid-template-columns: minmax(0, 1fr); } .vw-contact-envoi .vw-app-lancer { width: 100%; justify-content: center; } }

/* ---- À propos (R27) ---- */
.vw-apropos-intro p { margin: 0; }
.vw-apropos-collage { position: relative; justify-self: center; width: 380px; height: 380px; }
.vw-apropos-polaroid { position: absolute; display: flex; flex-direction: column; gap: 8px; padding: 12px 12px 14px; background: #FFFFFF; border: 2px solid var(--encre); border-radius: 18px; box-shadow: 10px 12px 0 var(--rub); }
.vw-apropos-polaroid .jr-avatar { width: 200px !important; height: 220px !important; object-fit: cover; border-radius: 10px; }
.vw-apropos-polaroid em { font-style: normal; font-family: var(--f-titre); font-size: 19px; text-align: center; }
.vw-apropos-polaroid--1 { left: 0; top: 10px; transform: rotate(-6deg); }
.vw-apropos-polaroid--2 { right: 0; bottom: 0; transform: rotate(5deg); box-shadow: 10px 12px 0 #00699A; }
@media (prefers-reduced-motion: no-preference) {
	.vw-apropos-polaroid--1 { animation: vw-pop .6s .2s both, vw-flotte 6s 1s ease-in-out infinite; }
	.vw-apropos-polaroid--2 { animation: vw-pop .6s .4s both, vw-flotte 7s 1.4s ease-in-out infinite; }
}
.vw-apropos-sceau { position: absolute; z-index: 3; left: 44%; top: 44%; width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; background: #FFFFFF; border: 2px dashed var(--magenta); transform: rotate(-12deg); }
.vw-apropos-deux { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.vw-apropos-deux h2 { font-size: clamp(30px, 3.2vw, 42px); }
.vw-apropos-texte p { font-size: 18px; color: var(--encre-douce); }
.vw-apropos-engagements { display: flex; flex-direction: column; gap: 14px; }
.vw-engagement { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 2px 18px; align-items: center; padding: 20px 22px; border-radius: 20px; background: var(--rub-fond); transition: transform .3s cubic-bezier(.34, 1.56, .64, 1); }
.vw-engagement:nth-child(2) { margin-left: 32px; }
.vw-engagement:hover { transform: translateX(6px); }
.vw-engagement > span { grid-row: span 2; width: 64px; height: 64px; border-radius: 18px; background: #FFFFFF; display: grid; place-items: center; }
.vw-engagement .jr-p-trait, .vw-engagement .jr-p-aplat-trait, .vw-engagement .jr-p-vif-trait, .vw-essentiel-carte .jr-p-trait, .vw-essentiel-carte .jr-p-aplat-trait, .vw-essentiel-carte .jr-p-vif-trait { stroke: var(--rub, var(--magenta)); }
.vw-engagement b { font-family: var(--f-titre); font-weight: 400; font-size: 26px; line-height: 1.1; color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-engagement p { margin: 0; font-size: 15.5px; color: var(--encre-douce); }
.vw-apropos-equipe { background: linear-gradient(180deg, var(--papier) 0%, #FFFFFF 100%); }
.vw-apropos-equipe .jr-section-chapo p { margin: 0; }
.vw-equipe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.vw-membre { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; align-items: center; padding: 24px; background: #FFFFFF; border: 1.5px solid var(--filet); border-radius: 24px; transition: transform .3s ease, box-shadow .3s ease; }
.vw-membre:hover { transform: translateY(-4px); box-shadow: 0 22px 40px -28px rgba(34, 19, 37, .5); }
.vw-membre-photo .jr-avatar { width: 150px !important; height: 170px !important; object-fit: cover; border-radius: 18px; border: 2px solid var(--encre); box-shadow: 6px 7px 0 var(--magenta); transform: rotate(-2deg); }
.vw-membre-role { margin: 0 0 4px; font-family: var(--f-machine); font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--magenta-fonce); }
.vw-membre h3 { font-family: var(--f-titre); font-weight: 400; font-size: 28px; margin: 0 0 8px; }
.vw-membre p { font-size: 15.5px; color: var(--encre-douce); }
.vw-apropos-rubs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.vw-apropos-rub { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 20px; background: var(--rub-fond); color: var(--encre); text-decoration: none; transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease; }
.vw-apropos-rub:hover { transform: translateY(-5px) rotate(-.6deg); box-shadow: 0 18px 32px -22px color-mix(in srgb, var(--rub) 80%, transparent); }
.vw-apropos-rub .vw-duo-picto { width: 54px; height: 54px; background: #FFFFFF; }
.vw-apropos-rub b { font-size: 17px; line-height: 1.25; }
.vw-apropos-rub-phrase { font-size: 14px; line-height: 1.45; color: var(--encre-douce); }
.vw-apropos-rub em { margin-top: auto; font-style: normal; font-family: var(--f-machine); font-weight: 700; font-size: 12px; text-transform: uppercase; color: color-mix(in srgb, var(--rub) 85%, #000); }
.vw-apropos-appels { background: var(--papier); border-top: 1.5px solid var(--filet); }
.vw-apropos-appels-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.vw-appel { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 32px; border-radius: 24px; background: #FFFFFF; border: 2px solid var(--encre); box-shadow: 10px 12px 0 var(--rub-fond); }
.vw-appel .jr-illustration { width: 150px; height: auto; }
.vw-appel h2 { margin: 0; font-size: 30px; }
.vw-appel p { color: var(--encre-douce); margin: 0; }
.vw-appel a:not(.jr-bouton) { color: var(--magenta-fonce); font-weight: 700; }
@media (max-width: 1000px) {
	.vw-apropos-collage { display: none; }
	.vw-apropos-deux, .vw-equipe, .vw-apropos-appels-grille { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.vw-apropos-rubs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vw-engagement:nth-child(2) { margin-left: 0; }
}
@media (max-width: 560px) {
	.vw-membre { grid-template-columns: minmax(0, 1fr); }
	.vw-apropos-rubs { grid-template-columns: minmax(0, 1fr); }
	.vw-appel { padding: 24px 18px; }
}

/* ---- Pages légales (R28, R29) ---- */
.vw-page-hero .vw-rub-hero-grille { min-height: 340px; }
.vw-essentiel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: -34px; position: relative; z-index: 2; }
.vw-essentiel-carte { --rub: var(--magenta); display: flex; gap: 14px; align-items: center; padding: 18px 20px; background: #FFFFFF; border: 2px solid var(--encre); border-radius: 18px; box-shadow: 6px 7px 0 var(--magenta-pale); }
.vw-essentiel-carte > span { flex: none; width: 54px; height: 54px; border-radius: 16px; background: var(--magenta-pale); display: grid; place-items: center; }
.vw-essentiel-carte b { display: block; font-size: 16.5px; }
.vw-essentiel-carte p { margin: 0; font-size: 14.5px; line-height: 1.4; color: var(--encre-douce); }
.vw-legal-grille { display: grid; grid-template-columns: 300px minmax(0, 760px); gap: 56px; padding-top: 56px; padding-bottom: 72px; align-items: stretch; }
.vw-legal-grille > .vw-legal-corps:only-child { grid-column: 1 / -1; max-width: 820px; }
.vw-legal-cote .vw-cote-colle { top: 96px; }
.vw-legal-corps { font-size: 18px; }
.vw-legal-intro { font-size: 20px; color: var(--encre-douce); margin-bottom: 28px; }
.vw-legal-bloc { position: relative; margin: 0 0 18px; padding: 26px 28px 22px 84px; background: #FFFFFF; border: 1.5px solid var(--filet); border-radius: 20px; scroll-margin-top: 96px; transition: border-color .2s ease; }
.vw-legal-bloc:hover { border-color: color-mix(in srgb, var(--magenta) 45%, transparent); }
.vw-legal-bloc h2 { margin: 0 0 10px; font-size: 25px; }
.vw-legal-bloc p { margin: 0 0 .8em; max-width: none; }
.vw-legal-bloc p:last-child { margin-bottom: 0; }
.vw-legal-n { position: absolute; left: 22px; top: 24px; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--magenta-pale); color: var(--magenta-fonce); font-family: var(--f-machine); font-weight: 700; font-size: 14px; }
.vw-legal-question { margin-top: 28px; padding: 18px 22px; border-radius: 16px; background: var(--magenta-pale); font-weight: 600; }
@media (max-width: 1000px) {
	.vw-legal-grille { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 32px; }
	.vw-legal-cote { display: none; }
	.vw-essentiel { grid-template-columns: minmax(0, 1fr); margin-top: 20px; }
}
@media (max-width: 560px) { .vw-legal-bloc { padding: 58px 18px 18px; } .vw-legal-n { left: 18px; top: 14px; width: 36px; height: 36px; } }
.vw-corrections-grille { align-items: start; }
.vw-apropos-collage { width: 440px; height: 400px; }
.vw-apropos-polaroid .jr-avatar { width: 170px !important; height: 190px !important; }
.vw-apropos-polaroid--1 { left: 0; top: 0; }
.vw-apropos-polaroid--2 { right: 0; bottom: 10px; }
.vw-apropos-sceau { left: auto; top: auto; right: 58%; bottom: 0; }
/* en-tête mobile : l'ancienne marge basse de 76 px poussait logo et boutons hors écran (top -24 px) */
@media (max-width: 980px) { .jr-barre { padding-bottom: 0; } .jr-burger { display: grid; place-items: center; min-width: 44px; min-height: 44px; } }
@media (max-width: 980px) { .jr-barre-fin { margin-left: auto; } .jr-burger { order: 3; } }

/* Recette 30/09 : en-tête d'article détaché du menu (RE-0242), formulaire dans la colonne (RE-0243) */
@media (min-width: 901px) { .vw-art-hero { margin: 16px 16px 0; border-radius: 30px; } }
.vw-cote-lettre { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 18px; background: var(--magenta-pale); }
.vw-cote-lettre:hover { transform: none; }
.vw-cote-lettre-titre { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 14px; line-height: 1.35; }
.vw-cote-lettre input[type="email"] { width: 100%; min-height: 44px; padding: 0 14px; border: 1.5px solid color-mix(in srgb, var(--magenta) 30%, transparent); border-radius: 999px; background: #FFFFFF; font: inherit; font-size: 15px; }
.vw-cote-lettre input[type="email"]:focus { outline: none; border-color: var(--magenta); box-shadow: 0 0 0 3px #FFFFFF; }
.vw-cote-lettre button { min-height: 44px; border: 0; border-radius: 999px; background: var(--magenta); color: #FFFFFF; font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; transition: background .2s ease; }
.vw-cote-lettre button:hover { background: var(--magenta-fonce); }