/*
Theme Name: Quand je serai grand
Theme URI: https://www.quandjeseraigrand.com
Description: Thème enfant de GeneratePress pour quandjeseraigrand.com — « Le grand cahier » : papier Seyès, ruban adhésif, photos instantanées, gommettes et toise.
Author: Fox
Template: generatepress
Version: 1.0.2
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: quandjeseraigrand
*/

/* ==========================================================================
   Fonts — served by the theme (no third-party request). SIL OFL 1.1.
   ========================================================================== */
@font-face {
	font-family: "Fredoka";
	font-style: normal;
	font-weight: 500 700;
	font-display: swap;
	src: url("assets/fonts/fredoka-latin-500-700.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Nunito";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("assets/fonts/nunito-latin-400-800.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Playwrite FR Moderne";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("assets/fonts/playwrite-fr-moderne-400.woff2") format("woff2");
}

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
	--qjsg-encre: #1F2A5A;
	--qjsg-encre-douce: #3E4775;
	--qjsg-soleil: #FFC93C;
	--qjsg-fraise: #F27D6B;
	--qjsg-ciel: #7CC4F0;
	--qjsg-menthe: #8CD3A0;
	--qjsg-lilas: #C9A6E0;
	--qjsg-brique: #B3391F;
	--qjsg-papier: #FFFDF7;
	--qjsg-blanc: #FFFFFF;
	--qjsg-soleil-pale: #FFE9A8;
	--qjsg-ciel-pale: #D9EEFB;
	--qjsg-fraise-pale: #FCDCD5;
	--qjsg-menthe-pale: #DDF1E3;
	--qjsg-lilas-pale: #F0E4F7;
	--qjsg-creme: #FFF3CC;
	--qjsg-pointille: #F2E3B8;
	--qjsg-pointille-fonce: #F2D27A;
	--qjsg-ligne: #CFE3F5;
	--qjsg-marge: #F4A9A0;
	/* Accessible (4.5:1 on paper) shades of the pastel accents, for text. */
	--qjsg-fraise-texte: #B3391F;
	--qjsg-ciel-texte: #1D6FA5;
	--qjsg-soleil-texte: #8A6200;
	--qjsg-menthe-texte: #2D7A46;
	--qjsg-lilas-texte: #7A4FA0;

	--qjsg-font-title: "Fredoka", "Nunito", system-ui, sans-serif;
	--qjsg-font-text: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
	--qjsg-font-hand: "Playwrite FR Moderne", "Segoe Print", cursive;

	--qjsg-shadow-photo: 0 10px 28px rgba(31, 42, 90, 0.16);
	--qjsg-shadow-card: 0 6px 20px rgba(31, 42, 90, 0.08);
	--qjsg-tape-fraise: rgba(242, 125, 107, 0.6);
	--qjsg-tape-ciel: rgba(124, 196, 240, 0.7);
	--qjsg-tape-menthe: rgba(140, 211, 160, 0.7);
	--qjsg-tape-soleil: rgba(255, 201, 60, 0.75);
	--qjsg-gutter: clamp(16px, 4vw, 40px);
	--qjsg-max: 1240px;
	/* Article text column: same width as the archive grid (.qjsg-wrap content box). */
	--qjsg-prose: 1160px;
	--qjsg-margin-line: clamp(36px, 8vw, 110px);
}

/* Fox Blocks and Fox Affiliate: align typography, colours and radii only.
   Set on body (not :root) so that a Fox Blocks theme set on a block wrapper
   still wins. */
body {
	--fxb-accent: #1F2A5A;
	--fxb-accent-hover: #B3391F;
	--fxb-accent-soft: rgba(31, 42, 90, 0.06);
	--fxb-accent-rgb: 31, 42, 90;
	--fxb-text: #1F2A5A;
	--fxb-text-secondary: #3E4775;
	--fxb-text-on-sunken: #1F2A5A;
	--fxb-surface-sunken: #FFF8E6;
	--fxb-border-focus: #1F2A5A;
	--fxb-font-display: "Fredoka", "Nunito", system-ui, sans-serif;
	--fxb-font-body: "Nunito", system-ui, sans-serif;
	--fxb-radius-sm: 8px;
	--fxb-radius-md: 14px;
	--fxb-radius-lg: 22px;
	--fox-text: #1F2A5A;
	--fox-text-muted: #3E4775;
	--fox-accent: #1F2A5A;
	--fox-accent-hover: #B3391F;
	--fox-font: "Nunito", system-ui, sans-serif;
	--fox-radius: 18px;
	--fox-radius-sm: 10px;
	--fox-radius-lg: 24px;
}

/* ==========================================================================
   Base
   ========================================================================== */
body {
	background: var(--qjsg-papier);
	color: var(--qjsg-encre);
	font-family: var(--qjsg-font-text);
	font-size: 17px;
	line-height: 1.6;
	overflow-x: hidden;
	overflow-x: clip;
}
a { color: var(--qjsg-encre); }
a:hover, a:focus { color: var(--qjsg-brique); }
h1, h2, h3, h4, h5, h6 {
	font-family: var(--qjsg-font-title);
	font-weight: 600;
	color: inherit;
	line-height: 1.15;
}
:focus-visible {
	outline: 3px solid var(--qjsg-encre);
	outline-offset: 3px;
	border-radius: 6px;
}
.qjsg-on-dark :focus-visible { outline-color: var(--qjsg-soleil); }
img { max-width: 100%; height: auto; }

/* Full-width canvas: the theme draws its own containers. */
body.qjsg-canvas .site.grid-container,
body.qjsg-canvas .site.container {
	max-width: none;
	padding: 0;
	background: transparent;
}
body.qjsg-canvas .site-content {
	display: block;
	padding: 0;
	background: transparent;
}
body.qjsg-canvas .site-footer,
body.qjsg-canvas .site-info { background: transparent; padding: 0; }
.qjsg-main { overflow-x: hidden; overflow-x: clip; }

.qjsg-wrap {
	max-width: var(--qjsg-max);
	margin-inline: auto;
	padding-inline: var(--qjsg-gutter);
	box-sizing: border-box;
}
.qjsg-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Motifs ------------------------------------------------------------------ */
.qjsg-seyes {
	background-color: var(--qjsg-blanc);
	background-image:
		linear-gradient(to right, transparent 0, transparent 7%, var(--qjsg-marge) 7%, var(--qjsg-marge) calc(7% + 2px), transparent calc(7% + 2px)),
		repeating-linear-gradient(to bottom, transparent 0, transparent 31px, var(--qjsg-ligne) 31px, var(--qjsg-ligne) 32px);
}
.qjsg-lines {
	background-color: var(--qjsg-blanc);
	background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 31px, var(--qjsg-ligne) 31px, var(--qjsg-ligne) 32px);
}
.qjsg-dashed-bottom { border-bottom: 3px dashed var(--qjsg-pointille); }
.qjsg-hl {
	background: linear-gradient(transparent 58%, var(--qjsg-soleil) 58%, var(--qjsg-soleil) 90%, transparent 90%);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}
