/* ---- Polices de marque auto-hébergées (EB Garamond serif + Aileron sans) ---- */
@font-face{font-family:Aileron;src:url(../fonts/Aileron/aileron-light-webfont.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Aileron;src:url(../fonts/Aileron/aileron-regular-webfont.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Aileron;src:url(../fonts/Aileron/aileron-italic-webfont.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Aileron;src:url(../fonts/Aileron/aileron-semibold-webfont.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Aileron;src:url(../fonts/Aileron/aileron-bold-webfont.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(../fonts/EBGaramond/EBGaramond-SemiBoldItalic.woff2) format("woff2");font-weight:600;font-style:italic;font-display:swap}

/* =========================================================================
   Éditions Beya — charte alignée sur les emails de lancement.
   Crème #F5F0EB + bordeaux #8B1A2C + gris chauds. Couvertures généreuses,
   ombres douces, labels Arial en capitales espacées, titres serif sobres.
   ========================================================================= */

:root {
    /* Palette de marque (emails de lancement) */
    --brand-red: #8b1a2c;        /* bordeaux — accent principal (lien, CTA, labels) */
    --brand-red-dark: #6f1422;
    --brand-red-light: #a83648;

    /* Crèmes & surfaces */
    --cream: #f5f0eb;            /* fond de page */
    --cream-2: #eae4dc;          /* encarts / blocs mis en avant */
    --cream-3: #d8d3ce;
    --surface: #ffffff;          /* cartes / contenu */
    --line: #e4ddd4;

    /* Encres */
    --ink: #1a1a1a;
    --ink-soft: #666666;
    --muted: #6a655e;            /* gris chaud — contraste AA (≥ 4,5:1) sur crème */

    --link: var(--brand-red);
    --paper: var(--cream);

    /* Typographies */
    --font-serif: "EB Garamond", Georgia, "Times New Roman", serif;
    --font-sans: "Aileron", Arial, Helvetica, sans-serif;

    --gutter: clamp(1rem, 4vw, 3rem);
    --radius: 2px;               /* coins quasi droits = plus éditorial */
    --radius-card: 10px;         /* encarts mis en avant (event-card, notices, widgets) */
    --radius-pill: 999px;        /* pastilles / boutons ronds */
    --shadow-cover: 0 12px 40px rgba(0, 0, 0, .22);
    --shadow-soft: 0 6px 24px rgba(26, 24, 26, .10);
    --maxw: 1180px;
    --label: .72rem;
}

* { box-sizing: border-box; }
html { font-size: 18.5px; -webkit-text-size-adjust: 100%; }  /* EB Garamond a une petite hauteur d'x */
body {
    margin: 0;
    font-family: var(--font-serif);
    color: var(--ink);
    background: var(--cream);
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1, "liga" 1, "clig" 1;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3 { font-family: var(--font-serif); line-height: 1.25; color: var(--ink); font-weight: 400; letter-spacing: -.3px; }
h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .5em; }
h2 { font-size: clamp(1.3rem, 3vw, 1.9rem); }

.container { max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }

/* Label éditorial : Arial, capitales, lettrage espacé, bordeaux */
.label, .badge-collection, .eyebrow {
    font-family: var(--font-sans);
    font-size: var(--label);
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--brand-red);
    font-weight: 700;
}

/* ---------- Header ---------- */
.site-header {
    position: sticky; top: 0; z-index: 100;
    background: rgba(245, 240, 235, .92);
    backdrop-filter: saturate(140%) blur(8px);
    border-bottom: 1px solid var(--line);
}
/* Header sur UNE seule rangée : logo à gauche, panier (action) à droite, menu au
   milieu qui s'enroule en interne si besoin — le panier ne bascule plus en 2e ligne. */
.site-header__inner { display: flex; align-items: center; gap: 1.25rem 1.5rem; padding-block: .85rem; flex-wrap: nowrap; }
.brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.brand__logo { height: 40px; width: auto; display: block; }
.nav { display: flex; justify-content: center; gap: .4rem 1.25rem; flex: 1 1 auto; min-width: 0; flex-wrap: wrap;
    font-family: var(--font-sans); font-size: .76rem; letter-spacing: .9px; text-transform: uppercase; white-space: nowrap; }
.nav a { color: var(--ink-soft); }
.nav a:hover { color: var(--brand-red); text-decoration: none; }
/* Menu déroulant "Collections" */
.nav-dd { position: relative; display: inline-flex; align-items: center; }
.nav-dd__btn { font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--ink-soft);
    background: none; border: 0; padding: 0; margin: 0; cursor: pointer; display: inline-flex; align-items: center; gap: .4em; }
.nav-dd__btn:hover, .nav-dd:hover .nav-dd__btn, .nav-dd:focus-within .nav-dd__btn, .nav-dd.is-open .nav-dd__btn { color: var(--brand-red); }
.nav-dd__caret { width: 0; height: 0; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent;
    border-top: 4px solid currentColor; transition: transform .2s ease; }
.nav-dd:hover .nav-dd__caret, .nav-dd:focus-within .nav-dd__caret, .nav-dd.is-open .nav-dd__caret { transform: rotate(180deg); }
.nav-dd__menu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(5px);
    min-width: 215px; background: var(--cream); border: 1px solid var(--line); box-shadow: 0 14px 28px rgba(0, 0, 0, .12);
    padding: .35rem 0; display: flex; flex-direction: column; opacity: 0; visibility: hidden;
    transition: opacity .15s ease, transform .15s ease; z-index: 60; }
.nav-dd:hover .nav-dd__menu, .nav-dd:focus-within .nav-dd__menu, .nav-dd.is-open .nav-dd__menu {
    opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dd__menu a { padding: .55rem 1.3rem; white-space: nowrap; text-align: left; }
.header-actions { display: flex; align-items: center; gap: 1.25rem; flex-shrink: 0; font-family: var(--font-sans); font-size: .76rem; letter-spacing: .9px; text-transform: uppercase; }
.nav-toggle { display: none; flex-direction: column; justify-content: center; gap: 4px; width: 40px; height: 40px; padding: 8px; background: none; border: 0; cursor: pointer; }
.nav-toggle span { display: block; height: 2px; background: var(--ink); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
.site-header.is-nav-open .nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.site-header.is-nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
.site-header.is-nav-open .nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 820px) {
    .nav-toggle { display: flex; }
    .site-header__inner { flex-wrap: nowrap; gap: .8rem; }
    .nav {
        position: absolute; top: 100%; left: 0; right: 0;
        flex-direction: column; align-items: stretch; gap: 0;
        background: var(--cream); border-bottom: 1px solid var(--line);
        box-shadow: 0 14px 28px rgba(0, 0, 0, .12);
        padding: .3rem 0; display: none; white-space: normal;
        max-height: calc(100vh - 66px); overflow-y: auto;
    }
    .site-header.is-nav-open .nav { display: flex; }
    .nav a { padding: .9rem 1.4rem; border-top: 1px solid var(--line); }
    .nav a:first-child { border-top: 0; }
    /* "Collections" en accordéon dans le menu mobile (clic, pas survol) */
    .nav-dd { display: block; width: 100%; }
    .nav-dd__btn { width: 100%; justify-content: space-between; padding: .9rem 1.4rem; }
    .nav-dd__menu { position: static; transform: none; min-width: 0; opacity: 1; visibility: visible;
        display: none; background: rgba(0, 0, 0, .025); border: 0; box-shadow: none; padding: .2rem 0; }
    .nav-dd.is-open .nav-dd__menu { display: flex; }
    .nav-dd__menu a { padding: .7rem 1.4rem .7rem 2.8rem; border-top: 0; }
    .header-actions { margin-left: auto; gap: .9rem; }
}
/* Recherche = action utilitaire en icône loupe (pas un onglet de contenu). */
.search-link { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
    width: 38px; height: 38px; border-radius: 50%; color: var(--ink-soft);
    transition: color .15s ease, background .15s ease; }
.search-link:hover { color: var(--brand-red); background: var(--cream-2); }

/* Panier = action, présentée en pastille distincte (pas un onglet de menu). */
.cart-link { display: inline-flex; align-items: center; gap: .45rem; flex-shrink: 0; white-space: nowrap;
    color: var(--brand-red); border: 1px solid var(--brand-red-light); border-radius: var(--radius-pill);
    padding: .4rem .85rem; background: var(--cream-2);
    transition: background .15s ease, color .15s ease, border-color .15s ease; }
.cart-link:hover { background: var(--brand-red); border-color: var(--brand-red); color: #fff; text-decoration: none; }
.cart-link:hover .cart-badge { background: #fff; color: var(--brand-red); }
.cart-badge { background: var(--brand-red); color: #fff; border-radius: var(--radius-pill); font-size: .68rem; padding: .1rem .45rem; letter-spacing: 0; }

/* Mini-panier : popover résumé au clic sur le panier. */
.cart-wrap { position: relative; }
.mini-cart { position: absolute; top: calc(100% + .6rem); right: 0; z-index: 210;
    width: min(352px, 92vw); background: var(--surface); border: 1px solid var(--line);
    border-radius: 12px; box-shadow: 0 22px 54px rgba(20, 16, 16, .16);
    padding: 1.15rem 1.25rem 1.25rem; font-family: var(--font-sans);
    text-transform: none; letter-spacing: 0; line-height: normal; }
.mini-cart::before { content: "Votre panier"; display: block; font-size: .68rem; font-weight: 700;
    letter-spacing: 1.5px; text-transform: uppercase; color: var(--ink-soft); margin-bottom: .7rem;
    padding-bottom: .55rem; border-bottom: 1px solid var(--line); }
.mini-cart[hidden] { display: none; }
.mini-cart__empty { text-align: center; color: var(--ink-soft); margin: .4rem 0 .9rem; font-size: .9rem; }
.mini-cart__items { list-style: none; margin: 0; padding: 0; max-height: 48vh; overflow-y: auto; }
.mini-cart__item { display: flex; align-items: center; gap: .8rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.mini-cart__item:last-child { border-bottom: 0; }
.mini-cart__thumb { flex-shrink: 0; width: 40px; display: flex; }
.mini-cart__thumb img { width: 40px; height: auto; border-radius: 3px; box-shadow: 0 3px 8px rgba(20, 16, 16, .16); }
.mini-cart__txt { display: flex; flex-direction: column; gap: .12rem; flex: 1 1 auto; min-width: 0; }
.mini-cart__title { font-size: .82rem; color: var(--ink); line-height: 1.25;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mini-cart__meta { font-size: .72rem; color: var(--ink-soft); }
.mini-cart__sub { font-size: .82rem; font-weight: 600; color: var(--brand-red); flex-shrink: 0; }
.mini-cart__foot { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--line); }
.mini-cart__total { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .6rem;
    text-transform: uppercase; letter-spacing: .5px; font-size: .74rem; color: var(--ink-soft); }
.mini-cart__total strong { font-size: 1.12rem; color: var(--brand-red); }
.mini-cart__cta { width: 100%; }

/* ---------- Boutons ---------- */
.btn {
    display: inline-block; font-family: var(--font-sans); font-size: .72rem; font-weight: 700;
    letter-spacing: 2.5px; text-transform: uppercase;
    padding: 1rem 2.4rem; border-radius: var(--radius); border: 1px solid transparent; cursor: pointer;
    transition: background .15s ease, transform .05s ease, border-color .15s ease;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--brand-red); color: #fff; }
.btn-primary:hover { background: var(--brand-red-dark); }
.btn-outline { background: transparent; border-color: var(--cream-3); color: var(--ink); }
.btn-outline:hover { background: var(--brand-red); border-color: var(--brand-red); color: #fff; }

/* ---------- Hero ---------- */
.hero { background: var(--cream-2); border-bottom: 1px solid var(--line); }
.hero__inner { padding-block: clamp(2.2rem, 5vw, 3.8rem) clamp(1.3rem, 3vw, 2.2rem); max-width: 720px; text-align: center; margin-inline: auto; }
.hero h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); }
.hero p { font-size: 1.1rem; color: var(--ink-soft); }

/* ---------- Mise en avant « dernier paru » ---------- */
.feature { display: grid; grid-template-columns: minmax(150px, 210px) 1fr; gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center; background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow-soft);
    padding: clamp(1.5rem, 4vw, 2.6rem); margin: 1.5rem 0 1.5rem; }
.feature:hover { box-shadow: 0 14px 40px rgba(26, 24, 26, .15); text-decoration: none; }
.feature__cover img { width: 100%; box-shadow: var(--shadow-cover); border-radius: var(--radius); }
.feature__body h2 { margin: .35rem 0 .3rem; font-size: clamp(1.5rem, 3vw, 2.1rem); color: var(--ink); }
.feature__body .subtitle { color: var(--brand-red); font-family: var(--font-sans); font-size: .88rem; font-weight: 600; margin: 0; }
.feature__chapeau { font-style: italic; color: var(--ink-soft); margin: .9rem 0 1.1rem; line-height: 1.65; }
.feature__cta { font-family: var(--font-sans); font-size: .76rem; letter-spacing: 1.5px; text-transform: uppercase; color: var(--brand-red); font-weight: 700; }
@media (max-width: 680px) { .feature { grid-template-columns: 1fr; text-align: center; } .feature__cover { max-width: 190px; margin-inline: auto; } }

/* ---------- Recherche / filtres catalogue (client) ---------- */
.visually-hidden {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
/* Barre de filtres discrète : pastilles compactes, centrées sous le titre,
   qui s'enroulent proprement (pas de carte, pas de pleine largeur). */
.book-filters {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: .5rem; max-width: 840px; margin: 1rem auto 1.8rem; padding: 0;
    background: none; border: 0; font-family: var(--font-sans);
}
.book-filters__search { flex: 0 1 280px; min-width: 180px; }
.book-filters__selects { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.book-filters input[type="search"],
.book-filters select {
    font-family: var(--font-sans); font-size: .8rem; color: var(--ink-soft);
    padding: .44rem .95rem; border: 1px solid var(--line); border-radius: var(--radius-pill);
    background-color: var(--surface); -webkit-appearance: none; appearance: none;
}
.book-filters input[type="search"] { width: 100%; }
.book-filters input[type="search"]:hover,
.book-filters select:hover { border-color: var(--cream-3); }
.book-filters select {
    width: auto; cursor: pointer; padding-right: 2rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23999' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right .75rem center;
}
.book-filters input[type="search"]:focus,
.book-filters select:focus { border-color: var(--brand-red); }
.book-filters input[type="search"]:focus:not(:focus-visible),
.book-filters select:focus:not(:focus-visible) { outline: none; }
.book-filters__count {
    margin: 1rem 0 0; font-family: var(--font-sans); font-size: .8rem;
    letter-spacing: .4px; color: var(--ink-soft);
}
.book-filters__empty {
    margin: 2rem 0; text-align: center; font-style: italic; color: var(--ink-soft);
}

/* ---------- Page Recherche (résultats groupés par collection puis articles) ---------- */
.search-form { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; max-width: 640px; margin: 1.4rem auto 2rem; }
.search-form input[type="search"] { flex: 1 1 280px; min-width: 0; padding: .7rem 1rem; font-size: .95rem;
    font-family: var(--font-sans); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.search-form input[type="search"]:focus { border-color: var(--brand-red); }
.search-form input[type="search"]:focus:not(:focus-visible) { outline: none; }
.search-count { text-align: center; color: var(--ink-soft); font-family: var(--font-sans); font-size: .86rem; margin-bottom: 2.2rem; }
.search-empty { text-align: center; color: var(--ink-soft); font-style: italic; margin: 2.5rem 0; }
.search-group { margin-bottom: 2.8rem; }
.search-group__title { font-family: var(--font-serif); font-size: 1.4rem; color: var(--brand-red);
    border-bottom: 1px solid var(--line); padding-bottom: .55rem; margin-bottom: 1.6rem; display: flex; align-items: baseline; gap: .6rem; }
.search-group__n { font-family: var(--font-sans); font-size: .72rem; font-weight: 700; color: var(--ink-soft);
    background: var(--cream-2); border-radius: var(--radius-pill); padding: .1rem .55rem; }
.search-group .grid-books { padding-block: 0; }
.search-articles { list-style: none; margin: 0; padding: 0; }
.search-article { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .9rem .4rem; border-bottom: 1px solid var(--line); }
.search-article:hover { background: var(--cream-2); }
.search-article__link { display: flex; flex-direction: column; gap: .12rem; flex: 1 1 auto; min-width: 0; text-decoration: none; color: inherit; }
.search-article__link:hover { text-decoration: none; }
.search-article__title { font-family: var(--font-serif); font-size: 1.05rem; color: var(--ink); line-height: 1.3; }
.search-article__link:hover .search-article__title { color: var(--brand-red); }
.search-article__meta { font-family: var(--font-sans); font-size: .76rem; color: var(--ink-soft); }
.search-article__pdf { flex-shrink: 0; font-family: var(--font-sans); font-size: .68rem; font-weight: 700;
    letter-spacing: .5px; color: var(--brand-red); border: 1px solid var(--brand-red-light); border-radius: var(--radius-pill);
    padding: .3rem .7rem; text-decoration: none; white-space: nowrap; }
.search-article__pdf:hover { background: var(--brand-red); color: #fff; text-decoration: none; }

/* ---------- Page Conférences (cycle « Croire l'incroyable ») ---------- */
.conf-page { max-width: 880px; }
.conf-hero { text-align: center; margin: 1rem auto 2.8rem; }
.conf-hero__eyebrow { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .16em; font-size: .74rem; font-weight: 700; color: var(--brand-red); margin: 0 0 1rem; }
.conf-hero__title { font-size: clamp(2.2rem, 6vw, 3.4rem); color: var(--ink); margin: 0; line-height: 1.05; }
.conf-hero__sub { font-family: var(--font-serif); font-style: italic; color: var(--ink-soft); font-size: 1.2rem; max-width: 40ch; margin: 1.1rem auto 0; line-height: 1.5; }
.conf-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.conf-item { display: flex; gap: 1.6rem; align-items: baseline; padding: 1.7rem .3rem; border-bottom: 1px solid var(--line); }
.conf-item__date { flex-shrink: 0; display: flex; align-items: baseline; gap: .55rem; width: 7.2rem; }
.conf-item__day { font-family: var(--font-serif); font-size: 2.3rem; color: var(--brand-red); line-height: 1; }
.conf-item__my { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: var(--ink-soft); line-height: 1.3; }
.conf-item__body { flex: 1 1 auto; }
.conf-item__title { font-size: 1.3rem; color: var(--ink); margin: 0 0 .3rem; line-height: 1.25; }
.conf-item__speaker { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .1em; font-size: .78rem; color: var(--ink-soft); margin: 0; }
.conf-practical { margin: 2.8rem 0 1rem; padding: 1.6rem 1.8rem; background: var(--cream-2); border: 1px solid var(--brand-red-light); border-radius: var(--radius); text-align: center; }
.conf-practical__free { display: inline-block; font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: .82rem; color: var(--brand-red); margin-bottom: 1rem; }
.conf-practical__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 2.4rem; margin: 0; }
.conf-practical__grid div { text-align: center; }
.conf-practical__grid dt { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .1em; font-size: .66rem; color: var(--ink-soft); margin-bottom: .2rem; }
.conf-practical__grid dd { font-family: var(--font-serif); font-size: 1.05rem; color: var(--ink); margin: 0; }
.conf-practical__lieu { flex-basis: 100%; margin-top: .4rem; }
@media (max-width: 560px) {
    .conf-item { flex-direction: column; gap: .5rem; }
    .conf-item__date { width: auto; }
}

/* Teaser « Conférences » sur l'accueil : encart « affiche » centré. */
.home-events { padding: 2.4rem 0; }
.event-card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .45rem;
    max-width: 560px; margin: 0 auto; padding: 1.9rem 2rem;
    background: var(--cream-2); border: 1px solid var(--brand-red-light); border-radius: var(--radius-card);
    box-shadow: 0 12px 34px rgba(139, 26, 44, .09); text-decoration: none;
    transition: box-shadow .2s ease, transform .2s ease; }
.event-card:hover { box-shadow: 0 18px 44px rgba(139, 26, 44, .15); transform: translateY(-2px); text-decoration: none; }
/* Lettrine « C » intégrée comme initiale du mot « Croire » (lockup façon affiche). */
.event-card__title.has-lettrine,
.conf-hero__title.has-lettrine { display: inline-flex; align-items: center; justify-content: center; gap: .03em; flex-wrap: nowrap; line-height: 1; }
.event-card__lettrine { height: 1.45em; width: auto; margin: 0; flex-shrink: 0; }
.conf-hero__lettrine { height: 1.4em; width: auto; margin: 0; flex-shrink: 0; }
.event-card__label { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .18em; font-size: .72rem; font-weight: 700; color: var(--brand-red); }
.event-card__title { font-family: var(--font-serif); font-size: clamp(1.7rem, 4vw, 2.3rem); color: var(--ink); line-height: 1.05; margin: .1rem 0 .15rem; }
.event-card__next { font-family: var(--font-serif); font-style: italic; font-size: 1rem; color: var(--ink-soft); }
.event-card__next strong { color: var(--ink); font-style: normal; }
.event-card__cta { margin-top: .8rem; font-family: var(--font-sans); font-size: .72rem; font-weight: 700;
    letter-spacing: .08em; text-transform: uppercase; color: var(--brand-red);
    border: 1px solid var(--brand-red-light); border-radius: var(--radius-pill); padding: .55rem 1.3rem;
    transition: background .15s ease, color .15s ease, border-color .15s ease; }
.event-card:hover .event-card__cta { background: var(--brand-red); border-color: var(--brand-red); color: #fff; }

/* Mini-carte rappel du cycle : petit encart en haut À DROITE, HORS FLUX (n'écarte pas le contenu). */
main { position: relative; }
.conf-mini { position: absolute; top: .8rem; right: clamp(.6rem, 2.5vw, 1.6rem); z-index: 6; width: 206px;
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .04rem;
    margin: 0; padding: .65rem .8rem;
    background: var(--cream-2); border: 1px solid var(--brand-red-light); border-radius: var(--radius-card);
    box-shadow: 0 6px 18px rgba(139, 26, 44, .09); text-decoration: none;
    transition: box-shadow .2s ease, transform .2s ease; }
.conf-mini:hover { box-shadow: 0 10px 24px rgba(139, 26, 44, .15); transform: translateY(-1px); text-decoration: none; }
.conf-mini__label { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: var(--brand-red); font-size: .54rem; }
.conf-mini__title { font-family: var(--font-serif); font-size: 1.02rem; color: var(--ink); line-height: 1.1; margin: .08rem 0 0; }
.conf-mini__title.has-lettrine { display: inline-flex; align-items: center; justify-content: center; gap: .02em; flex-wrap: nowrap; }
.conf-mini__lettrine { height: 1.3em; width: auto; }
.conf-mini__meta { font-family: var(--font-serif); font-style: italic; font-size: .7rem; color: var(--ink-soft); }
.conf-mini__cta { margin-top: .35rem; font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .05em; font-weight: 700; font-size: .58rem; color: var(--brand-red);
    border: 1px solid var(--brand-red-light); border-radius: var(--radius-pill); padding: .3rem .75rem; }
.conf-mini:hover .conf-mini__cta { background: var(--brand-red); border-color: var(--brand-red); color: #fff; }
@media (max-width: 980px) { .conf-mini { display: none; } }

/* ---------- Page Checkout (finaliser la commande) ---------- */
.checkout__grid { display: grid; grid-template-columns: 1fr minmax(280px, 360px); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; padding-block: 1rem 3rem; }
.checkout__section { margin-bottom: 2rem; }
.checkout__h2 { font-family: var(--font-serif); font-size: 1.3rem; color: var(--brand-red); margin: 0 0 1rem; }
.checkout .field { margin-bottom: .7rem; }
.checkout .field--row { display: flex; gap: .7rem; }
.checkout .field__cp { flex: 0 0 130px; }
.checkout input[type="text"], .checkout input[type="email"], .checkout input:not([type]), .checkout select {
    width: 100%; font-family: var(--font-sans); font-size: .92rem; color: var(--ink);
    padding: .7rem .9rem; border: 1px solid var(--cream-3); border-radius: var(--radius); background: var(--surface); }
.checkout input:focus, .checkout select:focus { border-color: var(--brand-red); }
.checkout input:focus:not(:focus-visible), .checkout select:focus:not(:focus-visible) { outline: none; }
.checkout .opt { display: flex; align-items: center; gap: .7rem; padding: .75rem .95rem; margin-bottom: .5rem;
    border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer; font-family: var(--font-sans); font-size: .9rem;
    transition: border-color .15s ease, background .15s ease; }
.checkout .opt:hover { border-color: var(--cream-3); }
.checkout .opt:has(input:checked) { border-color: var(--brand-red); background: var(--cream-2); }
.checkout .opt__label { flex: 1 1 auto; }
.checkout .opt__price { font-weight: 600; color: var(--brand-red); }
.checkout__pay { width: 100%; padding: .9rem; font-size: .78rem; margin-top: .6rem; }
.checkout__secure { text-align: center; font-family: var(--font-sans); font-size: .76rem; color: var(--ink-soft); margin-top: .8rem; }
.checkout__summary { background: var(--cream-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.4rem 1.5rem; position: sticky; top: 5rem; }
.checkout__summary .checkout__h2 { margin-top: 0; }
.checkout__items { list-style: none; margin: 0 0 1rem; padding: 0; }
.checkout__item { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--line); font-family: var(--font-sans); font-size: .85rem; }
.checkout__item:last-child { border-bottom: 0; }
.checkout__item-sub { font-weight: 600; flex-shrink: 0; color: var(--brand-red); }
.checkout__ens { text-transform: uppercase; letter-spacing: .08em; font-size: .66rem; color: var(--brand-red); font-weight: 700; }
.checkout__row { display: flex; justify-content: space-between; padding: .4rem 0; font-family: var(--font-sans); font-size: .9rem; }
.checkout__row--total { border-top: 2px solid var(--brand-red-light); margin-top: .3rem; padding-top: .65rem; font-weight: 700; font-size: 1.15rem; color: var(--brand-red); }
@media (max-width: 760px) { .checkout__grid { grid-template-columns: 1fr; } .checkout__summary { position: static; } }
@media (max-width: 600px) {
    .book-filters__search { flex-basis: 100%; }
}

/* ---------- Grille catalogue ---------- */
.grid-books {
    display: grid; gap: clamp(1.6rem, 3.5vw, 2.6rem);
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    padding-block: 3rem;
}
.book-card { background: transparent; border: 0; display: flex; flex-direction: column; gap: .55rem; text-align: center; transition: transform .2s ease; }
.book-card:hover { transform: translateY(-4px); text-decoration: none; }
/* Lien fiche (couverture + infos) en colonne ; le bouton d'ajout reste sous le prix. */
.book-card__link { display: flex; flex-direction: column; gap: .55rem; flex: 1 1 auto; color: inherit; text-decoration: none; }
.book-card__link:hover { text-decoration: none; }
.book-card__add { margin-top: .1rem; }
.book-card__add-btn { width: 100%; padding: .5rem 1rem; font-size: .66rem; letter-spacing: 1.2px; }
/* Toutes les couvertures à la même hauteur (largeur variable, alignées en bas) */
.book-card__cover { height: clamp(240px, 26vw, 300px); display: flex; align-items: flex-end; justify-content: center; }
.book-card__cover img { width: auto; max-width: 100%; height: 100%; object-fit: contain; object-position: bottom center; box-shadow: var(--shadow-cover); border-radius: var(--radius); }
/* Corps en colonne qui remplit la hauteur de carte (la grille étire les cartes
   à la même hauteur) : titre sur 2 lignes réservées, auteur aligné, prix épinglé
   en bas → alignement constant des prix sur toute une rangée. */
.book-card__body { display: flex; flex-direction: column; gap: .25rem; padding-top: .4rem; flex: 1 1 auto; }
.book-card__title { font-size: 1.05rem; line-height: 1.3; color: var(--ink);
    min-height: 2.6em; display: flex; align-items: center; justify-content: center; }
.book-card__author { font-family: var(--font-sans); font-size: .78rem; color: var(--ink-soft); font-style: italic; }
.book-card__price { font-family: var(--font-sans); font-weight: 600; color: var(--brand-red); font-size: .9rem; margin-top: auto; padding-top: .35rem; }

/* ---------- Accueil : carte « Ensemble à la une » sur 2 colonnes (couvertures chevauchées) ---------- */
.pack-card { grid-column: span 2; }
/* Dernier paru (3 colonnes) : un ENCART à liseré rouge autour de [couverture | chapeau]
   UNIQUEMENT ; le bloc d'achat (badge/titre/prix/bouton) vient DESSOUS, sous la couverture. */
.book-card--latest { grid-column: span 2; display: flex; flex-direction: column; gap: .9rem; }
.latest__encart { display: flex; align-items: center; gap: clamp(1.2rem, 3vw, 2.4rem); border: 1px solid var(--brand-red-light); border-radius: var(--radius-card); background: var(--cream-2); box-shadow: 0 6px 18px rgba(139, 26, 44, .09); padding: clamp(1rem, 2vw, 1.5rem); }
.latest__coverlink { flex: 0 0 auto; text-decoration: none; }
.latest__encart .book-card__cover { height: clamp(186px, 21vw, 244px); }
.latest__lead { flex: 1 1 auto; text-align: left; min-width: 0; }
.latest__buy { display: flex; flex-direction: column; gap: .55rem; align-self: flex-start; width: clamp(200px, 22vw, 250px); text-align: center; }
.latest__flag { display: inline-block; align-self: flex-start; margin-bottom: .6rem; font-family: var(--font-sans); font-size: .82rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--brand-red); border-bottom: 2px solid var(--brand-red-light); padding-bottom: .28rem; }
.latest__sub { display: block; color: var(--brand-red); font-family: var(--font-sans); font-size: .82rem; font-weight: 600; margin-bottom: .45rem; }
.latest__chapeau { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; font-family: var(--font-serif); font-style: italic; color: var(--ink-soft); line-height: 1.6; }
.latest__more { display: inline-block; margin-top: .7rem; font-family: var(--font-sans); font-size: .72rem; letter-spacing: 1.2px; text-transform: uppercase; color: var(--brand-red); font-weight: 700; }
@media (max-width: 760px) {
    .book-card--latest { grid-column: 1 / -1; }
    .latest__encart { flex-direction: column; text-align: center; }
    .latest__lead { text-align: center; }
    .latest__flag { align-self: center; }
    .latest__buy { width: 100%; align-self: stretch; }
}
/* Couvertures qui se chevauchent horizontalement (pile étalée), ombre à gauche pour la profondeur. */
/* Couvertures DROITES, taille identique aux couvertures seules (height = zone livre).
   Superposées avec la gauche AU-DESSUS (z-index décroissant) pour laisser dépasser
   le médaillon (côté droit) de chaque volume. */
.pack-card__fan { display: flex; align-items: flex-end; justify-content: center;
    height: clamp(240px, 26vw, 300px); isolation: isolate; }
.pack-card__cov { height: 100%; width: auto; max-width: none;
    object-fit: contain; object-position: bottom center;
    border-radius: 2px; box-shadow: 6px 5px 16px rgba(20, 16, 16, .22);
    margin-left: -125px; position: relative; z-index: calc(90 - var(--i, 0));
    transition: margin-left .3s ease; }
.pack-card__cov:first-child { margin-left: 0; }
.book-card:hover .pack-card__cov:not(:first-child) { margin-left: -105px; }
.pack-card__body { display: flex; flex-direction: column; align-items: center; gap: .12rem; padding-top: .5rem; }
/* Tailles de police calées sur les cartes livres (titre 1.05rem, auteur .78rem, prix .9rem). */
.pack-card__name { font-family: var(--font-serif); font-size: 1.05rem; line-height: 1.3; color: var(--ink); max-width: 28ch; }
.pack-card__count { font-family: var(--font-sans); font-size: .78rem; letter-spacing: .4px; color: var(--ink-soft); }
.pack-card__prices { display: flex; align-items: baseline; gap: .5rem; margin-top: .3rem; }
.pack-card__price { font-family: var(--font-sans); font-weight: 600; font-size: .9rem; color: var(--brand-red); }
.pack-card__strike { font-family: var(--font-sans); font-size: .78rem; color: var(--ink-soft); text-decoration: line-through; }
.pack-card__save { margin-top: .4rem; font-family: var(--font-sans); font-weight: 700; font-size: .7rem;
    letter-spacing: .5px; text-transform: uppercase; color: var(--brand-red); background: var(--cream-2);
    border-radius: var(--radius-pill); padding: .22rem .8rem; }
.pack-card__add { margin-top: .7rem; }
.pack-card__add .btn { padding: .5rem 1.4rem; font-size: .66rem; letter-spacing: 1.2px; }
@media (max-width: 760px) { .pack-card { grid-column: 1 / -1; } }

/* ---------- Fiche livre (colonne gauche cover+méta · colonne droite contenu) ---------- */
.book-detail { display: grid; grid-template-columns: minmax(260px, 330px) 1fr; gap: clamp(2rem, 5vw, 4rem); padding-block: 3rem; align-items: start; }
.book-detail__side { position: sticky; top: 5rem; }
.book-detail__cover { position: relative; text-align: center; }
.book-detail__cover > img { box-shadow: var(--shadow-cover); border-radius: var(--radius); width: 100%; }
/* Médaillon en haut à droite de la colonne contenu (rond) */
.book-detail__main .medaillon {
    float: right; width: clamp(80px, 18%, 116px); aspect-ratio: 1 / 1; object-fit: cover;
    border-radius: 50%; box-shadow: none; margin: 0 0 1rem 1.5rem;
    filter: drop-shadow(0 3px 12px rgba(139, 26, 44, .2));
}
@media (max-width: 760px) { .book-detail__main .medaillon { width: 84px; } }
/* Blocs métadonnées (façon ancienne fiche) — contributeurs empilés tight */
.meta-block { margin: 1.5rem 0 0; font-family: var(--font-sans); }
.meta-block dt { font-size: .64rem; letter-spacing: 1.4px; text-transform: uppercase; color: var(--ink-soft); }
.meta-block dd { margin: .05rem 0 .7rem; font-size: .92rem; color: var(--ink); }
/* Édition : grille label | valeur, compacte (spec-sheet) */
.meta-block--edition { display: grid; grid-template-columns: auto 1fr; gap: .42rem 1rem;
    border-top: 1px solid var(--line); margin-top: 1.5rem; padding-top: 1.1rem; }
.meta-block--edition dt { color: var(--ink-soft); align-self: baseline; }
.meta-block--edition dd { margin: 0; font-size: .88rem; }
/* Accordéon « Détails de l'édition » */
.meta-accordion { border-top: 1px solid var(--line); margin-top: 1.5rem; }
.meta-accordion > summary { cursor: pointer; list-style: none; font-family: var(--font-sans); font-size: .68rem;
    letter-spacing: 1.6px; text-transform: uppercase; color: var(--ink-soft); padding: .9rem 0; }
.meta-accordion > summary::-webkit-details-marker { display: none; }
.meta-accordion > summary::after { content: " +"; color: var(--ink-soft); }
.meta-accordion[open] > summary::after { content: " –"; }
.meta-accordion .meta-block--edition { border-top: 0; margin-top: 0; padding-top: .3rem; }

.book-detail__main h1 { letter-spacing: .4px; line-height: 1.1; margin: .1em 0 .25em; }
.book-detail__main .eyebrow { margin: 0 0 .6rem; }
.book-detail__main .subtitle { font-size: 1.15rem; margin: 0 0 .2rem; }
.book-detail__main .subtitle2 { font-family: var(--font-sans); color: var(--brand-red); font-weight: 600; font-size: .92rem; margin: 0 0 .2rem; }
@media (max-width: 760px) {
    .book-detail { grid-template-columns: 1fr; }
    .book-detail__side { position: static; max-width: 340px; margin-inline: auto; }
}
/* Ligne d'ajout au panier : quantité + bouton alignés, même hauteur */
.add-to-cart { display: flex; align-items: stretch; gap: .6rem; margin: 1rem 0 .4rem; }
.add-to-cart .qty { width: 3.4rem; text-align: center; border: 1px solid var(--cream-3);
    border-radius: var(--radius); font-family: var(--font-sans); font-size: 1rem; }
.add-to-cart .btn { padding-block: 0; line-height: 1; display: inline-flex; align-items: center; }
.book-detail__desc { font-size: 1.12rem; line-height: 1.72; color: #2c2a28; text-align: justify;
    hyphens: auto; -webkit-hyphens: auto; text-justify: inter-word; max-width: 66ch; }
.book-detail__desc p { margin: 0 0 1.15em; }
.book-detail__desc :first-child { margin-top: 0; }
/* Chapeau (intro) en encadré crème — façon email de lancement */
.book-detail__desc .chapeau { background: var(--cream-2); border-radius: var(--radius);
    padding: clamp(1.2rem, 3vw, 1.7rem) clamp(1.3rem, 4vw, 2rem); margin: 0 0 1.6rem; font-size: 1.04em; }
.book-detail__desc .chapeau p:first-child { margin-top: 0; }
.book-detail__desc .chapeau p:last-child { margin-bottom: 0; }
/* Bloc métadonnées affiné (ISBN, langue, dispo) */
.book-meta { list-style: none; padding: 0; margin: 2rem 0 0; border-top: 1px solid var(--line); }
.book-meta li { display: flex; gap: .8rem; padding: .55rem 0; border-bottom: 1px solid var(--line);
    font-family: var(--font-sans); font-size: .82rem; color: var(--ink); }
.book-meta li span { color: var(--ink-soft); text-transform: uppercase; letter-spacing: 1.5px;
    font-size: .7rem; min-width: 9rem; }
.subtitle { font-family: var(--font-sans); color: var(--brand-red); font-weight: 600; letter-spacing: .3px; }
.byline { font-family: var(--font-sans); font-style: italic; color: var(--ink-soft); margin-top: -.3rem; }
.byline a { color: var(--brand-red); text-decoration: none; }
.byline a:hover { text-decoration: underline; }
@media (max-width: 720px) { .book-detail { grid-template-columns: 1fr; text-align: center; } }

/* Encart « accroche » façon email (fond crème) */
.pull { background: var(--cream-2); padding: clamp(1.6rem, 4vw, 2.4rem); margin: 2rem 0; font-style: italic; text-align: center; font-size: 1.1rem; }

/* ---------- Articles (documentation) ---------- */
.prose { max-width: 66ch; margin-inline: auto; padding-block: 3rem; font-size: 1.1rem; line-height: 1.8; color: #2c2a28; }
.prose p { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.prose h1 { letter-spacing: -.2px; }
.prose h2 { margin-top: 2.2rem; letter-spacing: -.2px; }
.prose img { border-radius: var(--radius); margin: 1.5rem auto; box-shadow: var(--shadow-soft); }
.cat-block { padding-block: 1.6rem; border-bottom: 1px solid var(--line); }
.cat-block h2 { font-size: 1.3rem; }
.cat-block h2 a { color: var(--ink); }
.cat-block h2 a:hover { color: var(--brand-red); }
.cat-list { columns: 2; font-family: var(--font-sans); font-size: .92rem; line-height: 1.9; }
.cat-list a { color: var(--ink-soft); }
.cat-list a:hover { color: var(--brand-red); }
@media (max-width: 600px) { .cat-list { columns: 1; } }

/* ---------- Panier / checkout ---------- */
.cart-table { width: 100%; border-collapse: collapse; font-family: var(--font-sans); font-size: .92rem; }
.cart-table th, .cart-table td { text-align: left; padding: .85rem; border-bottom: 1px solid var(--line); }
.cart-table th { font-size: var(--label); letter-spacing: 1.5px; text-transform: uppercase; color: var(--ink-soft); }
.cart-total { font-size: 1.3rem; font-weight: 600; color: var(--brand-red); }
.cart-title { display: flex; align-items: center; gap: .6rem; }
.cart-medaillon { width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0; }
/* Pied de panier : code promo à gauche, actions à droite, séparateur net. */
.cart-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;
    gap: 1rem 1.5rem; margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid var(--line);
    font-family: var(--font-sans); }
.cart-foot__promo { display: flex; align-items: center; gap: .55rem; }
.cart-foot__promo input[type="text"] { padding: .6rem .85rem; border: 1px solid var(--cream-3);
    border-radius: var(--radius); font-family: var(--font-sans); font-size: .88rem; min-width: 150px; }
.cart-foot__applied { font-size: .88rem; color: var(--ink-soft); }
.cart-foot__actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.checkout-stub { background: var(--cream-2); border-radius: var(--radius); padding: 1.6rem; font-family: var(--font-sans); }

/* ---------- Footer ---------- */
.site-footer { margin-top: 5rem; background: var(--surface); border-top: 1px solid var(--line); color: var(--ink-soft); font-family: var(--font-serif); font-size: 1rem; line-height: 1.85; }
.site-footer a { color: var(--ink-soft); }
.site-footer a:hover { color: var(--brand-red); }
.site-footer__inner { display: flex; flex-wrap: wrap; gap: 2.5rem; justify-content: space-between; padding-block: 3rem; }
.site-footer h3 { color: var(--ink); font-size: var(--label); letter-spacing: 2px; text-transform: uppercase; font-family: var(--font-sans); font-weight: 700; margin-bottom: .8rem; }

/* ---------- Newsletter (pied de page) : bande pleine largeur ---------- */
.footer-newsletter { flex-basis: 100%; max-width: none; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1.2rem 3rem; border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 2rem; }
.nl-intro { flex: 1 1 300px; max-width: 460px; }
.nl-intro p { margin-top: .3rem; }
.nl-action { flex: 1 1 360px; max-width: 480px; }
.nl-form { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .2rem; }
.nl-input { flex: 1 1 200px; min-width: 0; padding: .6rem .7rem; border: 1px solid var(--cream-3); border-radius: var(--radius); font-family: var(--font-serif); font-size: .95rem; background: #fff; color: var(--ink); }
.nl-input:focus { border-color: var(--brand-red); }
.nl-input:focus-visible { outline: 2px solid var(--brand-red); outline-offset: 1px; }
.nl-btn { white-space: nowrap; }
.nl-msg { flex-basis: 100%; margin: .2rem 0 0; font-size: .85rem; }
.nl-msg--ok { color: var(--brand-red); }
.nl-msg--err { color: #b3261e; }
.nl-legal { font-family: var(--font-sans); font-size: .72rem; color: var(--ink-soft); margin-top: .6rem; line-height: 1.5; }

/* ---------- Fiche livre : blocs enrichis ---------- */
.book-detail__author { font-family: var(--font-sans); font-size: .92rem; letter-spacing: .5px; color: var(--ink-soft); text-transform: uppercase; margin: 0 0 .2rem; }
.book-detail__byline { font-family: var(--font-serif); font-style: italic; font-size: 1.05rem; color: var(--ink-soft); margin: .5rem 0 0; }
.book-detail__byline a { color: var(--brand-red); text-decoration: none; border-bottom: 1px solid transparent; }
.book-detail__byline a:hover { border-bottom-color: var(--brand-red); }
.book-detail__lead { font-family: var(--font-sans); color: var(--ink-soft); margin: .4rem 0 0; }
/* Chapeau (intro) en encadré crème — champ distinct */
.book-chapeau { background: var(--cream-2); border-radius: var(--radius);
    padding: clamp(1.1rem, 3vw, 1.6rem) clamp(1.3rem, 4vw, 2rem); margin: 1.4rem 0; font-size: 1.05rem; line-height: 1.7; }
.book-chapeau p:first-child { margin-top: 0; }
.book-chapeau p:last-child { margin-bottom: 0; }
.buy-box { margin: 1.8rem 0; border-block: 1px solid var(--line); }
.buy-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.4rem; padding: 1.2rem 0; }
.buy-row__cart { display: inline-flex; align-items: center; color: var(--brand-red); opacity: .8; }
.ico { flex: 0 0 auto; }
.buy-row__info { font-family: var(--font-sans); display: flex; flex-direction: column; gap: .15rem; margin-right: auto; }
.buy-row__line { display: flex; align-items: baseline; gap: 1rem; }
.buy-row__type { text-transform: uppercase; letter-spacing: 1.2px; font-size: .72rem; color: var(--ink-soft); }
.buy-row__price { font-size: 1.45rem; font-weight: 600; color: var(--brand-red); font-variant-numeric: lining-nums; }
.buy-row__delay { font-size: .74rem; color: var(--ink-soft); text-transform: uppercase; letter-spacing: .5px; }
/* Liens « Table des matières » / « Recensions » -> ouvrent une modale */
.book-actions { display: flex; flex-wrap: wrap; gap: 1.8rem; margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.book-link { display: inline-flex; align-items: center; gap: .5rem; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--font-sans);
    font-size: .78rem; letter-spacing: 1.5px; text-transform: uppercase; color: var(--brand-red); }
.book-link:hover { color: var(--brand-red-dark); }
.book-link:hover .book-link__txt { text-decoration: underline; }

/* Modale (popup) */
.modal[hidden] { display: none; }
.modal { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
/* Voile sombre net (pas de blur : sur une page dense le flou rendait le fond brouillon). */
.modal__backdrop { position: absolute; inset: 0; background: rgba(24, 19, 17, .82); }
.modal__panel { position: relative; background: var(--surface); max-width: 700px; width: 100%; max-height: 86vh;
    overflow: auto; border-radius: var(--radius); padding: 2.4rem clamp(1.4rem, 4vw, 2.8rem);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .32); }
.modal__close { position: absolute; top: .7rem; right: 1rem; background: none; border: 0; font-size: 1.9rem;
    line-height: 1; cursor: pointer; color: var(--ink-soft); }
.modal__close:hover { color: var(--brand-red); }
.modal__title { margin-top: 0; font-size: 1.35rem; letter-spacing: -.2px; }
body.modal-open { overflow: hidden; }

.book-section { border-top: 1px solid var(--line); margin-top: 1.4rem; }
.book-section > summary { cursor: pointer; font-family: var(--font-sans); font-size: .8rem; letter-spacing: 1.5px;
    text-transform: uppercase; color: var(--brand-red); padding: .9rem 0; list-style: none; }
.book-section > summary::-webkit-details-marker { display: none; }
.book-section > summary::after { content: " +"; color: var(--ink-soft); }
.book-section[open] > summary::after { content: " –"; }
.toc { font-family: var(--font-sans); font-size: .86rem; white-space: pre-wrap; line-height: 1.5; color: var(--ink);
    background: none; padding: 0; margin: 0; overflow-x: auto; }
/* Mention / suggestion de pack */
.pack-mention { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem;
    background: var(--cream-2); border: 1px solid var(--brand-red-light); border-radius: var(--radius);
    padding: .8rem 1.05rem; margin: 1.3rem 0; font-family: var(--font-sans); font-size: .86rem; }
/* Corps : éléments empilés sur des lignes distinctes (eyebrow / titre / prix / action), compact. */
.pack-mention__body { flex: 1 1 56%; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.pack-mention__body .eyebrow { margin: 0; }
.pack-mention__name { font-size: .95rem; line-height: 1.25; color: var(--ink); }
.pack-mention__price { color: var(--ink-soft); font-size: .84rem; }
.pack-mention__price strong { color: var(--ink); }
/* Ligne d'action : bouton compact + montant d'économie sur la même ligne. */
.pack-mention__action { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .85rem; margin-top: .5rem; }
.pack-mention__action .btn { padding: .42rem 1rem; font-size: .7rem; }
.pack-mention__save { color: var(--brand-red); font-weight: 600; font-size: .84rem; }
/* Éventail des médaillons des livres du pack */
.pack-fan { display: flex; align-items: flex-end; flex-shrink: 0; padding: .3rem .6rem .1rem 1.1rem; }
.pack-fan__med { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--surface);
    margin-left: -14px; box-shadow: 0 2px 8px rgba(20, 16, 16, .22); transform-origin: bottom center;
    transform: rotate(calc((var(--i, 0) - (var(--n, 1) - 1) / 2) * 9deg)); }
.pack-fan__med:first-child { margin-left: 0; }
/* Mobile : l'éventail ne disparaît plus — il passe sous le texte, centré
   (sinon la mention d'ensemble semblait absente sur téléphone). */
@media (max-width: 560px) {
    .pack-mention { justify-content: center; }
    .pack-mention__body { flex-basis: 100%; }
    .pack-fan:not(.pack-fan--sm) { width: 100%; justify-content: center; padding-left: 0; }
}
/* Ligne pack dans le panier : éventail compact + contenu */
.cart-pack { display: flex; align-items: center; gap: .85rem; }
.cart-pack__info { display: flex; flex-direction: column; }
.cart-pack__books { font-size: .8rem; color: var(--ink-soft); margin-top: .15rem; }
.pack-fan--sm { padding: .15rem .2rem; flex-shrink: 0; }
.pack-fan--sm .pack-fan__med { width: 38px; height: 38px; margin-left: -13px; }
.recensions { font-size: 1rem; line-height: 1.7; }

/* Accordéon de page (Présentation de la collection / À propos d'une tradition) */
.page-accordion { border: 1px solid var(--line); border-radius: var(--radius); margin: 1.5rem auto 2rem; max-width: 860px; }
.page-accordion > summary { cursor: pointer; list-style: none; font-family: var(--font-sans); font-size: .78rem;
    letter-spacing: 1.5px; text-transform: uppercase; color: var(--brand-red); padding: 1.05rem 1.4rem; display: flex; align-items: center; }
.page-accordion > summary::-webkit-details-marker { display: none; }
.page-accordion > summary::after { content: "›"; margin-left: auto; font-size: 1.2rem; transition: transform .2s ease; }
.page-accordion[open] > summary::after { transform: rotate(90deg); }
.page-accordion__content { padding: 0 1.4rem; }
.page-accordion__content.prose { max-width: none; margin: 0; }

/* ---------- Documentation : cartes illustrées ---------- */
.doc-intro { max-width: 720px; margin: 0 auto 2.5rem; text-align: center; color: var(--ink-soft); font-size: 1.05rem; }
.doc-grid { display: grid; gap: clamp(1.2rem, 3vw, 2rem); grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); padding-bottom: 3rem; }
.doc-card { background: var(--surface); box-shadow: var(--shadow-soft); border-radius: var(--radius); overflow: hidden;
    display: flex; flex-direction: column; transition: transform .2s ease, box-shadow .2s ease; }
.doc-card:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(26,24,26,.16); text-decoration: none; }
.doc-card__media { position: relative; aspect-ratio: 4 / 3; background-size: cover; background-position: center;
    display: flex; align-items: flex-end; }
.doc-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20,16,16,.72), rgba(20,16,16,.05) 55%); }
.doc-card__title { position: relative; z-index: 1; color: #fff; font-family: var(--font-serif); font-size: 1.15rem;
    padding: 1rem 1.1rem; line-height: 1.15; text-shadow: 0 1px 6px rgba(0,0,0,.4); }
.doc-card__desc { padding: 1rem 1.1rem 1.2rem; font-size: .9rem; color: var(--ink-soft); line-height: 1.6; }

/* ---------- Auteurs : index + fiche ---------- */
.author-grid { display: grid; gap: clamp(1rem, 3vw, 1.8rem); grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); padding-block: 2.5rem; }
.author-card { position: relative; aspect-ratio: 1 / 1; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-soft);
    display: flex; align-items: flex-end; transition: transform .2s ease; }
.author-card:hover { transform: translateY(-3px); text-decoration: none; }
.author-card__img { position: absolute; inset: 0; background-size: cover; background-position: center top;
    filter: grayscale(100%) contrast(1.02); transition: filter .3s ease; }
.author-card:hover .author-card__img { filter: grayscale(0%); }
.author-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20,16,16,.78), rgba(20,16,16,0) 55%); }
.author-card__name { position: relative; z-index: 1; color: #fff; font-family: var(--font-sans); font-weight: 700;
    letter-spacing: 1.5px; text-transform: uppercase; font-size: .85rem; padding: 1rem 1.1rem; text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.author-hero { display: grid; grid-template-columns: minmax(180px, 240px) 1fr; gap: clamp(1.5rem, 5vw, 3rem); padding-block: 3rem; align-items: start; }
.author-hero__photo { width: 100%; border-radius: var(--radius); box-shadow: var(--shadow-soft); }
.author-hero__bio { font-size: 1.08rem; line-height: 1.8; }
.author-hero__bio h1 { margin-top: 0; }
@media (max-width: 680px) { .author-hero { grid-template-columns: 1fr; } .author-hero__photo { max-width: 220px; } }

.section-title { padding-top: 3rem; text-align: center; }
.section-title + .muted { text-align: center; }
.muted { color: var(--ink-soft); }

/* ---------- Fil d'Ariane (breadcrumb) ---------- */
.breadcrumb { padding-top: 1.5rem; font-family: var(--font-sans); font-size: .78rem; color: var(--ink-soft); }
.breadcrumb__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; }
.breadcrumb__item { display: inline-flex; align-items: center; }
.breadcrumb__item + .breadcrumb__item::before { content: "›"; margin: 0 .5em; color: var(--muted); }
.breadcrumb a { color: var(--ink-soft); text-decoration: none; }
.breadcrumb a:hover { color: var(--brand-red); text-decoration: underline; }
.breadcrumb [aria-current="page"] { color: var(--ink); }

