/* =====================================================================================
   « La nuit de hafla » · ليلة الحفل — feuille unique du site mshahat.islam365.fr
   Nuit émeraude, lumière dorée portée, calligraphie Aref Ruqaa, ondes sonores en SVG.
   Voir design/DIRECTION.md. Aucun flou, aucune ombre portée de carte, aucun conteneur défilant.
   ===================================================================================== */
:root{
  --nuit:#030d0a; --nuit-2:#061711; --nuit-3:#0a2219; --emer:#0d3a2e; --emer-2:#14513f;
  --or:#d9b26f; --or-2:#f3d595; --or-3:#a8843f; --ivoire:#efe6d2; --gris:#a9b8aa; --gris-2:#8c9a8e; --eteint:#6f7f72;
  --filet:rgba(217,178,111,.28); --filet-2:rgba(217,178,111,.13);
  --q-haute:#9fdcb9; --q-moy:#f0cf86; --q-basse:#f0a99b;
  --lat:"Jost",system-ui,"Segoe UI",sans-serif; --serif:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --ruqaa:"Aref Ruqaa","Noto Naskh Arabic",serif; --naskh:"Noto Naskh Arabic","Segoe UI",Tahoma,serif;
  --max:1240px; --marge:clamp(1.1rem,4.5vw,4rem);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:auto;scroll-padding-top:4.6rem;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nuit);color:var(--ivoire);font:400 clamp(1rem,.35vw + .92rem,1.08rem)/1.68 var(--lat);
  font-feature-settings:"kern" 1;text-rendering:optimizeLegibility;overflow-wrap:break-word}
html.a-lecteur body{padding-bottom:5.6rem}
a{color:var(--or-2);text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:rgba(243,213,149,.45)}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--or-2);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;margin:0;letter-spacing:.005em}
b,strong{font-weight:500;color:#fff8e8}
[lang="ar"],.ar{font-family:var(--naskh);direction:rtl;unicode-bidi:isolate}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--marge)}
.lisible{max-width:70ch}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--nuit-3);padding:.5rem 1rem}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rub{font:500 .72rem/1.2 var(--lat);letter-spacing:.24em;text-transform:uppercase;color:var(--or)}
main{display:block}

/* ---------------------------------------------------------------- en-tête */
.site-head{position:sticky;top:0;z-index:50;background:var(--nuit);border-bottom:1px solid var(--filet-2)}
.site-head .wrap{display:flex;align-items:center;gap:.5rem 1.4rem;min-height:3.9rem;position:relative;max-width:none}
.brand{display:flex;align-items:baseline;gap:.9rem;text-decoration:none;margin-right:auto;min-width:0}
.brand [lang="ar"]{font:700 1.5rem/1 var(--ruqaa);color:var(--or-2)}
.brand .lat{font:400 .7rem/1.2 var(--lat);letter-spacing:.22em;text-transform:uppercase;color:var(--gris);white-space:nowrap}
.menu ul{list-style:none;margin:0;padding:0;display:flex;gap:.2rem 1.5rem;flex-wrap:wrap}
.menu a{display:inline-flex;align-items:center;min-height:2.6rem;text-decoration:none;font:400 .74rem/1 var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--gris);white-space:nowrap;border-bottom:1px solid transparent}
.menu a:hover{color:var(--ivoire)}
.menu a[aria-current="page"]{color:var(--or-2);border-bottom-color:var(--or)}
.menu a.audio-lien{color:var(--or-2)}
.menu a small{display:none}
.menu-toggle{display:none;align-items:center;gap:.6rem;font:400 .74rem var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--ivoire);background:none;border:1px solid var(--filet);min-height:2.6rem;padding:0 1rem;cursor:pointer}
.menu-toggle .bars3{display:inline-grid;gap:4px}.menu-toggle .bars3 i{display:block;width:18px;height:1px;background:var(--or-2)}
@media (max-width:1080px){
  .menu-toggle{display:inline-flex}
  .menu{position:absolute;left:0;right:0;top:100%;background:var(--nuit);border-bottom:1px solid var(--filet);padding:.6rem var(--marge) 1.2rem}
  .js .menu{display:none}.js .site-head.open .menu{display:block}
  .menu ul{flex-direction:column;gap:0}
  .menu a{display:flex;width:100%;min-height:3rem;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--filet-2);font-size:.8rem}
  .menu a small{display:inline;font:400 1.15rem var(--naskh);letter-spacing:0;text-transform:none;color:var(--or)}
  html:not(.js) .site-head .wrap{flex-wrap:wrap}
  html:not(.js) .menu{position:static;flex-basis:100%;border:0;padding:0 0 .6rem}
  html:not(.js) .menu ul{flex-direction:row;flex-wrap:wrap;gap:0 1.2rem}
  html:not(.js) .menu a{width:auto;border:0}
  html:not(.js) .menu a small{display:none}
  html:not(.js) .menu-toggle{display:none}
}
@media (max-width:460px){.brand .lat{display:none}.menu-toggle .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}

/* ---------------------------------------------------------------- ondes (fil conducteur) */
.onde-filet{display:block;width:100%;height:28px;color:var(--or)}
.onde-filet path{fill:currentColor;opacity:.55}
main > section.bloc + section.bloc::before{content:"";display:block;height:22px;margin:0 var(--marge) clamp(2.5rem,6vw,4.5rem);
  background:var(--onde) center/100% 100% no-repeat;opacity:.5}

/* ---------------------------------------------------------------- accueil : la scène */
.scene{position:relative;overflow:hidden;padding:0 var(--marge) clamp(2.5rem,6vw,4rem);isolation:isolate}
.scene::before{content:"";position:absolute;z-index:-1;inset:-12% -10% 0 22%;pointer-events:none;
  background:radial-gradient(ellipse 34% 62% at 64% 0%,rgba(243,213,149,.2),rgba(217,178,111,.055) 48%,transparent 72%)}
.scene::after{content:"";position:absolute;z-index:-1;left:-10%;right:-10%;bottom:0;height:46%;pointer-events:none;
  background:radial-gradient(ellipse 55% 60% at 62% 100%,rgba(13,58,46,.85),transparent 72%)}
.scene .geste{font:700 clamp(4.4rem,19.5vw,18.5rem)/1.04 var(--ruqaa);color:var(--or-2);text-align:right;margin:clamp(.5rem,3vh,2.4rem) calc(var(--marge) * -.6) 0 0;
  text-shadow:0 0 120px rgba(243,213,149,.16)}
.scene .geste span{display:block;font-size:.4em;line-height:1.3;color:var(--or);margin-right:.15em}
.scene .horizon{display:block;width:100%;height:clamp(54px,9vw,96px);margin-top:clamp(-1.2rem,-1vw,-.4rem);color:var(--or)}
.scene .horizon path{fill:currentColor;opacity:.82}
.scene .legende{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,21rem);gap:1.5rem clamp(2rem,6vw,6rem);align-items:end;margin-top:clamp(1.2rem,3vw,2.2rem)}
.scene h1{font:300 clamp(1.7rem,3.3vw,2.9rem)/1.08 var(--serif);letter-spacing:.01em}
.scene h1 i{color:var(--or);font-style:italic}
.scene .presente{margin:.9rem 0 0;max-width:46ch;color:var(--gris)}
.scene .presente b{color:var(--ivoire);font-weight:400}
.marge{font:italic 300 1.06rem/1.5 var(--serif);color:var(--gris);border-left:1px solid var(--filet);padding-left:1.1rem;margin:0}
.marge .rub{display:block;font-style:normal;margin-bottom:.45rem}
.marge a{color:var(--or-2)}
.scene .chiffres{display:flex;flex-wrap:wrap;gap:.4rem 2.2rem;list-style:none;margin:2rem 0 0;padding:1rem 0 0;border-top:1px solid var(--filet-2)}
.scene .chiffres li{font:300 .82rem/1.3 var(--lat);color:var(--gris)}
.scene .chiffres b{display:block;font:300 1.9rem/1.1 var(--serif);color:var(--ivoire);font-variant-numeric:lining-nums}
@media (max-width:760px){.scene .legende{grid-template-columns:1fr}.scene .geste{margin-right:-.4rem}}

