/* ==========================================================================
   L’INCUBATEUR MDB — Marchand de biens
   Tokens de direction artistique. Source unique de vérité.
   Copier ce fichier + le dossier fonts/ dans le projet, puis l'importer en
   premier, avant tout autre CSS.
   ========================================================================== */

/* --- Polices ------------------------------------------------------------- */












:root{
  /* --- Marque ------------------------------------------------------------ */
  --kaki:#8C8751;          /* accent principal, positif, progression */
  --bordeaux:#560F19;      /* négatif, liens, surface premium, courbes */
  --black:#000000;         /* encre du logo uniquement */
  --white:#FFFFFF;         /* surfaces, cartes */

  /* --- Encre et gris chauds ---------------------------------------------- */
  --ink:#0E0E0E;           /* texte principal, boutons pleins */
  --kaki-ink:#6F6A3B;      /* kaki lisible sur fond clair, jamais --kaki en texte */
  --g1:#5B584E;            /* texte de tag neutre */
  --g2:#7C7A73;            /* texte secondaire, phrases Creato */
  --g3:#9A978F;            /* méta, légendes */
  --g4:#B4B1A8;            /* surtitres, axes, états à venir */

  /* --- Surfaces ---------------------------------------------------------- */
  --paper:#F6F6F4;         /* fond de page, jamais blanc */
  --surface:#FFFFFF;       /* cartes */
  --soft:#FAFAF8;          /* survol de ligne, carte tertiaire */
  --chip:#F2F1EE;          /* puce neutre, survol de nav */
  --line:#F1F0EC;          /* filets, pistes de progression */

  /* --- Teintes ----------------------------------------------------------- */
  --kaki-07:rgba(140,135,81,.07);
  --kaki-14:rgba(140,135,81,.14);
  --kaki-16:rgba(140,135,81,.16);
  --kaki-18:rgba(140,135,81,.18);
  --kaki-45:rgba(140,135,81,.45);
  --bx-07:rgba(86,15,25,.07);
  --bx-09:rgba(86,15,25,.09);
  --bx-10:rgba(86,15,25,.10);
  --bx-12:rgba(86,15,25,.12);

  /* --- Élévation --------------------------------------------------------- */
  --sh-1:0 1px 2px rgba(14,14,14,.05);                                        /* repos */
  --sh-2:0 1px 2px rgba(14,14,14,.05),0 8px 24px -16px rgba(14,14,14,.16);    /* flottant, nav */
  --sh-3:0 1px 2px rgba(14,14,14,.05),0 20px 40px -24px rgba(14,14,14,.3);    /* survol de carte */

  /* --- Rayons ------------------------------------------------------------ */
  --r-xs:6px;    /* jalons, pistes */
  --r-sm:12px;   /* pastille initiales */
  --r-md:16px;   /* petite carte, ligne cliquable */
  --r-lg:20px;   /* carte de lead */
  --r-xl:22px;   /* carte KPI */
  --r-2xl:26px;  /* carte de section */
  --r-3xl:28px;  /* barre de navigation */
  --r-pill:999px;

  /* --- Typographie ------------------------------------------------------- */
  --font:'Effra',system-ui,sans-serif;
  --font-voice:'Creato',serif;   /* italique uniquement */

  /* --- Rythme ------------------------------------------------------------ */
  --gap:26px;           /* gouttière de grille */
  --pad-card:32px;      /* padding de carte de section */
  --pad-kpi:28px;
  --section-gap:96px;   /* respiration entre blocs majeurs */
  --max-w:1320px;
}

/* --- Base ---------------------------------------------------------------- */
*{box-sizing:border-box}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--font);-webkit-font-smoothing:antialiased;
}
a{color:var(--bordeaux);text-decoration:none}
a:hover{color:var(--kaki)}
::selection{background:var(--kaki);color:#fff}

/* --- Échelle typographique ----------------------------------------------
   Le tracking se resserre quand le corps grossit, jamais l'inverse.
   ------------------------------------------------------------------------ */
.t-display{font-size:76px;font-weight:800;line-height:1.02;letter-spacing:-.045em}
.t-kpi    {font-size:38px;font-weight:800;line-height:1;letter-spacing:-.04em}
.t-h2     {font-size:22px;font-weight:800;letter-spacing:-.03em}
.t-h3     {font-size:19px;font-weight:800;letter-spacing:-.03em}
.t-item   {font-size:18px;font-weight:800;letter-spacing:-.025em}
.t-row    {font-size:18px;font-weight:700;letter-spacing:-.02em}
.t-body   {font-size:18px;font-weight:700;letter-spacing:-.015em}
.t-meta   {font-size:15px;font-weight:500;color:var(--g3)}
.t-micro  {font-size:15px;font-weight:700}
.t-over   {font-size:15px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--g4)}
.t-voice  {font-family:var(--font-voice);font-style:italic;font-size:18px;font-weight:400;line-height:1.55;color:var(--g2)}

/* --- Composants ---------------------------------------------------------- */
.card{background:var(--surface);border-radius:var(--r-2xl);box-shadow:var(--sh-1);padding:var(--pad-card)}
.card-hover{transition:transform .2s,box-shadow .2s}
.card-hover:hover{transform:translateY(-3px);box-shadow:var(--sh-3)}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-pill);
  font-size:18px;font-weight:700;padding:14px 26px;cursor:pointer;transition:transform .18s,background .18s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:var(--bordeaux)}
.btn-secondary{background:var(--surface);box-shadow:var(--sh-1)}
.btn-ghost{border:1px solid var(--line);color:var(--ink)}
.btn-on-dark{background:#fff;color:var(--bordeaux)}
.btn-outline-dark{border:1px solid rgba(255,255,255,.32);color:#fff;font-weight:600}

.tag{display:inline-block;padding:5px 12px;border-radius:var(--r-pill);
  font-size:15px;font-weight:700;white-space:nowrap}
.tag-pos{background:var(--kaki-16);color:var(--kaki-ink)}
.tag-neutral{background:var(--chip);color:var(--g1)}
.tag-neg{background:var(--bx-10);color:var(--bordeaux)}

.surface-premium{padding:var(--pad-card);border-radius:var(--r-2xl);background:var(--bordeaux);color:#fff}
.surface-premium .t-voice{color:rgba(255,255,255,.8)}
.surface-premium .t-over{color:rgba(255,255,255,.65);text-transform:none;letter-spacing:0;font-size:15px;font-weight:600}

.track{width:100%;height:6px;border-radius:var(--r-xs);background:var(--line)}
.track>i{display:block;height:6px;border-radius:var(--r-xs);background:var(--ink)}

.row-hover{transition:background .16s}
.row-hover:hover{background:var(--soft)}
.divider{border-top:1px solid var(--line)}
