@font-face {
  font-family: Poppins;
  src: url("../polices/Poppins-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Poppins;
  src: url("../polices/Poppins-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Poppins;
  src: url("../polices/Poppins-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Ms Madi";
  src: url("../polices/MsMadi-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}

:root {
  --fond-haut:   #EAE2F7;
  --fond-milieu: #E4E8F5;
  --fond-bas:    #DBE7F4;
  --fond:        linear-gradient(165deg, var(--fond-haut) 0%, var(--fond-milieu) 45%, var(--fond-bas) 100%);

  --verre:        rgba(255, 255, 255, 0.52);
  --verre-fort:   rgba(255, 255, 255, 0.72);
  --verre-leger:  rgba(255, 255, 255, 0.34);
  --verre-bord:   rgba(255, 255, 255, 0.78);
  --verre-flou:   blur(18px) saturate(170%);
  --verre-reflet: inset 0 1px 0 rgba(255, 255, 255, 0.92),
                  inset 0 0 0 1px rgba(255, 255, 255, 0.45),
                  inset 0 -12px 28px rgba(255, 255, 255, 0.22);

  --verre-corail: rgba(239, 139, 107, 0.28);
  --verre-violet: rgba(167, 139, 224, 0.28);
  --verre-bleu:   rgba(127, 178, 232, 0.30);
  --verre-vert:   rgba(122, 205, 160, 0.32);

  --carte:        #FFFFFF;
  --carte-voilee: rgba(255, 255, 255, 0.62);
  --piste:        rgba(51, 53, 74, 0.10);

  --halo-violet:  rgba(167, 139, 224, 0.55);
  --halo-corail:  rgba(239, 139, 107, 0.48);
  --halo-bleu:    rgba(127, 178, 232, 0.58);

  --encre:        #33354A;
  --encre-douce:  #6E7185;
  --encre-legere: #9A9DB0;

  --violet:        #A78BE0;
  --violet-pale:   #E8E0F8;
  --violet-texte:  #6A4DB8;

  --corail:        #EF8B6B;
  --corail-pale:   #FBE3DA;
  --corail-texte:  #B54A27;

  --bleu:          #7FB2E8;
  --bleu-pale:     #DCEAF9;
  --bleu-texte:    #2F6FB3;

  --vert:          #7ACDA0;
  --vert-pale:     #DDF3E7;
  --vert-texte:    #237A4E;

  --marine:        #2B2856;
  --marine-clair:  #47428A;
  --marine-fonce:  #1E1C40;

  --positif:        var(--bleu-texte);
  --positif-pale:   var(--bleu-pale);
  --negatif:        var(--corail-texte);
  --negatif-pale:   var(--corail-pale);

  --police: Poppins, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --police-signe: "Ms Madi", cursive;

  --texte-legende:    0.75rem;
  --texte-secondaire: 0.875rem;
  --texte-corps:      0.9375rem;
  --texte-accent:     1.125rem;
  --texte-carte:      1.5rem;
  --texte-titre:      2.25rem;
  --texte-chiffre:    2.5rem;

  --interligne-titre: 1.1;
  --interligne-corps: 1.5;

  --e-1: 0.25rem;
  --e-2: 0.5rem;
  --e-3: 0.75rem;
  --e-4: 1rem;
  --e-5: 1.5rem;
  --e-6: 2rem;
  --e-7: 3rem;

  --rayon-carte: 1.75rem;
  --rayon-champ: 1rem;
  --rayon-rond:  999px;

  --ombre-carte:  0 12px 34px rgba(60, 60, 110, 0.10);
  --ombre-rond:   0 8px 20px rgba(60, 60, 110, 0.14);
  --ombre-marine: 0 14px 30px rgba(43, 40, 86, 0.40);
  --halo-marine:  0 0 0 0.625rem rgba(255, 255, 255, 0.38);

  --duree-court:  140ms;
  --duree-moyen:  220ms;
  --duree-long:   320ms;
  --duree-entree: 240ms;
  --duree-remplir: 620ms;
  --sortie:       cubic-bezier(0.23, 1, 0.32, 1);

  --z-nav:  20;
  --z-menu: 30;

  --nav-hauteur: 4.75rem;
}