/* la photo d'ouverture : le récitateur au micro, à gauche du nom, dans la même nuit */
.scene .ouverture{margin:0;position:relative;z-index:-1}
.scene .ouverture img{display:block;width:100%;height:100%;object-fit:cover;object-position:24% 22%;
  filter:grayscale(1) sepia(.4) brightness(.8) contrast(1.08);transition:filter .6s}
.scene .ouverture:hover img{filter:grayscale(.2) sepia(.15) brightness(.85)}
.scene .ouverture figcaption{position:absolute;top:.9rem;right:0;margin:0;padding:0;border:0;text-align:right;
  font:italic 300 .8rem/1.4 var(--serif);color:var(--gris);text-shadow:0 0 12px var(--nuit),0 0 3px var(--nuit)}
.scene .ouverture figcaption .quand,.scene .ouverture figcaption .credit{display:inline;font:inherit;letter-spacing:0;text-transform:none;color:inherit;margin:0}
.scene .ouverture figcaption .quand::after{content:". "}
@media (min-width:761px){
  .scene.avec-photo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}
  .scene.avec-photo .ouverture{grid-column:1;grid-row:1/3;align-self:stretch;margin-left:calc(var(--marge) * -1);min-height:clamp(22rem,52vh,36rem)}
  .scene.avec-photo .ouverture img{position:absolute;inset:0;
    -webkit-mask-image:radial-gradient(ellipse 70% 80% at 32% 36%,#000 42%,transparent 100%);mask-image:radial-gradient(ellipse 70% 80% at 32% 36%,#000 42%,transparent 100%)}
  .scene.avec-photo .ouverture figcaption{right:clamp(1rem,4vw,3.5rem)}
  .scene.avec-photo .geste{grid-column:2;grid-row:1;font-size:clamp(4.4rem,12.6vw,14rem);margin-top:clamp(1.5rem,6vh,4rem)}
  .scene.avec-photo .horizon{grid-column:1/-1;grid-row:2;align-self:end;position:relative;z-index:1}
  .scene.avec-photo .legende{grid-column:1/-1}
}
@media (max-width:760px){
  .scene.avec-photo .ouverture{margin:0 calc(var(--marge) * -1)}
  .scene.avec-photo .ouverture img{aspect-ratio:4/3;height:auto;
    -webkit-mask-image:linear-gradient(#000 55%,transparent 100%);mask-image:linear-gradient(#000 55%,transparent 100%)}
  .scene.avec-photo .ouverture figcaption{right:var(--marge)}
  .scene.avec-photo .geste{margin-top:-3.4rem;position:relative}
}

/* les trois entrées de l'écoute */
.ecoute{padding:clamp(3rem,8vw,6.5rem) var(--marge) clamp(2rem,5vw,4rem);border-top:1px solid var(--filet-2)}
.ecoute > .wrap,.plan > .wrap{padding:0}
.ecoute h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1.4rem;margin-bottom:clamp(1.5rem,4vw,2.5rem)}
.ecoute h2 .rub{font-size:.76rem}
.porte{display:grid;grid-template-columns:3.2rem minmax(0,1fr) auto;gap:.4rem clamp(1rem,3vw,2rem);align-items:center;padding:clamp(1.1rem,2.6vw,1.8rem) 0;border-bottom:1px solid var(--filet);text-decoration:none;color:var(--ivoire)}
.porte:first-of-type{border-top:1px solid var(--filet)}
.porte .i{font:italic 300 1.15rem var(--serif);color:var(--or);align-self:start;padding-top:.5rem}
.porte .t{font:300 clamp(1.7rem,3.8vw,3rem)/1.05 var(--serif)}
.porte .t em{display:block;font:400 .95rem/1.5 var(--lat);color:var(--gris);font-style:normal;margin-top:.45rem;max-width:56ch}
.porte .a{font:700 clamp(2.2rem,6vw,4.8rem)/1.2 var(--ruqaa);color:var(--or-2)}
.porte:hover .t,.porte:focus-visible .t{color:var(--or-2)}
@media (max-width:560px){.porte{grid-template-columns:2rem minmax(0,1fr)}.porte .a{grid-column:2;grid-row:1;justify-self:end;font-size:2.4rem}.porte .t{grid-column:2}}

/* le spectre des 114 sourates */
.spectre-bloc{padding:clamp(2rem,5vw,3.5rem) var(--marge) 0}
.spectre-bloc .tete{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.4rem 2rem;margin-bottom:1.2rem}
.spectre-bloc .tete p{margin:0;color:var(--gris);font-size:.92rem;max-width:62ch}
.spectre{display:flex;align-items:flex-end;gap:1px;height:clamp(120px,22vw,240px);border-bottom:1px solid var(--or);position:relative}
.spectre a{flex:1 1 0;min-width:0;height:100%;display:flex;align-items:flex-end;text-decoration:none;position:relative}
.spectre a i{display:block;width:100%;height:var(--h,2%);background:linear-gradient(var(--or-2),var(--or) 55%,rgba(217,178,111,.25))}
.spectre a.vide i{height:3px;background:rgba(217,178,111,.22)}
.spectre a:hover i,.spectre a:focus-visible i{background:#fff3cf}
.spectre a:focus-visible{outline:none}
.spectre a:focus-visible::after,.spectre a:hover::after{content:attr(data-l);position:absolute;bottom:calc(var(--h,2%) + .4rem);left:50%;transform:translateX(-50%);
  background:var(--nuit);border:1px solid var(--or);color:var(--ivoire);font:400 .74rem/1.3 var(--lat);padding:.25rem .5rem;white-space:nowrap;z-index:2;pointer-events:none}
.spectre a:nth-child(-n+12):hover::after,.spectre a:nth-child(-n+12):focus-visible::after{left:0;transform:none}
.spectre a:nth-last-child(-n+12):hover::after,.spectre a:nth-last-child(-n+12):focus-visible::after{left:auto;right:0;transform:none}
.spectre-axe{display:flex;justify-content:space-between;font:300 .72rem var(--lat);color:var(--gris-2);margin-top:.35rem;letter-spacing:.08em}

/* plan éditorial des autres pages */
.plan{padding:clamp(3rem,8vw,6rem) var(--marge) clamp(3rem,7vw,5rem);background:linear-gradient(var(--nuit),var(--nuit-2))}
.plan-grille{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2.5rem clamp(1.2rem,3vw,2.5rem);align-items:start}
.plan figure{grid-column:1/6;grid-row:1/4;margin:0;position:relative}
.plan figure img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:30% 30%;filter:grayscale(1) sepia(.35) brightness(.82) contrast(1.05)}
.plan figure::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 55% at 65% 25%,transparent,rgba(3,13,10,.75) 85%);pointer-events:none}
.plan figcaption{position:relative;z-index:1;margin-top:.7rem;font:italic 300 .92rem/1.45 var(--serif);color:var(--gris)}
.plan figcaption a{color:var(--gris)}
.plan .entree{grid-column:7/13;padding-bottom:1.6rem;border-bottom:1px solid var(--filet-2)}
.plan .entree:nth-of-type(even){grid-column:6/12}
.plan .entree a{text-decoration:none;color:var(--ivoire)}
.plan .entree h3{font:300 clamp(1.6rem,2.8vw,2.3rem)/1.1 var(--serif);display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem 1rem}
.plan .entree h3 .ar{font:700 1.45rem var(--ruqaa);color:var(--or)}
.plan .entree a:hover h3{color:var(--or-2)}
.plan .entree p{margin:.5rem 0 0;color:var(--gris);font-size:.95rem;max-width:52ch}
.plan .entree .n{display:block;margin-top:.5rem;font:italic 300 1rem var(--serif);color:var(--or)}
@media (max-width:820px){.plan-grille{grid-template-columns:1fr}.plan figure,.plan .entree,.plan .entree:nth-of-type(even){grid-column:1;grid-row:auto}.plan figure img{aspect-ratio:3/2}}

