/*
 * Bulle Studio — Typography
 * Bricolage Grotesque (variable) + Albert Sans (variable)
 *
 * Ces deux polices sont des VARIABLE FONTS :
 * → un seul fichier .woff2 couvre toute la gamme de graisses (100–900)
 * → légèreté maximale, flexibilité totale
 *
 * 📁 Placez les fichiers dans :
 *    /wp-content/themes/bulle-studio/assets/fonts/bricolage-grotesque/
 *    /wp-content/themes/bulle-studio/assets/fonts/albert-sans/
 */


/* ============================================================
   BRICOLAGE GROTESQUE — Variable Font
   Axes : wght (200–800), wdth (75–100), opsz (12–96)
   Usage recommandé : titres, headings, display
   ============================================================ */

@font-face {
     font-family: 'Bricolage Grotesque';
    src: url('../fonts/bricolage-grotesque/BricolageGrotesque-Variable.woff2')
         format('woff2');
    font-weight: 200 800;  /* plage complète */
    font-style: normal;
    font-display: swap;
}


/* ============================================================
   ALBERT SANS — Variable Font
   Axes : wght (100–900), ital (0–1)
   Usage recommandé : corps de texte, UI, labels
   ============================================================ */

/* Upright (normal) */
@font-face {
    font-family: 'Albert Sans';
    src: url('../fonts/albert-sans/AlbertSans-VariableFont_wght.woff2')
         format('woff2'),
    font-weight: 100 900;       /* Plage complète du variable font */
    font-style: normal;
    font-display: swap;
}

/* Italic */
@font-face {
    font-family: 'Albert Sans';
    src: url('../fonts/albert-sans/AlbertSans-Italic-Variable.woff2')
         format('woff2 supports variations'),
         url('../fonts/albert-sans/AlbertSans-Italic-Variable.woff2')
         format('woff2');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
                   U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
                   U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                   U+2212, U+2215, U+FEFF, U+FFFD;
}
/* ============================================================
   Behind the nineties — Variable Font
   Axes : wght (100–900), ital (0–1)
   Usage recommandé : corps de texte, UI, labels
   ============================================================ */

@font-face {
    font-family: 'Behind The Nineties Sans';
    src: url('../fonts/behind-nineties/Behind_The_Nineties_Sans_Variable.woff2') format('woff2-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --font-nineties: 'Behind The Nineties Sans', sans-serif;
}


/* ============================================================
   APPLICATION DES FONTS DANS LE THÈME
   ============================================================ */

:root {
    /* Définir les fonts comme variables CSS */
    --font-display: 'Bricolage Grotesque', system-ui, sans-serif;
    --font-body:    'Albert Sans', system-ui, sans-serif;
}

/* Corps de texte → Albert Sans */
body, p {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
}

/* Titres → Bricolage Grotesque */
h1, h2, h3, h4, h5, h6, p.texte-intro {
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1.2;
}

/* Classes utilitaires pour switcher de font */
.font-display { font-family: var(--font-display); }
.font-body    { font-family: var(--font-body); }
.nineties { font-family: var(--font-nineties); }

/* ============================================================
   VARIABLE FONT — EXEMPLES D'UTILISATION AVANCÉE
   ============================================================ */

/*
 * Bricolage Grotesque — Graisses disponibles :
 * ExtraLight  : font-weight: 200
 * Light       : font-weight: 300
 * Regular     : font-weight: 400
 * Medium      : font-weight: 500
 * SemiBold    : font-weight: 600
 * Bold        : font-weight: 700
 * ExtraBold   : font-weight: 800
 *
 * Exemple display hero :
 */
.hero-title {
    font-family: var(--font-display);
    font-weight: 800;
    /* Optical size pour les grands titres (axe opsz) */
    font-optical-sizing: auto;
}

/*
 * Albert Sans — Graisses disponibles :
 * Thin        : font-weight: 100
 * ExtraLight  : font-weight: 200
 * Light       : font-weight: 300
 * Regular     : font-weight: 400
 * Medium      : font-weight: 500
 * SemiBold    : font-weight: 600
 * Bold        : font-weight: 700
 * ExtraBold   : font-weight: 800
 * Black       : font-weight: 900
 *
 * Exemple navigation :
 */
.nav-link {
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: 0.01em;
}

/*
 * Exemple label / caption :
 */
.label, .caption, .meta {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 0.875rem;
    letter-spacing: 0.02em;
}

/*
 * Exemple bouton :
 */
.btn {
    font-family: var(--font-body);
    font-weight: 600;
    letter-spacing: 0.02em;
}