/* fonts:start (self-hosted, SIL Open Font License 1.1) */
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-mono-400-latin.08949f72.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ibm-plex-mono-500-latin.01d28544.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/ibm-plex-mono-600-latin.0d1f0b8d.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:400 600;font-display:swap;src:url(/fonts/newsreader-400-600-italic-latin.5dfcd10d.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/newsreader-400-700-latin.6e4f2958.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* fonts:end */
:root{--paper:#fbf7f1;--ink:#2a1f1d;--soft:#6a5b54;--rule:#e4d9cc;--ruby:#9b1c31;--ruby-dark:#6f1222;--tint:#f3e9dc;--card:#fffdf9;--code:#2b2420;--codefg:#f4ead8;
--serif:"Newsreader",Charter,"Bitstream Charter","Iowan Old Style","Palatino Linotype",Georgia,serif;--mono:"IBM Plex Mono","SF Mono",Menlo,Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:19px/1.62 var(--serif);font-optical-sizing:auto}
a{color:var(--ruby);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:var(--ruby-dark)}
a:focus-visible{outline:2px solid var(--ruby);outline-offset:3px}
img{max-width:100%;height:auto}
.in{max-width:1132px;margin:0 auto;padding:0 16px}

/* Bandeau, en-tête */
.banner{background:var(--ruby-dark);color:#f6e9e2;font:500 .66rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.banner .in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 26px;padding-top:7px;padding-bottom:7px}
.banner span+span{color:#ecd0c6}
header.site{border-bottom:1px solid var(--rule);background:var(--paper)}
header.site .in{display:flex;align-items:center;justify-content:space-between;gap:10px 32px;padding-top:20px;padding-bottom:18px}
.logo{display:inline-block;color:var(--ink);text-decoration:none;font:600 1.85rem/1 var(--serif);letter-spacing:-.01em}
.logo i{font-style:italic;font-weight:500;color:var(--ruby)}
.logo small{display:block;margin-top:7px;font:500 .64rem/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
header.site nav{display:flex;gap:4px 26px;font:500 .78rem/1.6 var(--mono);letter-spacing:.02em}
header.site nav a{color:var(--ink);text-decoration:none;padding:4px 0;border-bottom:1px solid transparent;white-space:nowrap}
header.site nav a:hover{color:var(--ruby);border-bottom-color:var(--ruby)}

/* Colonne de lecture */
main.in{max-width:calc(700px + 32px);padding-top:48px;padding-bottom:72px}
main.in:has(> .home){max-width:1132px;padding-top:44px}
h1{font-size:2.6rem;line-height:1.1;font-weight:600;letter-spacing:-.015em;margin:.1em 0 .4em;text-align:center}
h2{font-size:1.55rem;line-height:1.25;margin:2em 0 .5em;font-weight:600;letter-spacing:-.01em}
h3{font-size:1.18rem;margin:1.6em 0 .3em;color:var(--ruby-dark);font-weight:600}
.kicker{text-align:center;margin:0 0 .8em;font:500 .74rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.kicker a{color:var(--ruby);text-decoration:none}.kicker a::before,.kicker a::after{content:"\2014";color:#c9b8a8;margin:0 .6em}
.meta{text-align:center;color:var(--soft);font:.74rem/1.5 var(--mono);letter-spacing:.03em;text-transform:uppercase;margin:0 0 2em}
.meta a{color:var(--soft)}
.lede{font-size:1.24rem;line-height:1.55;color:#3d302c;font-style:italic}
blockquote,.note{margin:1.5em 0;padding:.9em 1.2em;background:var(--tint);border-left:3px solid var(--ruby);font-size:.95em}
pre{background:var(--code);color:var(--codefg);padding:16px 18px;overflow-x:auto;font:14px/1.6 var(--mono);border-radius:3px}
code{font-family:var(--mono);font-size:.8em;font-weight:500}:not(pre)>code{background:var(--tint);color:var(--ruby-dark);padding:.1em .35em;border-radius:3px}
pre code{color:inherit;font-weight:400}
table{border-collapse:collapse;width:100%;margin:1.3em 0;font-size:.9rem;display:block;overflow-x:auto}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
th{font:600 .72rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--soft);border-bottom:2px solid var(--ink)}
figure.lead{margin:0 -40px 2.4em}
figure.lead img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--tint);border-radius:3px}
figure.lead figcaption{margin:.7em 40px 0;text-align:center;font-style:italic;font-size:.9rem;line-height:1.45;color:var(--soft)}
ul.sources li{margin:.5em 0}

/* Pages de rubrique */
ul.list{list-style:none;padding:0;margin:1.2em 0}ul.list li{padding:16px 0;border-bottom:1px solid var(--rule)}
ul.list li a{font-weight:600;font-size:1.1rem;text-decoration:none;color:var(--ink)}ul.list li a:hover{color:var(--ruby)}
ul.list li p{margin:.25em 0 0;color:var(--soft);font-size:.95rem;line-height:1.5}
ul.list li.has-img{display:grid;gap:12px}
ul.list li.has-img img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px;background:var(--tint)}
ul.grid{list-style:none;padding:0;margin:1.2em 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
ul.grid li a{display:block;height:100%;padding:16px 16px 18px;background:var(--card);border:1px solid var(--rule);border-top:3px solid var(--ruby);text-decoration:none;color:var(--ink)}
ul.grid li a:hover{border-color:var(--ruby)}ul.grid strong{display:block;font-size:1.08rem;margin-bottom:4px;color:var(--ruby-dark)}ul.grid span{font-size:.9rem;color:var(--soft);line-height:1.45}

/* Cartes photo */
.cards{display:grid;grid-template-columns:1fr;gap:28px 24px;margin:1.2em 0}
.card{display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.card .ph{display:block;margin-bottom:14px;overflow:hidden;border-radius:3px}
.card .ph img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--tint);transition:transform .4s ease}
.card:hover .ph img{transform:scale(1.035)}
.card .label{display:block;font:500 .68rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ruby)}
.card h3{font-size:1.3rem;line-height:1.2;margin:.3em 0 .3em;color:var(--ink);font-weight:600;letter-spacing:-.01em}
.card:hover h3{color:var(--ruby-dark);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.card p{margin:0;font-size:.95rem;line-height:1.5;color:var(--soft)}
.readnext{margin:3.4em 0 0;padding-top:1.2em;border-top:1px solid var(--ink)}
.readnext-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;margin-bottom:.4em}
.readnext-head h2{margin:0;font-size:1.35rem}
.readnext-head a{font:500 .74rem/1.4 var(--mono);letter-spacing:.03em;text-transform:uppercase}

/* Accueil */
.eyebrow{display:block;margin:0;font:500 .72rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ruby)}
.opening{display:grid;grid-template-columns:1fr;gap:28px;align-items:center;padding-bottom:48px;border-bottom:1px solid var(--rule)}
.opening h1{text-align:left;font-size:clamp(2.3rem,4.6vw,3.7rem);line-height:1.04;font-weight:600;letter-spacing:-.025em;margin:.35em 0 .4em}
.opening h1 em{color:var(--ruby);font-style:italic;font-weight:500}
.dek{font-size:1.24rem;line-height:1.55;color:#3d302c;margin:0 0 1.1em;max-width:34em}
.provenance{margin:0;padding-top:.9em;border-top:1px solid var(--rule);font:.78rem/1.6 var(--mono);color:var(--soft);max-width:44em}
.opening-img{margin:0}
.opening-img img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;background:var(--tint)}
.opening-img figcaption{margin-top:.6em;font-style:italic;font-size:.88rem;line-height:1.45;color:var(--soft)}

.lead-story{margin:48px 0 0}
.lead-story a{display:grid;grid-template-columns:1fr;background:var(--tint);color:var(--ink);text-decoration:none;border-radius:4px;overflow:hidden}
.lead-img img{display:block;width:100%;height:100%;aspect-ratio:3/2;object-fit:cover}
.lead-body{display:flex;flex-direction:column;justify-content:center;padding:28px 24px 30px}
.lead-story h2{margin:.45em 0 .4em;font-size:clamp(1.6rem,2.8vw,2.2rem);line-height:1.12;letter-spacing:-.02em}
.lead-story a:hover h2{color:var(--ruby-dark)}
.lead-story p{margin:0;font-size:1.04rem;color:#3d302c}
.steps{display:flex;flex-wrap:wrap;gap:6px;margin-top:1.1em;counter-reset:st}
.steps span{counter-increment:st;font:500 .7rem/1 var(--mono);background:var(--card);border:1px solid #dccbb8;color:var(--ink);padding:6px 8px;border-radius:3px}
.steps span::before{content:counter(st)". ";color:var(--ruby)}
.go{align-self:flex-start;margin-top:1.4em;font:500 .78rem/1 var(--mono);color:#fff;background:var(--ruby);padding:12px 16px;border-radius:3px}
.lead-story a:hover .go{background:var(--ruby-dark)}

.shelf{margin:64px 0 0}
.shelf-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 18px;border-top:2px solid var(--ink);padding-top:12px;margin-bottom:22px}
.shelf-head h2{margin:0;font-size:1.75rem}
.shelf-head p{margin:0;color:var(--soft);font-size:1rem;font-style:italic}

.sections{display:grid;grid-template-columns:1fr;gap:36px}
.sec h3{margin:0 0 .3em;font-size:1.4rem}
.sec h3 a{color:var(--ink);text-decoration:none}.sec h3 a:hover{color:var(--ruby)}
.sec>p{margin:0 0 14px;color:var(--soft);font-size:.95rem;line-height:1.5}
.sec ul{list-style:none;margin:0 0 14px;padding:0;border-top:1px solid var(--ink)}
.sec li{margin:0;padding:10px 0 11px;border-bottom:1px solid var(--rule)}
.sec li a{display:block;color:var(--ink);text-decoration:none;font-weight:600;font-size:1.04rem;line-height:1.3}
.sec li a:hover{color:var(--ruby);text-decoration:underline}
.sec li span{display:block;margin-top:3px;font:.72rem/1.4 var(--mono);color:var(--ruby-dark)}
.all{font:500 .74rem/1.4 var(--mono);letter-spacing:.02em;text-transform:uppercase}
.all::after{content:" \2192"}

footer.site{border-top:2px solid var(--ink);color:var(--soft);font:.76rem/1.7 var(--mono);margin-top:24px}
footer.site .in{padding-top:22px;padding-bottom:32px}footer.site a{color:var(--ink)}
.fnote{margin:.6em 0 0;max-width:46rem}

@media (min-width:600px){.cards{grid-template-columns:repeat(2,1fr)}ul.list li.has-img{grid-template-columns:190px minmax(0,1fr);align-items:center}}
@media (min-width:740px){.readnext .cards{grid-template-columns:repeat(3,1fr)}.readnext .card h3{font-size:1.1rem}}
@media (min-width:860px){
 .opening{grid-template-columns:1.05fr 1fr;gap:56px}
 .lead-story a{grid-template-columns:1fr 1.1fr}
 .lead-body{padding:36px 40px}
 .sections{grid-template-columns:repeat(3,1fr);gap:40px}
}
@media (min-width:960px){.home .cards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:800px){figure.lead{margin-left:0;margin-right:0}figure.lead figcaption{margin-left:0;margin-right:0}}
@media (max-width:720px){
 header.site .in{flex-direction:column;align-items:flex-start;gap:12px;padding-top:16px;padding-bottom:12px}
 header.site nav{width:100%;overflow-x:auto;scrollbar-width:none;gap:4px 20px}
 header.site nav::-webkit-scrollbar{display:none}
 .banner .in{justify-content:flex-start}
}
@media (max-width:560px){body{font-size:18px}h1{font-size:2rem}.logo{font-size:1.6rem}main.in{padding-top:32px}main.in:has(> .home){padding-top:24px}.opening{padding-bottom:36px}.shelf{margin-top:48px}}
@media (max-width:560px){.banner span+span{display:none}}