/* ---------------------------------------------------------------- têtes de page */
.page-head{position:relative;overflow:hidden;padding:clamp(2.6rem,7vw,5rem) 0 clamp(1.6rem,4vw,2.6rem);isolation:isolate}
.page-head::before{content:"";position:absolute;z-index:-1;inset:-40% -10% 0 35%;background:radial-gradient(ellipse 40% 70% at 70% 0,rgba(243,213,149,.14),transparent 70%);pointer-events:none}
h1.page{display:grid;grid-template-columns:1fr;gap:0;font:300 clamp(2.2rem,5.4vw,4.4rem)/1.05 var(--serif)}
h1.page .ar{font:700 clamp(2.4rem,7vw,6rem)/1.3 var(--ruqaa);color:var(--or-2);text-align:right;margin-top:-.15em}
.page-head .lede{max-width:60ch;font:300 clamp(1.1rem,1.6vw,1.3rem)/1.55 var(--serif);color:var(--gris);margin:1.2rem 0 0}
.toc{display:flex;flex-wrap:wrap;gap:.3rem 1.8rem;list-style:none;margin:1.6rem 0 0;padding:1rem 0 0;border-top:1px solid var(--filet-2)}
.toc li{counter-increment:toc}
.toc a{display:inline-flex;align-items:baseline;gap:.5rem;min-height:2.6rem;align-items:center;text-decoration:none;color:var(--ivoire);font-size:.95rem}
.toc a::before{content:counter(toc,upper-roman) ".";font:italic 300 1rem var(--serif);color:var(--or)}
.toc{counter-reset:toc}
@media (max-width:640px){h1.page{grid-template-columns:1fr}h1.page .ar{text-align:right}}

/* ---------------------------------------------------------------- sections */
section.bloc{padding:0 0 clamp(2.5rem,6vw,4.5rem)}
section.bloc:first-of-type{padding-top:clamp(1rem,3vw,2rem)}
main > section.bloc + section.bloc{content-visibility:auto;contain-intrinsic-size:auto 1400px}
.t-sec{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.3rem 2rem;margin-bottom:1.8rem;padding-bottom:.9rem;border-bottom:1px solid var(--filet)}
.t-sec h1,.t-sec h2{font:300 clamp(1.9rem,3.6vw,3rem)/1.05 var(--serif)}
.t-sec .ar{font:700 clamp(1.8rem,4vw,3.2rem)/1.2 var(--ruqaa);color:var(--or-2);text-align:right}
.t-sec h1{font-size:clamp(2.2rem,5.4vw,4.4rem)}
.t-sec h1 + .ar{font-size:clamp(2.6rem,8vw,6rem)}
@media (max-width:700px){.t-sec{grid-template-columns:1fr}.t-sec .ar{text-align:right}.t-sec h1{font-size:clamp(2.1rem,9vw,3rem)}}
.intro{color:var(--gris);max-width:70ch;margin:0 0 2rem;font:300 1.12rem/1.6 var(--serif)}
.intro a{color:var(--or-2)}
.note{font-size:.86rem;color:var(--gris)}
.doute{display:inline-block;font:italic 400 .9rem/1.2 var(--serif);color:var(--q-moy);border-bottom:1px dotted var(--q-moy);white-space:nowrap}
sup.src a{text-decoration:none;font:500 .7em var(--lat);color:var(--or)}
h2.sous{font:300 clamp(1.5rem,2.6vw,2rem)/1.15 var(--serif);margin:3.2rem 0 1rem;display:flex;flex-wrap:wrap;gap:.2rem 1.2rem;align-items:baseline}
h2.sous .ar{font:700 1.4rem var(--ruqaa);color:var(--or)}
.noscript{border-left:1px solid var(--or);padding:.6rem 1.1rem;color:var(--gris)}

/* biographie */
.chapitres{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem)}
.chapitres nav ol{list-style:none;padding:0;margin:0;position:sticky;top:5.5rem;counter-reset:c}
.chapitres nav li{counter-increment:c;border-bottom:1px solid var(--filet-2)}
.chapitres nav a{display:grid;grid-template-columns:2rem 1fr;padding:.6rem 0;text-decoration:none;color:var(--gris);font-size:.88rem;line-height:1.35}
.chapitres nav a::before{content:counter(c,upper-roman) ".";font:italic 300 1rem var(--serif);color:var(--or)}
.chapitres nav a:hover{color:var(--ivoire)}
.chapitre{margin-bottom:3rem;counter-increment:ch}
.chapitres > div{counter-reset:ch}
.chapitre h3{font:300 clamp(1.5rem,2.4vw,2rem)/1.15 var(--serif);margin-bottom:.2rem}
.chapitre h3 + .ar{display:block;font:700 1.35rem/1.6 var(--ruqaa);color:var(--or);margin-bottom:1rem}
.chapitre p{margin:0 0 1rem;max-width:68ch}
.chapitre p:first-of-type::first-letter{font:400 3.3em/.8 var(--serif);float:left;margin:.08em .1em 0 0;color:var(--or-2)}
.encart{border-left:1px solid var(--or);padding:.4rem 0 .4rem 1.2rem;margin:1.6rem 0;max-width:62ch;font:italic 300 1.08rem/1.55 var(--serif);color:var(--gris)}
.encart b{font:normal 500 .72rem var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:.3rem}
@media (max-width:860px){.chapitres{grid-template-columns:1fr}.chapitres nav{display:none}}

/* chronologie */
.chrono{list-style:none;margin:0;padding:0;position:relative}
.chrono::before{content:"";position:absolute;left:7.3rem;top:.6rem;bottom:.6rem;width:1px;background:linear-gradient(var(--or),rgba(217,178,111,.08))}
.chrono li{display:grid;grid-template-columns:6.2rem minmax(0,1fr);gap:2.2rem;padding:.7rem 0;position:relative}
.chrono li::before{content:"";position:absolute;left:calc(7.3rem - 3px);top:1.35rem;width:7px;height:7px;background:var(--or);transform:rotate(45deg)}
.chrono .an{font:italic 300 1.6rem/1.2 var(--serif);color:var(--or-2);text-align:right;font-variant-numeric:lining-nums}
.chrono .ev{max-width:66ch;padding-top:.25rem}
.chrono .ev .ar{display:block;color:var(--or);font-size:.95rem;margin-top:.15rem}
@media (max-width:520px){.chrono::before{left:4.6rem}.chrono li{grid-template-columns:3.8rem minmax(0,1fr);gap:1.6rem}.chrono li::before{left:calc(4.6rem - 3px)}.chrono .an{font-size:1.1rem}}

