/* Éditions Vélin Bleu — feuille de style commune du site lecteurs (v3, 1/11/2026).
   Mêmes jetons que /liens/ v3 (fond nuit dégradé, cartes blanches, Fraunces + Manrope auto-hébergées).
   Aucune ressource externe. Les règles d'affichage liées au JavaScript restent dans chaque page. */
:root { --nuit:#0B2F6B; --abysse:#061a3d; --bleu:#3F86DC; --ciel:#9CC3F0; --pale:#DCEAFB; --blanc:#fff; --encre:#0B2F6B;
  --texte-carte:#1a2433; --gris-carte:#4a5a75; --lien-carte:#1f5fbf; --voile:rgba(255,255,255,.08); --filet:rgba(156,195,240,.45);
  --bleu-fonce:#0B2F6B; --bleu-clair:#9CC3F0; --creme:#F2F7FE; --texte:#1a2433; --gris:#4a5a75;
  --ombre:0 14px 34px rgba(0,0,0,.35); --rayon:18px; }
* { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; background:var(--abysse); }
body { font-family:Manrope, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--pale); line-height:1.65; min-height:100vh; display:flex; flex-direction:column;
  background:radial-gradient(120% 60rem at 50% 0%, #1a4a95 0%, rgba(26,74,149,0) 70%), linear-gradient(180deg, var(--nuit) 0%, #08265a 50rem, var(--abysse) 100%); overflow-x:hidden; }
a { color:var(--blanc); text-decoration-thickness:1px; text-underline-offset:3px; }
a:hover { color:var(--pale); }
a:focus-visible { outline:3px solid var(--ciel); outline-offset:3px; border-radius:6px; }
strong, b { color:var(--blanc); font-weight:600; }
em { font-style:italic; }
img { max-width:100%; }

/* ---------- En-tête commun : logo rond + « Éditions Vélin Bleu » ---------- */
.vb-tete { padding:1.1rem 1.25rem .4rem; text-align:center; }
.vb-marque { display:inline-flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--blanc); padding:.3rem .9rem .3rem .3rem; border-radius:999px; background:var(--voile); border:1px solid rgba(156,195,240,.3); transition:background .15s; }
.vb-marque:hover { background:rgba(255,255,255,.14); color:var(--blanc); }
.vb-marque img { display:block; width:40px; height:40px; border-radius:50%; box-shadow:0 0 0 2px rgba(255,255,255,.9), 0 4px 12px rgba(0,0,0,.3); }
.vb-marque span { font-family:Fraunces, Georgia, serif; font-weight:600; font-size:1.06rem; letter-spacing:.01em; line-height:1.1; }

/* ---------- Mise en page ---------- */
main { flex:1; width:100%; max-width:40rem; margin:0 auto; padding:1.6rem 1.25rem 3rem; }
h1, h2, h3 { font-family:Fraunces, Georgia, serif; font-weight:600; color:var(--blanc); line-height:1.18; overflow-wrap:normal; word-break:normal; hyphens:manual; -webkit-hyphens:manual; }
h1 { font-size:clamp(1.85rem, 7.6vw, 2.6rem); line-height:1.12; letter-spacing:-.01em; margin-bottom:.7rem; }
h2 { font-size:1.42rem; margin:2.5rem 0 .75rem; }
p + p { margin-top:.8rem; }
ul, ol { margin:.7rem 0 0 1.25rem; } li + li { margin-top:.5rem; }
li::marker { color:var(--ciel); }
.surtitre { font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ciel); font-weight:600; margin-bottom:.55rem; }
.centre { text-align:center; }
.sous-titre { color:var(--pale); font-size:1.06rem; }
.note { font-size:.92rem; color:var(--ciel); }
.petit { font-size:.88rem; color:var(--ciel); margin-top:.9rem; }
.rgpd { margin-top:.8rem; font-size:.85rem; color:var(--ciel); text-align:center; line-height:1.5; }
.cta { margin:1.6rem 0 0; }

/* ---------- Boutons : sur le fond nuit, l'action principale est blanche ---------- */
.btn { display:block; width:100%; text-align:center; padding:1rem 1.25rem; border-radius:14px; font-weight:600; font-size:1.1rem; line-height:1.3; text-decoration:none;
  background:var(--blanc); color:var(--encre); box-shadow:var(--ombre); overflow-wrap:normal; word-break:normal; transition:transform .15s, background .15s, box-shadow .15s; }
