/* Style unifié (audit visuel du 2026-10-01, option 1 « une voix pour lire, une pour agir »).
   Chargée en dernier : elle complète style.css, style-custom.css, margin.css, fx.css et nav.css.
   Cinzel (--display) : logo et titres des livres seulement. Source Serif (--serif) : lecture et titres.
   Source Sans 3 (--sans) : boutons, champs, menus, mentions. Pas de petites capitales. Accent : ocre (--red). */

:root { --sans: "Source Sans 3", "Segoe UI", Arial, sans-serif; }

/* ---------- 1. Typographie ---------- */
/* Titres : Source Serif en minuscules, demi-gras (Cinzel retirée des titres courants). */
h1, h2, .chap-h, .gloss dt, .era strong, .season-list strong, .chars h4, .margin-notes dt, .f-done-h, .gate-n, .practical h3 {
	font-family: var(--serif); font-optical-sizing: auto; font-weight: 600; letter-spacing: -.005em; text-transform: none; font-variant: normal;
}
h1, h2 { text-wrap: balance; }
/* Ce qui vient des couvertures garde Cinzel : logo, titres des livres. */
.hdr .logo, .foot .site-title, #logo .site-title, .bk-hero h1, .tome h3, .drop b, .sheet-books b, .next-book strong, .subnav strong, .excerpt-book, .gg-name b, .gg-name i, .map .lake-name { font-family: var(--display); }

/* Interface (menus, boutons, mentions) : Source Sans, casse normale. */
.menu > li > a, .menu > li > button, .sheet li a, .subnav a, .lang a, .button, .kicker, .foot-h, .part-label, .tome .step, .cover-ghost span,
.facts-line dt, .practical .practical-h, .where-h, .era-l, .gate-l, .facts dt, .next-book em, .bk-hero-grid .kicker, .sheet-h, .gg-book span, .meta, .preview-note,
.f-row label, .f-status, .f-note, .consent, .consent .button {
	font-family: var(--sans); font-variant: normal; text-transform: none;
}
.menu > li > a, .menu > li > button { letter-spacing: .01em; font-size: 1rem; font-weight: 500; }
.sheet li a { font-size: 1.375rem; font-weight: 500; letter-spacing: 0; }
.subnav a { letter-spacing: .01em; font-size: .9375rem; }
.lang a { letter-spacing: .02em; font-weight: 600; }
/* Petites mentions (ex-petites capitales) : lisibles, sans majuscules espacées. */
.kicker, .bk-hero-grid .kicker, .tome .step, .cover-ghost span, .facts-line dt, .era-l, .gate-l, .facts dt, .next-book em, .sheet-h, .gg-book span, .where-h {
	letter-spacing: .02em; font-size: .9375rem; font-weight: 500;
}
.foot-h, .practical .practical-h { letter-spacing: .03em; font-size: .9375rem; font-weight: 600; }

/* Texte courant un peu plus grand (17 → 18 px). */
:root { --fs-3: 1.125rem; }