/* carte des voyages */
.carte-grille{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:2.5rem;align-items:start}
.carte{padding:0;border:0;background:none;position:relative}
.carte svg{width:100%;height:auto;display:block}
.carte svg path{fill:#0d2a21;stroke:var(--nuit);stroke-width:.5}
.carte svg path.visite{fill:#1f5a48}
.carte svg path.egypte{fill:var(--or)}
.carte svg circle.pt{fill:var(--nuit);stroke:var(--or-2);stroke-width:1.6;cursor:pointer}
.carte svg circle.pt:hover,.carte svg circle.pt.sel{fill:var(--or-2);stroke:var(--nuit)}
.carte svg circle.pt:focus-visible{outline:none;stroke:#fff;stroke-width:3}
.carte svg line.trajet{stroke:var(--or);stroke-width:.6;stroke-dasharray:2 4;opacity:.55}
.pays-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--filet)}
.pays-liste li{border-bottom:1px solid var(--filet-2)}
.pays-liste button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:1fr auto;gap:.05rem 1rem;width:100%;padding:.6rem .2rem;cursor:pointer}
.pays-liste button:hover,.pays-liste button.sel,.pays-liste button[aria-pressed="true"]{color:var(--or-2)}
.pays-liste button:focus-visible{outline:2px solid var(--or-2);outline-offset:-2px}
.pays-liste .p-fr{font-weight:400}.pays-liste .p-ar{grid-column:1;color:var(--gris);font-size:.86rem}
.pays-liste .p-n{grid-row:1/3;grid-column:2;align-self:center;font:italic 300 .95rem var(--serif);color:var(--gris);text-align:right}
.pays-detail{margin-top:1.2rem}
.fiche-pays ul{margin:.4rem 0;padding-left:1.2rem}.fiche-pays li{margin-bottom:.3rem;font-size:.94rem}
@media (max-width:900px){.carte-grille{grid-template-columns:1fr}}
@media (max-width:900px) and (min-width:560px){.pays-liste{display:grid;grid-template-columns:1fr 1fr;column-gap:2rem}}

/* blocs d'information : filets et colonnes, jamais de cartes */
.cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:0 clamp(1.5rem,4vw,3.5rem)}
.carte-info{border-top:1px solid var(--filet);padding:1.1rem 0 1.4rem}
.carte-info h3{font:400 1.35rem/1.2 var(--serif);margin-bottom:.1rem}
.carte-info .ar{display:block;font:700 1.15rem/1.6 var(--ruqaa);color:var(--or);margin-bottom:.4rem}
.carte-info p{margin:.35rem 0;font-size:.95rem;color:#dcd3bf}
#pays-detail .carte-info{border-top:1px solid var(--or)}
.fiab{display:block;font:500 .7rem var(--lat);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.4rem}
.fiab.haute{color:var(--q-haute)}.fiab.moyenne{color:var(--q-moy)}.fiab.basse{color:var(--q-basse)}

/* catalogue vidéo (correctif anti-débordement conservé : fiches jusqu'à 900 px) */
.filtres{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.2rem;align-items:center;padding:1rem 0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet-2)}
.filtres input,.filtres select,.champ{font:inherit;font-size:.92rem;padding:.6rem .8rem;border:1px solid var(--filet);border-radius:0;background:var(--nuit-2);color:var(--ivoire);min-height:2.75rem;max-width:100%}
.filtres input{flex:1 1 260px}
.filtres select option{background:var(--nuit-2)}
.compte{font:italic 300 1rem var(--serif);color:var(--gris);margin-left:auto}
.table-wrap{overflow-x:auto}
table.cat{width:100%;border-collapse:collapse;font-size:.9rem}
table.cat th{text-align:left;font:500 .68rem/1.3 var(--lat);letter-spacing:.14em;text-transform:uppercase;color:var(--or);padding:.7rem .9rem;border-bottom:1px solid var(--or);position:static;white-space:normal}
table.cat th button{all:unset;cursor:pointer}
table.cat td{padding:.65rem .9rem;border-bottom:1px solid var(--filet-2);vertical-align:top}
table.cat td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.cat td.titre,table.cat td .note{overflow-wrap:anywhere}
table.cat td.titre{min-width:min(13rem,40vw)}
table.cat td.titre .ar,table.cat td.titre .orig{display:block;font-size:.92rem;line-height:1.55;color:var(--gris)}
table.cat td.titre .orig{unicode-bidi:plaintext;text-align:start}
.tag{display:inline-block;font-size:.74rem;border-bottom:1px solid var(--filet);padding:0 .1rem;margin:.1rem .5rem 0 0;white-space:nowrap;color:var(--gris)}
.tag.pays{color:var(--or-2);border-color:var(--or)}
.plus,.bouton{display:inline-flex;align-items:center;gap:.5rem;font:500 .74rem var(--lat);letter-spacing:.18em;text-transform:uppercase;min-height:2.75rem;padding:0 1.3rem;border:1px solid var(--or);background:none;color:var(--or-2);cursor:pointer;text-decoration:none}
.plus{margin:1.4rem auto 0;display:flex}
.plus:hover,.bouton:hover{background:var(--or);color:var(--nuit)}
@media (min-width:901px) and (max-width:1200px){
  table.cat th,table.cat td{padding:.6rem .45rem}
  table.cat th:first-child,table.cat td:first-child{padding-left:.2rem}
  table.cat th:last-child,table.cat td:last-child{padding-right:.2rem}
  table.cat th{letter-spacing:.06em}
  table.cat td.titre{min-width:11rem}
}
@media (max-width:900px){
  .filtres input{flex-basis:100%}
  .filtres select{flex:1 1 calc(50% - .3rem);min-width:0}
  .compte{margin-left:0;flex-basis:100%}
  .table-wrap{overflow:visible}
  .table-wrap table,.table-wrap tbody,.table-wrap tr,.table-wrap td{display:block;width:auto}
  .table-wrap thead{display:none}
  .table-wrap tr{border-top:1px solid var(--filet);padding:.8rem 0 .9rem}
  table.cat td{border:0;padding:.15rem 0;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere;text-align:left!important}
  table.cat td.rang{float:right;color:var(--gris);font-size:.8rem;margin-left:.5rem}
  table.cat td.titre{padding-bottom:.45rem}
  table.cat td[data-label]{display:flow-root;padding-left:7.2rem;font-size:.9rem}
  table.cat td[data-label]::before{content:attr(data-label);float:left;margin:.15rem 0 0 -7.2rem;width:6.8rem;color:var(--or);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;line-height:1.3}
  table.cat td[data-label] br{display:none}
  table.cat td[data-label] br + .note{margin-left:.4rem}
}