/* =========================================================================
   Ajustements MOBILE consolidés (≤760 px puis ≤480 px).
   Complètent les media queries locales ci-dessus ; aucune règle desktop
   n'est modifiée. Objectif : empilement propre, aucun débordement horizontal.
   ========================================================================= */

/* Filet de sécurité global : rien ne doit dépasser horizontalement. */
@media (max-width: 760px) {
    img, svg, video, iframe { max-width: 100%; }

    /* La table garde sa largeur fluide (elle tient dans le viewport) ; on
       resserre seulement le rembourrage des cellules pour gagner de la place. */
    .cart-table { table-layout: fixed; width: 100%; }
    .cart-table th, .cart-table td { padding: .7rem .55rem; word-break: break-word; overflow-wrap: anywhere; }
    /* Cellule pack : éventail aligné en haut, infos qui passent à la ligne sans
       chevaucher l'éventail (le bug d'origine venait du align-items:center +
       largeur de colonne insuffisante). */
    .cart-pack { align-items: flex-start; gap: .55rem; }
    .cart-pack__info { min-width: 0; }
    .cart-pack__books { overflow-wrap: anywhere; }
    /* Pied de panier empilé sur mobile : promo puis actions, pleine largeur. */
    .cart-foot { flex-direction: column; align-items: stretch; gap: .9rem; }
    .cart-foot__promo input[type="text"] { flex: 1 1 auto; }
    .cart-foot__actions .btn { flex: 1 1 auto; text-align: center; }

    /* Modale : le panneau ne doit jamais dépasser la largeur de l'écran. Le
       contenu de la TOC (déjà pre-wrap) casse aussi les très longs mots/URL pour
       éviter qu'un jeton insécable n'élargisse le panneau au-delà du viewport. */
    .modal__panel { max-width: calc(100vw - 1.5rem); min-width: 0; }
    .toc { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
    .recensions { overflow-wrap: anywhere; }

    /* Fiche livre : couverture empilée centrée et de largeur raisonnable (la
       colonne .book-detail__side passe en static <760px via la règle locale). */
    .book-detail__cover > img { max-width: 300px; margin-inline: auto; }

    /* Anti-débordement des gros titres (titres d'œuvres très longs, sans espace). */
    .book-detail__main h1, .author-hero__bio h1, .prose h1, .feature__body h2 {
        overflow-wrap: anywhere;
    }

    /* Footer : colonnes empilées et centrées. */
    .site-footer__inner { flex-direction: column; gap: 2rem; text-align: center; }
}

@media (max-width: 480px) {
    html { font-size: 17.5px; }

    /* Header : nav et actions empilés proprement sous le logo. */
    .site-header__inner { gap: .6rem 1rem; }
    .nav { gap: .35rem .9rem; font-size: .72rem; }

    /* Hero (.feature) : déjà 1 colonne <680px ; on resserre les marges. */
    .feature { padding: 1.3rem; margin: 1rem 0; }

    /* Fiche livre : médaillon plus discret et marges réduites pour ne pas
       chevaucher le titre sur les très petits écrans. */
    .book-detail__main .medaillon { width: 64px; margin: 0 0 .6rem .8rem; }

    /* Ligne d'achat : prix sous le type si la ligne devient trop étroite, et
       le formulaire d'ajout occupe toute la largeur (qty + bouton alignés). */
    .buy-row { gap: .8rem 1rem; }
    .add-to-cart { width: 100%; }
    .add-to-cart .btn { flex: 1 1 auto; padding-inline: 1rem; text-align: center; justify-content: center; }

    /* Pack : sur la fiche, l'éventail passe au-dessus du texte (flex column) ;
       dans le panier, l'éventail compact reste visible mais ne chevauche plus. */
    .pack-mention { gap: .7rem; }
    .pack-mention__txt { flex-basis: 100%; }
    .cart-pack { flex-wrap: wrap; }
    .cart-pack .pack-fan--sm { flex-shrink: 0; }

    /* Modale : panneau plein écran moins une petite marge, scroll vertical. */
    .modal { padding: .75rem; }
    .modal__panel { max-height: 92vh; padding: 2rem 1.2rem; }

    /* Grilles : 2 colonnes garanties même quand auto-fill voudrait n'en mettre
       qu'une (minmax 190/220/250 trop large sous 480px). */
    .grid-books { grid-template-columns: repeat(2, 1fr); gap: 1.3rem; padding-block: 2rem; }
    .doc-grid, .author-grid { grid-template-columns: repeat(2, 1fr); }

    /* Breadcrumb : on évite qu'un titre très long pousse la largeur. */
    .breadcrumb__list { font-size: .74rem; }

    /* Accordéons : padding latéral réduit. */
    .page-accordion > summary { padding: .9rem 1.1rem; }
    .page-accordion__content { padding-inline: 1.1rem; }
}

/* ---- Compléments mobile ≤600px : justification & empilements fins ---- */
@media (max-width: 600px) {
    /* La justification crée de gros trous sur colonne étroite : on repasse à
       gauche pour la prose, la description de fiche et le chapeau. */
    .prose p,
    .book-detail__desc,
    .book-chapeau,
    .pull { text-align: left; }
    .book-detail__desc { hyphens: none; -webkit-hyphens: none; }

    /* Auteur : photo centrée au-dessus de la bio (la grille est déjà 1 col <680px). */
    .author-hero { justify-items: center; text-align: center; }
    .author-hero__photo { margin-inline: auto; }
    .author-hero__bio { text-align: left; width: 100%; }

    /* Ligne d'achat : info + formulaire empilés pleine largeur, sans débordement. */
    .buy-row { flex-direction: column; align-items: stretch; gap: .9rem; }
    .buy-row__info { margin-right: 0; }
    .buy-row__cart { display: none; }

    /* Panier : champs quantité plus étroits + table compacte (l'input a un
       style inline width:4rem ; on le resserre pour éviter le débordement). */
    .cart-table { font-size: .84rem; }
    .cart-table input[type="number"] { width: 3.2rem !important; }
}

/* ---------- Éditoriaux : « Présentation » en lettres datées ---------- */
.home-editorial { padding-block: 1rem 3.5rem; }
.home-editorial--top { padding-top: 1.2rem; padding-bottom: 2.6rem; border-bottom: 1px solid var(--line); }
.home-editorial--top .section-title { padding-top: 1rem; }
/* Mobile : « À la une » + collections remontent au-dessus de la longue
   Présentation (sinon le catalogue est enfoui sous le pli sur téléphone). */
@media (max-width: 760px) {
    .home-flow { display: flex; flex-direction: column; }
    .home-flow .home-catalogue { order: 1; }
    .home-flow .home-editorial--top { order: 2; }
}
.editorials { max-width: 720px; margin: 1.2rem auto 0; }
.editorial { padding-top: 2.4rem; }
.editorial:first-child { padding-top: .4rem; }
.editorial + .editorial { border-top: 1px solid var(--line); }
.editorial__date {
    font-family: var(--font-sans);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .78rem;
    font-weight: 700;
    color: var(--brand-red);
    margin: 0 0 1.05rem;
}
.editorial__body p {
    text-align: justify;
    hyphens: auto;
    line-height: 1.75;
    margin: 0 0 1.05rem;
}
.editorial__body > p:first-of-type::first-letter {
    float: left;
    font-family: var(--font-serif);
    font-size: 3.1rem;
    line-height: .82;
    padding: .35rem .5rem 0 0;
    color: var(--brand-red);
}
.editorial__body ul {
    margin: 1.1rem 0 1.3rem;
    padding-left: 1.4rem;
    list-style: none;
}
.editorial__body li {
    position: relative;
    text-align: justify;
    line-height: 1.65;
    margin-bottom: .6rem;
}
.editorial__body li::before {
    content: "—";
    position: absolute;
    left: -1.4rem;
    color: var(--brand-red);
}
.editorial__body a {
    color: var(--brand-red);
    text-decoration: none;
    border-bottom: 1px solid rgba(139, 26, 44, .3);
}
.editorial__body a:hover { border-bottom-color: var(--brand-red); }

@media (max-width: 600px) {
    .editorial__body p, .editorial__body li { text-align: left; hyphens: none; }
    .editorial__body > p:first-of-type::first-letter { font-size: 2.6rem; }
}

/* ---------- Page Contact (cartes) ---------- */
.contact-hero { text-align: center; max-width: 660px; margin: .5rem auto 2.6rem; }
.contact-hero h1 { margin-bottom: .6rem; }
.contact-hero .lead { color: var(--ink-soft); line-height: 1.7; margin-bottom: 1.4rem; }
.contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
    gap: 1.3rem;
    margin-bottom: 3.5rem;
    align-items: stretch;
}
.contact-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 1.6rem 1.5rem;
}
.contact-card--main { background: var(--cream-2); border-color: var(--brand-red-light); }
.contact-card h2 { margin: 0 0 .8rem; color: var(--brand-red); font-size: 1.25rem; }
.contact-card h3 { margin: 0 0 .7rem; color: var(--brand-red); font-size: 1.02rem; }
.contact-card p { line-height: 1.65; margin: 0 0 .9rem; }
.contact-card .btn { margin-top: auto; align-self: flex-start; }
.contact-addr { font-style: normal; }
.contact-lines a { color: var(--brand-red); text-decoration: none; }
.contact-lines a:hover { text-decoration: underline; }
.contact-social { color: var(--brand-red); text-decoration: none; font-weight: 600; }

