html[data-theme="dark"] {
--background-color: #0b0f19;
--color-lighter-gray: rgb(255 255 255 / 0.06);
--color-light-gray: #161c2b;
--color-mid-gray: #232b3f;
--color-dark-gray: #8b95a7;
--color-darker-gray: #e8eaf0;
--color-primary-text: #e8eaf0;
--color-secondary-text: rgb(232 234 240 / 0.6);
--color-border: rgb(255 255 255 / 0.1);
--color-dark-border: rgb(255 255 255 / 0.4);
}
html[data-theme="light"] {
--background-color: #ffffff;
--color-lighter-gray: rgb(0 0 0 / 0.05);
--color-light-gray: #eef1f6;
--color-mid-gray: #d4d9e2;
--color-dark-gray: #5a6472;
--color-darker-gray: #15171a;
--color-primary-text: #15171a;
--color-secondary-text: rgb(0 0 0 / 0.55);
--color-border: rgb(0 0 0 / 0.1);
--color-dark-border: rgb(0 0 0 / 0.5);
}
html[data-theme="dark"],
html[data-theme="dark"] body {
background-color: #0b0f19;
}
html[data-theme="light"],
html[data-theme="light"] body {
background-color: #ffffff;
}
html[data-theme="dark"].has-light-text {
--color-darker-gray: #e8eaf0;
--color-secondary-text: rgb(232 234 240 / 0.6);
--color-border: rgb(255 255 255 / 0.1);
}
html[data-theme="light"].has-light-text {
--color-darker-gray: #15171a;
--color-secondary-text: rgb(0 0 0 / 0.55);
--color-border: rgb(0 0 0 / 0.1);
--color-dark-border: rgb(0 0 0 / 0.5);
}
body,
.gh-card,
.gh-navigation,
.gh-footer {
transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
html[data-theme="dark"] .gh-navigation {
background: linear-gradient(180deg, #141b2e 0%, #0b0f19 100%);
border-bottom: 1px solid rgb(255 255 255 / 0.08);
}
html[data-theme="light"] .gh-navigation {
background: linear-gradient(180deg, #e8edf5 0%, #ffffff 100%);
border-bottom: 1px solid rgb(0 0 0 / 0.08);
}
.gh-navigation-actions {
background: transparent !important;
}
.gh-theme-toggle {
font-family: var(--font-mono);
font-size: 1.05rem;
letter-spacing: 0.08em;
cursor: pointer;
border: 1px solid var(--color-dark-border);
border-radius: 6px;
padding: 6px 10px;
background: var(--color-light-gray);
color: var(--color-primary-text);
transition: all 0.2s ease;
display: inline-flex;
align-items: center;
gap: 6px;
white-space: nowrap;
line-height: 1;
flex-shrink: 0;
}
.gh-theme-toggle:hover {
border-color: var(--ghost-accent-color);
color: var(--ghost-accent-color);
box-shadow: 0 0 14px rgb(0 102 255 / 0.35);
}
.theme-toggle-icon {
font-size: 1.15rem;
line-height: 1;
}
html[data-theme="dark"] .theme-icon-light { display: none; }
html[data-theme="light"] .theme-icon-dark { display: none; }
@media (max-width: 480px) {
.theme-toggle-text { display: none; }
}
.gh-icon-button {
border: 1px solid var(--color-border);
border-radius: 8px;
background: var(--color-light-gray);
color: var(--color-primary-text);
transition: all 0.2s ease;
}
.gh-icon-button:hover {
border-color: var(--ghost-accent-color);
color: var(--ghost-accent-color);
}
.gh-navigation-members .gh-button {
background-color: var(--ghost-accent-color);
color: #fff;
border-radius: 6px;
padding: 8px 16px;
font-weight: 600;
}
.gh-navigation-members .gh-button:hover {
box-shadow: 0 4px 18px rgb(0 102 255 / 0.4);
}
@media (max-width: 767px) {
#gh-navigation .gh-navigation-brand {
grid-template-columns: 1fr auto auto auto;
gap: 10px;
}
}
.term-label {
font-family: var(--font-mono);
font-size: 1.2rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--ghost-accent-color);
}
.term-label::before { content: "["; color: var(--color-dark-gray); margin-right: 0.3em; }
.term-label::after { content: "]"; color: var(--color-dark-gray); margin-left: 0.3em; }
.gh-article-footer {
border-top: 1px solid var(--color-border);
margin-top: clamp(32px, 6vw, 56px);
padding-top: clamp(24px, 4vw, 36px);
}
.gh-article-footer .term-label {
display: inline-block;
margin-bottom: 12px;
}
.gh-article-footer .gh-article-meta {
display: flex;
align-items: center;
gap: 14px;
}
.gh-article-footer .gh-article-author-name {
color: var(--color-primary-text);
}
.reveal {
opacity: 0;
transform: translateY(18px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.is-visible {
opacity: 1;
transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
.reveal { opacity: 1; transform: none; transition: none; }
}
.gh-card {
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.gh-card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 30px rgb(0 0 0 / 0.15);
}
html[data-theme="dark"] .gh-card:hover {
box-shadow: 0 8px 30px rgb(0 0 0 / 0.5);
}
.gh-card:hover .gh-card-title {
color: var(--ghost-accent-color);
}
html[data-theme="dark"] #sodo-search-root input,
html[data-theme="dark"] #sodo-search-root input[type="search"] {
background-color: #161c2b !important;
border: 1px solid rgb(255 255 255 / 0.25) !important;
color: #e8eaf0 !important;
}
html[data-theme="dark"] #sodo-search-root input::placeholder {
color: rgb(232 234 240 / 0.5) !important;
}
html[data-theme="light"] #sodo-search-root input,
html[data-theme="light"] #sodo-search-root input[type="search"] {
background-color: #ffffff !important;
border: 1px solid rgb(0 0 0 / 0.2) !important;
color: #15171a !important;
}
html[data-theme="light"] #sodo-search-root input::placeholder {
color: rgb(0 0 0 / 0.4) !important;
}
a {
transition: color 0.2s ease;
}
html[data-theme="light"] #actu article {
background-color: #f8fafc;
border-color: rgb(0 0 0 / 0.12);
}
html[data-theme="light"] #actu article:hover {
background-color: #f1f5f9;
}
#actu article {
border: 1px solid rgba(59,130,246,.35);
box-shadow: 0 0 0 1px rgba(147,197,253,.2), 0 0 16px rgba(59,130,246,.12), 0 4px 12px rgba(59,130,246,.08);
}
html[data-theme="dark"] #actu article {
border-color: rgba(59,130,246,.4);
box-shadow: 0 0 0 1px rgba(59,130,246,.18), 0 0 20px rgba(59,130,246,.16), 0 4px 14px rgba(59,130,246,.1);
}
#actu article:hover {
border-color: rgba(37,99,235,.55);
box-shadow: 0 0 0 2px rgba(147,197,253,.25), 0 0 24px rgba(59,130,246,.22), 0 8px 20px rgba(59,130,246,.15);
}
#actu article.has-dossier {
border: 1px solid rgba(251,146,60,.55);
box-shadow: 0 0 0 1px rgba(253,186,116,.25), 0 0 18px rgba(249,115,22,.18), 0 4px 14px hsl(24 95% 53% / .12);
}
html[data-theme="dark"] #actu article.has-dossier {
border-color: rgba(251,146,60,.5);
box-shadow: 0 0 0 1px rgba(251,146,60,.2), 0 0 22px rgba(249,115,22,.22), 0 4px 16px hsl(24 95% 53% / .15);
}
#actu article.has-dossier:hover {
border-color: rgba(249,115,22,.7);
box-shadow: 0 0 0 2px rgba(253,186,116,.3), 0 0 28px rgba(249,115,22,.3), 0 8px 22px rgba(249,115,22,.2);
}
/* Halo orange carte pour les dossiers rendus via post-card.hbs (page article :
   bloc "Read more", home Source si réactivée). Classe has-dossier posee par
   {{#has tag="dossier"}} dans post-card.hbs. En clair ET en sombre. */