/* galerie vidéo : rangées éditoriales */
.videos{display:block;counter-reset:vid}
.video{display:grid;grid-template-columns:minmax(0,22rem) minmax(0,1fr);gap:1.2rem clamp(1.5rem,4vw,3rem);padding:1.6rem 0;border-top:1px solid var(--filet-2);counter-increment:vid}
.video:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,22rem)}
.video:nth-child(even) .ecran{order:2}
.video .ecran{position:relative;aspect-ratio:16/9;background:var(--nuit-3)}
.video .ecran button{all:unset;cursor:pointer;position:absolute;inset:0;display:grid;place-items:center}
.video .ecran button img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.6) sepia(.25) brightness(.75)}
.video .ecran button:hover img{filter:none}
.video .ecran button .play{position:relative;width:58px;height:58px;border-radius:50%;border:1px solid var(--or-2);background:rgba(3,13,10,.6);display:grid;place-items:center}
.video .ecran button .play::after{content:"";border-left:15px solid var(--or-2);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.video .ecran button:focus-visible{outline:2px solid var(--or-2);outline-offset:-2px}
.video .ecran iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .info{display:flex;flex-direction:column;gap:.35rem}
.video .info::before{content:counter(vid,upper-roman) ".";font:italic 300 1rem var(--serif);color:var(--or)}
.video h3{font:400 1.4rem/1.2 var(--serif)}
.video .ar{font-size:.98rem;color:var(--or)}
.video .note{margin:.2rem 0}
.video .meta{font-size:.82rem;color:var(--gris);margin-top:auto}
@media (max-width:720px){.video,.video:nth-child(even){grid-template-columns:1fr}.video:nth-child(even) .ecran{order:0}}

/* photographies : mise en scène, pas de grille */
.photos{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2rem clamp(1rem,3vw,2.5rem);align-items:end}
.photos figure{margin:0;grid-column:span 4;position:relative}
.photos figure:first-child{grid-column:1/8;grid-row:1/3}
.photos figure:nth-child(2){grid-column:8/13}
.photos figure:nth-child(3){grid-column:9/13}
.photos img{width:100%;aspect-ratio:3/2;object-fit:cover;filter:grayscale(1) sepia(.3) brightness(.85)}
.photos figure:hover img{filter:none}
.photos figcaption{font:italic 300 .95rem/1.45 var(--serif);color:var(--gris);padding:.6rem 0 0;border-top:1px solid var(--filet-2);margin-top:.6rem}
@media (max-width:760px){.photos{grid-template-columns:1fr}.photos figure,.photos figure:first-child,.photos figure:nth-child(2),.photos figure:nth-child(3){grid-column:1;grid-row:auto}}

ol.sources{padding-left:2.6rem;max-width:92ch;counter-reset:none}
ol.sources li{margin-bottom:.6rem;font-size:.92rem;color:#dcd3bf;overflow-wrap:anywhere}
ol.sources li::marker{font:italic 300 1rem var(--serif);color:var(--or)}

/* ---------------------------------------------------------------- pages voisines, pied de page */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:clamp(2.5rem,6vw,4rem) 0;border-top:1px solid var(--filet)}
.pager a{display:block;padding:1.1rem 0;text-decoration:none;font:300 1.5rem/1.2 var(--serif);color:var(--ivoire)}
.pager a:hover{color:var(--or-2)}
.pager small{display:block;font:500 .68rem var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin-bottom:.3rem}
.pager .next{grid-column:2;text-align:right}
@media (max-width:520px){.pager{grid-template-columns:1fr}.pager .next{grid-column:1}}
footer{background:var(--nuit);border-top:1px solid var(--filet);color:var(--gris);padding:2.6rem 0 3rem;font-size:.86rem;position:relative}
footer .wrap{display:flex;flex-wrap:wrap;gap:1rem 2.4rem;justify-content:space-between}
footer .fnav{flex-basis:100%;display:flex;flex-wrap:wrap;gap:.3rem 1.6rem;list-style:none;margin:0 0 .6rem;padding:0 0 1.2rem;border-bottom:1px solid var(--filet-2)}
footer .fnav a{color:var(--ivoire);text-decoration:none;font:400 .72rem var(--lat);letter-spacing:.18em;text-transform:uppercase}
footer a{color:var(--or-2)}
footer .signe{font:700 2rem/1 var(--ruqaa);color:var(--or);flex-basis:100%}

/* ======================================================================== page Audio */
.audio-tete{position:relative;padding:clamp(2.2rem,6vw,4.5rem) var(--marge) 0;overflow:hidden;isolation:isolate}
.audio-tete::before{content:"";position:absolute;z-index:-1;inset:-30% -10% 0 35%;background:radial-gradient(ellipse 38% 80% at 72% 0,rgba(243,213,149,.17),transparent 70%)}
.audio-tete .titre{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:1rem 2rem}
.audio-tete h1{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 2rem;font:300 clamp(2.6rem,7vw,5.6rem)/1 var(--serif)}
.audio-tete h1 .ar{font:700 clamp(3.6rem,13vw,10.5rem)/1.25 var(--ruqaa);color:var(--or-2);margin-left:auto}
.audio-tete .titre{display:block}
.audio-tete .lede{font:300 clamp(1.05rem,1.5vw,1.25rem)/1.55 var(--serif);color:var(--gris);max-width:58ch;margin:0}
.audio-tete .lede b{font:inherit;color:var(--ivoire)}
.onglets{display:flex;gap:0 2.4rem;flex-wrap:wrap;padding:0 var(--marge);margin-top:2rem;border-bottom:1px solid var(--filet)}
.onglets a{display:flex;flex-direction:column;justify-content:center;min-height:3.4rem;text-decoration:none;color:var(--gris);font:500 .74rem var(--lat);letter-spacing:.2em;text-transform:uppercase;border-bottom:2px solid transparent;margin-bottom:-1px}
.onglets a small{font:400 1rem var(--naskh);letter-spacing:0;text-transform:none;color:var(--or)}
.onglets a[aria-current="true"]{color:var(--or-2);border-bottom-color:var(--or)}
.vue{padding:clamp(1.6rem,4vw,2.6rem) var(--marge) clamp(3rem,6vw,5rem)}
.js .vue[hidden]{display:none}
.vue > h2,.vue-tete h2{font:300 clamp(1.6rem,3vw,2.4rem)/1.1 var(--serif);display:flex;flex-wrap:wrap;gap:.2rem 1.2rem;align-items:baseline;margin-bottom:.4rem}
.vue > h2 .ar,.vue-tete h2 .ar{font:700 1.6rem var(--ruqaa);color:var(--or)}
.vue > p.aide,.vue-tete p.aide{color:var(--gris);max-width:70ch;margin:0 0 1.6rem;font-size:.95rem}

/* index des 114 sourates */
.index114{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(30%,8.6rem),1fr));border-top:1px solid var(--filet-2);border-left:1px solid var(--filet-2)}
.index114 li{border-right:1px solid var(--filet-2);border-bottom:1px solid var(--filet-2)}
.index114 a,.index114 span.s{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;gap:0 .4rem;padding:.7rem .7rem .8rem;text-decoration:none;color:var(--ivoire);height:100%;min-height:6.4rem}
.index114 .n{font:300 .78rem var(--lat);color:var(--or);font-variant-numeric:tabular-nums}
.index114 .c{justify-self:end;font:italic 400 .95rem/1 var(--serif);color:var(--or-2)}
.index114 .a{grid-column:1/3;font:400 clamp(1.35rem,2.2vw,1.75rem)/1.55 var(--ruqaa);text-align:right;color:var(--or-2)}
.index114 .f{grid-column:1/3;font:400 .74rem/1.25 var(--lat);color:var(--gris)}
.index114 .poids{position:absolute;left:.7rem;bottom:.35rem;height:2px;background:var(--or);width:var(--w,0)}
.index114 a:hover,.index114 a:focus-visible{background:var(--nuit-3)}
.index114 a[aria-current="true"]{background:var(--emer)}
.index114 span.s .a{color:var(--eteint)}
.index114 span.s .n,.index114 span.s .f{color:var(--gris-2)}

