/* ============================================================
   MAPi · Design tokens (fondations seules)
   Extrait de index.html (Mes-Aides-Publiques/mapi-suivi-client).
   À importer tel quel dans tout nouvel écran MAPi.
   Règle : ne JAMAIS inventer un hex hors charte ; réutiliser ces
   variables (les gradients peuvent décliner un même hue en plus
   clair/foncé pour la profondeur).
   ============================================================ */

/* Museo Sans · police d'affichage de marque MAPi (auto-hébergée sur le CDN) */
@font-face {
    font-family: 'Museo Sans';
    src: local('Museo Sans'), url('https://cdn.mesaidespubliques.fr/fonts/MuseoSansCyrl-300.woff2') format('woff2');
    font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Museo Sans';
    src: local('Museo Sans'), url('https://cdn.mesaidespubliques.fr/fonts/MuseoSansCyrl-500.woff2') format('woff2');
    font-weight: 400 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Museo Sans';
    src: local('Museo Sans'), url('https://cdn.mesaidespubliques.fr/fonts/MuseoSansCyrl-700.woff2') format('woff2');
    font-weight: 600 700; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Museo Sans';
    src: local('Museo Sans'), url('https://cdn.mesaidespubliques.fr/fonts/MuseoSansCyrl-900.woff2') format('woff2');
    font-weight: 800 900; font-style: normal; font-display: swap;
}
/* Mukta Mahee (corps de texte) se charge via Google Fonts :
   <link href="https://fonts.googleapis.com/css2?family=Mukta+Mahee:wght@400;500;600;700;800&display=swap" rel="stylesheet"> */

* { margin: 0; padding: 0; box-sizing: border-box; }

:root {
    /* Couleurs de marque */
    --blue: #006DEC;
    --blue-dark: #0055BB;
    --blue-pale: #EBF6FF;
    --blue-muted: #D4EAFF;
    --orange: #FF934F;
    --orange-soft: #FFF3EB;
    --orange-ink: #A64E17;   /* encre orange assombrie : >= 4.5:1 sur blanc et sur --orange-soft */
    --yellow: #FCC844;
    --green: #2DAE54;
    --green-soft: #E8F9ED;
    --green-ink: #1E7C3C;

    /* Texte */
    --text-primary: #28323E;
    --text-secondary: #586173;
    --text-muted: #6E7A8E;    /* réservé aux petits labels ; jamais pour du texte courant */

    /* Gris de surface */
    --gray-100: #F7F9FC;
    --gray-200: #EDF1F5;
    --gray-300: #D8DEE6;

    /* Formes */
    --radius: 16px;
    --radius-pill: 32px;

    /* Layout */
    --page-max: 1040px;

    /* Ombres (teintées du bleu de marque) */
    --shadow-sm: 0 2px 8px rgba(0, 109, 236, 0.06);
    --shadow-md: 0 4px 20px rgba(0, 109, 236, 0.1);
    --shadow-lg: 0 8px 32px rgba(0, 109, 236, 0.14);

    /* Échelle z-index */
    --z-content: 1;
    --z-edge-fade: 5;
    --z-control: 10;
    --z-sticky: 20;
}

body {
    font-family: 'Mukta Mahee', sans-serif;
    background: var(--gray-100);
    color: var(--text-primary);
    line-height: 1.6;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
}

.container {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: 18px 20px 60px;
}