/* ============================================================
   TRIBUNE · SYSTÈME DE DESIGN v3
   Chargé en dernier : il harmonise toutes les rubriques du site
   (titres de page, panneaux, tableaux, tuiles de chiffres, onglets,
   filtres, boutons) pour une lecture claire et cohérente.
   ============================================================ */
:root{--ds-r-l:18px;--ds-r-m:14px;--ds-r-s:10px;--ds-gap:18px;--ds-lab:10.5px}

/* ---------- 1. En-têtes de page : même gabarit partout ---------- */
.page-h,.bkh,.hero,section.hero,.cpx-hero,.sg-hero,.mm-hero,.cl-hero,.cp-hero,.oc-hero,.pr-hero,.fx-hero,.bkw-hero,.hub-hero{border-radius:var(--ds-r-l) !important}
.page-h h1,.bkh h1,.lx-h1 h1,.ph h1,section.hero h1,.cpx-hero h1,.sg-hero h1,.mm-hero h1,.cl-hero h1,.cp-hero h1,.oc-hero h1,.pr-hero h1,.fx-hero h1,.bkw-hero h1{font-size:clamp(26px,3.1vw,40px) !important;line-height:1.02 !important;text-transform:uppercase !important;letter-spacing:.01em !important;margin:4px 0 8px !important}
.page-h .eyebrow,.bkh .eyebrow,section.hero .eyebrow,.cpx-hero .eyebrow,.sg-hero .eyebrow,.mm-hero .eyebrow,.cl-hero .eyebrow,.cp-hero .eyebrow,.oc-hero .eyebrow,.fx-hero .eyebrow{font-size:11px !important;font-weight:800 !important;letter-spacing:.12em !important;text-transform:uppercase}
.page-h p,.cpx-hero p,.sg-hero p,.mm-hero p,.cl-hero p,.cp-hero p,.oc-hero p,.fx-hero p{font-size:13.5px !important;line-height:1.5 !important;max-width:78ch}

/* ---------- 2. Panneaux ---------- */
#view .panel{border-radius:var(--ds-r-l) !important}
#view .panel-h{align-items:center;gap:8px 12px}
#view .panel-h h2{font-size:clamp(15px,1.35vw,18px) !important;letter-spacing:.03em !important;text-transform:uppercase;line-height:1.2}
#view .panel-h .src{font-size:11px;border-radius:999px;padding:3px 10px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* ---------- 3. Tableaux : en-têtes, chiffres, survol ---------- */
#view table th{font-size:var(--ds-lab);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
#view table td{font-variant-numeric:tabular-nums}
#view table tbody tr:not(.sec):not(.ts-tot):not(.tot):hover>td{background-color:color-mix(in srgb,var(--accent) 5%,transparent)}
#view .tablewrap{border-radius:var(--ds-r-m)}

/* ---------- 4. Tuiles de chiffres (KPI) ---------- */
#view .kpi,#view .es-k>div,#view .sg-k>div,#view .bi-kp>div{border-radius:var(--ds-r-m) !important}
#view .kpi>small:first-child,#view .es-k small,#view .sg-k small{font-size:var(--ds-lab) !important;font-weight:800 !important;letter-spacing:.06em !important;text-transform:uppercase;color:var(--muted)}
#view .kpi b.num,#view .es-k b,#view .sg-k b{line-height:1.08}

/* ---------- 5. Onglets et sous-onglets ---------- */
.lp-tabs button,.eq-tabs button{font-weight:700 !important}
.lp-tabs button:focus-visible,.eq-sub button:focus-visible,.cp-nav button:focus-visible,.an-tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- 6. Filtres, champs, boutons ---------- */
#view select,#view input[type=search],#view input[type=text],#view input[type=number]{border-radius:var(--ds-r-s)}
#view select:focus-visible,#view input:focus-visible{outline:none;border-color:var(--accent) !important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.mini-btn,.btn{border-radius:999px}
.mini-btn:focus-visible,.btn:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- 7. Textes d'aide et sources ---------- */
#view .hint{line-height:1.45}
#view .rp-meta{font-size:11.5px;line-height:1.45}
#view .empty{border-radius:var(--ds-r-m)}

/* ---------- 8. Espacements ---------- */
#view>div[style*="display:grid"],#view>section+section{row-gap:var(--ds-gap)}

/* ---------- 9. Téléphone ---------- */
@media (max-width:640px){
  .page-h h1,.bkh h1,.lx-h1 h1,.ph h1,section.hero h1,.cpx-hero h1,.sg-hero h1,.mm-hero h1,.cl-hero h1,.cp-hero h1,.oc-hero h1,.fx-hero h1,.bkw-hero h1{font-size:24px !important}
  .page-h p,.cpx-hero p,.sg-hero p,.mm-hero p,.cl-hero p,.cp-hero p,.oc-hero p,.fx-hero p{font-size:12.5px !important}
  #view .panel{padding:14px 12px !important;border-radius:14px !important}
  #view .panel-h h2{font-size:15px !important}
  #view .panel-h .src{display:none}
  #view table{font-size:12.5px}
}
