/* Charte « Clinique douce » (spec237) — chargée en dernier sur chaque page (src/lib/charte.mjs).
   Jetons de la charte, puis habillage des classes existantes du site (style.css, blocs <style> des pages,
   documentation/css/style.css). Les couleurs en dur des pages sont remplacées au build par ces variables. */

/* ── 1. Jetons (spec237 §3, §5) ─────────────────────────────────────────── */
:root {
	--c-bg: #f5f8f6;
	--c-surface: #ffffff;
	--c-ink: #15302d;
	--c-ink-soft: #4a6662;
	--c-nav: #3c5a56;
	--c-deep: #12403c;
	--c-accent: #2a6fb0;
	--c-accent-hover: #245f97;
	--c-accent-soft: #e5eff9;
	--c-accent-ink: #1f5a94;
	--c-line: #e1eae6;
	--c-line-strong: #6f8a85;
	--c-error: #b42318;
	--c-error-soft: #fdecea;

	--app-sante: #e3f2ea; --app-sante-ink: #1d6b42;
	--app-eleveur: #fdebd8; --app-eleveur-ink: #9a4a0b;
	--app-refuge: #e6f0dc; --app-refuge-ink: #3d6a1c;
	--app-pension: #e6e8fb; --app-pension-ink: #3b3fa0;

	--s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 88px;
	--r-sm: 12px; --r-md: 20px; --r-lg: 28px; --r-pill: 999px;
	--shadow-hover: 0 6px 20px rgba(18, 64, 60, .08);

	--font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--font-body: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;

	/* Variables de l'ancienne charte, rebranchées sur les jetons : les styles en ligne des pages les utilisent. */
	--primary: var(--c-accent);
	--primary-rgb: 42, 111, 176;
	--primary-dark: var(--c-deep);
	--primary-light: var(--c-accent-soft);
	--secondary: var(--c-deep);
	--secondary-hover: #0b2b28;
	--secondary-light: var(--c-line);
	--bg-body: var(--c-bg);
	--bg-card: var(--c-surface);
	--bg-soft: var(--c-bg);
	--text-main: var(--c-ink);
	--text-muted: var(--c-ink-soft);
	--text-light: var(--c-ink-soft);
	--glass-bg: var(--c-surface);
	--glass-border: var(--c-line);
	--shadow-sm: none;
	--shadow-md: none;
	--shadow-lg: none;
	--shadow-xl: var(--shadow-hover);
	--radius-md: var(--r-sm);
	--radius-lg: var(--r-md);
	--radius-xl: var(--r-lg);
}

/* Le site reste en clair : l'ancien thème sombre n'est pas repris par la charte (spec237 §8). */
[data-theme=dark], body.dark-theme {
	--bg-body: var(--c-bg); --bg-card: var(--c-surface); --text-main: var(--c-ink); --text-muted: var(--c-ink-soft);
	--text-light: var(--c-ink-soft); --glass-bg: var(--c-surface); --glass-border: var(--c-line);
}
body.dark-theme { background-image: none !important; }

/* ── 2. Base ─────────────────────────────────────────────────────────────── */
html { -webkit-text-size-adjust: 100%; }
body {
	font-family: var(--font-body) !important;
	background: var(--c-bg) !important;
	background-image: none !important;
	color: var(--c-ink);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
@media (max-width: 768px) { body { font-size: 16px; } }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-body); font-weight: 700; color: var(--c-ink); letter-spacing: -.01em; }
h1 { line-height: 1.15; }
h2 { line-height: 1.25; }
p, li, td, th, dd, dt, label, blockquote { font-family: var(--font-body); }
strong, b { font-weight: 700; }

