/* ══════════════════════════════════════════════════════════════════════════
   ATHENORA — cartes d'article (Éclairages) : date, titre, extrait, rubrique avec son logo.
   Partagées par la liste et les pages des Éclairages et par l'accueil (articles épinglés).
   Formats : une (titre en Butler), haute, large, simple, breve.
   ══════════════════════════════════════════════════════════════════════════ */

.carte,.carte-lien{display:flex;flex-direction:column;height:100%}
.carte-lien:hover{color:inherit}
.carte-date{font-size:12px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--body)}
.carte-titre{margin-top:14px;font-weight:500;font-size:20px;line-height:1.35;color:var(--ink);text-wrap:balance;transition:color .35s}
.carte-lien:hover .carte-titre,.carte-lien:focus-visible .carte-titre{color:var(--acc)}
.carte-extrait{margin-top:14px;font-size:15.5px;line-height:1.65;color:var(--body);text-wrap:pretty;overflow-wrap:anywhere}
.carte-rubrique{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:13px;line-height:1.35;letter-spacing:.02em;color:var(--body)}
/* logo du cercle : l'image sert de masque, la couleur est celle de l'accent du fond (bleu sur ciel, or sur nuit) */
.carte-logo{display:block;width:34px;height:34px;flex:none;color:var(--acc)}
span.carte-logo{background:currentColor;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}
.carte-chouette use{fill:currentColor}
.logo-cercle_europe{--logo:url("../img/icon-europe-nuit.png")}
.logo-cercle_technologie{--logo:url("../img/icon-tech-nuit.png")}
.logo-cercle_sociale{--logo:url("../img/icon-sociale-nuit.png")}

/* l'article de tête : titre en Butler, chapô en deux colonnes séparées d'un filet */
.carte-une .carte-titre{margin-top:18px;font-family:var(--serif);font-weight:800;font-size:clamp(30px,3vw,44px);line-height:1.18;max-width:18em}
.carte-une .carte-extrait{margin-top:26px;font-size:17px;line-height:1.7;column-count:2;column-gap:44px;column-rule:1px solid var(--line)}
.carte-une .carte-rubrique{font-size:14px}
/* l'article haut (deux rangées) : un long extrait, plus aéré */
.carte-haute .carte-titre{font-size:24px}
.carte-haute .carte-extrait{margin-top:20px;font-size:16px;line-height:1.75}
/* les brèves : plus serrées */
.carte-breve .carte-titre{font-size:17px}
.carte-breve .carte-extrait{font-size:14.5px}
/* les articles larges : titre un cran au-dessus, extrait plus long */
.carte-large .carte-titre{font-size:24px;max-width:26em}
.carte-large .carte-extrait{font-size:16px;max-width:44em}