.gh-card.has-dossier {
border-color: rgba(249,115,22,.4);
box-shadow: 0 0 24px rgba(249,115,22,.25);
}
html[data-theme="dark"] .gh-card.has-dossier {
border-color: rgba(251,146,60,.45);
box-shadow: 0 0 24px rgba(249,115,22,.28);
}
.gh-card.has-dossier:hover {
border-color: rgba(249,115,22,.65);
box-shadow: 0 0 28px rgba(249,115,22,.35);
}
html[data-theme="dark"] .gh-card.has-dossier:hover {
border-color: rgba(251,146,60,.7);
box-shadow: 0 0 30px rgba(249,115,22,.38);
}
.scroll-smooth-html {
}
.hero-mesh {
position: relative;
overflow: hidden;
}
.hero-watermark {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.7;
z-index: 0;
pointer-events: none;
}
html[data-theme="dark"] .hero-watermark { opacity: 0.45; }
html[data-theme="light"] .hero-watermark { opacity: 0.6; }
.tag-hero .hero-watermark { opacity: 0.5; }
html[data-theme="dark"] .tag-hero .hero-watermark { opacity: 0.35; }
.skeleton-card {
border-radius: 0.75rem;
border: 1px solid rgba(148,163,184,0.20);
background: rgba(241,245,249,0.75);
overflow: hidden;
display: flex;
flex-direction: column;
min-height: 360px;
}
#loadMoreBtn.is-loading {
opacity: 0.7;
pointer-events: none;
}
#actu article .flex-wrap {
flex-wrap: wrap;
max-width: 70%;
}
/* Layout meta des cartes Source (post-card.hbs) : badge type pousse a droite
   de la ligne (author/date a gauche, badge a l'autre bout, symetrie pilule
   categorie en haut de carte). Ne s'applique PAS aux cartes #actu (home/tag). */