/* Titres en Fraunces sur l'accueil et les landings (spec237 §4) */
html[data-display=landing] h1,
html[data-display=landing] h2,
html[data-display=landing] .hero-title,
html[data-display=landing] .section-title,
html[data-display=landing] .pricing-title { font-family: var(--font-display); font-weight: 400; letter-spacing: -.01em; }
html[data-display=landing] h3 { font-family: var(--font-display); font-weight: 400; }
html[data-display=landing] h1 { line-height: 1.06; }
html[data-display=landing] h2 { line-height: 1.12; }
html[data-display=landing] blockquote,
html[data-display=landing] .founder-quote { font-family: var(--font-display); font-style: italic; }

a { color: inherit; }
:focus-visible { outline: 3px solid var(--c-accent) !important; outline-offset: 2px !important; border-radius: 4px; }
::selection { background: var(--c-accent-soft); color: var(--c-ink); }

.icon { width: 1em; height: 1em; display: inline-block; vertical-align: -.125em; flex-shrink: 0; }
.icon-emoji { width: 1.05em; height: 1.05em; vertical-align: -.15em; color: var(--c-accent); }
.icon-emoji.icon-ok { color: var(--app-sante-ink); }
.icon-emoji.icon-no { color: var(--c-error); }
.icon-emoji.icon-warn { color: var(--app-eleveur-ink); }

/* Formes héritées de l'ancienne charte, retirées : taches floues, dégradés de fond, effets de verre. */
.blob, .blob-1, .blob-2, .living-blob { display: none !important; }
.glass {
	background: var(--c-surface) !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 1px solid var(--c-line) !important;
	box-shadow: none !important;
}

/* ── 3. Mise en page ─────────────────────────────────────────────────────── */
.container { max-width: 1136px; }
section { padding: var(--s-8) 0; }
@media (max-width: 768px) { section { padding: var(--s-7) 0; } .container { padding: 0 16px; } }

.text-muted { color: var(--c-ink-soft) !important; }
.text-primary { color: var(--c-accent) !important; }
.text-secondary { color: var(--c-deep) !important; }

/* ── 4. En-tête et menu (public/js/menu.js, rendu au build) ──────────────── */
.navbar {
	position: sticky !important; top: 0 !important; left: auto !important; transform: none !important;
	width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important;
	background: var(--c-surface) !important; border-bottom: 1px solid var(--c-line) !important;
	z-index: 1000;
}
.navbar.navbar-hidden { transform: translateY(-100%) !important; }
.nav-content {
	max-width: 1136px; margin: 0 auto;
	background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
	padding: 14px 24px !important; min-height: 68px;
}
@media (max-width: 768px) { .nav-content { padding: 10px 16px !important; min-height: 60px; } }
body:not(:has(.hero)) { padding-top: 0 !important; }
.logo { font-family: var(--font-display) !important; font-weight: 500 !important; font-size: 22px !important; color: var(--c-ink) !important; letter-spacing: -.01em; }
.logo img { height: 40px !important; }
.nav-links a { color: var(--c-nav); font-weight: 500; font-size: 15px; }
.nav-links a.active, .nav-links a:hover { color: var(--c-ink); }
.nav-links a::after { background-color: var(--c-accent) !important; height: 2px; }
.nav-dropdown-content, .dropdown-more-content {
	background: var(--c-surface) !important; border: 1px solid var(--c-line) !important;
	border-radius: var(--r-md) !important; box-shadow: var(--shadow-hover) !important;
}
.nav-dropdown-content a:hover, .nav-dropdown-content a.active { background-color: var(--c-accent-soft) !important; color: var(--c-ink) !important; }
.dropdown-more-content a:hover, .more-icon-cue { color: var(--c-accent) !important; }
.dropdown-more-item:not(:last-child) { border-bottom: 1px solid var(--c-line) !important; }
.dropdown-more-item .lang-pills { background: var(--c-bg) !important; border: 1px solid var(--c-line) !important; }
.lang-btn { color: var(--c-ink-soft); font-weight: 600; }
.lang-btn.active, .lang-btn:hover { color: var(--c-accent); }
.theme-toggle { display: none !important; }

