/* ==========================================================================
   ProCareLink — Design tokens & base
   Source de vérité : README handoff + charte « Direction B »
   ========================================================================== */

:root{
  /* Couleurs */
  --rose:#D6266B;
  --rose-700:#B01A52;
  --rose-900:#9C1545;
  --rose-50:#FBEFF4;
  --teal:#1F9E92;
  --teal-700:#137068;
  --teal-50:#E6F4F1;
  --orange:#E0913E;
  --orange-700:#B0701C;
  --orange-50:#FDF1E3;
  --coral:#E07A52;
  --coral-300:#F0A98E;
  --cream:#FDF6E9;
  --ink:#221A28;
  --dark:#1E1622;
  --text:#6E6878;
  --text-strong:#3A3442;
  --text-mid:#4A4453;
  --text-on-dark:#C4BCCC;
  --muted:#9A93A4;
  --bg:#F6F5F8;
  --border:#ECEAF0;
  --border-input:#E2DEE8;

  /* Typographie */
  --font-display:'Bricolage Grotesque',sans-serif;
  --font-body:'Hanken Grotesk',sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{margin:0;padding:0;scroll-behavior:smooth}
body{margin:0;padding:0;background:var(--dark);font-family:var(--font-body);color:var(--ink);overflow-x:clip}
::selection{background:var(--teal);color:#fff}
a{text-decoration:none;color:inherit}
button,input{font-family:inherit}
input:focus{outline:none}
img{border:0}
section[id]{scroll-margin-top:72px}

.container{max-width:1200px;margin:0 auto}

/* Eyebrow (sur-titre en majuscules) */
.eyebrow{font-weight:700;letter-spacing:0.16em;text-transform:uppercase;font-size:12px;color:var(--muted);margin-bottom:14px}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:600;font-size:15px;padding:15px 28px;border-radius:14px}
.btn-primary{background:var(--rose);color:#fff}
.btn-outline{background:#fff;border:1px solid var(--border);color:var(--ink)}