.qjsg-hand {
	font-family: var(--qjsg-font-hand);
	font-weight: 400;
	color: var(--qjsg-brique);
	line-height: 1.5;
}
.qjsg-tilt { transform: rotate(var(--tilt, 0deg)); }
.qjsg-tape {
	position: absolute;
	height: 22px;
	width: 70px;
	background: var(--tape, var(--qjsg-tape-soleil));
	transform: rotate(var(--tape-tilt, -4deg));
	z-index: 1;
	pointer-events: none;
}
.qjsg-ruler {
	height: 26px;
	border-radius: 13px;
	background-color: var(--qjsg-soleil);
	background-image: repeating-linear-gradient(to right, var(--qjsg-encre) 0, var(--qjsg-encre) 2px, transparent 2px, transparent 24px);
	border: 3px solid var(--qjsg-encre);
	box-sizing: border-box;
}
.qjsg-dot {
	display: inline-block;
	width: 18px; height: 18px;
	border-radius: 50%;
	background: var(--dot, var(--qjsg-fraise));
	flex: none;
}

/* Buttons ----------------------------------------------------------------- */
.qjsg-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 26px;
	border-radius: 999px;
	font-weight: 800;
	text-decoration: none;
	line-height: 1.2;
	box-sizing: border-box;
	border: 2px solid var(--qjsg-encre);
	transition: transform .15s ease, background-color .15s ease;
}
.qjsg-btn--ink { background: var(--qjsg-encre); color: var(--qjsg-blanc); }
.qjsg-btn--ink:hover, .qjsg-btn--ink:focus { background: var(--qjsg-brique); border-color: var(--qjsg-brique); color: var(--qjsg-blanc); }
.qjsg-btn--paper { background: var(--qjsg-blanc); color: var(--qjsg-encre); }
.qjsg-btn--paper:hover, .qjsg-btn--paper:focus { background: var(--qjsg-soleil-pale); color: var(--qjsg-encre); }
.qjsg-btn:hover { transform: translateY(-2px); }

/* ==========================================================================
   Header and logo
   ========================================================================== */
.qjsg-header {
	background: var(--qjsg-papier);
	border-bottom: 3px dashed var(--qjsg-pointille);
}
.qjsg-header__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 32px;
	padding-block: 16px;
}
.qjsg-logo {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: var(--qjsg-encre);
	min-height: 44px;
}
.qjsg-logo:hover, .qjsg-logo:focus { color: var(--qjsg-encre); }
.qjsg-logo__icon { width: 48px; height: 48px; flex: none; }
.qjsg-logo__text { display: flex; flex-direction: column; line-height: 1; }
.qjsg-logo__small {
	font-family: var(--qjsg-font-hand);
	font-size: 14px;
	color: var(--qjsg-brique);
}
.qjsg-logo__big {
	font-family: var(--qjsg-font-title);
	font-weight: 700;
	font-size: 32px;
	display: flex;
	align-items: flex-end;
	height: 40px;
}
.qjsg-logo__big > span {
	display: inline-block;
	transform: translateY(var(--rise, 0));
	animation: qjsg-grow .9s cubic-bezier(.34, 1.56, .64, 1) both;
	animation-delay: var(--delay, 0s);
}
.qjsg-logo__big > span:nth-child(2) { --rise: -3px; --delay: .08s; }
.qjsg-logo__big > span:nth-child(3) { --rise: -6px; --delay: .16s; }
.qjsg-logo__big > span:nth-child(4) { --rise: -9px; --delay: .24s; }
.qjsg-logo__big > span:nth-child(5) { --rise: -12px; --delay: .32s; }
.qjsg-logo:hover .qjsg-logo__big > span { animation: qjsg-hop .5s ease both; animation-delay: var(--delay, 0s); }
.qjsg-logo__star { transform-origin: 48px 11px; animation: qjsg-twinkle 1.2s ease .5s both; }
@keyframes qjsg-grow { from { transform: translateY(0); } }
@keyframes qjsg-hop { 50% { transform: translateY(calc(var(--rise, 0px) - 4px)); } }
@keyframes qjsg-twinkle { 0% { transform: scale(0) rotate(-40deg); } 70% { transform: scale(1.25); } 100% { transform: none; } }

@media (min-width: 768px) {
	.qjsg-logo__icon { width: 54px; height: 54px; }
	.qjsg-logo__small { font-size: 15px; }
	.qjsg-logo__big { font-size: 36px; height: 44px; }
}

/* Menu pills */
.qjsg-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 10px;
}
.qjsg-nav li { margin: 0; }
.qjsg-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	box-sizing: border-box;
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--pill, var(--qjsg-soleil-pale));
	color: var(--qjsg-encre);
	font-weight: 800;
	font-size: 15px;
	text-decoration: none;
	transition: transform .15s ease;
}
.qjsg-nav a:hover, .qjsg-nav a:focus { color: var(--qjsg-encre); transform: rotate(-2deg); }
.qjsg-c-soleil { --pill: var(--qjsg-soleil-pale); --dot: var(--qjsg-soleil); --num: var(--qjsg-soleil-texte); --tape: var(--qjsg-tape-soleil); }
.qjsg-c-ciel { --pill: var(--qjsg-ciel-pale); --dot: var(--qjsg-ciel); --num: var(--qjsg-ciel-texte); --tape: var(--qjsg-tape-ciel); }
.qjsg-c-fraise { --pill: var(--qjsg-fraise-pale); --dot: var(--qjsg-fraise); --num: var(--qjsg-fraise-texte); --tape: var(--qjsg-tape-fraise); }
.qjsg-c-menthe { --pill: var(--qjsg-menthe-pale); --dot: var(--qjsg-menthe); --num: var(--qjsg-menthe-texte); --tape: var(--qjsg-tape-menthe); }
.qjsg-c-lilas { --pill: var(--qjsg-lilas-pale); --dot: var(--qjsg-lilas); --num: var(--qjsg-lilas-texte); --tape: rgba(201, 166, 224, 0.7); }
.qjsg-nav .current-menu-item > a,
.qjsg-nav .current-menu-ancestor > a,
.qjsg-nav .current-menu-parent > a,
.qjsg-nav .current-post-ancestor > a,
.qjsg-nav .current-category-ancestor > a {
	background: var(--qjsg-encre);
	color: var(--qjsg-blanc);
}

