/* Polices auto-hébergées (licence SIL OFL) */
@font-face{font-family:"Noto Serif Ethiopic";src:url(/assets/fonts/NotoSerifEthiopic-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Noto Serif Ethiopic";src:url(/assets/fonts/NotoSerifEthiopic-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Noto Serif Ethiopic";src:url(/assets/fonts/NotoSerifEthiopic-Black.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Noto Serif";src:url(/assets/fonts/NotoSerif-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Noto Serif";src:url(/assets/fonts/NotoSerif-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Noto Serif";src:url(/assets/fonts/NotoSerif-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
/* getanehworku.com — feuille de style unique, mobile d'abord.
   Couleurs dérivées de la couverture du livre. */
:root{
  --ardoise-clair:#839BAB; --ardoise:#4D6A83; --nuit:#161D27;
  --rouge:#9A1E1B; --encre:#1E2733; --papier:#FAFBFC; --gris:#5B6774; --filet:#D9DFE5;
  --serif:"Noto Serif Ethiopic","Noto Serif",Georgia,"Times New Roman",serif;
  --mesure:36rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--encre);font-family:var(--serif);font-size:1.0625rem;line-height:1.75}
img{max-width:100%;height:auto;display:block}
a{color:var(--rouge);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--rouge);outline-offset:3px;border-radius:2px}
.passer{position:absolute;left:-999px}
.passer:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:10}

/* Bandeau : le dégradé de la couverture */
.bandeau{background:linear-gradient(180deg,var(--ardoise-clair) 0%,var(--ardoise) 55%,var(--nuit) 100%);color:#fff;padding:1rem 1.25rem 2.75rem}
.barre{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;max-width:60rem;margin:0 auto 2.5rem}
.marque{color:#fff;text-decoration:none;font-weight:700;font-size:1.05rem;letter-spacing:.02em}
.langues{display:flex;gap:.25rem;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.langues button{font:inherit;font-size:.9rem;color:#fff;background:transparent;border:1px solid rgba(255,255,255,.45);border-radius:2px;padding:.2rem .6rem;cursor:pointer;min-height:2.25rem}
.langues button[aria-pressed="true"]{background:#fff;color:var(--nuit);border-color:#fff}
.titre{max-width:60rem;margin:0 auto}
.titre h1{font-size:clamp(2rem,8vw,3.6rem);line-height:1.2;margin:0 0 .9rem;font-weight:800}
.titre .filet{width:5.5rem;height:3px;background:var(--rouge);border:0;margin:0 0 1rem}
.titre p{margin:0;max-width:var(--mesure);color:#E8EEF2;font-size:1.05rem}

/* Contenu */
main{max-width:60rem;margin:0 auto;padding:2.5rem 1.25rem 3rem}
.texte{max-width:var(--mesure)}
.texte p{margin:0 0 1.1rem}
h2{font-size:1.35rem;line-height:1.35;margin:2.5rem 0 1rem;font-weight:700}
.page-livre{display:inline-block;border-left:3px solid var(--rouge);padding:.15rem 0 .15rem .75rem;color:var(--gris);font-size:.95rem;margin:.5rem 0 1.5rem}

/* Lecteur audio : un dos de livre rouge à gauche */
.audio{border-left:6px solid var(--rouge);background:#fff;padding:1.1rem 1.1rem 1.25rem;margin:1.75rem 0;max-width:var(--mesure);box-shadow:0 1px 0 var(--filet)}
.audio p{margin:0 0 .6rem}
.audio .detail{color:var(--gris);font-size:.92rem}
.audio audio{width:100%;margin-top:.4rem}
.attente{border:1px dashed var(--ardoise-clair);padding:1rem 1.1rem;max-width:var(--mesure);color:var(--gris)}

/* Accueil */
.livre{display:grid;gap:2rem;align-items:start}
.livre img{max-width:16rem;box-shadow:0 10px 30px rgba(22,29,39,.25)}
.liste{list-style:none;margin:0;padding:0;max-width:var(--mesure)}
.liste li{border-top:1px solid var(--filet);padding:.85rem 0}
.liste li:last-child{border-bottom:1px solid var(--filet)}
.liste a{text-decoration:none;color:var(--encre);display:block}
.liste a:hover .nom{color:var(--rouge)}
.liste .nom{font-weight:700;display:block}
.liste .ou{color:var(--gris);font-size:.92rem}
.lien-externe{display:inline-block;margin-top:.5rem}

footer{border-top:1px solid var(--filet);color:var(--gris);font-size:.9rem;padding:1.5rem 1.25rem 2.5rem}
footer div{max-width:60rem;margin:0 auto}
footer p{margin:.3rem 0}


/* ===================== ACCUEIL ===================== */
.accueil main{max-width:none;padding:0}
.accueil .entete{position:relative;z-index:3;padding:.75rem 1rem;background:#1F3444}
.accueil .entete .langues button{font-size:.8rem;padding:.15rem .5rem;min-height:2rem}
.accueil .entete .barre{margin:0 auto}
/* La couverture qui s'ouvre sur l'écran */
.ouverture{position:relative;display:flex;justify-content:center;background:linear-gradient(180deg,#2D495D 0%,#39566A 25%,#274255 50%,#0D2232 75%,#0C141A 100%)}
.couv{position:relative;width:min(100%,calc(100svh*.7957));aspect-ratio:2067/2598;container-type:inline-size;background:url(/assets/img/portrait-couverture-900.jpg) center/cover no-repeat}
@media (min-width:40rem){.couv{background-image:url(/assets/img/portrait-couverture-1600.jpg)}}
@media (min-width:48rem) and (min-aspect-ratio:1/1){
  .couv{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%)}
}
.couv-texte{position:absolute;left:0;right:0;top:8cqw;text-align:center;padding:0 6cqw}
.couv-texte h1{margin:0;color:#fff;font-weight:900;font-size:10.4cqw;line-height:1.15;white-space:nowrap;text-shadow:0 .2cqw 1.6cqw rgba(13,25,35,.35)}
.couv-texte .nom{display:block;margin-top:1.6cqw;color:#1B2530;font-weight:900;font-size:6.6cqw;line-height:1.1;text-shadow:none}
.couv-texte .filet-rouge{width:42cqw;height:.55cqw;min-height:2px;background:var(--rouge);margin:3.6cqw auto 0;border:0}
.couv-texte .sous{margin:3.2cqw auto 0;max-width:70cqw;color:#1B2530;font-size:3.3cqw;line-height:1.45}

/* Quatre portraits datés (4e de couverture) */
.ages{background:#6F8798 url(/assets/img/texture-ardoise.jpg) center/cover;padding:3rem 1.25rem 0;color:#fff;overflow:hidden}
.ages-in{max-width:66rem;margin:0 auto}
.ages h2{margin:0 0 .4rem;font-size:clamp(1.4rem,4.5vw,2.1rem);font-weight:900}
.ages p{margin:0 0 1.75rem;max-width:var(--mesure);color:#EEF3F6}
.ages figure{margin:0;position:relative}
.ages img{width:100%;height:auto}
.annees{display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:.55rem 0 .9rem;list-style:none;background:rgba(13,25,35,.55);text-align:center;font-family:"Noto Serif",serif;letter-spacing:.06em;font-size:clamp(.85rem,2.6vw,1.05rem)}

/* Le livre : le rouge du dos */
.livre-rouge{background:var(--rouge);color:#fff;padding:3.5rem 1.25rem}
.livre-in{max-width:60rem;margin:0 auto;display:grid;gap:2.25rem;align-items:start}
.livre-rouge img{width:min(15rem,60vw);box-shadow:0 18px 40px rgba(0,0,0,.35)}
.livre-rouge h2{margin:0;font-size:clamp(2rem,7vw,2.8rem);font-weight:900;line-height:1.15}
.livre-rouge .sous-titre{display:inline-block;margin:.5rem 0 1.4rem;padding-bottom:.35rem;border-bottom:1px solid rgba(255,255,255,.85);font-weight:700;font-size:1.25rem}
.livre-rouge p{max-width:var(--mesure);margin:0 0 1rem;color:#FBEDEC}
.livre-rouge a{color:#fff}
.bouton{display:inline-block;margin-top:.75rem;padding:.7rem 1.3rem;border:1.5px solid #fff;color:#fff;text-decoration:none;font-weight:700;border-radius:2px}
.bouton:hover{background:#fff;color:var(--rouge)}
.bouton[aria-disabled="true"]{opacity:.75;cursor:default}
.bouton[aria-disabled="true"]:hover{background:transparent;color:#fff}
.note-achat{font-size:.9rem;color:#F4D9D7!important;margin-top:.6rem!important}

/* Sa voix */
.voix{padding:3.5rem 1.25rem;background:var(--papier)}
.voix-in{max-width:60rem;margin:0 auto;display:grid;gap:2rem;align-items:center}
.voix img{width:100%;max-width:26rem;filter:saturate(.9)}
.voix h2{margin:0 0 .8rem;font-size:clamp(1.6rem,5vw,2.2rem);font-weight:900}
.voix .audio{margin:1.2rem 0 .4rem}

/* Chapitres */
.chapitres{padding:3.5rem 1.25rem;background:#fff;border-top:1px solid var(--filet)}
.chapitres-in{max-width:60rem;margin:0 auto}
.chapitres h2{margin:0 0 .4rem;font-size:clamp(1.6rem,5vw,2.2rem);font-weight:900}
.chapitres .chapeau{margin:0 0 1.8rem;color:var(--gris);max-width:var(--mesure)}
.liste-ch{list-style:none;margin:0;padding:0}
.liste-ch li{break-inside:avoid;display:grid;grid-template-columns:3rem 1fr;gap:.25rem 1rem;padding:1rem 0;border-top:1px solid var(--filet)}
.liste-ch .num{color:var(--rouge);font-weight:900;font-size:1.35rem;line-height:1.3}
.liste-ch .am{font-weight:700;font-size:1.12rem;line-height:1.4;display:block}
.liste-ch .tr{display:block;color:var(--gris);font-size:.95rem}
@media (min-width:48rem){.liste-ch{column-count:2;column-gap:3rem}}

/* Archives */
.archives{padding:3.5rem 1.25rem 4rem;background:var(--papier)}
.archives-in{max-width:60rem;margin:0 auto}
.archives h2{margin:0 0 1.5rem;font-size:clamp(1.6rem,5vw,2.2rem);font-weight:900}
@media (min-width:48rem){.archives .liste{display:grid;grid-template-columns:1fr 1fr;column-gap:3rem;max-width:none}.archives .liste li:nth-last-child(2){border-bottom:1px solid var(--filet)}}

.pied-nuit{background:var(--nuit);color:#C9D3DB;border-top:4px solid var(--rouge)}
.pied-nuit a{color:#fff}

@media (min-width:48rem){
  .accueil .entete{position:absolute;inset:0 0 auto 0;padding:1.1rem 2rem;background:linear-gradient(180deg,rgba(13,25,35,.55),rgba(13,25,35,0))}
  .accueil .entete .langues button{font-size:.9rem;padding:.2rem .6rem;min-height:2.25rem}
  .couv-texte{top:10.5cqw}
  .livre-in{grid-template-columns:15rem 1fr;gap:3.5rem}
  .voix-in{grid-template-columns:1fr 1.1fr;gap:3.5rem}
  .ages{padding-top:4rem}
}

[hidden]{display:none!important}
@media (min-width:48rem){
  body{font-size:1.125rem}
  .bandeau{padding:1.25rem 2rem 3.5rem}
  main{padding:3rem 2rem 4rem}
  .livre{grid-template-columns:16rem 1fr;gap:3rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