/* ---------- Accueil : tuiles « Nos collections » (centrées + visuel) ---------- */
.collection-tiles {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
    margin: 1.6rem auto 1rem;
}
.collection-tile {
    width: 200px;
    text-align: center;
    text-decoration: none;
    color: inherit;
    transition: transform .2s ease;
}
.collection-tile:hover { transform: translateY(-5px); text-decoration: none; }
.collection-tile__cover { display: block; margin-bottom: 1rem; }
.collection-tile__cover img {
    width: 100%;
    height: 240px;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .14));
}
.collection-tile__name {
    display: block;
    font-family: var(--font-serif);
    font-size: 1.18rem;
    color: var(--brand-red);
    margin-bottom: .15rem;
}
.collection-tile__count { display: block; font-size: .82rem; color: var(--ink-soft); }
@media (max-width: 520px) {
    .collection-tiles { gap: 1.4rem; }
    .collection-tile { width: 132px; }
    .collection-tile__cover img { height: 168px; }
}

/* ---------- Accueil : hero + intertitres de section ---------- */
.hero__eyebrow {
    font-family: var(--font-sans);
    text-transform: uppercase;
    letter-spacing: .13em;
    font-size: .76rem;
    font-weight: 700;
    color: var(--brand-red);
    margin: 0 0 .9rem;
    white-space: nowrap;
}
@media (max-width: 480px) { .hero__eyebrow { white-space: normal; letter-spacing: .1em; } }
.hero__lead {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 1.3rem;
    color: var(--ink-soft);
    margin: .5rem auto 1.7rem;
    max-width: 38ch;
    line-height: 1.5;
}
.hero__cta { display: flex; flex-wrap: nowrap; gap: .9rem; justify-content: center; }
.hero__cta .btn { white-space: nowrap; flex: 0 0 auto; }
@media (max-width: 560px) { .hero__cta { flex-wrap: wrap; } .hero__cta .btn { flex: 1 1 auto; white-space: normal; } }
.section-sub {
    text-align: center;
    color: var(--ink-soft);
    font-style: italic;
    margin: -.6rem 0 1.8rem;
}

