/* Entre les pages — styles généraux
   Bordeaux profond, papier ivoire, doré discret.
   Rose poudré pour New Romance, vert forêt pour Romantasy. */

:root{
  --wine:#451f2c;
  --wine-deep:#36172a;
  --wine-ink:#2a1219;
  --ink:#23171d;
  --paper:#f5eddf;
  --paper-2:#ece1cd;
  --sheet:#fffcf5;
  --gold:#c7ab75;
  --gold-soft:#dcc59a;
  --gold-ink:#7a5a26;
  --rose:#c38d94;
  --rose-soft:#efd9d8;
  --forest:#263f36;
  --sage:#dde3d6;
  --on-wine:#f5eadf;
  --on-wine-muted:#d9c4c0;
  --on-paper-muted:#665450;
  --rule-wine:rgba(199,171,117,.24);
  --rule-paper:rgba(69,31,44,.16);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:clamp(16px,5vw,56px);
  --ease:cubic-bezier(.22,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:16px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wine);color:var(--on-wine);font:400 16px/1.65 var(--sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
svg{display:inline-block;width:1em;height:1em;flex-shrink:0}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0;text-wrap:balance}
p{margin:0}
em{font-style:italic}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.paper :focus-visible,.panel :focus-visible{outline-color:var(--wine)}
.symbols{position:absolute;width:0;height:0;overflow:hidden}
.wrap{width:min(1200px,calc(100% - 2 * var(--gutter)));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:0;left:12px;transform:translateY(-120%);z-index:100;background:var(--paper);color:var(--ink);padding:12px 16px;font-weight:600}
.skip-link:focus{transform:translateY(12px)}

/* Texte commun */
.eyebrow{font:600 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.paper .eyebrow,.panel .eyebrow{color:var(--gold-ink)}
h2{font-size:clamp(36px,4.4vw,58px);line-height:1.04;letter-spacing:-.01em}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px 64px;margin-bottom:48px}
.section-aside{max-width:400px;font-size:16px;color:var(--on-paper-muted)}

/* Bandeau et en-tête */
.announcement{display:block;margin:0;background:var(--wine-ink);color:var(--on-wine-muted);text-align:center;font-size:13px;letter-spacing:.04em;padding:9px 16px}
.announcement span{color:var(--gold);margin:0 6px}
.header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:88px;border-bottom:1px solid var(--rule-wine)}
.brand{font:500 32px/1 var(--serif);letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
.brand span{font-style:italic;color:var(--gold)}
.brand .brand-dot{font-style:normal;margin-left:1px}
.nav{display:flex;gap:32px}
.nav a{font-size:15px;text-decoration:none;color:var(--on-wine-muted);padding:10px 0;position:relative;transition:color .2s}
.nav a::after{content:'';position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav a:hover{color:var(--on-wine)}
.nav a:hover::after{transform:scaleX(1)}
.saved-toggle{display:flex;align-items:center;gap:10px;border:1px solid var(--rule-wine);background:none;min-height:44px;padding:0 14px;font-size:15px;transition:border-color .2s,background .2s}
.saved-toggle:hover{border-color:var(--gold);background:rgba(255,255,255,.04)}
.saved-toggle svg{width:18px;height:18px;color:var(--gold)}
.saved-count{min-width:24px;height:24px;padding:0 6px;display:grid;place-items:center;background:rgba(199,171,117,.18);font-size:13px;font-weight:600}

/* Boutons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:52px;padding:0 24px;border:1px solid transparent;font:600 15px/1.2 var(--sans);text-decoration:none;transition:background .2s,border-color .2s,transform .15s}
.button svg{width:20px;height:20px;transition:transform .25s var(--ease)}
.button:hover svg{transform:translateX(4px)}
.button:active{transform:translateY(1px)}
.button-gold{background:var(--gold);color:var(--wine-ink)}
.button-gold:hover{background:var(--gold-soft)}
.button-wine{background:var(--wine);color:var(--paper)}
.button-wine:hover{background:#5b2a3b}
.link-quiet{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:500;color:var(--on-wine);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:6px;text-decoration-thickness:1px;transition:text-underline-offset .2s}
.link-quiet:hover{text-underline-offset:9px}

/* B. Les univers */
.paper{background:var(--paper);color:var(--ink)}
.collections{padding:104px 0 112px}
.volumes{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.volume{display:flex;flex-direction:column;border-top:1px solid var(--rule-paper);padding-top:24px}
.volume-cover{position:relative;display:grid;place-items:center;aspect-ratio:1/1.02;border:0;padding:0;text-decoration:none;overflow:hidden;cursor:pointer}
.volume-dark .volume-cover{background:#e6d8cf}
.volume-new .volume-cover{background:var(--rose-soft)}
.volume-fantasy .volume-cover{background:var(--sage)}
.volume-cover::before{content:'';position:absolute;inset:auto -20% -40% auto;width:80%;aspect-ratio:1;border:1px solid rgba(255,255,255,.55);border-radius:50%}
.mini-book{position:relative;width:52%;aspect-ratio:.7;display:flex;flex-direction:column;align-items:center;text-align:center;padding:9% 8% 8%;border-radius:2px 4px 4px 2px;transform:rotate(-5deg);box-shadow:4px 5px 0 -1px #f4ecdf,6px 7px 0 -1px #9b8466,14px 20px 26px rgba(39,22,30,.28);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.mini-book{container-type:inline-size}
.mini-book::before{content:'';position:absolute;inset:6% 7% 6% 11%;border:1px solid currentColor;opacity:.4;pointer-events:none}
.volume-cover:hover .mini-book,.volume-cover:focus-visible .mini-book{transform:rotate(-1deg) translateY(-8px);box-shadow:4px 5px 0 -1px #f4ecdf,6px 7px 0 -1px #9b8466,18px 30px 34px rgba(39,22,30,.3)}
.volume-dark .mini-book{background:linear-gradient(90deg,#26101a,#6a3448 6%,#46202f 10%,#4f2436);color:var(--gold)}
.volume-new .mini-book{background:linear-gradient(90deg,#b67885,#e2b2b8 6%,#d49ba4 10%,#d7a0a8);color:#4b1f2b}
.volume-fantasy .mini-book{background:linear-gradient(90deg,#14231e,#46604f 6%,#2a4638 10%,#2c4a3b);color:#d6c58f}
.mini-kicker{font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.mini-title{font:500 clamp(26px,2.6vw,36px)/.95 var(--serif);font-size:clamp(18px,21cqi,40px);margin-top:14%}
.mini-book svg{width:42%;height:30%;margin:8% 0 4%}
.mini-foot{margin-top:auto;font:italic 14px var(--serif)}
.volume-body{display:flex;flex-direction:column;flex:1;padding-top:24px}
.volume-status{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--on-paper-muted);margin-bottom:14px}
.volume-status .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(199,171,117,.25)}
.volume-new .dot{background:var(--rose)}
.volume-fantasy .dot{background:#5e7d67}
.volume h3{font-size:36px;line-height:1.05}
.volume-mood{font:italic 21px/1.3 var(--serif);color:#6b3a48;margin:6px 0 14px}
.volume-new .volume-mood{color:#8c4a5a}
.volume-fantasy .volume-mood{color:var(--forest)}
.volume-body>p:not(.volume-status):not(.volume-mood){color:var(--on-paper-muted);font-size:16px}
.volume-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:auto;padding-top:24px}
.envie{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;border:0;background:none;color:var(--wine);font-size:15px;font-weight:500}
.envie svg{width:20px;height:20px;transition:transform .2s}
.envie:hover svg{transform:scale(1.12)}
.envie[aria-pressed="true"] svg{fill:currentColor}

/* C. Les dessins */
.drawings{background:var(--wine-deep);padding:104px 0 96px}
.drawings .section-aside{color:var(--on-wine-muted)}
.prototype-banner{max-width:760px;border-left:2px solid var(--gold);padding:4px 0 4px 20px;margin:-16px 0 48px;color:var(--on-wine-muted);font-size:15px}
.prototype-banner strong{color:var(--on-wine);font-weight:600}
.sheets{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 64px;max-width:1080px}
.sheet{display:block;width:100%;border:0;padding:0;background:none;text-align:left;cursor:zoom-in}
.sheet-paper{display:block;background:var(--sheet);padding:5.5%;box-shadow:0 1px 0 #e9dfcd,0 2px 0 #d8cbb4,0 24px 40px rgba(18,6,12,.38);transform:rotate(var(--tilt,0deg));transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.sheets li:nth-child(1){--tilt:-.7deg}
.sheets li:nth-child(2){--tilt:.6deg}
.sheets li:nth-child(3){--tilt:.5deg}
.sheets li:nth-child(4){--tilt:-.5deg}
.sheet-paper img{width:100%;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
.sheet:hover .sheet-paper,.sheet:focus-visible .sheet-paper{transform:rotate(0) translateY(-6px);box-shadow:0 1px 0 #e9dfcd,0 2px 0 #d8cbb4,0 34px 52px rgba(18,6,12,.45)}
.sheet-caption{display:flex;align-items:baseline;gap:14px;margin-top:20px;color:var(--on-wine)}
.sheet-num{font:600 13px var(--sans);letter-spacing:.12em;color:var(--gold)}
.sheet-title{font:italic 24px/1.2 var(--serif)}
.sheet-caption svg{margin-left:auto;width:20px;height:20px;color:var(--gold);opacity:.6;transition:opacity .2s;align-self:center}
.sheet:hover .sheet-caption svg{opacity:1}
.sheets-note{text-align:center;color:var(--on-wine-muted);font-size:15px;margin-top:48px}

/* D. L'atelier */
.atelier{padding:104px 0}
.atelier-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}
.atelier-emblem{position:relative;aspect-ratio:.82;max-width:380px;width:100%;justify-self:center;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#957044}
.atelier-emblem::before{content:'';position:absolute;inset:0;border:1px solid rgba(149,112,68,.45);border-radius:999px 999px 2px 2px}
.atelier-emblem::after{content:'';position:absolute;inset:12px;border:1px solid rgba(149,112,68,.2);border-radius:999px 999px 2px 2px}
.atelier-emblem svg{width:44%;height:44%}
.atelier-emblem span{font:italic 21px var(--serif);margin-top:18px;color:#7a5a2e}
.atelier-copy h2{margin-bottom:24px}
.atelier-copy>p:not(.eyebrow){color:var(--on-paper-muted);font-size:17px;max-width:560px;margin-bottom:16px}
.steps{list-style:none;padding:0;margin:36px 0 0;border-top:1px solid var(--rule-paper)}
.steps li{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:18px 0;border-bottom:1px solid var(--rule-paper);color:var(--on-paper-muted);font-size:16px}
.steps span{font:600 13px/1.9 var(--sans);letter-spacing:.12em;color:var(--gold-ink)}
.steps b{display:block;font:500 22px/1.3 var(--serif);color:var(--ink);margin-bottom:2px}

/* E. FAQ */
.faq{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;padding-top:104px;padding-bottom:104px}
.faq-intro h2{margin-bottom:16px}
.faq-intro>p:not(.eyebrow){color:var(--on-wine-muted);max-width:300px}
.faq-list{border-top:1px solid var(--rule-wine)}
.faq details{border-bottom:1px solid var(--rule-wine)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font:500 23px/1.3 var(--serif);color:var(--on-wine)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font:300 28px/1 var(--sans);color:var(--gold);transition:transform .25s var(--ease);flex-shrink:0}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--gold-soft)}
.faq details p{color:var(--on-wine-muted);max-width:640px;padding:0 0 24px}

/* F. Fin de page */
.closing{background:var(--wine-ink);text-align:center;padding:88px var(--gutter) 96px}
.closing>svg{width:56px;height:70px;color:var(--gold);margin-bottom:16px}
.closing h2{font-size:clamp(40px,5vw,64px);margin-bottom:36px}
.closing h2 em{color:var(--gold)}
.closing-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 32px}
.footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-top:36px;padding-bottom:40px}
.footer .brand{font-size:26px}
.footer p{font:italic 19px var(--serif);color:var(--on-wine-muted)}
.footer small{width:100%;font-size:13px;color:var(--on-wine-muted);border-top:1px solid var(--rule-wine);padding-top:20px}

/* Fenêtres */
body.modal-open{overflow:hidden}
dialog{border:0;padding:0;color:var(--ink)}
dialog::backdrop{background:rgba(22,9,14,.82)}
.close-dialog{width:48px;height:48px;display:grid;place-items:center;border:1px solid currentColor;background:none;font:300 30px/1 var(--sans);opacity:.85;transition:opacity .2s,background .2s}
.close-dialog:hover{opacity:1;background:rgba(127,127,127,.12)}

/* Lecteur */
.reader{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;background:#1f0f16;color:var(--on-wine)}
.reader[open]{display:grid;grid-template-rows:auto 1fr auto}
.reader-bar{display:flex;justify-content:space-between;align-items:center;padding:16px var(--gutter)}
.reader-count{font:600 13px var(--sans);letter-spacing:.14em;color:var(--gold)}
.reader-stage{display:grid;grid-template-columns:64px 1fr 64px;align-items:center;gap:16px;padding:0 var(--gutter);min-height:0;touch-action:pan-y}
.reader-sheet{--size:min(calc(100dvh - 250px),calc(100vw - 2 * var(--gutter) - 160px),1000px);margin:0;justify-self:center;align-self:center;width:var(--size);height:var(--size);background:var(--sheet);padding:clamp(12px,2vw,24px);box-shadow:0 30px 70px rgba(0,0,0,.5);transition:opacity .22s ease,transform .22s ease}
.reader-sheet img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.reader-sheet.is-leaving{opacity:0;transform:translateX(calc(var(--dir,1) * -24px))}
.reader-sheet.is-entering{opacity:0;transform:translateX(calc(var(--dir,1) * 24px));transition:none}
.reader-arrow{width:56px;height:56px;display:grid;place-items:center;border:1px solid var(--rule-wine);background:none;color:var(--gold);transition:background .2s,border-color .2s}
.reader-arrow svg{width:24px;height:24px}
.reader-arrow.prev svg{transform:scaleX(-1)}
.reader-arrow:hover:not(:disabled){border-color:var(--gold);background:rgba(199,171,117,.1)}
.reader-arrow:disabled{opacity:.3;cursor:default}
.reader-caption{text-align:center;padding:20px var(--gutter) 28px}
.reader-caption h2{font:italic 500 30px/1.2 var(--serif)}
.reader-caption p{color:var(--on-wine-muted);max-width:560px;margin:6px auto 0}
.reader-caption .reader-note{font-size:13px;margin-top:10px;color:#bfa7a6}

/* Panneaux (univers, envies) */
.panel{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;background:var(--paper);padding:32px;box-shadow:0 30px 90px rgba(0,0,0,.45)}
.panel-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:8px}
.panel-top .eyebrow{margin:12px 0 0}
.panel .close-dialog{color:var(--wine)}
.panel h2{font-size:40px}
.universe-art{width:96px;height:120px;margin:8px 0 16px}
.universe-new .universe-art{color:#a35b6b}
.universe-fantasy .universe-art{color:var(--forest)}
.universe-mood{font:italic 22px var(--serif);color:#6b3a48;margin:6px 0 16px}
.universe-fantasy .universe-mood{color:var(--forest)}
#universe-content p{color:var(--on-paper-muted)}
.universe-note{border-left:2px solid var(--gold);padding-left:16px;margin:20px 0 24px;font-size:15px}
.panel-actions{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.link-paper{display:inline-flex;align-items:center;min-height:44px;color:var(--wine);font-weight:500;text-decoration:underline;text-underline-offset:5px}
.favorite-row{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--rule-paper);padding:18px 0}
.favorite-row h3{font-size:28px}
.favorite-row p{font-size:14px;color:var(--on-paper-muted)}
.favorite-row button{min-height:44px;border:0;background:none;color:var(--wine);text-decoration:underline;text-underline-offset:4px;font-size:15px}
.empty-favorites{color:var(--on-paper-muted);margin:16px 0 24px}
.storage-note{font-size:13px;color:var(--on-paper-muted);margin-top:24px}

.toast{position:fixed;left:50%;bottom:24px;z-index:50;transform:translate(-50%,16px);opacity:0;pointer-events:none;background:var(--paper);color:var(--wine);border:1px solid var(--gold);padding:12px 20px;font-size:15px;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:opacity .2s,transform .2s;max-width:calc(100% - 32px);text-align:center}
.toast.visible{opacity:1;transform:translate(-50%,0)}

/* Tablette */
@media (max-width:1100px){
  .volumes{gap:28px}
  .volume h3{font-size:32px}
  .sheets{gap:44px 40px}
  .atelier-grid{gap:48px}
  .faq{gap:48px}
}
@media (max-width:900px){
  .nav{gap:22px}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px}
  .volumes{grid-template-columns:1fr;gap:56px;max-width:560px;margin-inline:auto}
  .volume-cover{aspect-ratio:1.5}
  .mini-book{width:34%}
  .atelier-grid{grid-template-columns:1fr}
  .atelier-emblem{max-width:240px}
  .faq{grid-template-columns:1fr;gap:24px}
}

/* Mobile */
@media (max-width:700px){
  body{font-size:16px}
  .announcement{font-size:12px}
  .header{flex-wrap:wrap;min-height:0;padding-top:16px;gap:4px 16px}
  .brand{font-size:28px}
  .saved-toggle .saved-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .nav{order:3;width:100%;gap:18px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter)}
  .nav::-webkit-scrollbar{display:none}
  .nav a{white-space:nowrap;padding:12px 0;font-size:14px}
  .collections,.drawings,.atelier{padding:72px 0}
  .faq{padding-top:72px;padding-bottom:72px}
  .section-head{margin-bottom:32px}
  .volume-cover{aspect-ratio:1.25}
  .mini-book{width:46%}
  .mini-kicker{letter-spacing:.06em}
  .volume-actions .button{width:100%}
  .prototype-banner{margin:-8px 0 32px}
  .sheets{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--gutter));padding:8px var(--gutter) 24px;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
  .sheets li{flex:0 0 82%;scroll-snap-align:center}
  .sheet-paper{transform:none}
  .sheet-title{font-size:21px}
  .sheets-note{margin-top:20px}
  .steps b{font-size:20px}
  .faq summary{font-size:21px;padding:20px 0}
  .closing{padding:72px var(--gutter) 80px}
  .footer{flex-direction:column;align-items:flex-start}
  .reader[open]{grid-template-rows:auto auto auto;align-content:start;overflow-y:auto}
  .reader-bar{padding:12px var(--gutter)}
  .reader-stage{grid-template-columns:1fr 1fr;grid-template-areas:"sheet sheet" "prev next";row-gap:16px;padding:0 12px}
  .reader-sheet{--size:min(calc(100vw - 24px),calc(100dvh - 300px));grid-area:sheet;padding:10px}
  .reader-arrow.prev{grid-area:prev;justify-self:start}
  .reader-arrow.next{grid-area:next;justify-self:end}
  .reader-caption{padding:8px var(--gutter) 32px}
  .reader-caption h2{font-size:24px}
  .reader-caption p:not(.reader-note){font-size:15px}
  .panel{padding:24px 20px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:0s!important;animation:none!important}
}

/* ---------- Boutique : affichage selon l'ouverture de la vente ---------- */
html:not([data-vente="ouverte"]) .si-ouverte{display:none!important}
html[data-vente="ouverte"] .si-fermee{display:none!important}
.announcement a{color:var(--gold-soft);text-underline-offset:4px;display:inline-block;padding:4px 0}
.announcement .sep{color:var(--gold);margin:0 6px}
.hero-offer{margin-top:28px;padding-top:20px;border-top:1px solid var(--rule-wine);font-size:15px;color:var(--on-wine-muted);max-width:460px}
.hero-offer b{color:var(--gold);font-weight:600}
.hero-offer a{color:var(--on-wine);text-decoration-color:var(--gold);text-underline-offset:5px}
.dot-live{background:#4f8a5d!important;box-shadow:0 0 0 3px rgba(79,138,93,.22)!important}

.shop{background:var(--paper-2);color:var(--ink);padding:104px 0;border-bottom:1px solid var(--rule-paper)}
.shop :focus-visible{outline-color:var(--wine)}
.shop .eyebrow{color:var(--gold-ink)}
.shop-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}
.shop-visual{position:relative;display:grid;place-items:center;aspect-ratio:1;max-width:480px;width:100%;justify-self:center;background:radial-gradient(circle at 50% 55%,#f6efe2 0 45%,transparent 46%)}
.shop-sheets{position:absolute;width:46%;aspect-ratio:.7;transform:translate(14%,2%) rotate(6deg);background:var(--sheet);box-shadow:3px 3px 0 #e2d6c1,6px 6px 0 #d4c5ab,0 20px 30px rgba(39,22,30,.18)}
.mini-book.shop-book{width:46%;background:linear-gradient(90deg,#26101a,#6a3448 6%,#46202f 10%,#4f2436);color:var(--gold);transform:rotate(-4deg)}
.shop-book .mini-title{font-size:clamp(28px,17cqi,48px)}
.shop-tag{position:absolute;top:18%;right:14%;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--wine);color:var(--gold-soft);font:600 13px var(--sans);letter-spacing:.14em;transform:rotate(10deg);box-shadow:0 8px 18px rgba(39,22,30,.25)}
.shop-copy h2{margin-bottom:20px}
.shop-copy h2 em{color:#6b3a48}
.shop-price{display:flex;align-items:baseline;gap:12px;margin-bottom:28px}
.shop-price .amount{font:500 52px/1 var(--serif);color:var(--wine)}
.shop-price .unit{font-size:15px;color:var(--on-paper-muted)}
.shop-facts{margin:0 0 32px;border-top:1px solid var(--rule-paper)}
.shop-facts>div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--rule-paper)}
.shop-facts>div[hidden]{display:none}
.shop-facts dt{font:600 12px/1.9 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink)}
.shop-facts dd{margin:0;color:var(--ink)}
.button-buy{min-height:58px;padding:0 32px;font-size:16px}
.button-buy[aria-busy="true"]{opacity:.75;cursor:progress}
.shop-message{min-height:1.5em;margin-top:12px;color:#8a2e3c;font-weight:500}
.shop-legal{font-size:13px;line-height:1.6;color:var(--on-paper-muted);max-width:520px}
.shop-legal a,.shop-soon a:not(.button){color:var(--wine);text-underline-offset:3px}
.shop-soon{border-left:2px solid var(--gold);padding-left:20px}
.shop-soon p{color:var(--on-paper-muted);max-width:480px;margin-bottom:8px}
.soon-badge{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--wine)!important}
.soon-badge .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(199,171,117,.25)}

.footer-links{display:flex;flex-wrap:wrap;gap:4px 24px;width:100%}
.footer-links a{font-size:14px;color:var(--on-wine-muted);text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
.footer-links a:hover{color:var(--on-wine)}

@media (max-width:900px){
  .shop-grid{grid-template-columns:1fr;gap:32px}
  .shop-visual{max-width:340px}
}
@media (max-width:700px){
  .shop{padding:72px 0}
  .shop-facts>div{grid-template-columns:1fr;gap:2px}
  .button-buy{width:100%}
  .shop-price .amount{font-size:44px}
}

/* ---------- Pages simples : merci, CGV, mentions, confidentialité ---------- */
.simple-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:88px;border-bottom:1px solid var(--rule-wine)}
.simple-header a.back{font-size:15px;color:var(--on-wine-muted);text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
.doc{background:var(--paper);color:var(--ink);padding:72px 0 96px}
.doc .wrap{max-width:760px}
.doc h1{font-size:clamp(40px,5vw,60px);line-height:1.05;margin-bottom:12px}
.doc .doc-intro{color:var(--on-paper-muted);margin-bottom:40px}
.doc h2{font-size:30px;margin:44px 0 12px}
.doc p,.doc li{color:#3d2e30;margin-bottom:12px}
.doc ul{padding-left:20px}
.doc a{color:var(--wine);text-underline-offset:3px}
.todo{background:#fbe7b6;color:#5a3d00;padding:1px 6px;font-weight:600;border-radius:2px}
.doc-warning{border:1px solid #d9b25c;background:#fdf3dc;padding:16px 20px;margin-bottom:32px;font-size:15px}
.thanks{min-height:calc(100svh - 200px);display:grid;place-items:center;padding:72px 0}
.thanks-card{width:min(640px,calc(100% - 2 * var(--gutter)));background:var(--paper);color:var(--ink);padding:clamp(28px,5vw,56px);box-shadow:0 30px 70px rgba(18,6,12,.35);text-align:center}
.thanks-card svg.emblem{width:56px;height:70px;color:#957044;margin-bottom:12px}
.thanks-card h1{font-size:clamp(36px,5vw,52px);line-height:1.05;margin-bottom:16px}
.thanks-card p{color:var(--on-paper-muted);margin:0 auto 14px;max-width:480px}
.thanks-card .button{margin:12px 0 20px}
.thanks-card .small{font-size:14px}
.thanks-card a:not(.button){color:var(--wine);text-underline-offset:3px}
.thanks-tips{text-align:left;border-top:1px solid var(--rule-paper);margin-top:24px;padding-top:20px;font-size:15px}
.thanks-tips li{color:var(--on-paper-muted);margin-bottom:6px}
a.shop-visual{text-decoration:none}
a.shop-visual .shop-book{transition:transform .45s var(--ease)}
a.shop-visual:hover .shop-book,a.shop-visual:focus-visible .shop-book{transform:rotate(-1deg) translateY(-8px)}
.shop-more{margin:4px 0 8px}
.soon-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:16px}
@media (max-width:700px){.soon-actions .button{width:100%}}
/* Petites couvertures : on garde le titre lisible, la mention de collection disparaît */
@container (max-width:150px){.mini-kicker{display:none}.mini-title{margin-top:18%}}
.cap::first-letter{text-transform:uppercase}
.cap{display:inline-block}

/* Couverture illustrée sur les petits livres (format carré) */
.mini-book.cover-img{aspect-ratio:1;padding:0;overflow:hidden;background:#3a1622;border-radius:1px 4px 4px 1px}
.mini-book.cover-img::before{content:'';position:absolute;inset:0;z-index:1;border:0;opacity:1;background:linear-gradient(90deg,rgba(0,0,0,.4),rgba(255,255,255,.16) 3%,rgba(0,0,0,.1) 6%,transparent 10%)}
.mini-book.cover-img img{display:block;width:100%;height:100%;object-fit:cover}
.volume-dark .mini-book.cover-img{width:66%}
.mini-book.shop-book.cover-img{width:58%}
@media (max-width:900px){.volume-dark .mini-book.cover-img{width:46%}}
@media (max-width:700px){.volume-dark .mini-book.cover-img{width:58%}}
.shop-visual .shop-tag{top:6%;right:4%}
/* Couverture illustrée du Volume II */
.volume-new .mini-book.cover-img{width:66%}
@media (max-width:900px){.volume-new .mini-book.cover-img{width:46%}}
@media (max-width:700px){.volume-new .mini-book.cover-img{width:58%}}

/* Page de paiement */
.page-paiement{background:var(--wine)}
.pay{background:var(--paper);color:var(--ink);padding:40px 0 96px}
.pay :focus-visible{outline-color:var(--wine)}
.pay .eyebrow{color:var(--gold-ink)}
.pay-steps{list-style:none;display:flex;flex-wrap:wrap;gap:8px 28px;margin:0 0 40px;padding:0 0 24px;border-bottom:1px solid var(--rule-paper);font-size:14px;color:var(--on-paper-muted)}
.pay-steps li{display:flex;align-items:center;gap:10px}
.pay-steps span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--rule-paper);font-weight:600;font-size:13px}
.pay-steps .fait span{background:var(--paper-2)}
.pay-steps [aria-current] {color:var(--ink);font-weight:600}
.pay-steps [aria-current] span{background:var(--wine);border-color:var(--wine);color:var(--paper)}
.pay-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:start}
.pay-recap{position:sticky;top:24px}
.pay-item{display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--rule-paper)}
.pay-cover{display:block;aspect-ratio:1;overflow:hidden;background:#3a1622;box-shadow:3px 4px 0 -1px #f4ecdf,4px 5px 0 -1px #9b8466,0 12px 24px rgba(39,22,30,.18)}
.pay-cover img{display:block;width:100%;height:100%;object-fit:cover}
.pay-cover-vide{background:linear-gradient(90deg,#14231e,#46604f 6%,#2a4638 10%,#2c4a3b)}
.pay-cover-vide img{display:none}
.pay-item h1{font-size:clamp(32px,4vw,44px);line-height:1}
.pay-volume{font:italic 19px/1.3 var(--serif);color:#6b3a48;margin:6px 0 4px}
.pay-format{font-size:14px;color:var(--on-paper-muted);margin:0}
.pay-total{margin:0;padding:16px 0;border-bottom:1px solid var(--rule-paper)}
.pay-total div{display:flex;justify-content:space-between;gap:16px;padding:6px 0;font-size:15px;color:var(--on-paper-muted)}
.pay-total dt,.pay-total dd{margin:0}
.pay-total dd{text-align:right}
.pay-total .pay-total-ligne{padding-top:12px;color:var(--ink)}
.pay-total .pay-total-ligne dt{font-weight:600}
.pay-total .pay-total-ligne dd{font:500 32px/1 var(--serif);color:var(--wine)}
.pay-inclus{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:16px}
.pay-inclus li{display:grid;grid-template-columns:28px 1fr;gap:12px;font-size:15px;color:var(--on-paper-muted)}
.pay-inclus svg{width:24px;height:24px;color:var(--gold-ink)}
.pay-inclus b{display:block;color:var(--ink);font-weight:600}
.pay-form h2{font-size:36px;line-height:1.1;margin-bottom:8px}
.pay-legal{font-size:14px;color:var(--on-paper-muted);margin-bottom:20px;max-width:560px}
.pay-legal a,.pay-erreur a{color:var(--wine);text-underline-offset:3px}
.pay-sheet{background:#fff;border:1px solid var(--rule-paper);box-shadow:0 18px 40px rgba(39,22,30,.12);padding:clamp(8px,2vw,20px);min-height:420px}
.pay-attente{display:grid;place-items:center;align-content:center;gap:16px;min-height:380px;color:var(--on-paper-muted);font-size:15px;text-align:center}
.pay-attente p{margin:0}
.pay-accord{display:grid;gap:20px;padding:24px;font-size:15px;line-height:1.6;color:var(--on-paper-muted)}
.pay-accord[hidden]{display:none}
.pay-accord label{display:flex;align-items:flex-start;gap:12px;cursor:pointer}
.pay-accord input{width:20px;height:20px;flex:0 0 20px;margin-top:3px;accent-color:var(--wine)}
.pay-accord a{text-decoration:underline;text-underline-offset:3px}
.pay-accord button{justify-self:start}
.pay-spinner{width:32px;height:32px;border-radius:50%;border:3px solid var(--rule-paper);border-top-color:var(--wine);animation:pay-tourne 0.9s linear infinite}
@keyframes pay-tourne{to{transform:rotate(360deg)}}
.pay-erreur{padding:40px clamp(8px,3vw,32px);text-align:center}
.pay-erreur h3{font-size:30px;margin-bottom:10px}
.pay-erreur p{color:var(--on-paper-muted);max-width:440px;margin:0 auto 20px}
.pay-erreur-actions{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:center;align-items:center}
@media (max-width:900px){
  .pay{padding:28px 0 72px}
  .pay-grid{grid-template-columns:1fr;gap:32px}
  .pay-recap{position:static}
  .pay-inclus{display:none}
}
@media (max-width:520px){
  .pay-steps{gap:8px 16px;font-size:13px}
  .pay-item{grid-template-columns:84px 1fr;gap:16px}
  .pay-sheet{padding:4px;border-left:0;border-right:0;margin-inline:calc(-1 * var(--gutter))}
}
@media (prefers-reduced-motion:reduce){.pay-spinner{animation:none}}
/* Le texte réglementaire doit être présenté dans un encadré lisible, y compris à l'impression. */
.legal-guarantee { border: 2px solid currentColor; padding: clamp(16px, 4vw, 32px); margin: 24px 0; }
.doc h3 { margin-top: 28px; }
#confirmation-lien { text-decoration: underline; text-underline-offset: .2em; }
@media print {
  .simple-header, .footer, .skip-link { display: none !important; }
  .doc { padding: 0 !important; }
  .doc .wrap { width: 100%; max-width: none; }
  .legal-guarantee { box-decoration-break: clone; }
}

/* Filigrane visuel des extraits uniquement. Les images et PDF restent inchangés. */
.sheet-paper,.reader-sheet,.thumb:has(> img[src*="assets/dessins/"]){position:relative}
.sheet-paper::after,.reader-sheet::after,.stage-page::after,
.book-page-right::after,.thumb:has(> img[src*="assets/dessins/"])::after{
  content:"";position:absolute;inset:6%;z-index:2;
  background:url("assets/filigrane-apercu.svg") center/100% 100% no-repeat;
  pointer-events:none;
}
.book-page-right::after{inset:17% 12% 23%}
.stage-page .stage-zoom{z-index:3}