/* listes d'enregistrements */
.panneau{margin-top:2.4rem;scroll-margin-top:5rem}
.panneau-tete{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem 2rem;align-items:end;padding-bottom:1rem;border-bottom:1px solid var(--or)}
.panneau-tete h3{font:300 clamp(1.7rem,3.2vw,2.6rem)/1.1 var(--serif)}
.panneau-tete h3 .ar{display:block;font:700 clamp(2.2rem,5vw,3.8rem)/1.3 var(--ruqaa);color:var(--or-2)}
.panneau-tete .actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:flex-end}
.panneau-tete p{grid-column:1/-1;margin:0;color:var(--gris);font-size:.9rem}
@media (max-width:700px){.panneau-tete{grid-template-columns:1fr}.panneau-tete .actions{justify-content:flex-start}.panneau-tete h3 .ar{text-align:right}}
.enr{list-style:none;margin:0;padding:0;counter-reset:enr}
.enr > li{display:grid;grid-template-columns:3rem minmax(0,1fr) auto;gap:.3rem 1.2rem;padding:1rem 0;border-bottom:1px solid var(--filet-2);counter-increment:enr;align-items:start}
.enr > li.joue{background:linear-gradient(90deg,rgba(13,58,46,.7),transparent 80%)}
.enr .lire{width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--or);background:none;color:var(--or-2);cursor:pointer;display:grid;place-items:center;padding:0}
.enr .lire svg{width:14px;height:14px;fill:currentColor}
.enr .lire:hover{background:var(--or);color:var(--nuit)}
.enr .lire[aria-pressed="true"]{background:var(--or-2);color:var(--nuit)}
.enr .corps{min-width:0}
.enr .t{font:400 1.12rem/1.3 var(--serif);color:var(--ivoire)}
.enr .t-ar{display:block;font:400 1rem/1.7 var(--naskh);color:var(--or);direction:rtl;text-align:right}
.enr .m{display:flex;flex-wrap:wrap;gap:.1rem 1.1rem;margin-top:.25rem;font-size:.82rem;color:var(--gris)}
.enr .m .q{font:500 .66rem/1.6 var(--lat);letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid currentColor}
.q-haute{color:var(--q-haute)!important}.q-moyenne{color:var(--q-moy)!important}.q-basse{color:var(--q-basse)!important}
.enr .droite{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;text-align:right;font-size:.8rem}
.enr .duree{font:italic 300 1.15rem var(--serif);color:var(--ivoire)}
.enr .droite a,.enr .droite button.lien{color:var(--or-2);font:400 .8rem var(--lat);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-decoration-color:rgba(243,213,149,.4);text-underline-offset:.2em;min-height:1.6rem}
.enr details{margin-top:.4rem;font-size:.82rem;color:var(--gris)}
.enr details summary{cursor:pointer;color:var(--gris);min-height:1.8rem;display:flex;align-items:center}
.enr details ul{margin:.3rem 0 0;padding-left:1.1rem}
.enr details li{overflow-wrap:anywhere}
.enr .note-e{display:block;margin-top:.3rem;font:italic 300 .95rem/1.4 var(--serif);color:var(--gris)}
@media (max-width:620px){.enr > li{grid-template-columns:2.9rem minmax(0,1fr)}.enr .droite{grid-column:2;flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:.3rem 1rem;text-align:left}}
.vide-msg{color:var(--gris);font:italic 300 1.1rem var(--serif);padding:1.4rem 0}

/* studio : discographie */
.album{display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:1.2rem clamp(1.5rem,4vw,3.5rem);padding:2rem 0;border-top:1px solid var(--filet)}
.album .pochette{aspect-ratio:1;background:radial-gradient(ellipse 70% 60% at 60% 20%,rgba(243,213,149,.25),transparent 70%),var(--emer);display:flex;flex-direction:column;justify-content:space-between;padding:1rem;border:1px solid var(--filet)}
.album .pochette .ar{font:700 clamp(1.8rem,3vw,2.4rem)/1.35 var(--ruqaa);color:var(--or-2);text-align:right}
.album .pochette svg{width:100%;height:40px;color:var(--or)}.album .pochette svg path{fill:currentColor;opacity:.7}
.album .pochette small{font:500 .66rem var(--lat);letter-spacing:.18em;text-transform:uppercase;color:var(--or)}
.album h3{font:300 clamp(1.6rem,2.8vw,2.3rem)/1.1 var(--serif)}
.album .fiche{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;margin:.6rem 0 1rem;font-size:.86rem;color:var(--gris)}
.album .fiche b{font-weight:400;color:var(--ivoire)}
@media (max-width:700px){.album{grid-template-columns:1fr}.album .pochette{max-width:14rem}}

/* haflat : filtres + chronique par année */
.filtres-audio{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;padding:1rem 0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet-2);margin-bottom:.5rem}
.filtres-audio label{display:flex;flex-direction:column;gap:.25rem;font:500 .66rem var(--lat);letter-spacing:.16em;text-transform:uppercase;color:var(--or)}
.filtres-audio select{width:100%}
.filtres-audio .compte{grid-column:1/-1;margin:0}
@media (max-width:760px){.filtres-audio{grid-template-columns:1fr 1fr}}
.annee{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:0 2rem;border-top:1px solid var(--filet)}
.annee > h3{font:italic 300 clamp(1.8rem,3vw,2.6rem)/1 var(--serif);color:var(--or-2);padding-top:1rem}
.annee > h3 small{display:block;font:400 .72rem var(--lat);font-style:normal;letter-spacing:.1em;color:var(--gris);margin-top:.4rem}
.annee .enr > li:last-child{border-bottom:0}
@media (max-width:620px){.annee{grid-template-columns:1fr}.annee > h3{padding-bottom:.4rem}}