/* ---------- Éditoriaux en accordéon (lettres datées repliables) ---------- */
.editorials--accordion { margin-top: 1rem; }
.editorial-acc { border-top: 1px solid var(--line); }
.editorial-acc:first-child { border-top: 0; }
.editorial-acc__date {
    cursor: pointer;
    list-style: none;
    font-family: var(--font-sans);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .8rem;
    font-weight: 700;
    color: var(--brand-red);
    padding: 1.15rem .2rem;
    display: flex;
    align-items: center;
    gap: .7rem;
    transition: opacity .15s;
}
.editorial-acc__date:hover { opacity: .72; }
.editorial-acc__date::-webkit-details-marker { display: none; }
.editorial-acc__date::before {
    content: "+";
    font-size: 1.15rem;
    line-height: 1;
    font-weight: 400;
}
.editorial-acc[open] > .editorial-acc__date::before { content: "\2013"; } /* – */
.editorial-acc[open] > .editorial-acc__date { padding-bottom: .4rem; }
.editorial-acc > .editorial__body { padding: 0 .2rem 1.7rem; }

/* ---------- Éditoriaux en onglets (3 dates sur une ligne, une lettre à la fois) ---------- */
.editorial-tabs { margin-top: 1.2rem; }
.editorial-tabs__nav {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--line);
}
.editorial-tab {
    flex: 1 1 0;
    min-width: 0;
    background: none;
    border: 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    font-family: var(--font-sans);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
    font-weight: 700;
    color: var(--ink-soft);
    padding: 1rem .6rem;
    transition: color .15s ease, border-color .15s ease;
}
.editorial-tab:hover { color: var(--brand-red); }
.editorial-tab.is-active { color: var(--brand-red); border-bottom-color: var(--brand-red); }
.editorial-panel { max-width: 720px; margin: 0 auto; padding-top: 1.9rem; }
.editorial-tab:focus { outline: none; }
.editorial-tab:focus-visible { outline: 2px solid var(--brand-red); outline-offset: -3px; }
@media (max-width: 560px) {
    .editorial-tab { flex-basis: 100%; border-bottom: 1px solid var(--line); margin-bottom: 0; }
    .editorial-tab.is-active { border-bottom-color: var(--brand-red); }
    .editorial-tabs__nav { border-bottom: 0; }
}