/* ==========================================================================
   Shared section heading
   ========================================================================== */
.qjsg-section { padding-block: 56px; }
.qjsg-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 18px;
	margin-bottom: 28px;
}
.qjsg-section__title {
	margin: 0;
	font-size: clamp(32px, 5vw, 44px);
	font-weight: 600;
}
.qjsg-section__head .qjsg-hand { font-size: 18px; }
.qjsg-section__intro { margin: -14px 0 34px; max-width: 640px; }
.qjsg-section.qjsg-section--flush { padding-top: 0; }
@media (min-width: 900px) { .qjsg-section { padding-block: 72px; } }

/* ==========================================================================
   Hero (front page)
   ========================================================================== */
.qjsg-hero { border-bottom: 3px dashed var(--qjsg-pointille); }
.qjsg-hero__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 40px 56px;
	padding-top: clamp(32px, 4.5vw, 64px);
	padding-bottom: clamp(40px, 5vw, 76px);
	padding-left: clamp(36px, 9vw, 130px);
}
.qjsg-hero__text {
	flex: 1.5 1 520px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}
.qjsg-hero__kicker { font-size: 18px; align-self: flex-start; --tilt: -3deg; }
.qjsg-hero__title {
	margin: 0;
	font-weight: 600;
	font-size: clamp(34px, 4.4vw, 62px);
	line-height: 1.04;
}
.qjsg-hero__lead { margin: 0; font-size: 19px; max-width: 560px; }
.qjsg-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 4px; }
@media (min-width: 768px) {
	.qjsg-hero__kicker { font-size: 20px; }
	.qjsg-hero__lead { font-size: 20px; }
}

/* Collage */
.qjsg-collage {
	flex: 1 1 360px;
	min-width: 0;
	max-width: 480px;
	position: relative;
	aspect-ratio: 480 / 440;
	margin-inline: auto;
}
.qjsg-collage__photo {
	position: absolute;
	display: block;
	background: var(--qjsg-blanc);
	padding: 3% 3% 10%;
	box-shadow: var(--qjsg-shadow-photo);
	text-decoration: none;
	color: var(--qjsg-encre);
	box-sizing: border-box;
	transition: transform .2s ease;
}
.qjsg-collage__photo--a { left: 4%; top: 6%; width: 56%; --tilt: -6deg; }
.qjsg-collage__photo--b { right: 2%; top: 30%; width: 50%; --tilt: 5deg; }
.qjsg-collage__img {
	display: block;
	aspect-ratio: 1 / 1;
	width: 100%;
	object-fit: cover;
	background: var(--qjsg-ciel-pale);
}
.qjsg-collage__photo--b .qjsg-collage__img { background: var(--qjsg-fraise-pale); }
.qjsg-collage__cap {
	position: absolute;
	left: 6px; right: 6px; bottom: 2.5%;
	text-align: center;
	font-family: var(--qjsg-font-hand);
	font-size: clamp(11px, 2.6vw, 15px);
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--qjsg-encre);
}
a.qjsg-collage__photo:hover, a.qjsg-collage__photo:focus { color: var(--qjsg-encre); transform: rotate(0deg) scale(1.02); z-index: 3; }
.qjsg-collage__tape--a { left: 40%; top: -2%; width: 26%; --tape: var(--qjsg-tape-soleil); --tape-tilt: 8deg; }
.qjsg-collage__tape--b { right: 18%; top: 26%; width: 22%; --tape: var(--qjsg-tape-ciel); --tape-tilt: -10deg; }
.qjsg-collage__dot { position: absolute; border-radius: 50%; }
.qjsg-collage__dot--1 { left: 6%; bottom: 4%; width: 10%; aspect-ratio: 1; background: var(--qjsg-fraise); }
.qjsg-collage__dot--2 { left: 20%; bottom: 0; width: 6.25%; aspect-ratio: 1; background: var(--qjsg-ciel); }
.qjsg-collage__dot--3 { right: 4%; top: 2%; width: 7.5%; aspect-ratio: 1; background: var(--qjsg-menthe); }
.qjsg-collage__star { position: absolute; left: 0; top: 64%; width: 12.5%; height: auto; }
/* Placeholder shapes when no featured post has an image */
.qjsg-shape {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	width: 100%;
	background: var(--qjsg-ciel-pale);
}
.qjsg-shape svg { width: 46%; height: auto; }
.qjsg-collage__photo--b .qjsg-shape { background: var(--qjsg-fraise-pale); }

/* ==========================================================================
   La toise
   ========================================================================== */