/* ======================================================================== lecteur persistant */
.lecteur{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#020906;border-top:1px solid var(--or);color:var(--ivoire)}
.lecteur[hidden]{display:none}
.lecteur .l-in{display:grid;grid-template-columns:auto minmax(0,17rem) minmax(0,1fr) auto;gap:.4rem 1.1rem;align-items:center;padding:.6rem var(--marge);max-width:none}
.lecteur .pp{width:3rem;height:3rem;border-radius:50%;border:1px solid var(--or);background:none;color:var(--or-2);cursor:pointer;display:grid;place-items:center;padding:0}
.lecteur .pp svg{width:16px;height:16px;fill:currentColor}
.lecteur .pp:hover{background:var(--or);color:var(--nuit)}
.lecteur .l-t{min-width:0;line-height:1.3}
.lecteur .l-t b{display:block;font:400 .92rem var(--lat);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lecteur .l-t [lang="ar"]{display:block;font:400 .98rem/1.5 var(--naskh);color:var(--or);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lecteur .l-t small{display:block;font-size:.72rem;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lecteur .l-barre{display:flex;align-items:center;gap:.8rem;min-width:0}
.lecteur .piste{position:relative;flex:1;height:34px;min-width:0;cursor:pointer;touch-action:none}
.lecteur .piste svg{position:absolute;inset:0;width:100%;height:100%}
.lecteur .piste .fond{fill:rgba(217,178,111,.28)}
.lecteur .piste .plein{fill:var(--or-2)}
.lecteur .piste:focus-visible{outline:2px solid var(--or-2);outline-offset:2px}
.lecteur .temps{font:300 .78rem var(--lat);color:var(--gris);white-space:nowrap;font-variant-numeric:tabular-nums}
.lecteur .l-x{display:flex;gap:.3rem;align-items:center}
.lecteur .l-x button{background:none;border:1px solid var(--filet);color:var(--ivoire);font:400 .74rem var(--lat);min-width:2.75rem;min-height:2.75rem;padding:0 .5rem;cursor:pointer}
.lecteur .l-x button:hover{border-color:var(--or-2);color:var(--or-2)}
.lecteur .file{position:absolute;right:var(--marge);bottom:100%;width:min(26rem,calc(100vw - 2rem));background:#020906;border:1px solid var(--or);border-bottom:0;padding:.8rem 1rem;font-size:.85rem}
.lecteur .file[hidden]{display:none}
.lecteur .file ol{margin:.4rem 0 0;padding-left:1.4rem}
.lecteur .file li{padding:.2rem 0}.lecteur .file li.cur{color:var(--or-2)}
.lecteur .file button{background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer;padding:0;min-height:1.8rem}
.lecteur .file h2{font:500 .68rem var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin:0}
.lecteur .erreur{grid-column:1/-1;font-size:.78rem;color:var(--q-basse)}
@media (max-width:860px){
  .lecteur .l-in{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"pp t x" "b b b";padding:.5rem .8rem .6rem}
  .lecteur .pp{grid-area:pp}.lecteur .l-t{grid-area:t}.lecteur .l-x{grid-area:x}.lecteur .l-barre{grid-area:b}
  html.a-lecteur body{padding-bottom:7.6rem}
}
@media (max-width:460px){
  .lecteur .l-x .opt{display:none}
  .lecteur .l-x button{min-width:2.6rem;padding:0 .3rem}
}

/* ---------------------------------------------------------------- photos du récitateur (passe photos, voir DIRECTION.md)
   Hors galerie : camaïeu noir et or, la couleur revient au survol. Dans la galerie : couleurs d'origine (ce sont des documents).
   Grandes images découpées par la lumière (masque radial), jamais posées dans une carte. */
.ph{margin:0;position:relative;min-width:0}
.ph img{width:100%;object-fit:cover;background:var(--nuit-3)}
.ph figcaption{font:italic 300 .95rem/1.45 var(--serif);color:var(--gris);padding:.55rem 0 0;margin-top:.55rem;border-top:1px solid var(--filet-2)}
.ph .quand{display:block;font:500 .64rem/1.6 var(--lat);font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--or)}
.ph .credit{display:block;font:300 .76rem/1.45 var(--lat);font-style:normal;color:var(--gris-2);margin-top:.3rem}
.ph .credit a{color:var(--gris)}
.ph.chap img,.ph.vignette img,.ph.fiche img,.ph.tete img,.ph.entete img,.ph.grand img,.plan-ph img{filter:grayscale(1) sepia(.35) brightness(.85) contrast(1.05)}
.ph:hover img,.ph:focus-within img,.plan-ph:hover img{filter:none}
.ph.grand img,.ph.tete img{-webkit-mask-image:radial-gradient(ellipse 80% 85% at 42% 40%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 80% 85% at 42% 40%,#000 58%,transparent 100%)}
/* accueil : grand tirage, note en marge */
.tirage{padding:clamp(2.5rem,6vw,4.5rem) 0}
.tirage .wrap{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,3.3fr);gap:2rem clamp(2rem,5vw,4.5rem);align-items:end}
.tirage .ph img{aspect-ratio:16/9}
.tirage .marge{border-left:1px solid var(--or);padding-left:1.2rem;color:var(--gris);font-size:.95rem}
.tirage .marge h2{margin-bottom:.8rem}
.plan-ph img{aspect-ratio:4/5;object-fit:cover;object-position:52% 32%}
@media (max-width:900px){.tirage .wrap{grid-template-columns:1fr}.tirage .ph img{aspect-ratio:3/2}}
/* têtes de page avec photo (Photos, Voyages) */
.page-head.avec-photo .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,19rem);grid-template-areas:"h ph" "t ph";gap:1.4rem clamp(2rem,5vw,4.5rem);align-items:start}
.page-head.avec-photo h1.page{grid-area:h}.page-head.avec-photo .tete-texte{grid-area:t}.page-head.avec-photo .ph{grid-area:ph}
.ph.tete img{aspect-ratio:4/5}
.intro-ph{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,20rem);gap:1.4rem clamp(2rem,5vw,4rem);align-items:start;margin-bottom:2rem}
.intro-ph .ph.tete img{aspect-ratio:3/2}
@media (max-width:760px){.page-head.avec-photo .wrap{grid-template-areas:"h" "t" "ph"}.page-head.avec-photo .wrap,.intro-ph{grid-template-columns:1fr}.ph.tete img{aspect-ratio:3/2}}
/* biographie : photo en marge du chapitre ; chronologie : vignette sous le jalon */
.ph.chap{float:right;width:min(42%,20rem);margin:.5rem 0 1.4rem clamp(1.4rem,3vw,2.4rem)}
.ph.chap img{aspect-ratio:4/5}
.chapitre::after{content:"";display:block;clear:both}
.ph.vignette{margin:.9rem 0 .5rem;max-width:17rem}
.ph.vignette img{aspect-ratio:3/2}
.ph.vignette figcaption{font-size:.85rem}
@media (max-width:860px){.ph.chap{float:none;width:100%;margin:0 0 1.4rem}.ph.chap img{aspect-ratio:3/2}}
@media (max-width:520px){.ph.vignette{max-width:none}}
/* voyages : photos dans la fiche du pays */
.fiche-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,11rem),1fr));gap:1rem 1.4rem;margin:1rem 0 1.2rem}
.ph.fiche img{aspect-ratio:4/5}
.ph.fiche figcaption{font-size:.82rem}
/* page Audio : photos des en-têtes */
.audio-tete .tete-grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,19rem);gap:1.4rem clamp(2rem,5vw,4rem);align-items:end}
.vue-tete{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,17rem);gap:1rem clamp(1.5rem,4vw,3.5rem);align-items:start;margin-bottom:.6rem}
.ph.entete img{aspect-ratio:3/2}
.ph.entete figcaption{font-size:.84rem}
@media (max-width:700px){.audio-tete .tete-grille,.vue-tete{grid-template-columns:1fr}.vue-tete .ph{max-width:24rem}}
/* galerie : un reportage par événement, planche asymétrique */
.reportage{display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:1.6rem clamp(2rem,5vw,4.5rem);padding:2.4rem 0 3rem;border-top:1px solid var(--filet-2)}
.reportage header .i{font:italic 300 1rem var(--serif);color:var(--or)}
.reportage header .quand{font:italic 300 clamp(1.5rem,2.6vw,2.1rem)/1.15 var(--serif);color:var(--or-2);margin:.2rem 0 .5rem}
.reportage header h3{font:400 1.3rem/1.2 var(--serif)}
.reportage header .ar{display:block;font:700 1.35rem/1.7 var(--ruqaa);color:var(--or)}
.reportage header .note{color:var(--gris);font-size:.92rem;margin-top:.6rem}
.planche{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2.2rem clamp(1rem,2.5vw,2.2rem);align-items:start}
.planche .ph{grid-column:span 6}
.planche .ph:nth-child(4n+1){grid-column:1/9}
.planche .ph:nth-child(4n+2){grid-column:9/13;margin-top:clamp(2rem,10vw,9rem)}
.planche .ph:nth-child(4n+3){grid-column:2/7}
.planche .ph:nth-child(4n+4){grid-column:7/13;margin-top:clamp(1rem,5vw,4rem)}
.planche .ph:last-child:nth-child(4n+1){grid-column:1/10}
.planche .ph img{filter:brightness(.95)}
@media (max-width:900px){.reportage{grid-template-columns:1fr}}
@media (max-width:600px){.planche{grid-template-columns:1fr}.planche .ph,.planche .ph:nth-child(n){grid-column:1;margin-top:0}}
.credits-photos{margin:1rem 0 0;padding-left:1.4rem;font-size:.88rem;color:var(--gris);max-width:90ch}
.credits-photos li{margin-bottom:.5rem}
.credits-photos b{font-weight:400;color:var(--ivoire)}
/* « En images » : publications officielles, chargées au clic */
.integrations{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,21rem),1fr));gap:0 clamp(1.5rem,4vw,3rem)}
.integration{border-top:1px solid var(--filet-2);padding:1.3rem 0 1.6rem;min-width:0}
.integration .quand{font:500 .64rem/1.6 var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin:0}
.integration h3{font:400 1.3rem/1.2 var(--serif);margin:.2rem 0}
.integration .ar{display:block;font-size:1rem;color:var(--or)}
.integration p{font-size:.92rem;color:var(--gris);margin:.5rem 0}
.integration .declencheur{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;border-left:1px solid var(--or);padding:.3rem 0 .3rem 1rem;margin:.9rem 0}
.integration .declencheur span{flex:1 1 14rem;font-size:.8rem;color:var(--gris-2)}
.integration .afficher{font:500 .72rem/1 var(--lat);letter-spacing:.2em;text-transform:uppercase;color:var(--nuit);background:var(--or);border:0;min-height:2.6rem;padding:0 1.2rem;cursor:pointer}
.integration .afficher:hover{background:var(--or-2)}
.integration .cadre{margin:.9rem 0;max-width:34rem}
.integration .cadre iframe{display:block;width:100%;border:0;background:var(--ivoire)}
.integration .meta{font-size:.82rem}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.site-head,.lecteur,.filtres,.onglets{display:none}body{background:#fff;color:#000}}

/* page Sources : méthode et crédits, en petit */
#methode h3.sous{font:300 clamp(1.25rem,2vw,1.6rem)/1.2 var(--serif);margin:2rem 0 .6rem;display:flex;flex-wrap:wrap;gap:.2rem 1rem;align-items:baseline}
#methode h3.sous:first-child{margin-top:0}
#methode h3.sous .ar{font:700 1.2rem var(--ruqaa);color:var(--or)}
#methode p{color:var(--gris)}
#credits .credits-photos{font-size:.8rem}
#credits .note{font-size:.8rem}
footer .credits-lien{font-size:.85em;color:var(--gris-2)}

:root{--onde:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 22' preserveAspectRatio='none'%3E%3Cpath fill='%23d9b26f' d='M0,10 L9,10 L18,10 L28,10 L37,10 L47,10 L56,10 L65,10 L75,9 L84,10 L94,10 L103,10 L112,9 L122,10 L131,10 L141,9 L150,10 L160,9 L169,8 L178,9 L188,9 L197,8 L207,8 L216,9 L225,9 L235,9 L244,9 L254,9 L263,8 L272,8 L282,9 L291,8 L301,8 L310,7 L320,8 L329,9 L338,9 L348,9 L357,9 L367,8 L376,9 L385,8 L395,7 L404,7 L414,8 L423,9 L432,8 L442,7 L451,9 L461,8 L470,9 L480,9 L489,7 L498,6 L508,7 L517,9 L527,6 L536,4 L545,7 L555,8 L564,8 L574,7 L583,6 L592,6 L602,6 L611,7 L621,3 L630,2 L640,4 L649,5 L658,5 L668,5 L677,7 L687,8 L696,5 L705,7 L715,3 L724,3 L734,2 L743,5 L752,5 L762,4 L771,4 L781,6 L790,6 L800,8 L809,7 L818,6 L828,4 L837,7 L847,7 L856,5 L865,4 L875,6 L884,8 L894,8 L903,7 L912,8 L922,7 L931,8 L941,8 L950,6 L960,5 L969,7 L978,8 L988,8 L997,6 L1007,8 L1016,9 L1025,8 L1035,8 L1044,6 L1054,6 L1063,7 L1072,7 L1082,6 L1091,5 L1101,6 L1110,7 L1120,8 L1129,8 L1138,7 L1148,7 L1157,6 L1167,7 L1176,6 L1185,5 L1195,5 L1204,6 L1214,8 L1223,7 L1232,8 L1242,8 L1251,7 L1261,9 L1270,8 L1280,7 L1289,6 L1298,7 L1308,9 L1317,8 L1327,7 L1336,8 L1345,9 L1355,9 L1364,9 L1374,9 L1383,8 L1392,9 L1402,10 L1411,9 L1421,9 L1430,9 L1440,10 L1449,10 L1458,10 L1468,10 L1477,10 L1487,10 L1496,10 L1505,10 L1515,10 L1524,10 L1534,10 L1543,10 L1552,10 L1562,10 L1571,10 L1581,10 L1590,10 L1600,10 L1600,11 L1590,11 L1581,11 L1571,11 L1562,11 L1552,11 L1543,11 L1534,11 L1524,11 L1515,11 L1505,11 L1496,11 L1487,11 L1477,11 L1468,11 L1458,12 L1449,11 L1440,12 L1430,12 L1421,13 L1411,12 L1402,11 L1392,12 L1383,13 L1374,12 L1364,12 L1355,12 L1345,12 L1336,13 L1327,14 L1317,13 L1308,12 L1298,14 L1289,15 L1280,14 L1270,14 L1261,13 L1251,14 L1242,13 L1232,13 L1223,14 L1214,13 L1204,15 L1195,16 L1185,16 L1176,15 L1167,14 L1157,15 L1148,14 L1138,14 L1129,14 L1120,13 L1110,14 L1101,15 L1091,16 L1082,15 L1072,14 L1063,15 L1054,15 L1044,15 L1035,13 L1025,13 L1016,12 L1007,13 L997,15 L988,13 L978,13 L969,14 L960,16 L950,15 L941,13 L931,13 L922,14 L912,13 L903,14 L894,13 L884,13 L875,15 L865,18 L856,16 L847,14 L837,14 L828,17 L818,15 L809,14 L800,13 L790,15 L781,15 L771,17 L762,17 L752,16 L743,16 L734,19 L724,18 L715,18 L705,14 L696,16 L687,13 L677,14 L668,16 L658,16 L649,16 L640,18 L630,19 L621,18 L611,14 L602,15 L592,15 L583,15 L574,14 L564,13 L555,14 L545,14 L536,17 L527,15 L517,13 L508,14 L498,16 L489,14 L480,12 L470,12 L461,13 L451,12 L442,14 L432,13 L423,12 L414,13 L404,15 L395,14 L385,13 L376,12 L367,13 L357,12 L348,12 L338,12 L329,12 L320,13 L310,14 L301,13 L291,13 L282,12 L272,13 L263,13 L254,13 L244,12 L235,12 L225,12 L216,12 L207,13 L197,13 L188,12 L178,13 L169,13 L160,13 L150,11 L141,12 L131,11 L122,11 L112,12 L103,12 L94,11 L84,11 L75,12 L65,12 L56,11 L47,11 L37,11 L28,11 L18,11 L9,11 L0,11Z'/%3E%3C/svg%3E")}