/* =========================================================================
   Accessibilité & confiance — skip-link, focus visible global, réassurance,
   flash panier, badge stock, CGV checkout, panier responsive en cartes.
   Palette existante uniquement (--brand-red, --cream, --line, --ink…).
   ========================================================================= */

/* ---------- Skip-link (lien d'évitement vers #main) ---------- */
/* Hors écran par défaut, net et visible au focus, en haut à gauche. */
.skip-link {
    position: absolute; top: -100px; left: .75rem; z-index: 1000;
    background: var(--brand-red); color: #fff;
    font-family: var(--font-sans); font-size: .8rem; font-weight: 700;
    letter-spacing: .5px; text-decoration: none;
    padding: .65rem 1.1rem; border-radius: var(--radius);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
    transition: top .15s ease;
}
.skip-link:focus { top: .75rem; outline: 2px solid #fff; outline-offset: 2px; text-decoration: none; }
/* La cible #main ne doit pas afficher d'anneau (elle reçoit le focus par programme). */
#main:focus { outline: none; }

/* ---------- Focus visible global (clavier) ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--brand-red);
    outline-offset: 2px;
}

/* ---------- Réassurance (rangée de 3 items sobres : icône + texte) ---------- */
.reassurance {
    list-style: none; margin: 2.2rem 0; padding: 1.4rem 0;
    border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
    display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch;
    gap: 1.2rem 2.5rem;
    font-family: var(--font-sans);
}
.reassurance__item {
    display: flex; align-items: center; gap: .7rem;
    flex: 1 1 220px; max-width: 320px;
    font-size: .86rem; color: var(--ink-soft); line-height: 1.4;
}
.reassurance__item svg {
    flex-shrink: 0; width: 26px; height: 26px;
    color: var(--brand-red); stroke: currentColor; fill: none;
}
@media (max-width: 640px) {
    .reassurance { flex-direction: column; align-items: center; gap: 1rem; }
    .reassurance__item { flex-basis: auto; max-width: none; justify-content: flex-start; width: 100%; max-width: 340px; }
}

/* ---------- Flash panier (bandeau discret de confirmation, role=status) ---------- */
.cart-flash {
    margin: 0 auto; max-width: var(--maxw);
    background: var(--cream-2); color: var(--brand-red-dark);
    border: 1px solid var(--brand-red-light); border-left: 3px solid var(--brand-red);
    border-radius: var(--radius);
    font-family: var(--font-sans); font-size: .88rem;
    padding: .7rem 1.1rem;
}
.cart-flash a { color: var(--brand-red); font-weight: 700; text-decoration: underline; }
.cart-flash a:hover { color: var(--brand-red-dark); }

/* ---------- Stock : pastille « Épuisé » + bouton désactivé ---------- */
.stock-badge {
    display: inline-block; font-family: var(--font-sans);
    font-size: .66rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
    padding: .18rem .6rem; border-radius: var(--radius-pill); line-height: 1.4;
}
.stock-badge--out { background: var(--brand-red); color: #fff; }
/* Bouton à l'état désactivé (Épuisé) : grisé, non cliquable. */
.btn.is-disabled {
    opacity: .5; pointer-events: none; cursor: default;
    filter: grayscale(60%);
}

/* ---------- Checkout : case à cocher CGV ---------- */
.checkout__cgv {
    display: flex; align-items: flex-start; gap: .65rem;
    margin: 1.1rem 0 .4rem; padding: .85rem 1rem;
    background: var(--cream-2); border: 1px solid var(--line); border-radius: var(--radius-card);
    font-family: var(--font-sans); font-size: .82rem; line-height: 1.6; color: var(--ink-soft);
    cursor: pointer;
}
.checkout__cgv-text { flex: 1 1 auto; }
.checkout__cgv-note { display: inline-block; margin-top: .15rem; font-size: .76rem; opacity: .85; }
.checkout__cgv input[type="checkbox"] {
    flex-shrink: 0; width: 1.05rem; height: 1.05rem; margin-top: .2rem;
    accent-color: var(--brand-red); cursor: pointer;
}
.checkout__cgv a { color: var(--brand-red); text-decoration: underline; }
.checkout__cgv a:hover { color: var(--brand-red-dark); }
/* Widget point relais Mondial Relay (checkout). */
.mr-relay__hint { font-size: .9rem; color: var(--ink-soft); line-height: 1.55; margin: .2rem 0 .7rem; }
#MR_Widget { width: 100%; min-height: 470px; border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; background: var(--surface); }
.mr-relay__selected { font-family: var(--font-serif); color: var(--brand-red); margin-top: .7rem; font-size: .96rem; line-height: 1.4; }
/* Domicile : liste déroulante des transporteurs (le moins cher en tête). */
.home-carriers { margin: .6rem 0 .2rem; padding: .7rem 1rem .8rem; background: var(--cream-2); border: 1px solid var(--line); border-radius: var(--radius-card); }
.home-carriers__title { font-family: var(--font-sans); font-size: .78rem; color: var(--ink-soft); margin: 0 0 .4rem; }
.home-carrier { display: flex; align-items: center; gap: .7rem; padding: .5rem .15rem; border-top: 1px solid var(--line); cursor: pointer; font-family: var(--font-sans); }
.home-carrier:first-child { border-top: 0; }
.home-carrier__name { flex: 1 1 auto; font-size: .95rem; color: var(--ink); }
.home-carrier__best { display: inline-block; margin-left: .35rem; font-size: .6rem; letter-spacing: .8px; text-transform: uppercase; color: var(--brand-red); border: 1px solid var(--brand-red-light); border-radius: 4px; padding: .04rem .35rem; vertical-align: middle; }
.home-carrier__price { flex-shrink: 0; font-weight: 600; color: var(--brand-red); }

/* ---------- Panier responsive : table en cartes empilées (≤560px) ---------- */
@media (max-width: 560px) {
    .cart-table thead {
        position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
    }
    /* Corps : chaque ligne devient une carte empilée (scopé au tbody pour ne pas casser le tfoot). */
    .cart-table, .cart-table tbody, .cart-table tbody tr, .cart-table tbody td { display: block; width: 100%; }
    .cart-table tbody tr {
        margin-bottom: 1rem; padding: .4rem .9rem;
        background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
    }
    .cart-table tbody td {
        display: flex; justify-content: space-between; align-items: center; gap: 1rem;
        text-align: right; padding: .55rem 0; border-bottom: 1px solid var(--line);
    }
    .cart-table tbody tr td:last-child { border-bottom: 0; }
    .cart-table tbody td::before {
        content: attr(data-label);
        font-weight: 700; text-align: left;
        text-transform: uppercase; letter-spacing: 1px; font-size: .68rem; color: var(--ink-soft);
        flex-shrink: 0;
    }
    /* La cellule titre (avec médaillon) reste lisible : contenu poussé à droite du libellé. */
    .cart-table tbody td.cart-title,
    .cart-table tbody td.cart-pack { justify-content: flex-end; }
    /* Pied de tableau (totaux) : lignes label/montant alignées, colspan ignoré proprement. */
    .cart-table tfoot { display: block; }
    .cart-table tfoot tr { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem .9rem; }
    .cart-table tfoot td { padding: .2rem 0; text-align: right; }
    .cart-table tfoot td[colspan] { text-align: left; color: var(--ink-soft); }
}

/* === Cartes video YouTube (transformerLiensYoutube) ============================
   Utilisees dans description_html des livres qui referencent une serie de
   videos YouTube. Grille auto-responsive, miniature 16:9 + bouton play
   en surimpression + titre dessous. */
/* Encart « Vidéos » : un seul cadre regroupant les liens (pas de miniature),
   chaque lien préfixé d'une icône play + suffixé d'un tag « vidéo ». */
.video-encart {
    margin: 1.8rem 0; border: 1px solid var(--brand-red-light); border-radius: var(--radius-card);
    background: var(--cream-2); padding: 1rem 1.3rem 1.1rem; box-shadow: 0 6px 18px rgba(139, 26, 44, .07);
}
.video-encart__head {
    display: flex; align-items: center; gap: .45rem; margin-bottom: .4rem;
    font-family: var(--font-sans); font-size: .72rem; letter-spacing: 1.5px; text-transform: uppercase;
    font-weight: 700; color: var(--brand-red);
}
.video-encart__list { display: flex; flex-direction: column; }
.video-link {
    display: flex; align-items: center; gap: .75rem; padding: .6rem .1rem;
    border-top: 1px solid var(--line); color: var(--ink); text-decoration: none;
    font-family: var(--font-serif); font-size: 1.02rem; line-height: 1.4;
}
.video-link:first-child { border-top: 0; }
.video-link:hover { color: var(--brand-red); text-decoration: none; }
.video-link__icon { flex-shrink: 0; color: var(--brand-red); display: inline-flex; opacity: .92; transition: transform .15s ease; }
.video-link:hover .video-link__icon { transform: scale(1.08); }
.video-link__num { color: var(--brand-red); font-weight: 600; margin-right: .35rem; }
.video-link__title { flex: 1 1 auto; }
.video-link__tag {
    flex-shrink: 0; font-family: var(--font-sans); font-size: .6rem; letter-spacing: 1px; text-transform: uppercase;
    color: var(--ink-soft); border: 1px solid var(--brand-red-light); border-radius: 4px; padding: .12rem .45rem;
}
@media (max-width: 600px) { .video-link__tag { display: none; } .video-link { gap: .6rem; } }

/* === Page Merci — récapitulatif de commande + coordonnées de virement ======== */
.merci__head { text-align: center; }
.merci__back { text-align: center; margin-top: 2rem; }
.order-recap {
    max-width: 560px; margin: 2rem auto 0; background: var(--surface);
    border: 1px solid var(--line); border-radius: var(--radius-card);
    padding: 1.6rem 1.8rem; font-family: var(--font-sans);
}
.order-recap__head { display: flex; justify-content: space-between; align-items: baseline;
    border-bottom: 1px solid var(--line); padding-bottom: .8rem; margin-bottom: .8rem; }
.order-recap__label { text-transform: uppercase; letter-spacing: 1px; font-size: .68rem; color: var(--ink-soft); }
.order-recap__ref { font-family: var(--font-serif); font-size: 1.1rem; color: var(--brand-red); letter-spacing: .5px; }
.order-recap__items { list-style: none; margin: 0 0 .6rem; padding: 0; }
.order-recap__item { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; font-size: .9rem; }
.order-recap__it-qty { color: var(--ink-soft); }
.order-recap__it-sub { flex-shrink: 0; font-weight: 600; }
.order-recap__totals { margin: 0; border-top: 1px solid var(--line); padding-top: .7rem; }
.order-recap__totals > div { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; font-size: .88rem; }
.order-recap__totals dt, .order-recap__totals dd { margin: 0; }
.order-recap__totals .order-recap__discount { color: var(--brand-red); }
.order-recap__totals .order-recap__total { border-top: 1px solid var(--line); margin-top: .35rem;
    padding-top: .6rem; font-weight: 700; font-size: 1.05rem; color: var(--brand-red); }
.order-recap__relay { font-size: .86rem; color: var(--ink-soft); margin: .8rem 0 0; }
.order-recap__bank { margin-top: 1.2rem; background: var(--cream-2);
    border: 1px solid var(--brand-red-light); border-radius: var(--radius); padding: 1.1rem 1.3rem; }
.order-recap--bankonly { max-width: 460px; }
.order-recap--bankonly .order-recap__bank { margin-top: 0; }
.order-recap__bank-title { display: block; text-transform: uppercase; letter-spacing: 1px;
    font-size: .68rem; font-weight: 700; color: var(--brand-red); margin-bottom: .6rem; }
.order-recap__bank dl { margin: 0; }
.order-recap__bank dl > div { display: flex; justify-content: space-between; gap: 1rem; padding: .22rem 0; font-size: .9rem; }
.order-recap__bank dt { color: var(--ink-soft); margin: 0; }
.order-recap__bank dd { margin: 0; font-weight: 600; text-align: right; }
.order-recap__bank-amount { color: var(--brand-red); }
.order-recap__bank-note { font-size: .78rem; color: var(--ink-soft); margin: .6rem 0 0; }

/* === Liens de secours (404 / recherche vide) ================================ */
.error-links { font-family: var(--font-sans); font-size: .92rem; margin: 1.4rem 0; color: var(--ink-soft); }
.error-links a { color: var(--brand-red); }
.search-launchpad { max-width: 620px; margin: 2.5rem auto 0; text-align: center; }
.search-launchpad__title { font-family: var(--font-sans); font-size: .74rem; letter-spacing: 1.5px;
    text-transform: uppercase; color: var(--ink-soft); margin: 0 0 1rem; }
.search-launchpad__links { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }
.search-launchpad__links a { font-family: var(--font-sans); font-size: .86rem; color: var(--brand-red);
    border: 1px solid var(--brand-red-light); border-radius: var(--radius-pill); padding: .45rem 1.1rem; text-decoration: none; }
.search-launchpad__links a:hover { background: var(--brand-red); border-color: var(--brand-red); color: #fff; }

/* === Accroche éditoriale (hero) ============================================ */
.hero__tagline { max-width: 52ch; margin: 1rem auto 0; font-family: var(--font-serif); font-style: italic;
    font-size: 1.15rem; line-height: 1.55; color: var(--ink-soft); }

/* === Page À propos (récit institutionnel) ================================== */
.about-prose { max-width: 720px; margin: 0 auto; }
.about-prose .about-lead { font-size: 1.18rem; line-height: 1.65; color: var(--ink); font-style: italic; }
.about-prose h2 { font-family: var(--font-serif); color: var(--brand-red); font-size: 1.35rem; margin: 2.2rem 0 .6rem; }
.about-prose a { color: var(--brand-red); text-decoration: none; border-bottom: 1px solid transparent; }
.about-prose a:hover { border-bottom-color: var(--brand-red); }

/* === Conférences : présentation du cycle + résumés de séance =============== */
.conf-intro { max-width: 680px; margin: 1.8rem auto 0; text-align: center; color: var(--ink-soft); line-height: 1.7; }
.conf-item__desc { font-family: var(--font-serif); color: var(--ink); line-height: 1.6; margin: .5rem 0 0; }
.conf-item__bio { font-size: .86rem; color: var(--ink-soft); font-style: italic; margin: .35rem 0 0; }

/* === Galerie d'images d'article (ex-diaporamas Cycle2 reconstruits) ========= */
.article-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1.3rem; margin: 1.8rem 0; }
.article-gallery__item { margin: 0; }
.article-gallery__item img { width: 100%; height: auto; margin: 0; display: block; border-radius: var(--radius); box-shadow: var(--shadow-soft); }
.article-gallery__item figcaption { margin-top: .45rem; font-family: var(--font-sans); font-size: .78rem; color: var(--ink-soft); font-style: italic; line-height: 1.4; }

/* === Réseaux sociaux (icônes en rouge Beya) ================================ */
.social-row { display: flex; gap: .7rem; margin-top: .4rem; }
.social-link { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
    border-radius: var(--radius-pill); color: var(--brand-red); border: 1px solid var(--brand-red-light);
    transition: background .15s ease, color .15s ease; }
.social-link:hover { background: var(--brand-red); color: #fff; text-decoration: none; }