/* ---------- 2. Contrastes et lisibilité ---------- */
/* En-tête et barre du livre opaques au défilement : le texte de la page ne transparaît plus dessous. */
.hdr.solid, .subnav { background: var(--night-2); }
.subnav a { color: var(--snow); opacity: .78; }
.subnav a:hover, .subnav a.on { opacity: 1; }
/* Surtitres retirés : le chiffre romain dit déjà « partie I, II, III ». */
.part-label { display: none; }
/* Mentions de période (« Today », « Five centuries earlier ») : lisibles, plus en rouge. */
.era-l { color: var(--ice); }
/* Initiales décoratives B, C, R retirées : elles passaient sous le texte. */
.chars .initial { display: none; }
/* Plus aucune petite mention sous 4,5:1 : le gris des mentions est éclairci. */
.meta, .facts-line dt, .gate-l, .cover-ghost span, .f-note, .foot-bottom { color: var(--muted); }
.tome .step { color: var(--ice); }
.tome.first .step { color: #fff; background: var(--red); padding: 2px 10px; border-radius: 4px; }

/* ---------- 3. Boutons et liens : 2 boutons + 1 lien, partout ---------- */
.button, .actions .button, .tome .actions .button, .voice .button, .practical .news-form .button, .consent .button {
	display: inline-flex; align-items: center; justify-content: center; gap: .4em; min-height: 46px; padding: 0 22px;
	font-size: 1rem; font-weight: 600; letter-spacing: .01em; line-height: 1.2; border-radius: 6px;
	border: 1px solid rgba(158, 195, 214, .5); color: var(--snow); background: transparent; text-decoration: none;
}
.button:hover, .button:focus-visible { border-color: var(--ice); color: #fff; background: rgba(158, 195, 214, .08); }
.button.filled, .actions .button.filled, .tome .actions .button.filled, .voice .button.filled, .practical .news-form .button.filled { background: var(--red); border-color: var(--red); color: #fff; }
:is(.button.filled, .actions .button.filled, .tome .actions .button.filled, .practical .news-form .button.filled):is(:hover, :focus-visible) { background: var(--red-dark); border-color: var(--red-dark); color: #fff; }
/* Bouton « Acheter » de la barre du livre : même style, plus compact. */
.subnav .buy { font-family: var(--sans); font-weight: 600; font-size: .9375rem; letter-spacing: .01em; opacity: 1; border-radius: 6px; padding: 7px 16px; }
/* Un seul style de lien : bleu glacé, soulignement fin décalé. */
.link { color: var(--ice); border-bottom: 1px solid rgba(158, 195, 214, .45); padding-bottom: 2px; }
.link:hover, .link:focus-visible { color: #fff; border-bottom-color: #fff; }
main a:not(.button):not(.link):not(.post-item a):not(.next-book) { text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* ---------- 4. Formulaires ---------- */
.sx-form input, .sx-form select, .sx-form textarea, .news-form input[type=email] {
	min-height: 48px; padding: .65em .9em; font-family: var(--sans); font-size: 1.0625rem; color: #fff;
	background-color: #16243a; border: 1px solid #3a4d68; border-radius: 6px;
}
.sx-form textarea { min-height: 10rem; }
.sx-form input:focus, .sx-form select:focus, .sx-form textarea:focus, .news-form input[type=email]:focus {
	background-color: #16243a; border-color: var(--ice); box-shadow: 0 0 0 3px rgba(158, 195, 214, .25); outline: none;
}
.sx-form select { background-color: #16243a; }
.sx-form input::placeholder, .news-form input::placeholder { color: #8d9aab; }
.f-row { gap: .45em; margin-bottom: 1.25rem; }
.f-row label { font-size: .9375rem; font-weight: 500; color: var(--snow); }
.js-form.checked :invalid { border-color: #e08a6a; }
.f-status { font-family: var(--sans); font-size: .9375rem; }
.f-status.err { color: #f0a58c; }
.news-form { gap: 10px; }
/* Confirmation : même rayon que les champs, titre en Source Serif. */
.f-done { border-radius: 6px; border: 1px solid rgba(158, 195, 214, .5); border-left: 3px solid var(--ice); }
.f-done p:last-child { font-family: var(--sans); }
@media (max-width: 600px) { .sx-form .button, .news-form .button { width: 100%; } }

/* ---------- 5. Espacements : une échelle (sections 80 px ordinateur / 56 px téléphone) ---------- */
.part { padding: 80px 0 32px; }
.part-head { grid-template-columns: 5.5rem minmax(0, 1fr); gap: 0 var(--s3); margin-bottom: 48px; align-items: start; }
.part-num { font-size: 4.5rem; line-height: .9; padding-top: .1em; }
.part h2 { font-size: clamp(2rem, 3.6vw, 2.75rem); margin: 0 0 .4em; }
.part-promise { max-width: 38em; }
.chap { padding: 56px 0; }
.season-sec { margin-top: 64px; }
.practical { padding: 56px 0 64px; }
.practical p, .practical .buy { font-size: 1rem; line-height: 1.6; }
.practical h3 { font-size: 1.25rem; }
.foot li a, .foot p { font-size: 1rem; }
@media (max-width: 899px) {
	.part { padding: 56px 0 24px; }
	.part-head { grid-template-columns: 1fr; margin-bottom: 32px; }
	.part-num { font-size: 2.75rem; text-align: left; margin-bottom: 8px; }
	.chap { padding: 40px 0; }
	.season-sec { margin-top: 40px; }
	.practical { padding: 40px 0 48px; }
}

/* ---------- 6. Téléphone : accueil plus compact ---------- */
@media (max-width: 600px) {
	/* Livres : la couverture à côté du texte, plus au-dessus. */
	.path { gap: 40px; }
	.path-line { display: none; }
	.tome { display: grid; grid-template-columns: 104px minmax(0, 1fr); column-gap: 18px; align-items: start; }
	.tome > * { grid-column: 2; }
	.tome .cover, .tome.first .cover, .tome .cover-ghost { grid-column: 1; grid-row: 1 / span 3; width: 104px; margin-bottom: 14px; }
	.tome .cover-ghost { height: 156px; }
	.tome .cover-ghost b { font-size: 2.5rem; }
	.tome .step { margin-top: 0; justify-self: start; }
	.tome.first h3, .tome h3 { font-size: 1.375rem; }
	.tome blockquote, .tome > p:not(.step, .meta) { grid-column: 1 / -1; }
	/* L'auteur : photo plus petite. */
	.author-photo { max-width: 220px; }
	/* Pied de page sur deux colonnes. */
	.foot { grid-template-columns: 1fr 1fr; gap: 28px 18px; }
	.foot > div:first-child, .foot > div:last-child { grid-column: 1 / -1; }
	/* Ouverture : les légendes sous les couvertures (illisibles sous la brume du décor) sont masquées ; les couvertures restent cliquables. */
	.gg-book span { display: none; }
}