.qjsg-toise .qjsg-ruler { margin-bottom: 26px; }
.qjsg-ages {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	align-items: end;
}
.qjsg-age {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 22px;
	border-radius: 26px 26px 26px 6px;
	background: var(--pill);
	color: var(--qjsg-encre);
	text-decoration: none;
	min-height: var(--h-sm, 140px);
	box-sizing: border-box;
	transition: transform .15s ease;
}
.qjsg-age:hover, .qjsg-age:focus { color: var(--qjsg-encre); transform: translateY(-4px); }
.qjsg-age .qjsg-dot { width: 40px; height: 40px; }
.qjsg-age--2 .qjsg-dot { border: 3px solid var(--qjsg-encre); box-sizing: border-box; }
.qjsg-age__name { font-family: var(--qjsg-font-title); font-weight: 700; font-size: 30px; line-height: 1.1; }
.qjsg-age__range { font-weight: 800; }
.qjsg-age__text { font-size: 15px; }
.qjsg-age--1 { --h-sm: 150px; --h: 180px; }
.qjsg-age--2 { --h-sm: 165px; --h: 220px; }
.qjsg-age--3 { --h-sm: 180px; --h: 260px; }
.qjsg-age--4 { --h-sm: 195px; --h: 300px; }
@media (min-width: 600px) { .qjsg-ages { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } }
@media (min-width: 1000px) {
	.qjsg-ages { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.qjsg-age { min-height: var(--h, 180px); padding: 24px; }
}

/* ==========================================================================
   Jouer
   ========================================================================== */
.qjsg-play {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
}
@media (min-width: 640px) {
	.qjsg-play { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.qjsg-feature { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
	.qjsg-play { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.qjsg-feature { grid-column: span 2; }
}
.qjsg-feature {
	position: relative;
	min-width: 0;
	background: var(--qjsg-encre);
	color: var(--qjsg-blanc);
	border-radius: 30px;
	padding: clamp(20px, 3vw, 30px);
	display: flex;
	flex-wrap: wrap;
	gap: 22px 26px;
	align-items: center;
}
.qjsg-feature__media {
	flex: 1 1 240px;
	min-width: 0;
	aspect-ratio: 4 / 3;
	border-radius: 20px;
	overflow: hidden;
	background: var(--qjsg-soleil);
}
.qjsg-feature__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qjsg-feature__body { flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.qjsg-feature__label {
	font-weight: 800;
	font-size: 14px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--qjsg-soleil);
}
.qjsg-feature__title { margin: 0; font-size: clamp(26px, 3vw, 32px); line-height: 1.12; font-weight: 600; }
.qjsg-feature__title a { color: var(--qjsg-blanc); text-decoration: none; }
.qjsg-feature__title a:hover, .qjsg-feature__title a:focus { color: var(--qjsg-soleil); }
.qjsg-feature__excerpt { margin: 0; color: var(--qjsg-blanc); }

/* Generic card (Jouer) */
.qjsg-card {
	position: relative;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: var(--qjsg-blanc);
	border-radius: 24px;
	padding: 18px;
	box-shadow: var(--qjsg-shadow-card);
	transition: transform .2s ease;
}
.qjsg-card:nth-child(3n+2) { --tilt: 1.2deg; }
.qjsg-card:nth-child(3n) { --tilt: -1deg; }
.qjsg-card:nth-child(3n+1) { --tilt: .8deg; }
.qjsg-card:hover { transform: rotate(0deg) translateY(-4px); }
.qjsg-card__media {
	aspect-ratio: 4 / 3;
	border-radius: 16px;
	overflow: hidden;
	background: var(--qjsg-menthe-pale);
}
.qjsg-card:nth-child(3n) .qjsg-card__media { background: var(--qjsg-lilas-pale); }
.qjsg-card:nth-child(3n+1) .qjsg-card__media { background: var(--qjsg-soleil-pale); }
.qjsg-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qjsg-card__title { margin: 0; font-size: 23px; line-height: 1.2; font-weight: 600; }
.qjsg-card__title a { text-decoration: none; }
/* Stretched link: the whole card is the target. */
.qjsg-stretch::after { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: 2; }
.qjsg-card, .qjsg-feature, .qjsg-photo { isolation: isolate; }

/* ==========================================================================
   Photo cards (Jolies trouvailles, archives, related)
   ========================================================================== */
.qjsg-band-creme {
	background: var(--qjsg-creme);
	border-top: 3px dashed var(--qjsg-pointille-fonce);
	border-bottom: 3px dashed var(--qjsg-pointille-fonce);
}
.qjsg-photos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
	gap: 34px 30px;
	padding-top: 12px;
}
.qjsg-photo {
	position: relative;
	min-width: 0;
	background: var(--qjsg-blanc);
	border-radius: 6px;
	padding: 16px 16px 22px;
	box-shadow: 0 10px 26px rgba(31, 42, 90, 0.14);
	display: flex;
	flex-direction: column;
	gap: 10px;
	transition: transform .2s ease;
}
.qjsg-photo:nth-child(4n+1) { --tilt: -2deg; --tape: var(--qjsg-tape-fraise); --tape-tilt: -4deg; --tape-left: 38%; }
.qjsg-photo:nth-child(4n+2) { --tilt: 1.5deg; --tape: var(--qjsg-tape-ciel); --tape-tilt: 5deg; --tape-left: 30%; }
.qjsg-photo:nth-child(4n+3) { --tilt: -1deg; --tape: var(--qjsg-tape-menthe); --tape-tilt: -6deg; --tape-left: 42%; }
.qjsg-photo:nth-child(4n) { --tilt: 2deg; --tape: var(--qjsg-tape-soleil); --tape-tilt: 3deg; --tape-left: 34%; }
.qjsg-photo:hover { transform: rotate(0deg) translateY(-4px); }
.qjsg-photo > .qjsg-tape { top: -12px; left: var(--tape-left, 38%); }
.qjsg-photo__media { aspect-ratio: 1 / 1; overflow: hidden; background: var(--qjsg-fraise-pale); }
.qjsg-photo:nth-child(4n+2) .qjsg-photo__media { background: var(--qjsg-ciel-pale); }
.qjsg-photo:nth-child(4n+3) .qjsg-photo__media { background: var(--qjsg-menthe-pale); }
.qjsg-photo:nth-child(4n) .qjsg-photo__media { background: var(--qjsg-lilas-pale); }
.qjsg-photo__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qjsg-photo__title { margin: 0; font-size: 22px; line-height: 1.2; font-weight: 600; }
.qjsg-photo__title a { text-decoration: none; }
.qjsg-photo__excerpt { margin: 0; font-size: 15px; }
.qjsg-photo__more { align-self: flex-start; font-weight: 800; font-size: 15px; }
.qjsg-photos--small .qjsg-photo { padding: 12px 12px 18px; }
.qjsg-photos--small .qjsg-photo__media { aspect-ratio: 4 / 3; }
.qjsg-photos--small .qjsg-photo__title { font-size: 19px; }

/* Media placeholder (no featured image) */
.qjsg-ph {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.qjsg-ph svg { width: 34%; height: auto; opacity: .9; }

/* Chips (sub-categories) */
.qjsg-chips {
	list-style: none;
	margin: 36px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.qjsg-chips li { margin: 0; }
.qjsg-chips a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	box-sizing: border-box;
	padding: 8px 18px;
	background: var(--qjsg-blanc);
	border: 2px solid var(--qjsg-encre);
	border-radius: 999px;
	font-weight: 800;
	text-decoration: none;
}
.qjsg-chips a:hover, .qjsg-chips a:focus { background: var(--qjsg-soleil-pale); color: var(--qjsg-encre); }

/* ==========================================================================
   Être parent
   ========================================================================== */
.qjsg-parent { display: flex; flex-wrap: wrap; gap: 28px; }
.qjsg-numlist {
	flex: 1 1 420px;
	min-width: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}
.qjsg-numlist li { margin: 0; border-bottom: 2px dashed var(--qjsg-pointille); }
.qjsg-numlist li:last-child { border-bottom: 0; }
.qjsg-numlist a {
	display: flex;
	gap: 18px;
	align-items: baseline;
	padding: 18px 0;
	text-decoration: none;
	min-height: 44px;
}
.qjsg-numlist__n {
	font-family: var(--qjsg-font-title);
	font-weight: 700;
	font-size: 34px;
	line-height: 1;
	color: var(--num, var(--qjsg-fraise-texte));
	min-width: 1.1em;
}
.qjsg-numlist li:nth-child(4n+1) { --num: var(--qjsg-fraise-texte); }
.qjsg-numlist li:nth-child(4n+2) { --num: var(--qjsg-ciel-texte); }
.qjsg-numlist li:nth-child(4n+3) { --num: var(--qjsg-soleil-texte); }
.qjsg-numlist li:nth-child(4n) { --num: var(--qjsg-menthe-texte); }
.qjsg-numlist__t { font-family: var(--qjsg-font-title); font-weight: 600; font-size: clamp(20px, 2.4vw, 24px); line-height: 1.25; }
.qjsg-dream {
	flex: 1 1 320px;
	min-width: 0;
	background: var(--qjsg-lilas-pale);
	border-radius: 30px;
	padding: clamp(24px, 3vw, 32px);
	display: flex;
	flex-direction: column;
	gap: 14px;
	justify-content: center;
	box-sizing: border-box;
}
.qjsg-dream__quote { font-family: var(--qjsg-font-hand); font-size: 21px; line-height: 1.5; color: var(--qjsg-encre); }
.qjsg-dream p { margin: 0; }
.qjsg-dream .qjsg-btn { align-self: flex-start; }

/* ==========================================================================
   La lettre du mercredi
   ========================================================================== */
.qjsg-letter {
	border: 3px solid var(--qjsg-encre);
	border-radius: 30px;
	padding: 36px clamp(20px, 4vw, 56px);
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: center;
	justify-content: space-between;
}
.qjsg-letter__text { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.qjsg-letter__title { margin: 0; font-size: clamp(28px, 4vw, 36px); font-weight: 600; }
.qjsg-letter__text p { margin: 0; }
.qjsg-letter__form { flex: 1 1 340px; min-width: 0; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.qjsg-letter__form input[type="email"] {
	flex: 1 1 200px;
	min-width: 0;
	min-height: 50px;
	border-radius: 999px;
	border: 2px solid var(--qjsg-encre);
	padding: 0 20px;
	font: inherit;
	color: var(--qjsg-encre);
	background: var(--qjsg-blanc);
}
.qjsg-letter__form input::placeholder { color: #5B6386; opacity: 1; }
.qjsg-letter__form button {
	min-height: 50px;
	border-radius: 999px;
	border: 0;
	background: var(--qjsg-soleil);
	color: var(--qjsg-encre);
	font: inherit;
	font-weight: 800;
	padding: 0 24px;
	cursor: pointer;
}
.qjsg-letter__form button:hover, .qjsg-letter__form button:focus { background: var(--qjsg-encre); color: var(--qjsg-blanc); }

/* ==========================================================================
   Footer
   ========================================================================== */
.qjsg-footer { background: var(--qjsg-encre); color: var(--qjsg-blanc); }
.qjsg-footer__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 28px 64px;
	justify-content: space-between;
	padding-top: 48px;
	padding-bottom: 36px;
}
.qjsg-footer__brand { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.qjsg-footer .qjsg-logo, .qjsg-footer .qjsg-logo:hover { color: var(--qjsg-blanc); }
.qjsg-footer .qjsg-logo__small { color: var(--qjsg-soleil); }
.qjsg-footer__text { margin: 0; font-size: 15px; color: var(--qjsg-blanc); }
.qjsg-footer__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 28px; }
.qjsg-footer__nav li { margin: 0; }
.qjsg-footer__nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--qjsg-blanc);
	font-weight: 700;
	font-size: 15px;
}
.qjsg-footer__nav a:hover, .qjsg-footer__nav a:focus { color: var(--qjsg-soleil); }

/* ==========================================================================
   Page header band (single, page, archive)
   ========================================================================== */
.qjsg-pagehead { border-bottom: 3px dashed var(--qjsg-pointille); }
.qjsg-pagehead__inner {
	/* Same text column as the article body, plus the margin line on the left. */
	max-width: calc(var(--qjsg-prose) + 2 * var(--qjsg-margin-line));
	margin-inline: auto;
	box-sizing: border-box;
	padding: 16px var(--qjsg-margin-line) 36px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 32px 48px;
}
.qjsg-pagehead__text { flex: 1 1 460px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.qjsg-pagehead__kicker { font-size: 18px; align-self: flex-start; --tilt: -2deg; }
.qjsg-pagehead__title { margin: 0; font-size: clamp(34px, 5vw, 60px); line-height: 1.06; font-weight: 600; }
.qjsg-pagehead__lead { margin: 0; font-size: 19px; }
.qjsg-pagehead__lead p { margin: 0 0 .5em; }
.qjsg-pagehead__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; font-weight: 700; }
.qjsg-pagehead__photo { flex: 0 1 260px; min-width: 200px; margin-inline: auto; position: relative; padding-top: 12px; }
.qjsg-pagehead__photo .qjsg-tape { top: 0; left: 36%; width: 90px; height: 24px; --tape: var(--qjsg-tape-fraise); --tape-tilt: -5deg; }
.qjsg-pagehead__photo figure { margin: 0; background: var(--qjsg-blanc); padding: 12px 12px 36px; box-shadow: var(--qjsg-shadow-photo); --tilt: 3deg; }
.qjsg-pagehead__photo img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
@media (min-width: 900px) { .qjsg-pagehead__inner { padding-top: 24px; padding-bottom: 40px; } }

.qjsg-crumbs { font-size: 14px; font-weight: 700; }
.qjsg-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; }
.qjsg-crumbs li { margin: 0; display: inline-flex; align-items: center; }
.qjsg-crumbs li + li::before { content: "›"; padding: 0 8px; }
.qjsg-crumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.qjsg-crumbs [aria-current] { padding-block: 12px; }

/* ==========================================================================
   Article body
   ========================================================================== */
.qjsg-article { padding: 48px var(--qjsg-gutter) 64px; }
.qjsg-prose {
	max-width: var(--qjsg-prose);
	margin-inline: auto;
	line-height: 1.7;
}
@media (min-width: 1200px) { .qjsg-prose { font-size: 18px; } }
.qjsg-prose > * { margin-top: 0; margin-bottom: 1.25em; }
.qjsg-prose h2 { font-size: clamp(26px, 3.4vw, 34px); margin-top: 1.6em; margin-bottom: .6em; line-height: 1.12; }
.qjsg-prose h3 { font-size: clamp(21px, 2.6vw, 26px); margin-top: 1.4em; margin-bottom: .5em; }
.qjsg-prose h4 { font-size: 20px; margin-top: 1.2em; margin-bottom: .4em; }
.qjsg-prose a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: var(--qjsg-soleil); }
.qjsg-prose a:hover, .qjsg-prose a:focus { text-decoration-color: var(--qjsg-brique); }
.qjsg-prose .wp-element-button, .qjsg-prose .wp-block-button__link { text-decoration: none; }
.qjsg-prose blockquote, .qjsg-prose .wp-block-quote {
	border-left: 6px solid var(--qjsg-soleil);
	background: var(--qjsg-creme);
	border-radius: 0 18px 18px 0;
	padding: 16px 22px;
	margin-inline: 0;
	font-style: normal;
}
.qjsg-prose figure { margin-inline: 0; }
.qjsg-prose img { border-radius: 14px; }
.qjsg-prose figcaption, .qjsg-prose .wp-element-caption { font-size: 14px; text-align: center; }
.qjsg-prose table { border-collapse: collapse; width: 100%; }
.qjsg-prose th, .qjsg-prose td { border: 1px solid var(--qjsg-pointille); padding: 8px 10px; }
.qjsg-prose > .alignwide {
	max-width: none;
	margin-left: calc(50% - min(560px, 50vw - 16px));
	margin-right: calc(50% - min(560px, 50vw - 16px));
}
.qjsg-prose > .alignfull { max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.qjsg-prose .alignleft { float: left; margin: .3em 1.5em 1em 0; max-width: 50%; }
.qjsg-prose .alignright { float: right; margin: .3em 0 1em 1.5em; max-width: 50%; }
.qjsg-prose::after { content: ""; display: table; clear: both; }

/* Fox Blocks headings keep their own scale: the prose h2/h3 rules above would
   otherwise add a large top margin and size inside the blocks. */
.qjsg-prose :is(h2, h3, h4)[class*="fxb-"] { margin-top: 0; line-height: 1.25; }
.qjsg-prose h3.fxb-key-points__title { font-size: 19px; margin-bottom: 4px; }
.qjsg-prose h2.fxb-steps__heading { font-size: clamp(22px, 2.6vw, 26px); }
/* Key points without number or icon: title above its text, not side by side. */
.qjsg-prose .fxb-key-points:not(.fxb-key-points--cards) .fxb-key-points__item:not(:has(.fxb-key-points__number, .fxb-key-points__icon)) {
	flex-direction: column;
	gap: 0;
}
.qjsg-prose .fxb-key-points:not(.fxb-key-points--cards) .fxb-key-points__item {
	padding-left: 16px;
	border-left: 4px solid var(--qjsg-soleil);
}
.qjsg-prose .fxb-key-points__content { font-size: 16px; }
/* Link cards without an image: no empty media box. */
.qjsg-prose .fxb-lcard__media:empty { display: none; }
/* Expert tip: theme cream instead of the plugin green, readable text. */
.qjsg-prose .fxb-expert-tip { background: var(--qjsg-creme); border-radius: 18px; }
.qjsg-prose .fxb-expert-tip::before { background: var(--qjsg-soleil); width: 6px; }
.qjsg-prose .fxb-expert-tip__icon { color: var(--qjsg-soleil-texte); }
.qjsg-prose .fxb-expert-tip__content { font-size: 16px; line-height: 1.6; }

/* Small screens: lighter breadcrumb, list indent, narrow tables. */
@media (max-width: 640px) {
	/* The last crumb repeats the H1 just below. */
	.qjsg-crumbs li:last-child { display: none; }
	.qjsg-prose > :is(ul, ol).wp-block-list:not(.is-style-qjsg-gommettes),
	.qjsg-prose li > :is(ul, ol) { padding-left: 1.3em; }
	.qjsg-prose .wp-block-table :is(th, td):first-child,
	.qjsg-prose .fxb-ctable__table tr > :first-child {
		width: 6.5em;
		min-width: 6.5em;
		max-width: 6.5em;
		padding-inline: 6px;
		font-size: 13px;
		white-space: normal;
		overflow-wrap: break-word;
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	/* Horizontal scroll hint: a soft shade on the right while more columns
	   remain; the "local" cover hides it once scrolled to the end. */
	.qjsg-prose .wp-block-table,
	.qjsg-prose .fxb-ctable__scroll {
		overflow-x: auto;
		background:
			linear-gradient(to left, var(--qjsg-papier) 40%, rgba(255, 253, 247, 0)) right center / 36px 100% no-repeat local,
			linear-gradient(to left, rgba(31, 42, 90, 0.16), rgba(31, 42, 90, 0)) right center / 26px 100% no-repeat scroll;
	}
}

/* ==========================================================================
   Fox Affiliate highlight (fox-affiliate/highlight, .fox-hl) in articles
   Restyle only: same markup, same links and tracking. The plugin list of rows
   becomes a grid of white notebook cards (tape, sticker badge, ink pill).
   ========================================================================== */
.qjsg-prose .fox-hl {
	--fox-btn-text: #FFFFFF;
	font-family: var(--qjsg-font-text);
	color: var(--qjsg-encre);
	margin-top: 8px;
	margin-bottom: 2em;
}
.qjsg-prose .fox-hl__title {
	margin: 0 0 26px;
	font-family: var(--qjsg-font-title);
	font-weight: 600;
	font-size: clamp(24px, 3vw, 30px);
	line-height: 1.2;
	color: var(--qjsg-encre);
}
.qjsg-prose .fox-hl__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px 26px;
	padding-top: 12px;
}
@media (min-width: 640px) { .qjsg-prose .fox-hl__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .qjsg-prose .fox-hl__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Card */
.qjsg-prose .fox-hl__item {
	position: relative;
	min-width: 0;
	display: flex;
	flex-direction: column;
	background: var(--qjsg-blanc);
	border: 0;
	border-radius: 22px;
	padding: 0;
	box-shadow: var(--qjsg-shadow-card);
	overflow: visible;
	transform: rotate(var(--tilt, 0deg));
	transition: transform .2s ease, box-shadow .2s ease;
}
.qjsg-prose .fox-hl__item:nth-child(3n+1) { --tilt: -.6deg; --tape: var(--qjsg-tape-soleil); --tape-tilt: -4deg; --tape-left: 42%; --media: var(--qjsg-soleil-pale); }
.qjsg-prose .fox-hl__item:nth-child(3n+2) { --tilt: .5deg; --tape: var(--qjsg-tape-ciel); --tape-tilt: 5deg; --tape-left: 34%; --media: var(--qjsg-ciel-pale); }
.qjsg-prose .fox-hl__item:nth-child(3n) { --tilt: -.3deg; --tape: var(--qjsg-tape-menthe); --tape-tilt: -6deg; --tape-left: 46%; --media: var(--qjsg-menthe-pale); }
.qjsg-prose .fox-hl__item:hover {
	transform: rotate(0deg) translateY(-4px);
	box-shadow: 0 12px 28px rgba(31, 42, 90, 0.13);
}
/* Washi tape across the top edge */
.qjsg-prose .fox-hl__item::before {
	content: "";
	position: absolute;
	top: -11px;
	left: var(--tape-left, 40%);
	width: 74px;
	height: 22px;
	background: var(--tape, var(--qjsg-tape-soleil));
	transform: rotate(var(--tape-tilt, -4deg));
	z-index: 1;
	pointer-events: none;
}
.qjsg-prose .fox-hl__item--stripe { border-left: 0; padding-left: 0; }

/* Inside: image on top, text, then the button at the bottom */
.qjsg-prose .fox-hl__row {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 16px 18px 20px;
	align-items: stretch;
}
.qjsg-prose .fox-hl__item--banner.fox-hl__item--has-badge .fox-hl__row { padding-top: 12px; }
.qjsg-prose .fox-hl__image-cell {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	box-sizing: border-box;
	padding: 18px;
	border-radius: 16px;
	background: var(--media, var(--qjsg-creme));
	isolation: isolate;
}
@media (max-width: 639px) { .qjsg-prose .fox-hl__image-cell { aspect-ratio: 16 / 10; } }
.qjsg-prose .fox-hl__image-link { width: 100%; height: 100%; }
.qjsg-prose .fox-hl__image {
	width: 100%;
	height: 100%;
	max-width: 220px;
	object-fit: contain;
	border-radius: 0;
	/* Amazon packshots have a white background: let it take the pastel. */
	mix-blend-mode: multiply;
}
.qjsg-prose .fox-hl__main { gap: 8px; }
.qjsg-prose h3.fox-hl__product-title {
	margin: 0;
	font-family: var(--qjsg-font-title);
	font-weight: 600;
	font-size: 21px;
	line-height: 1.22;
	color: var(--qjsg-encre);
}
.qjsg-prose .fox-hl__product-title .fox-product-link { cursor: pointer; }
.qjsg-prose .fox-hl__product-title .fox-product-link:hover { color: var(--qjsg-brique); }
.qjsg-prose .fox-hl__desc,
.qjsg-prose .fox-hl .fox-desc__text,
.qjsg-prose .fox-hl .fox-desc__list {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--qjsg-encre-douce);
}
.qjsg-prose .fox-hl .fox-desc__list { padding-left: 1.1em; }
.qjsg-prose .fox-hl__stars-row { line-height: 1; }
.qjsg-prose .fox-hl .fox-stars__fill { color: #E9A800; }
.qjsg-prose .fox-hl .fox-stars__count { color: var(--qjsg-encre-douce); }

/* Button area: price stays plain text, never bigger than the body text. */
.qjsg-prose .fox-hl__cta {
	margin-top: auto;
	min-width: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 14px;
	padding-top: 4px;
}
.qjsg-prose .fox-hl__price-block { flex-direction: row; align-items: baseline; gap: 8px; }
.qjsg-prose .fox-hl__price {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	color: var(--qjsg-encre-douce);
}
.qjsg-prose .fox-hl__price-before,
.qjsg-prose .fox-hl .fox-promo-badge { display: none; }
.qjsg-prose .fox-hl__unavailable { font-size: 14px; color: var(--qjsg-encre-douce); }
.qjsg-prose .fox-hl .fox-hl__btn {
	flex: 1 1 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	box-sizing: border-box;
	padding: 12px 22px;
	border: 2px solid var(--qjsg-encre);
	border-radius: 999px;
	background: var(--qjsg-encre);
	color: var(--qjsg-blanc) !important;
	font-family: var(--qjsg-font-text);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	text-decoration: none;
	white-space: normal;
	cursor: pointer;
	transition: transform .15s ease, background-color .15s ease, border-color .15s ease;
}
.qjsg-prose .fox-hl .fox-hl__btn::after { content: "→"; font-weight: 800; }
.qjsg-prose .fox-hl .fox-hl__btn:hover,
.qjsg-prose .fox-hl .fox-hl__btn:focus {
	background: var(--qjsg-brique);
	border-color: var(--qjsg-brique);
	color: var(--qjsg-blanc) !important;
	box-shadow: none;
	transform: translateY(-2px);
}

/* Badge as a sticker (gommette): theme colours, never a "sale" red. */
.qjsg-prose .fox-hl-badge {
	--sticker: var(--qjsg-soleil);
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 6px;
	width: auto;
	margin: 0;
	padding: 6px 14px 6px 10px;
	border-radius: 999px;
	background: var(--sticker) !important;
	color: var(--qjsg-encre) !important;
	font-family: var(--qjsg-font-text);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.2;
	box-shadow: 0 2px 0 rgba(31, 42, 90, 0.12);
	transform: rotate(-2deg);
}
.qjsg-prose .fox-hl-badge__icon { font-size: 15px; }
.qjsg-prose .fox-hl-badge--layout-banner { margin: 20px 18px 0; }
.qjsg-prose .fox-hl-badge--top { --sticker: var(--qjsg-soleil); }
.qjsg-prose .fox-hl-badge--value { --sticker: var(--qjsg-menthe); }
.qjsg-prose .fox-hl-badge--easy { --sticker: var(--qjsg-ciel); }
.qjsg-prose .fox-hl-badge--pro { --sticker: var(--qjsg-fraise-pale); }
.qjsg-prose .fox-hl-badge--eco { --sticker: var(--qjsg-lilas); }
.qjsg-prose .fox-hl-badge--budget { --sticker: var(--qjsg-soleil-pale); }
.qjsg-prose .fox-hl-badge--niche { --sticker: var(--qjsg-menthe-pale); }
.qjsg-prose .fox-hl-badge--neutral { --sticker: var(--qjsg-creme); }
.qjsg-prose .fox-hl-badge--custom { --sticker: color-mix(in srgb, var(--fox-hl-c, #FFC93C) 35%, white); }

/* Core buttons and form buttons follow the ink pill. */
.wp-block-button .wp-block-button__link, .wp-element-button,
.comment-form [type="submit"], .search-form .search-submit, .wp-block-search__button {
	background: var(--qjsg-encre);
	color: var(--qjsg-blanc);
	border-radius: 999px;
	font-weight: 800;
	padding: 14px 24px;
	min-height: 48px;
	box-sizing: border-box;
}
.wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:focus,
.comment-form [type="submit"]:hover, .comment-form [type="submit"]:focus, .search-form .search-submit:hover, .search-form .search-submit:focus { background: var(--qjsg-brique); color: var(--qjsg-blanc); }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea, .search-form .search-field {
	border: 2px solid var(--qjsg-encre);
	border-radius: 14px;
	background: var(--qjsg-blanc);
	color: var(--qjsg-encre);
	min-height: 44px;
}
.wp-block-button.is-style-outline > .wp-block-button__link { background: var(--qjsg-blanc); color: var(--qjsg-encre); border: 2px solid var(--qjsg-encre); }

.qjsg-label { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 14px; }
.qjsg-label::before { content: ""; width: 18px; height: 18px; border-radius: 50%; background: var(--qjsg-fraise); flex: none; }

/* Same column as the article body (.qjsg-article gutter + .qjsg-prose width). */
.qjsg-related { max-width: calc(var(--qjsg-prose) + 2 * var(--qjsg-gutter)); box-sizing: border-box; margin: 0 auto; padding: 0 var(--qjsg-gutter) 72px; }
.qjsg-related__title { margin: 0 0 16px; font-size: 28px; font-weight: 600; }
.qjsg-comments { max-width: calc(var(--qjsg-prose) + 2 * var(--qjsg-gutter)); box-sizing: border-box; margin: 0 auto; padding: 0 var(--qjsg-gutter) 64px; }

/* Archive */
.qjsg-listing { padding-block: 48px 72px; }
.qjsg-listing .qjsg-chips { margin: 0 0 40px; }
.qjsg-pagination { margin-top: 48px; }
.qjsg-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.qjsg-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 14px;
	box-sizing: border-box;
	border-radius: 999px;
	border: 2px solid var(--qjsg-encre);
	background: var(--qjsg-blanc);
	font-weight: 800;
	text-decoration: none;
}
.qjsg-pagination .page-numbers.current { background: var(--qjsg-encre); color: var(--qjsg-blanc); }
.qjsg-empty { max-width: 640px; }

/* ==========================================================================
   Block styles (register_block_style)
   ========================================================================== */
/* Image — « photo instantanée » */
.wp-block-image.is-style-qjsg-polaroid {
	position: relative;
	display: table;
	box-sizing: border-box;
	background: var(--qjsg-blanc);
	padding: 14px 14px 46px;
	box-shadow: 0 12px 30px rgba(31, 42, 90, 0.16);
	transform: rotate(var(--tilt, -3deg));
	margin-top: 24px;
	margin-bottom: 32px;
	max-width: 100%;
}
.wp-block-image.is-style-qjsg-polaroid:nth-of-type(even) { --tilt: 3deg; }
.wp-block-image.is-style-qjsg-polaroid::before {
	content: "";
	position: absolute;
	top: -12px;
	left: 36%;
	width: 90px;
	height: 24px;
	background: var(--qjsg-tape-fraise);
	transform: rotate(-5deg);
	z-index: 1;
}
.wp-block-image.is-style-qjsg-polaroid:nth-of-type(even)::before { background: var(--qjsg-tape-ciel); transform: rotate(6deg); left: 30%; }
.wp-block-image.is-style-qjsg-polaroid img { border-radius: 0; display: block; }
.wp-block-image.is-style-qjsg-polaroid figcaption,
.wp-block-image.is-style-qjsg-polaroid .wp-element-caption {
	position: absolute;
	left: 0; right: 0; bottom: 10px;
	margin: 0;
	padding: 0 10px;
	text-align: center;
	font-family: var(--qjsg-font-hand);
	font-size: 15px;
	color: var(--qjsg-encre);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wp-block-image.is-style-qjsg-polaroid.aligncenter { margin-left: auto; margin-right: auto; }

/* Group — « page de cahier » */
.wp-block-group.is-style-qjsg-cahier {
	background-color: var(--qjsg-blanc);
	background-image:
		linear-gradient(to right, transparent 0, transparent 30px, var(--qjsg-marge) 30px, var(--qjsg-marge) 32px, transparent 32px),
		repeating-linear-gradient(to bottom, transparent 0, transparent 31px, var(--qjsg-ligne) 31px, var(--qjsg-ligne) 32px);
	border: 2px solid var(--qjsg-pointille);
	border-radius: 22px;
	padding: 28px 22px 28px 52px;
	line-height: 32px;
}
.wp-block-group.is-style-qjsg-cahier > :last-child { margin-bottom: 0; }

/* Group — « le petit plus » */
.wp-block-group.is-style-qjsg-petit-plus {
	background: var(--qjsg-creme);
	border-radius: 18px;
	padding: 14px 18px;
	font-family: var(--qjsg-font-hand);
	font-size: 16px;
	line-height: 1.8;
	color: var(--qjsg-encre);
}
.wp-block-group.is-style-qjsg-petit-plus > * { margin-top: 0; margin-bottom: .4em; }
.wp-block-group.is-style-qjsg-petit-plus > :last-child { margin-bottom: 0; }

/* List — « gommettes » */
.is-style-qjsg-gommettes { list-style: none; padding-left: 0; }
.is-style-qjsg-gommettes > li { position: relative; padding-left: 34px; margin-bottom: .5em; }
.is-style-qjsg-gommettes > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .3em;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--qjsg-fraise);
}
.is-style-qjsg-gommettes > li:nth-child(5n+2)::before { background: var(--qjsg-soleil); }
.is-style-qjsg-gommettes > li:nth-child(5n+3)::before { background: var(--qjsg-ciel); }
.is-style-qjsg-gommettes > li:nth-child(5n+4)::before { background: var(--qjsg-menthe); }
.is-style-qjsg-gommettes > li:nth-child(5n)::before { background: var(--qjsg-lilas); }

/* Pattern — « Fiche trouvaille » */
.qjsg-fiche { margin-block: 48px; }
.qjsg-fiche .wp-block-columns { gap: 36px; align-items: flex-start; }
.qjsg-fiche h2, .qjsg-fiche h3 { margin-top: 0; }
.qjsg-fiche .wp-block-image.is-style-qjsg-polaroid { margin-top: 12px; }

/* ==========================================================================
   Motion and accessibility preferences
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	.qjsg-tilt,
	.qjsg-card, .qjsg-photo, .qjsg-collage__photo,
	.qjsg-card:hover, .qjsg-photo:hover, .qjsg-age:hover, .qjsg-btn:hover, .qjsg-nav a:hover,
	.wp-block-image.is-style-qjsg-polaroid,
	.qjsg-prose .fox-hl__item, .qjsg-prose .fox-hl__item:hover,
	.qjsg-prose .fox-hl .fox-hl__btn:hover { transform: none; }
	.qjsg-logo__big > span { animation: none !important; }
	.qjsg-logo__star { animation: none !important; }
}
@media (forced-colors: active) {
	.qjsg-hl { background: none; text-decoration: underline; }
	.qjsg-nav a, .qjsg-chips a, .qjsg-btn { border: 2px solid; }
}
@media print {
	.qjsg-header .qjsg-nav, .qjsg-letter, .qjsg-footer__nav { display: none; }
	.qjsg-seyes, .qjsg-lines { background: none; }
}