@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

:root {
  --color-1 : #FFF;
  --color-2 : #0f0f14;
  --color-3 : #00e0ff;

  --btn-primary-bg : #00e0ff;
  --btn-primary-text : #fff;
  
  --h1-xs: 36px;
  --h1: 72px;
  --h2-xs: 28px;
  --h2: 40px;
  --h3-xs: 20px;
  --h3: 24px;
  --h4-xs: 16px;
  --h4: 16px;
}

/*============================================================================*\
  DÉCLARATION DES POLICES
\*============================================================================*/

@font-face {
    font-family: 'TypoMain';
    /* Remplacez par le vrai fichier de votre police principale si nécessaire */
    src: url('../fonts/19732340198.ttf') format('truetype'); 
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TypoTitle';
    /* Remplacez par le vrai fichier de votre police de titre si nécessaire */
    src: url('../fonts/18628564760.ttf') format('truetype');
    font-weight: 700;
    font-style: bold;
    font-display: swap;
}

/*============================================================================*\
  EXEMPLE D'APPLICATION (À adapter selon vos classes)
\*============================================================================*/

body {
    font-family: 'Playfair Display', sans-serif;
}

h1, h2, h3, h4 .title {
    font-family: 'Playfair Display', sans-serif;
    font-weight: bold;
}