/* ================================================
   DESIGN TOKENS — Formations 90
   Extrait du thème Divi actuel (avril 2026)
   ================================================ */

/* --- Polices self-hosted --- */
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/poppins-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/poppins-medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/poppins-semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/poppins-bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* --- Variables CSS --- */
:root {
  /* Couleurs */
  --color-primary: #7700d3;
  --color-secondary: #2ea3f2;
  --color-text: #666666;
  --color-text-dark: #333333;
  --color-text-light: #999999;
  --color-text-nav: rgba(0, 0, 0, 0.6);
  --color-bg: #ffffff;
  --color-bg-alt: #f5f7fa;
  --color-cta: #7700d3;
  --color-cta-hover: rgba(0, 0, 0, 0.05);
  --color-cta-text: #7700d3;
  --color-cta-text-hover: #ffffff;
  --color-border: #eeeeee;
  --color-input-border: #bbbbbb;
  --color-input-text: #4e4e4e;
  --color-submenu-border: #2ea3f2;
  --color-success: #27ae60;
  --color-error: #e74c3c;

  /* Typographie */
  --font-main: 'Poppins', Helvetica, Arial, sans-serif;
  --font-size-h1: clamp(1.75rem, 4vw, 30px);       /* 30px desktop — Divi default */
  --font-size-h2: clamp(1.375rem, 3vw, 30px);      /* 30px desktop — Divi H2 */
  --font-size-h3: clamp(1.1rem, 2.5vw, 22px);      /* 22px desktop */
  --font-size-body: 16px;                            /* 16px — Divi body */
  --font-size-small: 0.8125rem;                      /* 13px */
  --font-size-nav: 0.875rem;                         /* 14px */
  --font-size-btn: 1.125rem;                         /* 18px — légèrement < 20px Divi */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --line-height-body: 1.7;
  --line-height-heading: 1.3;

  /* Layout */
  --container-max: 1080px;
  --container-width: 70%;
  --section-padding: clamp(40px, 5vw, 80px);
  --gap-default: 30px;
  --gap-small: 16px;
  --gap-large: 60px;

  /* Boutons */
  --btn-radius: 3px;
  --btn-padding: 0.5em 1.2em;
  --btn-border-width: 2px;

  /* Composants */
  --card-radius: 8px;
  --accordion-radius: 16px;
  --accordion-shadow: 0px 32px 52px 0px rgba(26, 48, 102, 0.1);
  --nav-padding-item: 22px;

  /* Transitions */
  --transition-fast: 0.2s ease-in-out;
  --transition-medium: 0.3s ease;
}