*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Georgia,'Times New Roman',serif;line-height:1.8;color:#222;background:#f4f1eb}
.astro-PyeTC1pN{max-width:1100px;margin:0 auto;padding:0 24px}
.astro-AWpBxrzC{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:48px 0;text-align:center;margin-bottom:48px}
.astro-AWpBxrzC h1{font-size:36px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.astro-AWpBxrzC p{font-size:16px;opacity:.8;font-style:italic}
.astro-AWpBxrzC .astro-3P7yKUyz{color:#fff;text-decoration:none;font-size:20px;letter-spacing:1px;text-transform:uppercase}
.astro-OI2UDRNW{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}
.astro-HuEFpzGY{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:28px;transition:box-shadow .2s}
.astro-HuEFpzGY:hover{box-shadow:0 4px 20px rgba(0,0,0,.14)}
.astro-HuEFpzGY h2{font-size:22px;margin-bottom:10px;line-height:1.3}
.astro-HuEFpzGY h2 a{color:#2c3e50;text-decoration:none}
.astro-HuEFpzGY .astro-MP2tW5AX{font-size:12px;color:#888;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}
.astro-HuEFpzGY p{font-size:15px;color:#555;margin-bottom:14px}
.astro-XSoLto7z{color:#e74c3c;text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.astro-9TnRTo4b{max-width:780px;margin:0 auto;padding:0 24px 60px}
.astro-9TnRTo4b h1{font-size:36px;margin-bottom:10px;line-height:1.2}
.astro-9TnRTo4b .astro-MP2tW5AX{font-size:13px;color:#888;display:block;margin-bottom:28px;text-transform:uppercase;letter-spacing:1px}
.astro-9TnRTo4b h2{font-size:24px;margin:36px 0 14px}
.astro-9TnRTo4b h3{font-size:19px;margin:28px 0 10px}
.astro-9TnRTo4b p{margin-bottom:18px;font-size:17px}
.astro-9TnRTo4b ul,.astro-9TnRTo4b ol{margin:0 0 18px 28px}
.astro-9TnRTo4b a{color:#e74c3c}
.astro-9TnRTo4b img{max-width:100%;height:auto;border-radius:4px;margin:20px 0}
.astro-3dR9jmTo{border-top:2px solid #ddd;padding:28px 0;margin-top:48px;text-align:center;font-size:13px;color:#888}
.astro-3dR9jmTo a{color:#888}
.astro-kfFsGKAE{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:14px 0;margin-bottom:28px;font-size:14px;color:#888;font-style:italic;text-align:center}
.astro-bUbDY261{background:#f9f3e3;padding:16px 20px;margin-top:28px;font-size:13px;color:#7a6230;border-radius:4px}
.astro-5erFrfz3{font-size:11px;color:#888;margin:-22px 0 28px;text-transform:uppercase;letter-spacing:1.5px}
.astro-y3plqY6k{margin:0 0 28px}
.astro-lrze4KZV{width:100%;height:auto;border-radius:4px}
.astro-BuJ1QyyP{border-top:2px solid #ddd;margin-top:40px;padding-top:24px}
.astro-BuJ1QyyP h4{font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;color:#888}
.mag-related-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mag-related-item a{color:#2c3e50;text-decoration:none;font-size:15px}
.mag-related-item a:hover{color:#e74c3c}
.astro-pkBbFB5I{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:22px 28px;margin-top:28px}
.astro-pkBbFB5I p{font-size:15px;padding:4px 0;margin:0}
.astro-pkBbFB5I .astro-MP2tW5AX{margin:0 8px 0 0;display:inline}
.astro-pkBbFB5I a{color:#2c3e50;text-decoration:none}
.astro-pkBbFB5I a:hover{color:#e74c3c}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Playfair+Display:wght@400;700&display=swap');
body{font-family:'Lora',sans-serif;color:#2C3E50;background:#F9FBF9}
.astro-AWpBxrzC{background:#2D4F4F;color:#fff}
.astro-AWpBxrzC h1{font-family:'Playfair Display',serif;color:#fff}
.astro-AWpBxrzC p{color:rgba(255,255,255,.75)}
.astro-AWpBxrzC a{color:#fff;text-decoration:none}
.card h2{font-family:'Playfair Display',serif}
.card h2 a{color:#2D4F4F}
.card h2 a:hover{color:#E2A03F}
.read-more{color:#E2A03F}
.article-content h1{font-family:'Playfair Display',serif}
.article-content h2{font-family:'Playfair Display',serif}
.article-content a{color:#E2A03F}
.article-content img{border-radius:12px}
.affiliate-disclosure{border-radius:12px}
.ymyl-disclaimer{border-radius:12px}
/* === Custom === */
/* v.237560 — layout revision */

/* sg-spirit-fr — « Clairene »  (soinlumiere.com, Astro build)
   Persona : Lyonnaise quarantaine, admin PME, sceptique-curieuse du Reiki.
             Ton confidence-à-une-amie, honnête, sans promesse miracle.
   Palette : pin-teal #2D5A5E (identité déployée) + cuivre #B8693D
             + moment sauge #5C6B4A (2 endroits : lettrine + label incontournables)
   Type    : Spectral (serif display+corps) · Mulish (méta bas-de-casse traqué)
   NB      : les classes réelles sont obfusquées (astro-xxxxx) — on cible en
             structurel + :root pour battre les règles de gabarit (0,1,x).
             Le @import de tête est ignoré par Chromium (règles avant lui) :
             on déclare donc les webfonts en @font-face (indépendant de la position).
*/

/* ── Webfonts (position-independent) ──────────────────────────── */
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCr-xNNww_2s0amA9M3knj-SA.woff2) format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:500;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCs-xNNww_2s0amA9vKsW3PafadWQ.woff2) format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:600;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCs-xNNww_2s0amA9vmtm3PafadWQ.woff2) format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:700;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCs-xNNww_2s0amA9uCt23PafadWQ.woff2) format('woff2');}
@font-face{font-family:'Spectral';font-style:italic;font-weight:400;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCt-xNNww_2s0amA9M8onTmTMuk.woff2) format('woff2');}
@font-face{font-family:'Spectral';font-style:italic;font-weight:600;font-display:swap;
  src:url(https://fonts.gstatic.com/s/spectral/v15/rnCu-xNNww_2s0amA9M8qqXCWfqFXUIJ.woff2) format('woff2');}
@font-face{font-family:'Mulish';font-style:normal;font-weight:300 800;font-display:swap;
  src:url(https://fonts.gstatic.com/s/mulish/v18/1Ptvg83HX_SGhgqk0QotcqA.woff2) format('woff2');}

/* ── Design tokens ────────────────────────────────────────────── */
:root {
  --paper:      #FAF6F0;   /* page — warm cream, jamais blanc pur */
  --paper-2:    #F4EDDF;   /* cartes */
  --paper-3:    #EFE6D4;   /* héros / bandeaux clairs */
  --ink:        #29303A;
  --ink-soft:   #6B6A63;
  --primary:    #2D5A5E;   /* pin-teal */
  --primary-dk: #1F4145;
  --accent:     #B8693D;   /* cuivre — l'accent chaud, utilisé franchement 1× */
  --accent-dk:  #96522D;
  --moment:     #5C6B4A;   /* sauge — 2 endroits seulement */
  --line:       rgba(45,90,94,.16);
  --line-soft:  rgba(41,48,58,.12);

  --serif: 'Spectral', Georgia, 'Times New Roman', serif;
  --sans:  'Mulish', system-ui, -apple-system, sans-serif;
}

/* ── Base ─────────────────────────────────────────────────────── */
:root body{
  background-color: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}
:root main{ max-width: 1140px; margin-inline:auto; padding-inline: 24px; }

/* Generic headings fallback (article body handled below) */
:root h1,:root h2,:root h3,:root h4{
  font-family: var(--serif);
  color: var(--primary-dk);
  line-height: 1.22;
  font-weight: 600;
}

/* ══════════════════════════════════════════════════════════════
   MASTHEAD  (body > nav ; shared by home + article)
   ══════════════════════════════════════════════════════════════ */
:root body > nav{
  background:
    linear-gradient(135deg, rgba(31,65,69,.86), rgba(45,90,94,.62)),
    url("/theme-assets/hero-masthead.jpg") center 38%/cover no-repeat;
  color:#fff;
  text-align:center;
  padding: 58px 24px 52px;
  margin-bottom: 76px;
  border-bottom: 3px solid var(--accent);
}
:root body > nav > div{ max-width: 900px; }

/* Wordmark — serif italic, out-specify the template's uppercase (0,1,1) / (0,2,0) */
:root body > nav h1{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  text-transform: none;
  letter-spacing: .01em;
  font-size: clamp(2.4rem, 5.4vw, 3.4rem);
  line-height: 1.05;
  color:#fff;
  margin: 0 0 .5rem;
}
:root body > nav a:not([hidden]){          /* article-page wordmark link (beats 0,2,0) */
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  text-transform: none;
  letter-spacing: .01em;
  font-size: clamp(1.5rem, 3vw, 1.9rem);
  color:#fff;
  text-decoration:none;
}
/* Manifesto line under wordmark — the signature voice */
:root body > nav p{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 1.06rem;
  line-height: 1.55;
  color: rgba(255,255,255,.9);
  max-width: 40ch;
  margin: .35rem auto 0;
  opacity:1;
}

/* ══════════════════════════════════════════════════════════════
   HOMEPAGE GRID  (main:not(:has(> article)) > div:first-of-type)
   6-col rail : héros(6) · incontournables(2×3) · journal(3×2)
   ══════════════════════════════════════════════════════════════ */
:root main:not(:has(> article)) > div:first-of-type{
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  column-gap: 2rem;
  row-gap: 2.6rem;
  margin: 0;
}

/* -- Base card (all 15) -------------------------------------------------- */
:root main:not(:has(> article)) > div:first-of-type > div{
  display:flex;
  flex-direction:column;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: 0 1px 4px rgba(31,65,69,.05);
  padding: 26px 30px 24px;
  position: relative;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
:root main:not(:has(> article)) > div:first-of-type > div:hover{
  box-shadow: 0 8px 24px rgba(31,65,69,.12);
  transform: translateY(-2px);
  border-color: rgba(45,90,94,.32);
}
/* date kicker */
:root main:not(:has(> article)) > div:first-of-type > div > p:nth-of-type(1){
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--accent-dk);
  margin: 0 0 12px;
  line-height:1.4;
}
/* title */
:root main:not(:has(> article)) > div:first-of-type > div > h2{
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.24rem;
  line-height: 1.28;
  margin: 0 0 12px;
}
:root main:not(:has(> article)) > div:first-of-type > div > h2 > a{
  color: var(--primary-dk);
  text-decoration: none;
}
:root main:not(:has(> article)) > div:first-of-type > div > h2 > a:hover{ color: var(--accent); }
/* excerpt — clamp to 3 lines to keep row heights even */
:root main:not(:has(> article)) > div:first-of-type > div > p:nth-of-type(2){
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0 0 16px;
  max-width: 64ch;
  display:-webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* read-more */
:root main:not(:has(> article)) > div:first-of-type > div > a{
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
  margin-top: auto;
}
:root main:not(:has(> article)) > div:first-of-type > div > a:hover{ color: var(--primary); }

/* -- HÉROS : carte 1, pleine largeur ------------------------------------- */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1){
  grid-column: 1 / -1;
  background: var(--paper-3);
  border-top: 4px solid var(--primary);
  padding: 44px 48px 40px;
  border-radius: 11px;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1)::before{
  content:"À la une";
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--primary);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > p:nth-of-type(1){
  color: var(--accent-dk);
  margin-top: 14px;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > h2{
  font-size: clamp(2rem, 4.4vw, 3rem);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -.01em;
  margin-bottom: 18px;
  max-width: 20ch;
}
/* héros excerpt : plein, gros, lettrine sauge (moment 1/2) */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > p:nth-of-type(2){
  font-size: 1.28rem;
  line-height: 1.5;
  color: var(--ink);
  max-width: 60ch;
  display:block;
  -webkit-line-clamp: none;
  overflow: visible;
  margin-bottom: 22px;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > p:nth-of-type(2)::first-letter{
  font-family: var(--serif);
  font-weight: 700;
  font-size: 3.5em;
  line-height: .78;
  float: left;
  margin: .06em .12em 0 0;
  color: var(--moment);
}
/* héros CTA en pilule cuivre soulignée — l'accent chaud, 1 fois franchement */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > a{
  align-self:flex-start;
  margin-top: 6px;
  padding: 11px 22px;
  border: 1.5px solid var(--accent);
  border-radius: 999px;
  color: var(--accent);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1) > a:hover{
  background: var(--accent);
  color: var(--paper);
}

/* -- INCONTOURNABLES : cartes 2-4, bandeau 3 colonnes ------------------- */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(2),
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(3),
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(4){
  grid-column: span 2;
  margin-top: 3.4rem;
}
/* label plein-rang, ancré à la carte 2, débordant vers la droite (moment 2/2) */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(2)::before{
  content:"Les incontournables · à lire d’abord";
  position:absolute;
  left:0;
  bottom: calc(100% + 1.1rem);
  width: calc(300% + 4rem);
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--primary-dk);
  padding-bottom: 10px;
  border-bottom: 2px solid var(--moment);
}

/* -- JOURNAL : cartes 5+, 2 colonnes ------------------------------------ */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(n+5){
  grid-column: span 3;
}
/* carte impaire esseulée en fin de flux : pleine largeur, centrée */
:root main:not(:has(> article)) > div:first-of-type > div:last-child:nth-of-type(odd){
  grid-column: 1 / -1;
  align-items:center;
  text-align:center;
}
:root main:not(:has(> article)) > div:first-of-type > div:last-child:nth-of-type(odd) > p:nth-of-type(2){ max-width:64ch; }
:root main:not(:has(> article)) > div:first-of-type > div:last-child:nth-of-type(odd) > a{ margin-top:14px; }

/* -- STRIP 1 « CI-DESSOUS » : photo, entre incontournables et journal --- */
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(5),
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(6){
  margin-top: 15rem;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(5)::before{
  content:"Ci-dessous";
  position:absolute;
  left:0;
  bottom: calc(100% + 1.5rem);
  width: calc(200% + 2rem);
  height: 200px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 9px;
  background:
    linear-gradient(rgba(20,34,36,.55), rgba(20,34,36,.28)),
    url("/theme-assets/article-hero.jpg") center 30%/cover no-repeat;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .32em;
  text-transform: uppercase;
  color:#fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
}

/* ══════════════════════════════════════════════════════════════
   ARCHIVE TAIL  (main:not(:has(> article)) > div:not(:first-of-type))
   pleine largeur · index multi-colonnes · STRIP 2 « LES ARCHIVES »
   ══════════════════════════════════════════════════════════════ */
:root main:not(:has(> article)) > div:not(:first-of-type){
  position:relative;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: 0 1px 4px rgba(31,65,69,.05);
  padding: 34px 36px 28px;
  margin-top: 20rem;      /* place pour le strip photo au-dessus */
}
:root main:not(:has(> article)) > div:not(:first-of-type)::before{
  content:"Les archives";
  position:absolute;
  left:0;
  bottom: calc(100% + 1.6rem);
  width: 100%;
  height: 210px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 9px;
  background:
    linear-gradient(rgba(20,34,36,.58), rgba(20,34,36,.3)),
    url("/theme-assets/article-hero.jpg") center 72%/cover no-repeat;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .32em;
  text-transform: uppercase;
  color:#fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
}
/* full-row heading via ::after label */
:root main:not(:has(> article)) > div:not(:first-of-type) > p{
  break-inside: avoid;
  margin: 0;
  padding: 9px 0;
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.4;
  border-bottom: 1px dotted rgba(41,48,58,.16);
}
:root main:not(:has(> article)) > div:not(:first-of-type){ columns: 2; column-gap: 40px; }
:root main:not(:has(> article)) > div:not(:first-of-type) > p > span{
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--ink-soft);
  margin-right: 8px;
}
:root main:not(:has(> article)) > div:not(:first-of-type) > p > a{
  color: var(--primary-dk);
  text-decoration: none;
}
:root main:not(:has(> article)) > div:not(:first-of-type) > p > a:hover{ color: var(--accent); }

/* ══════════════════════════════════════════════════════════════
   ARTICLE PAGE  (main:has(> article))
   ══════════════════════════════════════════════════════════════ */
:root main:has(> article){ max-width: 760px; }
:root main:has(> article) > h1{
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.12;
  letter-spacing: -.01em;
  color: var(--primary-dk);
  margin: 8px 0 12px;
}
:root main:has(> article) > time{
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--accent-dk);
  display:block;
  margin-bottom: 30px;
}
:root main:has(> article) > article > p{
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.8;
  color: var(--ink);
  margin: 0 0 20px;
}
:root main:has(> article) > article > h2{
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.6rem;
  line-height: 1.25;
  color: var(--primary-dk);
  margin: 44px 0 16px;
  text-align:center;
}
/* dinkus au-dessus de chaque H2 */
:root main:has(> article) > article > h2::before{
  content:"✦ ✦ ✦";
  display:block;
  font-size: .62rem;
  letter-spacing: .5em;
  color: var(--primary);
  opacity:.55;
  margin: 0 0 18px;
}
:root main:has(> article) > article > h3{
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.22rem;
  color: var(--primary-dk);
  margin: 32px 0 12px;
}
:root main:has(> article) > article > blockquote{
  position:relative;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.22rem;
  line-height: 1.5;
  color: var(--primary-dk);
  background: var(--paper-3);
  border: none;
  border-left: 3px solid var(--accent);
  border-radius: 0 9px 9px 0;
  margin: 32px 0;
  padding: 22px 28px 22px 56px;
}
:root main:has(> article) > article > blockquote::before{
  content:"\201C";
  position:absolute;
  left: 14px;
  top: 2px;
  font-family: var(--serif);
  font-size: 3.2rem;
  line-height:1;
  color: var(--accent);
  opacity:.55;
}
:root main:has(> article) > article > blockquote p{ margin:0; }
:root main:has(> article) > article > ul,
:root main:has(> article) > article > ol{ margin: 0 0 20px 1.4em; }
:root main:has(> article) > article > ul > li,
:root main:has(> article) > article > ol > li{
  font-size: 18px; line-height: 1.7; margin-bottom: 9px; padding-left: 4px;
}
:root main:has(> article) > article > ul > li::marker{ color: var(--accent); }
:root main:has(> article) > article > ol > li::marker{ color: var(--accent); font-weight:700; }
:root main:has(> article) > article > figure img,
:root main:has(> article) > article img{ border-radius: 10px; }

/* body links */
:root main:has(> article) > article p a,
:root main:has(> article) > article li a{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: .18em;
  text-decoration-thickness: 1px;
}
:root main:has(> article) > article p a:hover,
:root main:has(> article) > article li a:hover{ color: var(--primary); }

/* affiliate CTAs (inline mid-phrase /ref/ /go/) — liens forts, out-specify body-link */
:root main:has(> article) > article p a[href^="/ref/"],
:root main:has(> article) > article p a[href^="/go/"],
:root main:has(> article) > article li a[href^="/ref/"],
:root main:has(> article) > article li a[href^="/go/"]{
  color: var(--accent-dk);
  font-weight: 700;
  text-decoration-thickness: 2px;
  text-decoration-color: rgba(184,105,61,.45);
}
:root main:has(> article) > article p a[href^="/ref/"]:hover,
:root main:has(> article) > article p a[href^="/go/"]:hover,
:root main:has(> article) > article li a[href^="/ref/"]:hover,
:root main:has(> article) > article li a[href^="/go/"]:hover{
  color: var(--paper);
  background: var(--accent);
  text-decoration: none;
  border-radius: 3px;
  box-shadow: 0 0 0 3px var(--accent);
}

/* ── Footer ───────────────────────────────────────────────────── */
:root body > footer{
  background: var(--primary-dk);
  color: rgba(255,255,255,.72);
  border-top: 3px solid var(--accent);
  text-align:center;
  padding: 30px 24px;
  margin-top: 80px;
  font-family: var(--sans);
  font-size: 13px;
  letter-spacing: .04em;
}
:root body > footer a{ color: rgba(255,255,255,.9); text-decoration: underline; text-underline-offset:.2em; }
:root body > footer a:hover{ color: var(--accent); }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 780px){
  :root body{ font-size: 16px; }
  :root body > nav{ padding: 44px 20px 40px; margin-bottom: 52px; }

  /* single column — reset every span (span N crée des pistes implicites ;
     les resets doivent égaler la spécificité des règles nth-of-type d'origine) */
  :root main:not(:has(> article)) > div:first-of-type{
    grid-template-columns: 1fr;
    row-gap: 2rem;
  }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(1){ padding: 32px 26px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(2),
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(3),
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(4){ grid-column: 1 / -1; margin-top: 0; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(2){ margin-top: 3rem; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(2)::before{ width: 100%; }

  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(n+5){ grid-column: 1 / -1; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(5),
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(6){ margin-top: 0; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(5){ margin-top: 13rem; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-of-type(5)::before{ width: 100%; height: 170px; }

  :root main:not(:has(> article)) > div:not(:first-of-type){ columns: 1; margin-top: 13rem; }
  :root main:not(:has(> article)) > div:not(:first-of-type)::before{ height: 170px; }

  :root main:has(> article) > article > blockquote{ padding: 20px 20px 20px 48px; }
}