.btn:hover, .btn:focus-visible { background:var(--pale); color:var(--encre); transform:translateY(-1px); }
.btn:focus-visible { outline:3px solid var(--ciel); outline-offset:3px; }
.btn.second { background:var(--voile); color:var(--blanc); border:1px solid var(--filet); box-shadow:none; }
.btn.second:hover, .btn.second:focus-visible { background:rgba(255,255,255,.16); color:var(--blanc); }
.btn + .btn { margin-top:.75rem; }

/* ---------- Cartes blanches ---------- */
.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte {
  background:var(--blanc); color:var(--texte-carte); border-radius:var(--rayon); box-shadow:var(--ombre); }
.encadre { padding:1.3rem 1.25rem; margin-top:1.75rem; }
.encadre h2, .feuille h2, .inscription h2, .aide h2, .vb-carte h2 { color:var(--encre); }
.encadre h2 { margin-top:0; }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) :is(h3, strong, b) { color:var(--encre); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) a:not(.btn) { color:var(--lien-carte); font-weight:600; }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) a:not(.btn):hover { color:var(--encre); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) :is(.note, .petit, .rgpd, .formats) { color:var(--gris-carte); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .surtitre { color:var(--bleu); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) li::marker { color:var(--bleu); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .btn { background:var(--nuit); color:var(--blanc); box-shadow:0 8px 18px rgba(11,47,107,.3); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .btn:hover,
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .btn:focus-visible { background:var(--bleu); color:var(--blanc); }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .btn.second { background:var(--blanc); color:var(--encre); border:2px solid var(--nuit); box-shadow:none; }
:is(.encadre, .feuille, .livres .livre, .carte-livre, .inscription, .aide, .vb-carte) .btn.second:hover { background:#EAF2FD; color:var(--encre); }
/* Texte long (confidentialité, Club) : une seule feuille claire, lisible */
.feuille { padding:1.5rem 1.3rem 1.7rem; margin-top:1.6rem; line-height:1.7; }
.feuille > h2:first-child, .feuille > :first-child { margin-top:0; }
.feuille h2 { font-size:1.28rem; margin:2rem 0 .6rem; padding-top:1.6rem; border-top:1px solid #e3ecf8; }
.feuille > h2:first-child { padding-top:0; border-top:0; }
.feuille p, .feuille li, .feuille address { color:#2b3648; }
.feuille .encadre { background:#F2F7FE; border:1px solid #cfe0f6; box-shadow:none; }

/* ---------- Couvertures ---------- */
.couverture { width:min(52vw, 220px); margin:1.6rem auto; }
.couverture img { display:block; width:100%; height:auto; border-radius:6px; box-shadow:0 18px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.08); }
.encadre .couverture img { box-shadow:0 12px 28px rgba(11,47,107,.35); }

/* ---------- Bandeau « tête de page » commun (surtitre + titre + chapô) ---------- */
.vb-hero { text-align:center; padding-top:.6rem; }
.vb-hero .sous-titre { max-width:34rem; margin-left:auto; margin-right:auto; }

/* ---------- Accueil ---------- */
.serie-vedette { display:flex; flex-direction:column; align-items:center; text-align:center; }
.serie-vedette .couv-serie { display:block; width:118px; height:auto; aspect-ratio:480/768; border-radius:7px; box-shadow:0 10px 24px rgba(11,47,107,.35); margin-bottom:1rem; }
.serie-vedette .corps { width:100%; }
.serie-vedette .corps > p:not(.surtitre):not(.note) { text-align:left; color:#2b3648; }
.livres { margin-top:2.8rem; }
.livres > h2, #titre-livres { margin-top:0; text-align:center; }
.livres > .note { text-align:center; }
.livres .livre { display:flex; gap:1rem; align-items:flex-start; padding:.85rem; margin-top:.9rem; }
.livres .livre img { flex:0 0 auto; width:104px; height:auto; aspect-ratio:440/704; border-radius:6px; box-shadow:0 6px 16px rgba(11,47,107,.3); }
.livres .livre img.dos { aspect-ratio:440/660; }
.livres .livre .infos { flex:1; min-width:0; display:flex; flex-direction:column; }
.livres .livre .surtitre { font-size:.66rem; letter-spacing:.14em; margin:.1rem 0 .2rem; }
.livres .livre h3 { font-size:1.12rem; line-height:1.22; margin:0 0 .2rem; }
.livres .livre .note { font-size:.85rem; }
.livres .livre .btn { font-size:.95rem; padding:.65rem .8rem; margin-top:.7rem; border-radius:10px; background:var(--nuit); color:var(--blanc); border:0; box-shadow:0 6px 14px rgba(11,47,107,.28); }
.livres .livre .btn:hover { background:var(--bleu); color:var(--blanc); }
.formats { margin-top:.5rem; font-size:.8rem; line-height:1.45; }
.livres .formats a { color:var(--encre); }
.lien-auteur { display:block; text-align:center; margin:1.2rem auto 0; max-width:26rem; font-weight:600; text-decoration:none; padding:.75rem 1rem; border-radius:999px; background:var(--voile); border:1px solid var(--filet); }
.lien-auteur:hover { background:rgba(255,255,255,.15); color:var(--blanc); }
.serie-titre { font-size:1.42rem; margin-top:2.6rem; text-align:center; }
.serie-titre + .note { text-align:center; margin-top:.3rem; }
@media (max-width:380px) { .livres .livre img { width:84px; } }

/* ---------- Avis ---------- */
#livre .encadre { text-align:center; padding-top:1.4rem; }
#livre .couverture { width:min(46vw, 180px); margin:.2rem auto 1.1rem; }
#livre .petit, #tous-livres .petit { line-height:1.6; }
.encadre .cta { margin-top:1.2rem; }
#tous > h2 { text-align:center; }
#tous-livres .encadre { text-align:center; }
#aide { margin-top:.6rem; }
.attente { color:var(--encre); font-weight:500; }
p.encadre.attente { color:var(--encre); }

/* ---------- Pages de confirmation ---------- */
.etapes { counter-reset:e; list-style:none; margin:.6rem 0 0; }
.etapes li { counter-increment:e; position:relative; padding:.5rem 0 .5rem 2.7rem; }
.etapes li + li { margin-top:.2rem; }
.etapes li::before { content:counter(e); position:absolute; left:0; top:.48rem; width:1.85rem; height:1.85rem; border-radius:50%; background:var(--nuit); color:var(--blanc); font-weight:600; text-align:center; line-height:1.85rem; font-size:.92rem; }
main > ul, main > ol:not(.etapes) { color:var(--pale); }

/* ---------- Confidentialité ---------- */
.updated { font-size:.88rem; color:var(--ciel); }
address { font-style:normal; margin-bottom:.65rem; }
.feuille p, .feuille li { margin-bottom:.6rem; }
.feuille p + p { margin-top:0; }
.feuille ol, .feuille ul { margin:.5rem 0 .8rem 1.25rem; }

/* ---------- Nouvelle offerte (lien personnel /n/…) ---------- */
.boutons { display:grid; gap:.9rem; }
.btn small { display:block; font-weight:500; font-size:.82rem; opacity:.8; margin-top:.15rem; }
.aide { margin-top:2rem; padding:1.2rem 1.25rem; font-size:.95rem; }
.aide h2 { font-size:1.15rem; margin:0 0 .55rem; }
.aide ul { margin-left:1.1rem; display:grid; gap:.5rem; }
.aide li + li { margin-top:0; }
.url { margin-top:.45rem; padding:.6rem .75rem; background:#F2F7FE; border:1px dashed #9CC3F0; border-radius:8px; font-family:ui-monospace, Menlo, Consolas, monospace; font-size:.84rem; color:var(--encre); word-break:break-all; user-select:all; -webkit-user-select:all; }
.auteur { text-align:center; color:var(--ciel); margin-bottom:1.6rem; }

/* ---------- Styles de chemise et typographies mono (non usati in queste pagine) ---------- */
.mono { font-family:"Courier Prime", "Courier New", ui-monospace, monospace; letter-spacing:.04em; }
.bande { text-align:center; margin:.6rem auto 0; }
.bande { font-family:Oswald, "Arial Narrow", sans-serif; font-weight:600; letter-spacing:.28em; font-size:.74rem; text-transform:uppercase; color:var(--ciel); padding:.3rem 1rem; }
.hero { padding:1.2rem 1.25rem 1rem; text-align:center; }
.hero-in { max-width:40rem; margin:0 auto; }
.hero .etiquette { display:inline-block; color:#E7C877; font-size:.8rem; border:1px solid rgba(216,178,90,.6); padding:.22rem .7rem; border-radius:999px; margin-bottom:1rem; }
.hero h1 { color:var(--blanc); }
.chapo { font-size:1.04rem; color:var(--pale); max-width:34rem; margin-left:auto; margin-right:auto; }
.chapo + .chapo { margin-top:.6rem; }
.visuel { display:flex; align-items:flex-end; justify-content:center; gap:1rem; margin-top:1.8rem; }
.visuel .couv-dossier { flex:none; width:112px; height:auto; aspect-ratio:440/660; border-radius:6px; box-shadow:0 16px 36px rgba(0,0,0,.5); transform:rotate(-3deg); }
.chemise { position:relative; margin:1.8rem auto 0; width:min(78vw, 300px); aspect-ratio:4/3; text-align:left; }
.visuel .chemise { margin:0; width:min(52vw, 230px); }
.chemise .dos { position:absolute; inset:0 0 auto 0; height:22%; width:46%; background:#b8955f; border-radius:8px 8px 0 0; }
.chemise .face { position:absolute; inset:12% 0 0 0; background:#C9A878; border-radius:3px 8px 8px 8px; box-shadow:0 18px 40px rgba(0,0,0,.45); padding:1rem; color:#3a2c17; overflow:hidden; }
.chemise .face::after { content:""; position:absolute; top:0; bottom:0; right:16%; width:9px; background:#2a2a2a; opacity:.85; }
.chemise .ligne { font-size:.74rem; border-bottom:1px solid rgba(58,44,23,.35); padding:.2rem 0; width:72%; }
.chemise .num { font-family:Oswald, "Arial Narrow", sans-serif; font-weight:600; font-size:clamp(1.5rem, 7vw, 2.1rem); line-height:1; margin:.7rem 0 .2rem; color:#2b2112; }
.visuel .chemise .num { font-size:clamp(1.15rem, 5.4vw, 1.6rem); }
.visuel .chemise .ligne { font-size:.62rem; }
.tampon { position:absolute; right:20%; bottom:16%; transform:rotate(-11deg); color:#B3262E; border:3px solid #B3262E; border-radius:4px; padding:.15rem .5rem; font-family:"Courier Prime", monospace; font-size:.9rem; letter-spacing:.14em; opacity:.9; background:rgba(244,238,226,.12); }
.visuel .tampon { font-size:.7rem; border-width:2px; }
ul.contenu { list-style:none; margin:.6rem 0 0; }
ul.contenu li { position:relative; padding:.85rem 0 .85rem 2.3rem; border-bottom:1px dashed rgba(156,195,240,.3); margin:0; }
ul.contenu li::before { content:""; position:absolute; left:.2rem; top:1.1rem; width:1.15rem; height:1.15rem; border:2px solid var(--ciel); border-radius:3px; }
.inscription { margin-top:2.4rem; padding:1.4rem 1.25rem 1.3rem; scroll-margin-top:1rem; }
.inscription h2 { margin-top:0; }
.inscription .mono { font-size:.78rem; color:var(--bleu); margin-bottom:.35rem; }
.inscription p:not(.mono):not(.statut):not(.rgpd) { color:#2b3648; }
.inscription .rgpd { text-align:left; }
.statut { display:flex; align-items:center; gap:.6rem; font-weight:600; color:var(--encre); font-size:1.06rem; margin:.4rem 0 .6rem; }
.statut::before { content:""; flex:none; width:.7rem; height:.7rem; border-radius:50%; background:#D8B25A; box-shadow:0 0 0 4px rgba(216,178,90,.25); }
.inscription .btn { margin-top:1rem; }
.btn.dl { margin-top:1.2rem; }
.btn.dl + .btn.dl { background:var(--voile); color:var(--blanc); border:1px solid var(--filet); box-shadow:none; }
.btn.dl + .btn.dl:hover { background:rgba(255,255,255,.16); }
.retard { margin-top:1rem; background:var(--voile); border:1px solid rgba(156,195,240,.3); border-left:3px solid var(--ciel); border-radius:10px; padding:.7rem .9rem; font-size:.95rem; color:var(--pale); }
.carte-livre { margin-top:2.6rem; display:grid; grid-template-columns:96px 1fr; gap:1rem; align-items:center; padding:1rem; }
.carte-livre img { display:block; width:96px; height:auto; aspect-ratio:440/660; border-radius:5px; box-shadow:0 8px 20px rgba(11,47,107,.35); }
.carte-livre .mono { font-size:.74rem; color:var(--bleu); }
.carte-livre h3 { font-size:1.14rem; line-height:1.2; margin:.2rem 0 .35rem; }
.carte-livre p { font-size:.88rem; color:#3b4d6b; }
main.m-dossier > .note { color:var(--ciel); margin-top:1rem; }

/* ---------- Pied de page commun ---------- */
footer { text-align:center; padding:1.4rem 1.25rem 1.8rem; font-size:.82rem; color:var(--ciel); border-top:1px solid rgba(156,195,240,.18); }
footer a { color:var(--blanc); } footer a:hover { color:var(--ciel); }
footer p + p { margin-top:.35rem; }

/* ---------- Ordinateur ---------- */
@media (min-width:760px) {
  main { padding-top:2.4rem; }
  .vb-tete { padding-top:1.6rem; }
  h2 { font-size:1.55rem; }
  .serie-vedette { display:grid; grid-template-columns:150px 1fr; gap:1.5rem; align-items:start; text-align:left; padding:1.5rem; }
  .serie-vedette .couv-serie { width:150px; margin:0; }
  main.m-large { max-width:60rem; }
  main.m-large > .vb-hero, main.m-large > .encadre, main.m-large > .petit { max-width:40rem; margin-left:auto; margin-right:auto; }
  .livres { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:1.1rem; align-items:stretch; }
  .livres > :not(.livre) { grid-column:1 / -1; }
  .livres .livre { margin-top:1.1rem; }
  .livres .livre img { width:120px; }
  .livres > .note + .livre:last-child { grid-column:1 / -1; width:100%; max-width:calc(50% - .55rem); justify-self:center; }
  .hero-2col { display:grid; grid-template-columns:220px 1fr; column-gap:2.2rem; align-items:center; text-align:left; }
  .hero-2col > .couverture { grid-column:1; grid-row:1 / span 5; width:220px; margin:0; }
  .hero-2col > :not(.couverture) { grid-column:2; }
  .hero-2col .centre { text-align:left; }
  .hero-2col .rgpd { text-align:left; }
  main.m-hero2 { max-width:46rem; }
  .feuille { padding:2rem 2.2rem 2.2rem; }
  #tous-livres { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:0 1.1rem; }
  .carte-livre { grid-template-columns:120px 1fr; }
  .carte-livre img { width:120px; }
  .visuel .couv-dossier { width:140px; }
  .visuel .chemise { width:260px; }
  .hero { padding-top:1.8rem; }
}
@media (prefers-reduced-motion:reduce) { * { transition:none !important; } }
/* compléments v3 */
.encadre h1, .vb-carte h1 { color:var(--encre); }
.btn.dl + .btn.dl { margin-top:.75rem; } .dl-titre { margin-top:1.4rem; } .dl-titre + .btn.dl { margin-top:.6rem; }
main.m-404 { display:flex; flex-direction:column; justify-content:center; max-width:30rem; }
main.m-404 .encadre { padding:2rem 1.5rem; }
main.m-404 .cta { margin-top:1.4rem; }
.duo .btn + .btn { margin-top:0; }
.feuille .encadre h2 { padding-top:0; border-top:0; }
.feuille .encadre > h2:first-child { margin-top:0; }
.visuel .chemise .face { padding:.75rem .8rem; }
.visuel .tampon { right:22%; bottom:7%; font-size:.6rem; padding:.1rem .35rem; letter-spacing:.1em; }
.aide + *, .encadre + p, .encadre + .petit { margin-top:1.25rem; }
.btn.dl + p, .btn.dl + .note, .btn.dl + .petit { margin-top:.9rem; }

/* Viste italiane libro/sito e accessibilità. */
.vista-libro {display:none;}
.dal-libro .vista-libro {display:block;}
.dal-libro .vista-sito {display:none;}
:focus-visible {outline:3px solid #73c4ff;outline-offset:4px;}