.gh-card-meta {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 0.5rem;
}
.gh-card-meta .post-type-badge {
margin-left: auto;
}
#actu article .aspect-\[16\/9\] {
aspect-ratio: 16 / 9;
position: relative;
overflow: hidden;
border-radius: 0.5rem;
}
#actu article .aspect-\[16\/9\] img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.5s ease;
}
#actu article:hover .aspect-\[16\/9\] img {
transform: scale(1.02);
}
#actu article .aspect-\[3\/2\] {
aspect-ratio: 3 / 2;
position: relative;
overflow: hidden;
border-radius: 0.5rem;
}
#actu article .aspect-\[3\/2\] img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.5s ease;
}
#actu article:hover .aspect-\[3\/2\] img {
transform: scale(1.02);
}
#actu article .object-cover {
object-fit: cover;
width: 100%;
height: 100%;
}
html[data-theme="dark"] #actu article {
background-color: #1a2233;
}
html[data-theme="dark"] #actu article:hover {
background-color: #202a3f;
}
.gh-content {
font-size: 1.8rem;
line-height: 1.75;
}
.gh-content > h1:first-child {
display: none;
}
.gh-article-meta-content {
font-size: 1.5rem;
}
.gh-article-tag {
font-size: 1.4rem;
}
@media (max-width: 767px) {
.gh-content {
font-size: 1.7rem;
}
}
.gh-article-title {
font-size: clamp(2.6rem, 1vw + 2.1rem, 3.4rem);
font-family: var(--font-mono), ui-monospace, monospace;
}
body.has-sans-title.is-title-mono .gh-article-title,
body.has-sans-title .gh-article-title.is-title {
font-family: var(--font-mono), ui-monospace, monospace !important;
}
@media (max-width: 767px) {
.gh-article-title {
font-size: 2.4rem;
}
}
.gh-article-image,
.feature-image {
border-radius: 0.75rem;
overflow: hidden;
border: 1px solid rgba(59,130,246,.35);
box-shadow: 0 0 0 1px rgba(147,197,253,.2), 0 0 16px rgba(59,130,246,.12), 0 4px 12px rgba(59,130,246,.08);
}
.gh-article-image img,
.feature-image img {
width: 100%;
height: auto;
display: block;
}
#mobileMenuBtn,
#themeToggle {
width: 42px;
height: 42px;
flex-shrink: 0;
}
#searchToggle {
width: 42px;
height: 42px;
flex-shrink: 0;
}
#searchToggle svg {
width: 20px;
height: 20px;
}
#mobileMenuBtn svg {
width: 24px;
height: 24px;
}
#themeToggle [data-theme-icon] {
font-size: 21px;
line-height: 1;
}
header > div.max-w-7xl {
height: 96px;
}
@media (max-width: 1023.98px) {
#mobileMenu {
position: fixed;
top: 96px;
left: 0;
right: 0;
z-index: 40;
max-height: calc(100vh - 96px);
overflow-y: auto;
-webkit-overflow-scrolling: touch;
box-shadow: 0 12px 24px rgba(2, 6, 23, 0.25);
transition: opacity 0.15s ease;
}
}
@media (max-width: 1023.98px) and (prefers-reduced-motion: reduce) {
#mobileMenu {
transition: none;
}
}
@media (min-width: 1024px) {
#mobileMenuBtn {
display: none;
}
#mobileMenu {
display: none !important;
}
}
@media (min-width: 768px) and (max-width: 1023.98px) {
header nav {
display: none !important;
}
}
.tag-hero {
position: relative;
}
.tag-glow {
position: absolute;
border-radius: 9999px;
pointer-events: none;
filter: blur(48px);
}
.tag-glow-main {
top: -6rem;
left: 50%;
transform: translateX(-50%);
width: 36rem;
height: 20rem;
background: radial-gradient(circle, var(--tag-glow-color) 0%, transparent 70%);
opacity: 0.30;
}
.tag-glow-side {
top: 3rem;
right: 10%;
width: 12rem;
height: 12rem;
background: radial-gradient(circle, var(--tag-glow-color) 0%, transparent 70%);
opacity: 0.18;
}
.tag-badge-pill {
background: var(--tag-badge-bg);
border: 2px solid var(--tag-badge-border);
color: var(--tag-badge-text);
box-shadow: 0 0 28px var(--tag-glow-color);
}
.tag-pill-dot {
width: 0.75rem;
height: 0.75rem;
border-radius: 9999px;
background: rgba(255, 255, 255, 0.85);
animation: tag-pulse 1.6s ease-in-out infinite;
}
@keyframes tag-pulse {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.4; transform: scale(0.85); }
}
html[data-theme="dark"] .tag-badge-pill {
color: #fff;
}
body.tag-actualites { --tag-badge-bg: #cffafe; --tag-badge-text: #0e7490; --tag-badge-border: #67e8f9; --tag-glow-color: #06b6d4; }
html[data-theme="dark"] body.tag-actualites { --tag-badge-bg: #083344; --tag-badge-border: #164e63; --tag-glow-color: #06b6d4; }
body.tag-alignement { --tag-badge-bg: #e0e7ff; --tag-badge-text: #4338ca; --tag-badge-border: #a5b4fc; --tag-glow-color: #6366f1; }
html[data-theme="dark"] body.tag-alignement { --tag-badge-bg: #1e1b4b; --tag-badge-border: #3730a3; --tag-glow-color: #6366f1; }
body.tag-dossier { --tag-badge-bg: #ffedd5; --tag-badge-text: #c2410c; --tag-badge-border: #fdba74; --tag-glow-color: #f97316; }
html[data-theme="dark"] body.tag-dossier { --tag-badge-bg: #431407; --tag-badge-border: #7c2d12; --tag-glow-color: #f97316; }
body.tag-robotique { --tag-badge-bg: #fef3c7; --tag-badge-text: #b45309; --tag-badge-border: #fcd34d; --tag-glow-color: #f59e0b; }
html[data-theme="dark"] body.tag-robotique { --tag-badge-bg: #451a03; --tag-badge-border: #78350f; --tag-glow-color: #f59e0b; }
body.tag-recherche { --tag-badge-bg: #ccfbf1; --tag-badge-text: #0f766e; --tag-badge-border: #5eead4; --tag-glow-color: #14b8a6; }
html[data-theme="dark"] body.tag-recherche { --tag-badge-bg: #042f2e; --tag-badge-border: #134e4a; --tag-glow-color: #14b8a6; }
body.tag-sante { --tag-badge-bg: #dcfce7; --tag-badge-text: #15803d; --tag-badge-border: #86efac; --tag-glow-color: #22c55e; }
html[data-theme="dark"] body.tag-sante { --tag-badge-bg: #052e16; --tag-badge-border: #14532d; --tag-glow-color: #22c55e; }
body.tag-bonnes-nouvelles { --tag-badge-bg: #fce7f3; --tag-badge-text: #be185d; --tag-badge-border: #f9a8d4; --tag-glow-color: #ec4899; }
html[data-theme="dark"] body.tag-bonnes-nouvelles { --tag-badge-bg: #500724; --tag-badge-border: #831843; --tag-glow-color: #ec4899; }
body.tag-gouvernance { --tag-badge-bg: #ede9fe; --tag-badge-text: #6d28d9; --tag-badge-border: #c4b5fd; --tag-glow-color: #8b5cf6; }
html[data-theme="dark"] body.tag-gouvernance { --tag-badge-bg: #2e1065; --tag-badge-border: #4c1d95; --tag-glow-color: #8b5cf6; }
.gh-article-tags {
margin-bottom: 1.25rem;
}
.gh-article-tags .tag-badges {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
}
.post-badge {
display: inline-flex;
align-items: center;
padding: 0.4rem 1rem;
border-radius: 9999px;
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.9rem;
font-weight: 700;
text-decoration: none;
border: 2px solid transparent;
transition: all .2s ease;
}
.post-badge:hover {
transform: translateY(-2px);
}
.post-badge-actualites {
background: #cffafe; color: #0e7490; border-color: #67e8f9;
}
.post-badge-alignement {
background: #e0e7ff; color: #4338ca; border-color: #a5b4fc;
}
.post-badge-dossier {
background: #dbeafe; color: #1d4ed8; border-color: #93c5fd;
}
html[data-theme="dark"] .post-badge-actualites { background: #083344; color: #67e8f9; border-color: #164e63; }
html[data-theme="dark"] .post-badge-alignement { background: #1e1b4b; color: #a5b4fc; border-color: #3730a3; }
html[data-theme="dark"] .post-badge-dossier { background: #172554; color: #93c5fd; border-color: #1e3a8a; }
.post-badge-dossier,
.tag-dossier .post-badge-dossier {
background: #ffedd5;
color: #c2410c;
border-color: #fdba74;
}
html[data-theme="dark"] .post-badge-dossier,
html[data-theme="dark"] .tag-dossier .post-badge-dossier {
background: #431407;
color: #fdba74;
border-color: #7c2d12;
}
.post-badge-recherche {
background: #ccfbf1; color: #0f766e; border-color: #5eead4;
}
html[data-theme="dark"] .post-badge-recherche {
background: #042f2e; color: #5eead4; border-color: #134e4a;
}
.post-badge-sante {
background: #dcfce7; color: #15803d; border-color: #86efac;
}
html[data-theme="dark"] .post-badge-sante {
background: #052e16; color: #86efac; border-color: #14532d;
}
.post-badge-bonnes {
background: #fce7f3; color: #be185d; border-color: #f9a8d4;
}
html[data-theme="dark"] .post-badge-bonnes {
background: #500724; color: #f9a8d4; border-color: #831843;
}
.post-badge-gouvernance {
background: #ede9fe; color: #6d28d9; border-color: #c4b5fd;
}
html[data-theme="dark"] .post-badge-gouvernance {
background: #2e1065; color: #c4b5fd; border-color: #4c1d95;
}
.post-badge-robotique {
background: #fef3c7; color: #b45309; border-color: #fcd34d;
}
html[data-theme="dark"] .post-badge-robotique {
background: #451a03; color: #fcd34d; border-color: #78350f;
}

/* ============================================================
   Badge TYPE de contenu (Silicium IA) : distinct de la pilule
   catégorie (primary_tag). Orange outline réservé au type
   « dossier », neutre pour les autres types (article, puis
   tuto/comparatif/test quand il y aura du contenu).
   ============================================================ */
.post-type-badge {
display: inline-flex;
align-items: center;
flex-shrink: 0;
padding: 0.15rem 0.65rem;
border-radius: 9999px;
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
text-decoration: none;
color: #c2410c;
background: transparent;
border: 1px solid rgba(249, 115, 22, 0.65);
box-shadow: 0 0 10px rgba(249, 115, 22, 0.22);
transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.post-type-badge:hover {
transform: scale(1.05);
box-shadow: 0 0 14px rgba(249, 115, 22, 0.32);
filter: brightness(1.1);
}
html[data-theme="dark"] .post-type-badge {
color: #fdba74;
border-color: rgba(251, 146, 60, 0.6);
box-shadow: 0 0 12px rgba(249, 115, 22, 0.28);
}
html[data-theme="dark"] .post-type-badge:hover {
box-shadow: 0 0 16px rgba(249, 115, 22, 0.4);
}
/* Variante neutre : types sans couleur dédiée (article, futurs
   tuto/comparatif/test) : outline gris, aucun accent coloré. */
.post-type-badge-neutral {
color: #475569;
background: transparent;
border-color: rgba(100, 116, 139, 0.5);
box-shadow: none;
}
.post-type-badge-neutral:hover {
box-shadow: 0 0 10px rgba(100, 116, 139, 0.25);
filter: none;
}
html[data-theme="dark"] .post-type-badge-neutral {
color: #94a3b8;
border-color: rgba(148, 163, 184, 0.45);
box-shadow: none;
}
html[data-theme="dark"] .post-type-badge-neutral:hover {
box-shadow: 0 0 10px rgba(148, 163, 184, 0.25);
}
/* Garde de spécificite : sur les cartes #actu (home / pages tag), la regle
   existante #actu article [class*="post-badge-"]:hover (ID + attribut) gagne
   sur .post-type-badge:hover et ecraserait le glow orange au survol. */
#actu article .post-type-badge.post-badge-dossier:hover,
.post-type-badge.post-badge-dossier:hover {
transform: scale(1.05);
box-shadow: 0 0 14px rgba(249, 115, 22, 0.32);
}
html[data-theme="dark"] #actu article .post-type-badge.post-badge-dossier:hover,
html[data-theme="dark"] .post-type-badge.post-badge-dossier:hover {
box-shadow: 0 0 16px rgba(249, 115, 22, 0.4);
}
.transparency-banner {
position: relative;
border-radius: 1rem;
border: 1px solid rgba(148, 163, 184, 0.25);
background: rgba(241, 245, 249, 0.65);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4), 0 4px 18px rgba(0, 0, 0, 0.05);
overflow: hidden;
}
html[data-theme="dark"] .transparency-banner {
background: rgba(30, 41, 59, 0.55);
border-color: rgba(148, 163, 184, 0.18);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 4px 22px rgba(0, 0, 0, 0.25);
}
.transparency-banner::before {
content: "";
position: absolute;
top: -40%;
right: -10%;
width: 12rem;
height: 12rem;
background: radial-gradient(circle, rgba(6, 182, 212, 0.18) 0%, transparent 70%);
pointer-events: none;
}
.transparency-banner-inner {
position: relative;
z-index: 1;
display: flex;
align-items: center;
gap: 0.875rem;
padding: 0.9rem 1.25rem;
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.95rem;
line-height: 1.55;
color: #334155;
}
html[data-theme="dark"] .transparency-banner-inner {
color: #cbd5e1;
}
.transparency-icon {
flex-shrink: 0;
font-size: 1.25rem;
line-height: 1;
}
.transparency-text {
margin: 0;
}
.transparency-link {
margin-left: 0.35rem;
color: #0891b2;
text-decoration: underline;
text-underline-offset: 2px;
transition: color 0.2s ease;
}
html[data-theme="dark"] .transparency-link {
color: #22d3ee;
}
.transparency-link:hover {
color: #0ea5e9;
}
.transparency-pledge {
position: relative;
margin: 3rem auto 2rem;
max-width: 720px;
border-radius: 1.25rem;
border: 1px solid rgba(99, 102, 241, 0.35);
background: linear-gradient(135deg, rgba(99, 102, 241, 0.08) 0%, rgba(6, 182, 212, 0.06) 100%);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5), 0 8px 32px rgba(99, 102, 241, 0.14);
overflow: hidden;
font-family: var(--font-mono, ui-monospace, monospace);
}
html[data-theme="dark"] .transparency-pledge {
background: linear-gradient(135deg, rgba(99, 102, 241, 0.12) 0%, rgba(6, 182, 212, 0.08) 100%);
border-color: rgba(99, 102, 241, 0.45);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 8px 36px rgba(99, 102, 241, 0.22);
}
.transparency-pledge-glow {
position: absolute;
top: -4rem;
right: -4rem;
width: 14rem;
height: 14rem;
background: radial-gradient(circle, rgba(99, 102, 241, 0.28) 0%, transparent 70%);
pointer-events: none;
}
html[data-theme="dark"] .transparency-pledge-glow {
background: radial-gradient(circle, rgba(99, 102, 241, 0.38) 0%, transparent 70%);
}
.transparency-pledge-inner {
position: relative;
z-index: 1;
padding: 1.6rem 1.8rem;
}
.transparency-pledge-title {
margin: 0 0 0.9rem;
font-size: 1.35rem;
font-weight: 700;
color: #1e293b;
}
html[data-theme="dark"] .transparency-pledge-title {
color: #f8fafc;
}
.transparency-pledge-list {
margin: 0 0 0.9rem;
padding: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: 0.5rem;
font-size: 1rem;
color: #475569;
}
html[data-theme="dark"] .transparency-pledge-list {
color: #94a3b8;
}
.transparency-pledge-list li {
display: flex;
align-items: flex-start;
gap: 0.55rem;
}
.transparency-pledge-list li span {
flex-shrink: 0;
margin-top: -0.05em;
}
.transparency-pledge-note {
margin: 0;
font-size: 0.9rem;
line-height: 1.6;
color: #64748b;
}
html[data-theme="dark"] .transparency-pledge-note {
color: #94a3b8;
}
.transparency-pledge-note a,
.transparency-pledge-list a {
color: #6366f1;
text-decoration: underline;
text-underline-offset: 2px;
transition: color 0.2s ease;
}
html[data-theme="dark"] .transparency-pledge-note a,
html[data-theme="dark"] .transparency-pledge-list a {
color: #818cf8;
}
.transparency-pledge-note a:hover,
.transparency-pledge-list a:hover {
color: #4f46e5;
}
.site-footer {
margin-top: 4rem;
border-top: 1px solid rgba(148, 163, 184, 0.25);
background: rgba(248, 250, 252, 0.85);
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
font-family: var(--font-mono, ui-monospace, monospace);
font-size: 0.95rem;
color: #475569;
padding: 2.25rem 0 1.5rem;
}
html[data-theme="dark"] .site-footer {
background: rgba(15, 23, 42, 0.88);
border-color: rgba(148, 163, 184, 0.12);
color: #94a3b8;
}
.footer-section {
margin-bottom: 1.75rem;
}
.footer-section-header {
display: flex;
align-items: center;
gap: 0.55rem;
margin-bottom: 0.5rem;
}
.footer-section-icon {
font-size: 1.1rem;
line-height: 1;
}
.footer-section-title {
font-weight: 700;
color: #1e293b;
font-size: 1.05rem;
}
html[data-theme="dark"] .footer-section-title {
color: #f1f5f9;
}
.footer-section-text {
margin: 0 0 0.75rem;
line-height: 1.6;
max-width: 640px;
}
.footer-affiliate-links {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
}
.footer-affiliate-link {
display: inline-flex;
align-items: center;
padding: 0.45rem 0.9rem;
border-radius: 9999px;
border: 1px solid rgba(99, 102, 241, 0.35);
background: rgba(255, 255, 255, 0.7);
color: #4338ca;
text-decoration: none;
font-size: 0.85rem;
font-weight: 600;
transition: all 0.2s ease;
}
html[data-theme="dark"] .footer-affiliate-link {
background: rgba(30, 27, 75, 0.45);
color: #a5b4fc;
border-color: rgba(99, 102, 241, 0.45);
}
.footer-affiliate-link:hover {
background: rgba(99, 102, 241, 0.12);
border-color: rgba(99, 102, 241, 0.65);
color: #3730a3;
box-shadow: 0 0 18px rgba(99, 102, 241, 0.18);
}
.footer-cta {
display: inline-flex;
align-items: center;
color: #0891b2;
text-decoration: none;
font-weight: 600;
transition: color 0.2s ease;
}
html[data-theme="dark"] .footer-cta {
color: #22d3ee;
}
.footer-cta:hover {
color: #0ea5e9;
text-decoration: underline;
text-underline-offset: 2px;
}
.footer-row {
display: grid;
grid-template-columns: 1fr auto;
gap: 2rem;
align-items: start;
padding-top: 1.25rem;
border-top: 1px solid rgba(148, 163, 184, 0.2);
margin-bottom: 1.75rem;
}
html[data-theme="dark"] .footer-row {
border-color: rgba(148, 163, 184, 0.1);
}
.footer-legal {
display: flex;
flex-wrap: wrap;
gap: 1rem;
justify-content: flex-end;
}
.footer-legal-link {
color: #64748b;
text-decoration: none;
transition: color 0.2s ease;
}
html[data-theme="dark"] .footer-legal-link {
color: #94a3b8;
}
.footer-legal-link:hover {
color: #0891b2;
text-decoration: underline;
text-underline-offset: 2px;
}
.footer-bottom {
display: flex;
flex-direction: column;
gap: 0.35rem;
padding-top: 1.25rem;
border-top: 1px solid rgba(148, 163, 184, 0.2);
font-size: 0.85rem;
color: #64748b;
}
html[data-theme="dark"] .footer-bottom {
border-color: rgba(148, 163, 184, 0.1);
color: #64748b;
}
.footer-tagline {
font-size: 0.8rem;
opacity: 0.75;
}
@media (max-width: 767px) {
.footer-row {
grid-template-columns: 1fr;
gap: 1.25rem;
}
.footer-legal {
justify-content: flex-start;
}
.transparency-pledge-inner {
padding: 1.25rem;
}
.transparency-banner-inner {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
}
/* ============================================================
   MENU MOBILE (burger) — refonte 09/09 partie 1 : pilules sobres
   « style code ». Un seul style de pilule ; la couleur par tag vit
   uniquement dans le point (variable CSS --menu-dot), identique en
   clair et en sombre. Pas de backdrop-filter (interdit sur ce site).
   ============================================================ */
.menu-tag {
    --menu-dot: #94a3b8; /* point neutre par défaut */
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 500;
    font-size: 0.9375rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(148, 163, 184, 0.25); /* slate-500/25 */
    border-radius: 0.75rem;
    background: rgba(241, 245, 249, 0.6); /* slate-100/60 */
    color: #475569; /* slate-600 */
    transition: border-color 0.2s ease, background-color 0.2s ease;
}
html[data-theme="dark"] .menu-tag {
    background: rgba(15, 23, 42, 0.8); /* slate-900/80 */
    border-color: rgba(30, 41, 59, 0.9); /* slate-800/90 */
    color: #cbd5e1; /* slate-300 */
}
.menu-tag:hover {
    border-color: rgba(148, 163, 184, 0.5);
    background: rgba(226, 232, 240, 0.8); /* slate-200/80 */
}
html[data-theme="dark"] .menu-tag:hover {
    background: rgba(30, 41, 59, 0.9); /* slate-800/90 */
    border-color: rgba(71, 85, 105, 0.9); /* slate-600/90 */
}
.menu-tag-label {
    flex: 1 1 auto;
}
/* Le point coloré : seul élément de couleur de la pilule (6-8 px) */
.menu-tag-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--menu-dot, #94a3b8);
}
.menu-tag-count {
    flex: 0 0 auto;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    padding: 0.0625rem 0.375rem;
    border-radius: 0.25rem;
    background: rgba(148, 163, 184, 0.15); /* slate-500/15 */
    color: #64748b; /* slate-500 */
    min-width: 1.5rem;
    text-align: center;
}
html[data-theme="dark"] .menu-tag-count {
    background: rgba(71, 85, 105, 0.25); /* slate-600/25 */
    color: #94a3b8; /* slate-400 */
}
.menu-tag-count-unknown {
    color: #f97316; /* orange : signal visuel du fallback « n.a. » */
}
/* Couleurs par tag (réutilisées des anciennes pilules colorées) */
.menu-tag-actualites { --menu-dot: #06b6d4; } /* cyan-500 */
.menu-tag-alignement { --menu-dot: #6366f1; } /* indigo-500 */
.menu-tag-dossier { --menu-dot: #f97316; } /* orange-500 */
.menu-tag-recherche { --menu-dot: #14b8a6; } /* teal-500 */
.menu-tag-sante { --menu-dot: #22c55e; } /* green-500 */
.menu-tag-bonnes-nouvelles { --menu-dot: #ec4899; } /* pink-500 */
.menu-tag-gouvernance { --menu-dot: #8b5cf6; } /* violet-500 */
.menu-tag-robotique { --menu-dot: #f59e0b; } /* amber-500 */
.menu-tag-bench { --menu-dot: #38bdf8; } /* sky-400 : lien externe outil */

/* Lien Bench IA en nav desktop : le header est saturé dès 1280px
   (marge prod 10px, mesuré le 13/09 : lien texte = scrollWidth 1356).
   On le masque < 1536px : à 1280 la page reste identique à la prod
   (1270 <= 1280) ; le lien reste accessible via le footer et le menu
   mobile à toutes les largeurs. A partir de 1536px il tient (1484 <= 1521). */
@media (max-width: 1535.98px) {
  header nav a.bench-desktop-link { display: none !important; }
}
/* Titres de section : font-mono uppercase petites + grisées */
.menu-section-title {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #64748b; /* slate-500 */
    margin: 0.75rem 0 0.25rem 0.25rem;
}
html[data-theme="dark"] .menu-section-title {
    color: #64748b;
}
/* Trait fin entre Types de contenu et Catégories */
.menu-separator {
    display: block;
    height: 1px;
    margin: 0.75rem 0.25rem;
    background: rgba(148, 163, 184, 0.25); /* slate-500/25 */
}
html[data-theme="dark"] .menu-separator {
    background: rgba(148, 163, 184, 0.15);
}
#actu article,
.gh-card {
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
will-change: transform, box-shadow;
}
#actu article:hover,
.gh-card:hover {
transform: translateY(-4px);
}
#actu article:not(.has-dossier):hover {
box-shadow: 0 0 0 1px rgba(147,197,253,.28), 0 0 28px rgba(59,130,246,.22), 0 12px 28px rgba(59,130,246,.16);
}
html[data-theme="dark"] #actu article:not(.has-dossier):hover {
box-shadow: 0 0 0 1px rgba(147,197,253,.22), 0 0 34px rgba(59,130,246,.28), 0 12px 32px rgba(59,130,246,.18);
}
#actu article.has-dossier:hover {
box-shadow: 0 0 0 1px rgba(253,186,116,.35), 0 0 30px rgba(249,115,22,.30), 0 12px 30px rgba(249,115,22,.20);
}
html[data-theme="dark"] #actu article.has-dossier:hover {
box-shadow: 0 0 0 1px rgba(253,186,116,.28), 0 0 36px rgba(249,115,22,.35), 0 12px 34px rgba(249,115,22,.22);
}
#actu article .group a[href]:hover ~ span,
#actu article a[href]:hover ~ span,
#actu article .group:hover span,
#actu article:hover .card-arrow,
#actu article:hover span[class*="translate"] {
transform: translateX(4px);
}
html[data-theme="dark"] #actu article .group a[href]:hover ~ span,
html[data-theme="dark"] #actu article a[href]:hover ~ span,
html[data-theme="dark"] #actu article .group:hover span,
html[data-theme="dark"] #actu article:hover .card-arrow,
html[data-theme="dark"] #actu article:hover span[class*="translate"] {
transform: translateX(4px);
}
header nav a {
position: relative;
overflow: hidden;
}
header nav a::after {
content: "";
position: absolute;
bottom: 0.35rem;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, var(--ghost-accent-color), #22d3ee);
transform: scaleX(0);
transform-origin: left;
transition: transform 0.3s ease;
border-radius: 2px;
pointer-events: none;
}
html[data-theme="dark"] header nav a::after {
background: linear-gradient(90deg, #22d3ee, #818cf8);
}
header nav a:hover::after,
header nav a:focus-visible::after {
transform: scaleX(1);
}
header nav a:focus-visible {
outline: 2px solid var(--ghost-accent-color);
outline-offset: 2px;
}
.post-badge,
#actu article .flex-wrap span[class*="rounded"],
#actu article .post-badge-actualites,
#actu article .post-badge-alignement,
#actu article .post-badge-dossier,
#actu article .post-badge-recherche,
#actu article .post-badge-sante,
#actu article .post-badge-bonnes,
#actu article .post-badge-gouvernance,
#actu article .post-badge-robotique,
.tag-badge-pill {
transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
will-change: transform;
}
.post-badge:hover,
#actu article .flex-wrap span[class*="rounded"]:hover,
#actu article [class*="post-badge-"]:hover,
.tag-badge-pill:hover {
transform: scale(1.05);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}
html[data-theme="dark"] .post-badge:hover,
html[data-theme="dark"] #actu article .flex-wrap span[class*="rounded"]:hover,
html[data-theme="dark"] #actu article [class*="post-badge-"]:hover,
html[data-theme="dark"] .tag-badge-pill:hover {
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}
.reveal-card {
opacity: 1;
transform: translateY(0);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.reveal-card.is-visible {
opacity: 1;
transform: translateY(0);
animation: card-reveal-subtle 0.5s ease both;
}
@keyframes card-reveal-subtle {
from { opacity: 0.94; transform: translateY(8px); }
to   { opacity: 1;   transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
.reveal-card,
.reveal-card.is-visible {
opacity: 1 !important;
transform: none !important;
transition: none !important;
animation: none !important;
}
}
@supports (animation-timeline: view()) {
.reveal-scroll {
animation: reveal-scroll-anim 1ms linear both;
animation-timeline: view();
animation-range: entry 0% entry 35%;
}
@keyframes reveal-scroll-anim {
from { opacity: 0; transform: translateY(16px); }
to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
.reveal-scroll {
animation: none !important;
opacity: 1 !important;
transform: none !important;
}
}
}
#actu article {
background: rgba(255, 255, 255, 0.98);
}
html[data-theme="dark"] #actu article {
background: rgba(22, 29, 44, 0.96);
}
html[data-theme="light"] #actu article {
border-color: rgba(0, 0, 0, 0.08);
}
.transparency-banner {
background: rgba(241, 245, 249, 0.72);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
border-color: rgba(148, 163, 184, 0.22);
}
html[data-theme="dark"] .transparency-banner {
background: rgba(30, 41, 59, 0.62);
-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);
border-color: rgba(148, 163, 184, 0.15);
}
.transparency-pledge {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background: linear-gradient(135deg, rgba(99, 102, 241, 0.10) 0%, rgba(6, 182, 212, 0.08) 100%);
}
html[data-theme="dark"] .transparency-pledge {
background: linear-gradient(135deg, rgba(99, 102, 241, 0.16) 0%, rgba(6, 182, 212, 0.12) 100%);
}
.site-footer {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background: rgba(248, 250, 252, 0.80);
}
html[data-theme="dark"] .site-footer {
background: rgba(15, 23, 42, 0.82);
}
.tag-hero {
background: rgba(255, 255, 255, 0.45);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}
html[data-theme="dark"] .tag-hero {
background: rgba(15, 23, 42, 0.55);
border-bottom-color: rgba(148, 163, 184, 0.10);
}
header.sticky {
background: rgba(255, 255, 255, 0.82) !important;
-webkit-backdrop-filter: blur(12px) !important;
backdrop-filter: blur(12px) !important;
}
html[data-theme="dark"] header.sticky {
background: rgba(2, 6, 23, 0.78) !important;
}
@media (prefers-reduced-motion: reduce) {
#actu article,
.gh-card,
.post-badge,
.tag-badge-pill,
#actu article .flex-wrap span[class*="rounded"],
header nav a,
header nav a::after,
#actu article .aspect-\[16\/9\] img,
#actu article .aspect-\[3\/2\] img {
transition: none !important;
animation: none !important;
transform: none !important;
}
#actu article:hover,
.gh-card:hover,
.post-badge:hover,
#actu article [class*="post-badge-"]:hover {
transform: none !important;
}
}
.text-gradient-accent {
background-image: linear-gradient(115deg, #f472b6, #fb923c 55%, #f59e0b);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.section-head {
border: 1px solid rgba(59,130,246,.35);
border-radius: 0.75rem;
background: rgba(255,255,255,.9);
box-shadow: 0 0 0 1px rgba(147,197,253,.2), 0 0 16px rgba(59,130,246,.12), 0 4px 12px rgba(59,130,246,.08);
padding: 1rem 1.5rem;
margin-bottom: 2.5rem;
text-align: center;
}
html[data-theme="dark"] .section-head {
background: rgba(22,29,44,.96);
border-color: rgba(59,130,246,.4);
box-shadow: 0 0 0 1px rgba(59,130,246,.18), 0 0 20px rgba(59,130,246,.16), 0 4px 14px rgba(59,130,246,.1);
}
.section-arrow {
color: #0891b2;
font-size: 1.1rem;
line-height: 1;
}
html[data-theme="dark"] .section-arrow {
color: #22d3ee;
}
@media (min-width: 1024px) {
header nav a[class] {
white-space: nowrap;
}
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
header nav {
gap: .125rem;
}
header nav a[class] {
padding-left: .45rem;
padding-right: .45rem;
font-size: .875rem;
}
}
@media (min-width: 1280px) and (max-width: 1439.98px) {
header nav a[class] {
padding-left: .75rem;
padding-right: .75rem;
}
}

/* ===== M5 : boutons « Voir plus d'articles » / « Voir plus de dossiers » =====
   Classe commune home.hbs (#loadMoreBtn) + partials/rail-type.hbs (CTA rail).
   Autoportante : ne depend d'AUCUNE classe Tailwind compilee (les variantes
   dark:/hover: de l'ancien inline n'existaient PAS dans tailwind.css).
   custom.css est charge AVANT tailwind.css : pas besoin de !important ici,
   les declarations explicites (class selector) battent les regles element
   (screen.css : button,input{font:inherit}) et rien ne surcharge apres.
   Sombre = data-theme="dark" sur <html>. Pas de backdrop-filter. */
.btn-voir-plus {
display: inline-block;
box-sizing: border-box;
padding: 0.75rem 1.75rem;
border-radius: 0.75rem;
border: 1px solid rgba(100, 116, 139, 0.45);
background: #e2e8f0;
color: #0f172a;
font-family: var(--font-mono, ui-monospace, monospace);
font-weight: 700;
font-size: 1rem;
line-height: 1.5;
text-decoration: none;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.btn-voir-plus:hover {
background: #dbe3ec;
border-color: rgba(100, 116, 139, 0.7);
transform: translateY(-1px);
}
.btn-voir-plus .btn-voir-plus-arrow {
display: inline-block;
margin-left: 0.5rem;
transition: transform 0.2s ease;
}
.btn-voir-plus:hover .btn-voir-plus-arrow {
transform: translateX(3px);
}
html[data-theme="dark"] .btn-voir-plus {
background: #2b3a55;
border-color: rgba(148, 163, 184, 0.5);
color: #f1f5f9;
}
html[data-theme="dark"] .btn-voir-plus:hover {
background: #324362;
border-color: rgba(148, 163, 184, 0.8);
}
.btn-voir-plus:focus-visible {
outline: 2px solid #f97316;
outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
.btn-voir-plus,
.btn-voir-plus .btn-voir-plus-arrow {
transition: none !important;
transform: none !important;
}
}

/* ============================================================
   MAILLAGE — « À lire aussi » (post.hbs, 13/09/2026)
   Section cartes identiques à l'accueil (structure home.hbs).
   Les classes Tailwind utilisées existent toutes dans tailwind.css
   compilé (vérifié une par une, gap-6 = 1.5rem) ; ces règles sont
   les garde-fous (le .md\:grid-cols-3 compilé est bien présent) :
   - .a-lire-grid : layout 1 colonne, 3 colonnes >= 768px ;
   - .a-lire-fallback : caché PAR DÉFAUT (clair comme sombre, le
     mécanisme ne dépend pas du thème) -> il n'apparaît que si le
     micro-script arbitre constate < 2 cartes tag (alors il pose
     style.display='block' en inline, qui gagne sur cette classe).
     Sans JS : la section tag reste visible, jamais de double
     section ni de bloc vide (dégradation propre).
   ============================================================ */
.a-lire-aussi .a-lire-grid {
display: grid;
gap: 1.5rem;
}
@media (min-width: 768px) {
.a-lire-aussi .a-lire-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
.a-lire-aussi .a-lire-fallback {
display: none;
}
.a-lire-aussi .a-lire-fallback.a-lire-fallback-visible {
display: block;
}
/* Halos : les cartes du maillage vivent HORS de #actu, on ré-applique
   la même signature bleue (orange si has-dossier), clair + sombre. */
.a-lire-aussi article.a-lire-card {
border: 1px solid rgba(59,130,246,.35);
box-shadow: 0 0 0 1px rgba(147,197,253,.2), 0 0 16px rgba(59,130,246,.12), 0 4px 12px rgba(59,130,246,.08);
}
html[data-theme="dark"] .a-lire-aussi article.a-lire-card {
background-color: #1a2233;
border-color: rgba(59,130,246,.4);
box-shadow: 0 0 0 1px rgba(59,130,246,.18), 0 0 20px rgba(59,130,246,.16), 0 4px 14px rgba(59,130,246,.1);
}
.a-lire-aussi article.a-lire-card:hover {
border-color: rgba(37,99,235,.55);
box-shadow: 0 0 0 2px rgba(147,197,253,.25), 0 0 24px rgba(59,130,246,.22), 0 8px 20px rgba(59,130,246,.15);
}
html[data-theme="dark"] .a-lire-aussi article.a-lire-card:hover {
background-color: #202a3f;
}
.a-lire-aussi article.a-lire-card.has-dossier {
border: 1px solid rgba(251,146,60,.55);
box-shadow: 0 0 0 1px rgba(253,186,116,.25), 0 0 18px rgba(249,115,22,.18), 0 4px 14px hsl(24 95% 53% / .12);
}
html[data-theme="dark"] .a-lire-aussi article.a-lire-card.has-dossier {
border-color: rgba(251,146,60,.5);
box-shadow: 0 0 0 1px rgba(251,146,60,.2), 0 0 22px rgba(249,115,22,.22), 0 4px 16px hsl(24 95% 53% / .15);
}
.a-lire-aussi article.a-lire-card.has-dossier:hover {
border-color: rgba(249,115,22,.7);
box-shadow: 0 0 0 2px rgba(253,186,116,.3), 0 0 28px rgba(249,115,22,.3), 0 8px 22px rgba(249,115,22,.2);
}
/* Couleurs de texte garanties clair + sombre (identiques aux cartes
   #actu ; les variantes dark: du compilé ne sont pas toutes là). */
.a-lire-aussi .a-lire-card h3 a {
color: #1e293b;
}
html[data-theme="dark"] .a-lire-aussi .a-lire-card h3 a {
color: #f8fafc;
}
.a-lire-aussi .a-lire-card .text-slate-500 {
color: #64748b;
}
.a-lire-aussi .a-lire-card .text-slate-600 {
color: #475569;
}
html[data-theme="dark"] .a-lire-aussi .a-lire-card .text-slate-500,
html[data-theme="dark"] .a-lire-aussi .a-lire-card .text-slate-600 {
color: #94a3b8;
}