/* ── 5. Boutons, étiquettes ─────────────────────────────────────────────── */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 12px 22px; border-radius: var(--r-sm) !important;
	font-family: var(--font-body); font-weight: 600; font-size: 16px; line-height: 1.2;
	box-shadow: none !important; transform: none !important; text-decoration: none;
}
.btn-primary { background: var(--c-accent) !important; color: #fff !important; border: 0; }
.btn-primary:hover { background: var(--c-accent-hover) !important; }
.btn-secondary, .btn-outline, .btn-ghost {
	background: var(--c-surface) !important; color: var(--c-deep) !important;
	border: 1px solid var(--c-line-strong) !important;
}
.btn-secondary:hover, .btn-outline:hover, .btn-ghost:hover { background: var(--c-bg) !important; }
@media (max-width: 768px) { .btn { min-height: 44px; padding: 10px 18px; font-size: 15px; } }

.badge {
	border-radius: var(--r-pill) !important; padding: 4px 12px !important;
	font-size: 12px !important; font-weight: 600 !important; letter-spacing: .02em;
	background: var(--c-accent-soft) !important; color: var(--c-accent-ink) !important; border: 0 !important;
}
.badge-free { background: var(--app-sante) !important; color: var(--app-sante-ink) !important; }
.badge-accent { background: var(--c-accent-soft) !important; color: var(--c-accent-ink) !important; }
.filter-btn, .newsletter-tab {
	border-radius: var(--r-pill) !important; background: var(--c-surface) !important; color: var(--c-ink-soft) !important;
	border: 1px solid var(--c-line) !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	min-height: 40px;
}
.filter-btn:hover, .newsletter-tab:hover { border-color: var(--c-accent) !important; color: var(--c-accent) !important; }
.filter-btn.active, .newsletter-tab.active { background: var(--c-accent) !important; border-color: var(--c-accent) !important; color: #fff !important; }
.newsletter-tabs { background: var(--c-bg) !important; border: 1px solid var(--c-line); }

/* ── 6. Cartes ───────────────────────────────────────────────────────────── */
.glass-card {
	background: var(--c-surface) !important; border: 1px solid var(--c-line) !important;
	border-radius: var(--r-md) !important; box-shadow: none !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	transition: box-shadow .2s ease, border-color .2s ease !important;
}
.glass-card:hover { transform: none !important; box-shadow: none !important; }
a.glass-card:hover, .clickable-card:hover, .article-item:hover, .newsletter-card:hover {
	box-shadow: var(--shadow-hover) !important; border-color: #cfdcd7 !important; transform: none !important;
}
.newsletter-card:hover, .gallery-item:hover, .aesthetic-image-container:hover { transform: none !important; }
.aesthetic-image-container { box-shadow: none !important; border: 1px solid var(--c-line); border-radius: var(--r-md) !important; }
.feature-icon { color: var(--c-accent); }
.offer-card { border: 1px solid var(--c-accent) !important; background: var(--c-surface) !important; border-radius: var(--r-md) !important; }
.accounting-card { border: 1px solid var(--c-line) !important; background: var(--c-surface) !important; }
.discover-card { background: var(--c-accent-soft) !important; border: 1px solid var(--c-line) !important; }
.highlight { background: var(--c-accent-soft) !important; border: 0 !important; border-radius: var(--r-md) !important; }

/* ── 7. Héros et titres de section ──────────────────────────────────────── */
.hero { min-height: auto; padding-top: var(--s-8); padding-bottom: var(--s-8); }
.hero-title {
	background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
	-webkit-text-fill-color: currentColor !important; color: var(--c-ink) !important;
	font-size: clamp(38px, 2rem + 2.6vw, 64px) !important; line-height: 1.06 !important;
}
html:not([data-display=landing]) .hero-title { font-size: clamp(32px, 1.6rem + 1.6vw, 44px) !important; line-height: 1.15 !important; }
.hero-subtitle { color: var(--c-ink-soft) !important; font-size: clamp(18px, 1rem + .4vw, 20px) !important; line-height: 1.55; }
.section-title { font-size: clamp(28px, 1.3rem + 1vw, 36px); color: var(--c-ink); }
html:not([data-display=landing]) .section-title { font-size: clamp(24px, 1.2rem + .6vw, 28px); }
.section-title::after { display: none !important; }
.scroll-indicator { background: var(--c-deep) !important; border: 0 !important; box-shadow: none !important; }
.scroll-indicator:hover { background: #0b2b28 !important; box-shadow: none !important; }

.heartbeat-paw { max-width: 760px; margin: var(--s-5) auto var(--s-4); color: var(--c-accent); }
.heartbeat-paw svg { width: 100%; height: auto; display: block; }
.heartbeat-paw .hb-line { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.heartbeat-paw .hb-dots { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 2 10; }
.heartbeat-paw .hb-tail { fill: none; stroke: var(--c-line); stroke-width: 2; }
.heartbeat-paw g { fill: currentColor; }
.hero-content .heartbeat-paw, [style*="text-align: left"] > .heartbeat-paw, [style*="text-align:left"] > .heartbeat-paw { margin-left: 0; }
@media (max-width: 768px) { .heartbeat-paw { margin: var(--s-4) auto; } }

/* ── 8. Fondateur, tarifs ───────────────────────────────────────────────── */
.founder-card { background: var(--c-surface) !important; border: 1px solid var(--c-line) !important; }
.founder-image-container { box-shadow: none !important; border: 4px solid var(--c-surface) !important; outline: 1px solid var(--c-line); }
.founder-quote { color: var(--c-ink); }
.founder-quote::before { color: var(--c-accent-soft) !important; opacity: 1 !important; font-family: var(--font-display) !important; }
.founder-title { color: var(--c-accent) !important; }
.pricing-card.popular { border: 2px solid var(--c-accent) !important; }
.pricing-card.popular::before { background: var(--c-accent) !important; border-radius: var(--r-pill) !important; }
.pricing-price { color: var(--c-ink) !important; }
.pricing-features .icon { color: var(--c-accent); }
.pricing-features li.feat-highlight .icon { color: var(--c-deep); }

/* ── 9. Pied de page, boutons flottants ──────────────────────────────────── */
.footer { background: var(--c-surface) !important; border-top: 1px solid var(--c-line) !important; margin-top: var(--s-9); }
.footer-col h4 { font-family: var(--font-body); color: var(--c-ink) !important; font-size: 15px; letter-spacing: .02em; }
.footer-col ul a, .footer-about p { color: var(--c-ink-soft) !important; }
.footer-col ul a:hover { color: var(--c-accent) !important; transform: none !important; }
.footer-social-links a { background: var(--c-bg) !important; color: var(--c-deep) !important; border: 1px solid var(--c-line); width: 44px !important; height: 44px !important; }
.footer-social-links a:hover { background: var(--c-accent) !important; color: #fff !important; transform: none !important; }
.footer-bottom { border-top: 1px solid var(--c-line) !important; }
.footer-bottom .footer-rights { color: var(--c-ink-soft) !important; }
.scroll-to-top { background: var(--c-deep) !important; border: 0 !important; box-shadow: none !important; }
.scroll-to-top:hover { background: #0b2b28 !important; box-shadow: none !important; }
.lang-switcher-footer a.active { color: var(--c-accent) !important; }

/* ── 10. Formulaires ─────────────────────────────────────────────────────── */
input[type=text], input[type=email], input[type=tel], input[type=search], input[type=number], input[type=url], select, textarea {
	font-family: var(--font-body); border: 1px solid var(--c-line-strong) !important; border-radius: var(--r-sm) !important;
	background: var(--c-surface) !important; color: var(--c-ink) !important; min-height: 44px;
}
input::placeholder, textarea::placeholder { color: #6f8a85 !important; }

/* ── 11. Articles (spec237 §6 ArticleLayout) ─────────────────────────────── */
.article-body h1, .article-body .section-title {
	font-size: clamp(30px, 1.4rem + 1.4vw, 44px) !important; line-height: 1.15 !important; color: var(--c-ink) !important;
}
.article-content { font-size: 18px !important; color: var(--c-ink) !important; line-height: 1.7 !important; max-width: 720px; }
.article-content h2 { color: var(--c-ink) !important; font-size: clamp(24px, 1.1rem + .6vw, 28px) !important; }
.article-content h3 { color: var(--c-ink) !important; }
.article-content a:not(.btn) { color: var(--c-accent); text-decoration: underline; text-underline-offset: 3px; }
.article-content table { border: 1px solid var(--c-line); box-shadow: none !important; border-radius: var(--r-md) !important; }
.article-content th { background: var(--c-accent-soft) !important; color: var(--c-ink) !important; }
.article-content td { border-color: var(--c-line) !important; }
.article-content img, .article-body picture img { border-radius: var(--r-md); }
.article-updated { color: var(--c-ink-soft) !important; }
.article-item h3 { font-family: var(--font-body); }

/* ── 12. Documentation (spec237 §6 DocLayout) ────────────────────────────── */
html[data-section=documentation] {
	--primary: var(--c-accent); --primary-rgb: 42, 111, 176; --secondary: var(--c-deep); --accent: var(--c-accent);
	--text: var(--c-ink); --text-muted: var(--c-ink-soft); --bg: var(--c-bg);
	--sidebar-bg: var(--c-surface); --card-bg: var(--c-surface); --shadow: none; --radius: var(--r-md);
}
html[data-section=documentation] .sidebar { background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border-right: 1px solid var(--c-line) !important; }
html[data-section=documentation] .header-mobile { background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border-bottom: 1px solid var(--c-line); }
html[data-section=documentation] .logo { font-size: 20px !important; }
html[data-section=documentation] .nav-link { color: var(--c-ink-soft); border-radius: var(--r-sm); }
html[data-section=documentation] .nav-link:hover { background: var(--c-accent-soft) !important; color: var(--c-ink) !important; }
html[data-section=documentation] .nav-link.active { background: var(--c-accent) !important; color: #fff !important; box-shadow: none !important; }
html[data-section=documentation] .main-content h1 { font-size: clamp(30px, 1.4rem + 1.4vw, 40px); color: var(--c-ink); }
html[data-section=documentation] .main-content h2 { color: var(--c-ink); }
html[data-section=documentation] .main-content a:not(.btn):not(.nav-link):not(.lang-btn) { color: var(--c-accent); }
html[data-section=documentation] .card, html[data-section=documentation] .glass-card, html[data-section=documentation] [class*=card] {
	background: var(--c-surface) !important; border: 1px solid var(--c-line) !important; box-shadow: none !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}

/* ── 13. Héros sur photo des landings ────────────────────────────────────── */
/* Plus de voile sombre ni de verre dépoli : la carte de texte devient une carte blanche posée sur la photo. */
.hero .hero-overlay { display: none !important; }
.hero, .hero * { text-shadow: none !important; }
.hero .hero-content[style*="backdrop-filter"], .hero .hero-content[style*="background"] {
	background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important; box-shadow: none !important;
}
.hero .hero-content .badge { background: var(--c-accent-soft) !important; color: var(--c-accent-ink) !important; }
.hero .hero-content [style*="color: white"], .hero .hero-content [style*="color:white"],
.hero .hero-content [style*="color: rgba(255"], .hero .hero-content [style*="color:rgba(255"] { color: var(--c-ink-soft) !important; }
.hero .hero-content a:not(.btn)[style*="color"] { color: var(--c-accent) !important; }
.hero.hero-has-video { background: var(--c-bg); }
.hero.hero-has-video > div:has(> picture) { display: none; }
.hero-video { background: var(--c-surface) !important; border: 1px solid var(--c-line) !important; box-shadow: none !important; border-radius: var(--r-lg) !important; }
.hero .hero-content { box-shadow: none !important; }
.hero .hero-content .hero-title { font-size: clamp(34px, 1.4rem + 2vw, 52px) !important; }
.hero .hero-content [style*="color: #fff"], .hero .hero-content [style*="color:#fff"],
.hero .hero-content [style*="color: #ffffff"], .hero .hero-content [style*="color:#ffffff"] { color: var(--c-ink) !important; }
.hero .hero-content [style*="text-fill-color"] { -webkit-text-fill-color: currentColor !important; }
/* Accueil : titre et vidéo côte à côte (la vidéo garde son cadre) */
@media (min-width: 1101px) {
	.hero.hero-has-video { min-height: auto !important; padding: var(--s-8) 0 !important; }
	.hero.hero-has-video > .container:not(.navbar) { gap: var(--s-7); justify-content: space-between; }
	.hero.hero-has-video .hero-content { flex: 1 1 560px; max-width: 600px !important; }
	.hero.hero-has-video .hero-video { flex: 0 0 auto; width: min(42%, 460px); aspect-ratio: 4 / 5; }
}
@media (max-width: 1100px) { .hero.hero-has-video { padding: var(--s-6) 0 var(--s-8) !important; } }
.hero.hero-has-video .scroll-indicator { display: none !important; }
.hero .hero-content .hero-title.hero-title, .hero .hero-content h1[style] { color: var(--c-ink) !important; -webkit-text-fill-color: currentColor !important; }
/* Repli « ••• » prévu quand Ionicons ne chargeait pas : les icônes sont désormais des SVG intégrés. */
.nav-dropdown-more .nav-dropdown-trigger::before { content: none !important; }
.mobile-sticky-cta {
	background: var(--c-deep) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 0 !important; box-shadow: 0 8px 24px rgba(18, 64, 60, .18) !important; border-radius: var(--r-pill) !important;
}
.mobile-sticky-cta:hover, .mobile-sticky-cta:active { transform: translateX(-50%) !important; background: #0b2b28 !important; }
.mobile-sticky-cta .sticky-arrow { background: rgba(255, 255, 255, .16) !important; }

.hero .hero-card {
	background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important; box-shadow: none !important; color: var(--c-ink);
}
.hero .hero-card :is(h1, h2, h3, p, strong, span, li) { color: inherit; }
.hero .hero-card p, .hero .hero-card .hero-subtitle { color: var(--c-ink-soft) !important; }
.hero .hero-card :is(h1, h2, h3) { color: var(--c-ink) !important; }
.hero .hero-card strong { color: var(--c-ink) !important; }
.scroll-indicator { display: none !important; }
.hero [class*="hero-card"] {
	background: var(--c-surface) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important; box-shadow: none !important; color: var(--c-ink);
}
.hero [class*="hero-card"] :is(h1, h2, h3) { color: var(--c-ink) !important; -webkit-text-fill-color: currentColor !important; }
.hero [class*="hero-card"] p, .hero [class*="hero-card"] .pro-choose-label { color: var(--c-ink-soft) !important; }
.hero [class*="hero-card"] strong { color: var(--c-ink) !important; }
.hero [class*="hero-card"] .pro-pill, .hero .hero-card .pro-pill { background: var(--c-accent-soft) !important; color: var(--c-accent-ink) !important; border: 0 !important; }
.hero [class*="hero-card"] a:not(.btn):not([class^="c-"]) { color: var(--c-accent) !important; }
/* Certaines pages passaient le menu en blanc (il flottait sur leur photo) : il est désormais sur fond blanc. */
html[data-charte] body > nav.navbar .nav-links > a,
html[data-charte] body > nav.navbar .nav-links .nav-dropdown-trigger { color: var(--c-nav) !important; opacity: 1 !important; text-shadow: none !important; }
html[data-charte] body > nav.navbar .nav-links > a.active,
html[data-charte] body > nav.navbar .nav-links > a:hover,
html[data-charte] body > nav.navbar .nav-links .nav-dropdown-trigger:hover { color: var(--c-ink) !important; }
html[data-charte] body > nav.navbar .logo, html[data-charte] body > nav.navbar .logo span { color: var(--c-ink) !important; text-shadow: none !important; }
html[data-charte] body > nav.navbar .nav-content { background: var(--c-surface) !important; border: 0 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
/* Articles : colonne de lecture de 720 px centrée dans la carte */
.article-body > *:not(.article-content) { max-width: 720px; margin-left: auto !important; margin-right: auto !important; }
.article-body .article-content { margin-left: auto !important; margin-right: auto !important; }
.article-body h1.section-title { left: auto !important; transform: none !important; display: block; text-align: left !important; }
html[data-section=documentation] [style*="rgba(42, 111, 176"] { color: inherit; }
html[data-section=documentation] .alert { border-radius: var(--r-md) !important; }
html[data-section=documentation] .alert-tip { background: var(--c-accent-soft) !important; border: 0 !important; }
html[data-section=documentation] .alert-warning { background: var(--app-eleveur) !important; border: 0 !important; }
html[data-section=documentation] .alert-warning svg.icon { color: var(--app-eleveur-ink) !important; }
html[data-section=documentation] table { border: 1px solid var(--c-line) !important; }
html[data-section=documentation] th { background: var(--c-accent-soft) !important; color: var(--c-ink) !important; }
/* Tableaux larges : défilement horizontal dans leur cadre sur téléphone */
@media (max-width: 768px) {
	.article-content table, html[data-section=documentation] .main-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
.lang-switcher-footer a { opacity: 1 !important; color: var(--c-ink-soft); }
.lang-switcher-footer a.active { color: var(--c-accent) !important; }
/* Mention de bas de menu de la documentation (opacité 0,5 dans src/data/doc-menu.js) */
html[data-section=documentation] .sidebar [style*="opacity: 0.5"] { opacity: 1 !important; color: var(--c-ink-soft); }
/* Héros à carte : marge au-dessus et au-dessous de la carte, pour qu'elle ne touche pas les bords de la photo
   (les landings ont `padding: 0` en ligne). */
.hero:has(.hero-card, [class*="hero-card"]) { padding-top: var(--s-7) !important; padding-bottom: var(--s-7) !important; }
@media (max-width: 768px) { .hero:has(.hero-card, [class*="hero-card"]) { padding-top: var(--s-6) !important; padding-bottom: var(--s-6) !important; } }
/* Note de l'application (page éleveur) */
.app-rating { margin-top: var(--s-3); font-size: 15px; }
.app-rating a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--c-ink) !important; font-weight: 600; text-decoration: none; }
.app-rating a:hover span { text-decoration: underline; text-underline-offset: 3px; }
.app-rating .icon { color: var(--app-eleveur-ink); fill: currentColor; width: 1.1em; height: 1.1em; }

/* spec238 — bandeau « Parlons-en en visio » des pages pro */
.visio-cta-band { padding: var(--s-6) 16px; }
.visio-cta {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-5);
	max-width: 1000px; margin: 0 auto; padding: var(--s-6); border-radius: var(--r-lg);
	background: var(--c-accent-soft); border: 1px solid var(--c-line);
}
.visio-cta > div { flex: 1 1 420px; }
.visio-cta h2 { margin: 0 0 var(--s-2); font-size: clamp(24px, 1.1rem + .8vw, 30px); }
.visio-cta p { margin: 0; color: var(--c-ink-soft); }