/*
Theme Name:   Démarchiant
Theme URI:    https://demarchiant.fr
Description:  Thème léger et rapide pour Démarchiant (identification des numéros inconnus). Mobile d'abord, SEO, emplacements AdSense, palettes noir-blanc-rouge, bleu ou noir et blanc. À utiliser avec l'extension Démarchiant Core.
Version:      1.2.1
Requires at least: 6.3
Requires PHP: 7.4
Author:       Démarchiant
License:      GPL-2.0-or-later
Text Domain:  demarchiant
*/

/* ------------------------------------------------------------------
   Couleurs (mode bleu par défaut, mode noir via body.mode-noir)
------------------------------------------------------------------ */
:root {
	--accent: #1F5BD8;
	--accent-ink: #FFFFFF;
	--ink: #0B1B33;
	--text: #3D4F6B;
	--muted: #5A6B85;
	--faint: #7A8AA3;
	--line: #E3E9F2;
	--field: #C9D5E6;
	--soft: #F2F6FC;
	--hero: #F2F6FC;
	--bg: #FFFFFF;
	--footer: #F7F9FC;
	--dark: #0B1B33;
	--dark-2: #16294A;
	--dark-text: #C9D5E6;
	--dark-link: #9DBCFF;
	--logo-accent-bg: transparent;
	--logo-accent-ink: var(--accent);

	--c-dem-bg: #FDF1E3; --c-dem-ink: #8A4B08; --c-dem-bar: #D97706; --c-dem-line: #F5D2A8;
	--c-arn-bg: #FCE8E8; --c-arn-ink: #A11D1D; --c-arn-bar: #C62828; --c-arn-line: #F4C2C2;
	--c-sur-bg: #E6F4EC; --c-sur-ink: #17663D; --c-sur-bar: #1B7F4B; --c-sur-line: #BFE3CD;
	--c-aut-bg: #EEF2F8; --c-aut-ink: #3D4F6B; --c-aut-bar: #7A8AA3; --c-aut-line: #DCE4EF;

	--radius: 16px;
	--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body.mode-noir {
	--accent: #111111;
	--ink: #111111;
	--text: #444444;
	--muted: #666666;
	--faint: #767676;
	--line: #E5E5E5;
	--field: #111111;
	--soft: #F4F4F4;
	--hero: #FFFFFF;
	--footer: #FAFAFA;
	--dark: #111111;
	--dark-2: #2A2A2A;
	--dark-text: #CFCFCF;
	--dark-link: #FFFFFF;
	--logo-accent-bg: #111111;
	--logo-accent-ink: #FFFFFF;

	--c-dem-bg: #EBEBEB; --c-dem-ink: #111111; --c-dem-bar: #666666; --c-dem-line: #D0D0D0;
	--c-arn-bg: #111111; --c-arn-ink: #FFFFFF; --c-arn-bar: #111111; --c-arn-line: #111111;
	--c-sur-bg: #FFFFFF; --c-sur-ink: #111111; --c-sur-bar: #BDBDBD; --c-sur-line: #111111;
	--c-aut-bg: #F4F4F4; --c-aut-ink: #444444; --c-aut-bar: #9E9E9E; --c-aut-line: #D0D0D0;
}

/* Noir, blanc et rouge : la palette du logo (par défaut). */
body.mode-rouge {
	--brand: #E5383B;          /* logo, pastilles, décor (pas de texte) */
	--accent: #D62F33;         /* boutons et liens : contraste AA sur blanc */
	--ink: #16181F;
	--text: #3A3F4E;
	--muted: #5E6372;
	--faint: #7D8292;
	--line: #E3E5EC;
	--field: #C9CCD6;
	--soft: #F2F3F7;
	--hero: #F2F3F7;
	--footer: #F7F8FA;
	--dark: #16181F;
	--dark-2: #252833;
	--dark-text: #C3C6D0;
	--dark-link: #FFFFFF;

	--c-dem-bg: #E9EAEF; --c-dem-ink: #16181F; --c-dem-bar: #5E6372; --c-dem-line: #D3D5DD;
	--c-arn-bg: #FDE7E7; --c-arn-ink: #B3191D; --c-arn-bar: #E5383B; --c-arn-line: #F6C3C4;
	--c-sur-bg: #FFFFFF; --c-sur-ink: #16181F; --c-sur-bar: #B8BBC6; --c-sur-line: #16181F;
	--c-aut-bg: #F2F3F7; --c-aut-ink: #3A3F4E; --c-aut-bar: #9A9EAB; --c-aut-line: #D3D5DD;
}

/* ------------------------------------------------------------------
   Base
------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 16px; line-height: 1.55; }
img, svg, video { max-width: 100%; height: auto; }
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--ink); text-decoration: underline; }
body.mode-noir a { text-decoration: underline; text-underline-offset: 3px; }
body.mode-noir .site-header a, body.mode-noir .dm-report-card, body.mode-noir .guide-card, body.mode-noir .btn, body.mode-noir .dm-btn { text-decoration: none; }
h1, h2, h3 { line-height: 1.15; letter-spacing: -0.02em; color: var(--ink); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 12px; top: -60px; background: var(--ink); color: #fff; padding: 10px 14px; border-radius: 8px; z-index: 100; }
.skip-link:focus { top: 12px; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
.wrap--narrow { max-width: 760px; }

.btn, .dm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 0 22px; border: 0; border-radius: 12px;
	background: var(--accent); color: var(--accent-ink);
	font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none;
}
.btn:hover, .dm-btn:hover { filter: brightness(1.08); color: var(--accent-ink); text-decoration: none; }
.btn--dark { background: var(--dark); color: #fff; }
.btn--dark:hover { color: #fff; }
.dm-btn:disabled { opacity: .6; cursor: default; }

/* ------------------------------------------------------------------
   En-tête
------------------------------------------------------------------ */
.site-header { border-bottom: 1px solid var(--line); background: var(--bg); }
.site-header__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; padding-bottom: 12px; }
.logo { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-weight: 800; font-size: 21px; letter-spacing: -0.02em; text-decoration: none; }
.logo:hover { color: var(--ink); text-decoration: none; }
.logo__mark { width: 36px; height: 36px; border-radius: 10px; background: var(--accent); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.logo__accent { color: var(--logo-accent-ink); background: var(--logo-accent-bg); }
body.mode-noir .logo__accent { padding: 0 5px; margin-left: 1px; border-radius: 4px; }

/* Logo « raccrocher » (palette rouge) */
body.mode-rouge .logo { font-size: 22px; letter-spacing: -0.035em; gap: 10px; }
body.mode-rouge .logo__mark { background: var(--brand); border-radius: 50%; }
body.mode-rouge .logo__mark svg { transform: rotate(135deg); }
body.mode-rouge .logo__accent { color: inherit; }
body.mode-rouge .eyebrow { color: var(--accent); }
body.mode-rouge .guide-card__cat { color: var(--accent); }
body.mode-rouge .dm-prefix-grid a:hover { background: var(--brand); }
body.mode-rouge .dm-text--demarchage { color: var(--ink); }
body.mode-rouge .dm-text--arnaque { color: #B3191D; }
body.mode-rouge .dm-text--sur { color: var(--ink); }
body.mode-rouge .dm-badge--sur { border-color: var(--c-sur-line); }

/* Logo curseur de l'en-tête */
body.mode-rouge .logo--pill { height: 48px; padding: 0 5px 0 18px; gap: 8px; border-radius: 24px; background: var(--dark); color: #fff; }
body.mode-rouge .logo--pill:hover { color: #fff; text-decoration: none; }
body.mode-rouge .logo--pill .logo__word { font-size: 21px; font-weight: 800; letter-spacing: -0.035em; color: #fff; line-height: 1; }
body.mode-rouge .logo--pill .logo__chev { font-size: 14px; font-weight: 800; letter-spacing: -0.1em; color: #5B6070; }
body.mode-rouge .logo--pill .logo__btn { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; background: var(--brand); display: inline-flex; align-items: center; justify-content: center; transition: transform .25s ease; }
body.mode-rouge .logo--pill .logo__btn svg { transform: rotate(135deg); }
@media (prefers-reduced-motion: no-preference) {
	body.mode-rouge .logo--pill:hover .logo__btn { transform: translateX(3px); }
}
@media (max-width: 380px) {
	body.mode-rouge .logo--pill { height: 42px; padding-left: 14px; }
	body.mode-rouge .logo--pill .logo__word { font-size: 18px; }
	body.mode-rouge .logo--pill .logo__btn { width: 34px; height: 34px; flex-basis: 34px; }
}

/* Curseur « Glissez pour ignorer » */
.swipe { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 8px; }
.swipe__pill { width: min(100%, 420px); height: 80px; border-radius: 40px; background: var(--dark); box-sizing: border-box; padding: 0 8px 0 30px; display: flex; align-items: center; gap: 12px; }
.swipe__word { flex: 1 1 auto; font-size: clamp(26px, 6vw, 36px); font-weight: 800; letter-spacing: -0.035em; color: #fff; }
.swipe__chev { font-size: 22px; font-weight: 800; letter-spacing: -0.1em; color: #5B6070; }
.swipe__btn { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%; background: var(--brand); display: flex; align-items: center; justify-content: center; }
.swipe__btn svg { transform: rotate(135deg); }
.swipe__tag { margin: 0; font-size: 17px; font-weight: 600; color: var(--text); }
@media (prefers-reduced-motion: no-preference) {
	.swipe__chev { animation: dm-chev 1.6s ease-in-out infinite; }
	@keyframes dm-chev { 0%, 100% { transform: translateX(0); opacity: .55; } 50% { transform: translateX(6px); opacity: 1; } }
}
@media (max-width: 420px) { .swipe__pill { height: 68px; padding-left: 22px; } .swipe__btn { width: 54px; height: 54px; flex-basis: 54px; } }
.custom-logo { max-height: 40px; width: auto; }

.menu-toggle { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); cursor: pointer; }
.site-nav { display: none; width: 100%; }
.site-nav.is-open { display: block; }
.site-nav__list { list-style: none; margin: 0; padding: 8px 0; display: flex; flex-direction: column; }
.site-nav__list a { display: block; padding: 12px 0; color: var(--text); font-weight: 600; text-decoration: none; }
.site-nav__list a:hover { color: var(--ink); }
.site-nav__cta { width: 100%; margin: 6px 0 10px; }

@media (min-width: 900px) {
	.menu-toggle { display: none; }
	.site-nav, .site-nav.is-open { display: flex; align-items: center; gap: 24px; width: auto; }
	.site-nav__list { flex-direction: row; gap: 24px; padding: 0; }
	.site-nav__list a { padding: 8px 0; font-size: 15px; }
	.site-nav__cta { width: auto; margin: 0; min-height: 44px; font-size: 15px; }
}

/* ------------------------------------------------------------------
   Accueil
------------------------------------------------------------------ */
.hero { background: var(--hero); border-bottom: 1px solid var(--line); }
.hero__inner { padding-top: 48px; padding-bottom: 44px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.eyebrow { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
body.mode-noir .eyebrow { color: var(--muted); }
.hero__title { margin: 0; font-size: clamp(38px, 8vw, 60px); line-height: 1.03; font-weight: 800; letter-spacing: -0.035em; }
.hero__lead { margin: 0; max-width: 560px; font-size: clamp(16px, 2.4vw, 19px); color: var(--text); }
.hero__note { margin: 0; font-size: 14px; color: var(--muted); }
.hero .dm-search { width: 100%; max-width: 620px; margin-top: 8px; }
@media (min-width: 700px) { .hero__inner { padding-top: 88px; padding-bottom: 80px; gap: 20px; } }

.section { padding: 40px 0 8px; }
.section__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.section__title { margin: 0; font-size: clamp(24px, 4vw, 30px); font-weight: 800; }
.section__link { font-weight: 700; font-size: 15px; }

.prefix-block { margin: 40px 0 8px; background: var(--dark); color: #fff; border-radius: 24px; padding: 28px 22px; display: flex; flex-wrap: wrap; gap: 28px; align-items: center; }
.prefix-block__text { flex: 1 1 320px; display: flex; flex-direction: column; gap: 12px; }
.prefix-block__text h2 { margin: 0; color: #fff; font-size: clamp(24px, 4vw, 30px); }
.prefix-block__text p { margin: 0; color: var(--dark-text); }
.prefix-block__text a { color: var(--dark-link); font-weight: 700; }
@media (min-width: 700px) { .prefix-block { padding: 48px; gap: 40px; } }

.guides { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.guide-card { display: flex; flex-direction: column; gap: 6px; padding: 22px; border-radius: var(--radius); background: var(--soft); color: var(--ink); text-decoration: none; }
.guide-card:hover { color: var(--ink); text-decoration: none; outline: 1px solid var(--field); }
.guide-card__cat { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
body.mode-noir .guide-card__cat { color: var(--muted); }
.guide-card__title { font-size: 18px; font-weight: 700; line-height: 1.3; }
.home-text { padding: 40px 0 16px; }

/* ------------------------------------------------------------------
   Recherche
------------------------------------------------------------------ */
.dm-search { display: flex; flex-wrap: wrap; gap: 10px; }
.dm-search__input {
	flex: 1 1 260px; min-width: 0; height: 52px; padding: 0 16px;
	font: inherit; font-size: 18px; font-weight: 600; color: var(--ink);
	background: #fff; border: 2px solid var(--field); border-radius: 14px;
}
.dm-search__input::placeholder { color: var(--faint); font-weight: 500; }
.dm-search__input:focus { border-color: var(--accent); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.dm-search__btn { height: 52px; border-radius: 14px; flex: 1 1 auto; }
@media (min-width: 560px) { .dm-search__btn { flex: 0 0 auto; } }
.dm-search--lg .dm-search__input, .dm-search--lg .dm-search__btn { height: 60px; font-size: 19px; }

.notice { padding: 12px 16px; border-radius: 12px; font-weight: 600; margin: 0; }
.notice--error { background: var(--c-arn-bg); color: var(--c-arn-ink); }

/* ------------------------------------------------------------------
   Publicité
------------------------------------------------------------------ */
.ad-slot { margin: 28px auto 0; text-align: center; }
.ad-slot__label { display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); margin-bottom: 4px; }
.ad-slot--placeholder { border: 1px dashed var(--field); border-radius: 12px; min-height: 90px; display: flex; align-items: center; justify-content: center; color: var(--faint); font-size: 13px; font-weight: 600; padding: 12px; }
.dm-aside .ad-slot { margin-top: 0; }
.dm-aside .ad-slot--placeholder { min-height: 250px; }

/* ------------------------------------------------------------------
   Pages Démarchiant (numéro, préfixe, listes)
------------------------------------------------------------------ */
.dm-wrap { max-width: 1120px; margin: 0 auto; padding: 18px 20px 64px; }
.dm-breadcrumb { font-size: 14px; color: var(--muted); margin-bottom: 18px; display: flex; flex-wrap: wrap; gap: 6px; }
.dm-breadcrumb a { color: var(--muted); }
.dm-breadcrumb [aria-current] { color: var(--ink); font-weight: 600; }
.dm-layout { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.dm-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.dm-main--full { flex-basis: 100%; }
.dm-aside { flex: 1 1 280px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }

.dm-card { border: 1px solid var(--line); border-radius: 20px; padding: 22px; background: var(--bg); }
@media (min-width: 700px) { .dm-card { padding: 30px; } }
.dm-dark-card { background: var(--dark); color: #fff; border-radius: var(--radius); padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.dm-dark-card h2, .dm-dark-card h3 { color: #fff; margin: 0; }
.dm-dark-card p { margin: 0; color: var(--dark-text); font-size: 15px; }
.dm-dark-card a { color: var(--dark-link); font-weight: 700; }

.dm-h1 { margin: 0; font-size: clamp(30px, 6vw, 44px); font-weight: 800; }
.dm-h2 { margin: 0 0 14px; font-size: clamp(21px, 3.5vw, 24px); font-weight: 800; }
.dm-h3 { margin: 0 0 10px; font-size: 18px; font-weight: 800; }
.dm-page-head { display: flex; flex-direction: column; gap: 10px; }
.dm-lead { margin: 0; font-size: 17px; color: var(--text); }
.dm-lead strong { color: var(--ink); }
@media (min-width: 700px) { .dm-lead { font-size: 18px; } }
.dm-small { margin: 0; font-size: 14px; color: var(--muted); }
.dm-section { display: flex; flex-direction: column; }

.dm-hero-number { display: flex; flex-direction: column; gap: 18px; }
.dm-hero-number__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.dm-number { margin: 0; font-size: clamp(32px, 7vw, 46px); font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }

.dm-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; padding: 4px 10px; border-radius: 999px; border: 1.5px solid transparent; white-space: nowrap; }
.dm-badge--lg { font-size: 16px; font-weight: 800; padding: 9px 16px; }
.dm-badge--demarchage { background: var(--c-dem-bg); color: var(--c-dem-ink); }
.dm-badge--arnaque { background: var(--c-arn-bg); color: var(--c-arn-ink); }
.dm-badge--sur { background: var(--c-sur-bg); color: var(--c-sur-ink); border-color: var(--c-sur-line); }
.dm-badge--autre, .dm-badge--info { background: var(--c-aut-bg); color: var(--c-aut-ink); }
body:not(.mode-noir) .dm-badge--sur { border-color: transparent; }

.dm-facts { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.dm-fact { background: var(--soft); border-radius: 14px; padding: 14px 16px; }
.dm-fact dt { font-size: 13px; font-weight: 600; color: var(--muted); }
.dm-fact dd { margin: 0; font-size: 16px; font-weight: 700; }

.dm-bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dm-bar { display: flex; align-items: center; gap: 12px; font-size: 15px; }
.dm-bar__label { flex: 0 0 104px; font-weight: 600; }
.dm-bar__track { flex: 1 1 auto; height: 12px; background: var(--soft); border-radius: 999px; overflow: hidden; }
.dm-bar__fill { display: block; height: 100%; border-radius: 999px; }
.dm-bar--demarchage .dm-bar__fill { background: var(--c-dem-bar); }
.dm-bar--arnaque .dm-bar__fill { background: var(--c-arn-bar); }
.dm-bar--sur .dm-bar__fill { background: var(--c-sur-bar); }
.dm-bar--autre .dm-bar__fill { background: var(--c-aut-bar); }
.dm-bar__value { flex: 0 0 46px; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Formulaire de signalement */
.dm-report { display: flex; flex-direction: column; gap: 10px; }
.dm-report__cats { border: 0; margin: 0; padding: 0; min-width: 0; }
.dm-report__title { padding: 0; margin-bottom: 12px; font-size: 22px; font-weight: 800; color: var(--ink); }
.dm-report__chips { display: flex; flex-wrap: wrap; gap: 10px; }
.dm-chip { position: relative; }
.dm-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dm-chip span { display: inline-flex; align-items: center; min-height: 48px; padding: 0 18px; border-radius: 12px; font-weight: 700; font-size: 15px; cursor: pointer; border: 2px solid transparent; }
.dm-chip--demarchage span { background: var(--c-dem-bg); color: var(--c-dem-ink); border-color: var(--c-dem-line); }
.dm-chip--arnaque span { background: var(--c-arn-bg); color: var(--c-arn-ink); border-color: var(--c-arn-line); }
.dm-chip--sur span { background: var(--c-sur-bg); color: var(--c-sur-ink); border-color: var(--c-sur-line); }
.dm-chip--autre span { background: var(--c-aut-bg); color: var(--c-aut-ink); border-color: var(--c-aut-line); }
.dm-chip input:checked + span { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.dm-chip input:checked + span::before { content: "✓"; margin-right: 6px; }
.dm-chip input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.dm-report__label { font-size: 14px; font-weight: 600; color: var(--text); margin-top: 6px; }
.dm-report__comment { width: 100%; font: inherit; font-size: 15px; color: var(--ink); padding: 12px 14px; border: 1px solid var(--field); border-radius: 12px; resize: vertical; }
body.mode-noir .dm-report__comment { border-color: #BDBDBD; }
.dm-report .dm-btn { align-self: flex-start; }
.dm-report__msg { margin: 0; font-weight: 600; min-height: 1em; }
.dm-report__msg.is-ok { color: var(--c-sur-ink); }
.dm-report__msg.is-error { color: #A11D1D; }
.dm-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Commentaires */
.dm-comment { border-bottom: 1px solid var(--line); padding: 4px 0 16px; margin-bottom: 14px; display: flex; flex-direction: column; gap: 6px; }
.dm-comment__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.dm-comment__time { font-size: 13px; color: var(--muted); }
.dm-comment__text { margin: 0; font-size: 15px; color: var(--ink); overflow-wrap: anywhere; }

/* Cartes et grilles */
.dm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.dm-report-card { display: flex; flex-direction: column; gap: 10px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); background: var(--bg); text-decoration: none; }
.dm-report-card:hover { border-color: var(--field); color: var(--ink); text-decoration: none; box-shadow: 0 2px 10px rgba(11, 27, 51, .06); }
.dm-report-card__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.dm-report-card__num { font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.dm-report-card__text { font-size: 15px; color: var(--text); overflow-wrap: anywhere; }
.dm-report-card__time { font-size: 13px; color: var(--muted); }

.dm-prefix-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; flex: 1 1 360px; }
.dm-prefix-grid a, .dm-prefix-grid span { display: block; text-align: center; padding: 12px 0; border-radius: 12px; background: var(--dark-2); color: #fff; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; text-decoration: none; }
body.mode-noir .dm-prefix-grid a { background: transparent; border: 1px solid #3A3A3A; }
.dm-prefix-grid a:hover { background: var(--accent); color: #fff; text-decoration: none; }
body.mode-noir .dm-prefix-grid a:hover { background: #fff; color: #111; }
@media (min-width: 700px) { .dm-prefix-grid a { padding: 14px 0; font-size: 20px; } }
.dm-prefix-block { padding: 28px; }

.dm-list { margin: 0; padding-left: 20px; }
.dm-prefix-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.dm-prefix-list a { display: flex; justify-content: space-between; gap: 8px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); text-decoration: none; }
.dm-prefix-list__p { font-weight: 800; }
.dm-prefix-list__n { color: var(--muted); font-size: 14px; }

.dm-near ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.dm-near a { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; color: var(--ink); font-weight: 600; text-decoration: none; }
.dm-near__num { font-variant-numeric: tabular-nums; }
.dm-near__cat { font-size: 13px; font-weight: 700; color: var(--muted); }
.dm-text--demarchage { color: var(--c-dem-ink); }
.dm-text--arnaque { color: #A11D1D; }
.dm-text--sur { color: #17663D; }
body.mode-noir .dm-text--demarchage, body.mode-noir .dm-text--arnaque, body.mode-noir .dm-text--sur { color: #111; }

.dm-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 24px; font-weight: 600; }
.dm-pagination a { padding: 10px 16px; border: 1px solid var(--line); border-radius: 10px; }

/* Formulaire de retrait */
.dm-form { display: flex; flex-direction: column; gap: 4px; max-width: 560px; }
.dm-form label { display: block; font-weight: 600; margin-bottom: 4px; }
.dm-form input[type="tel"], .dm-form input[type="email"], .dm-form textarea { width: 100%; font: inherit; padding: 12px 14px; border: 1px solid var(--field); border-radius: 12px; }
.dm-check { display: flex; gap: 10px; align-items: flex-start; }
.dm-check input { margin-top: 5px; width: 18px; height: 18px; }
.dm-check label { font-weight: 400; }
.dm-notice { padding: 14px 16px; border-radius: 12px; font-weight: 600; }
.dm-notice--ok { background: var(--c-sur-bg); color: var(--c-sur-ink); border: 1px solid var(--c-sur-line); }
.dm-notice--error { background: var(--c-arn-bg); color: var(--c-arn-ink); }

/* ------------------------------------------------------------------
   Articles et pages (guides)
------------------------------------------------------------------ */
.content-wrap { padding-top: 32px; padding-bottom: 64px; }
.entry-header { margin-bottom: 24px; }
.entry-title { margin: 0 0 8px; font-size: clamp(30px, 6vw, 44px); font-weight: 800; }
.entry-meta { color: var(--muted); font-size: 14px; }
.entry-content { font-size: 17px; color: var(--ink); }
.entry-content p, .entry-content li { color: var(--text); }
.entry-content h2 { font-size: 26px; margin: 36px 0 12px; }
.entry-content h3 { font-size: 20px; margin: 28px 0 10px; }
.entry-content img { border-radius: 12px; }
.entry-content a { text-decoration: underline; text-underline-offset: 3px; }
.posts-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.post-card { display: flex; flex-direction: column; gap: 8px; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); }
.post-card__title { margin: 0; font-size: 20px; }
.post-card__title a { color: var(--ink); }
.post-card__excerpt { margin: 0; color: var(--text); font-size: 15px; }
.archive-title { margin: 0 0 24px; font-size: clamp(28px, 5vw, 38px); font-weight: 800; }
.nav-links { display: flex; justify-content: space-between; gap: 16px; margin-top: 32px; font-weight: 600; }
.not-found { padding: 64px 0; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }

/* ------------------------------------------------------------------
   Pied de page
------------------------------------------------------------------ */
.site-footer { border-top: 1px solid var(--line); background: var(--footer); margin-top: 48px; }
.site-footer__inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 28px; padding-bottom: 28px; font-size: 14px; color: var(--muted); }
.site-footer__inner p { margin: 0; }
.footer-nav { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.footer-nav a { color: var(--text); }
.dm-page .site-footer, .home .site-footer { margin-top: 0; }