/* ========================================== */
/* INNOVX - TYPOGRAPHIE STANDARDISÉE */
/* Basée sur les styles InnovXcoin */
/* ========================================== */

/* ⚠️ EXCLUSIONS - Ne pas appliquer à ces pages/éléments */
#bientotModal,
#bientotModal *,
.popup-bientot,
.popup-bientot *,
.modal-bientot,
.modal-bientot * {
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  margin-bottom: inherit !important;
}

/* Import des polices modernes */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;900&family=Poppins:wght@300;400;500;600;700;800&family=Roboto:wght@300;400;500;600;700&display=swap');

/* Variables de tailles */
:root {
  /* Tailles de titres (basées sur InnovXcoin) */
  --font-h1-mobile: 2.25rem;      /* 36px - text-4xl */
  --font-h1-desktop: 3.75rem;     /* 60px - text-6xl */
  --font-h2: 1.875rem;            /* 30px - text-3xl */
  --font-h3-large: 1.5rem;        /* 24px - text-2xl */
  --font-h3: 1.25rem;             /* 20px - text-xl */
  --font-h4: 1.125rem;            /* 18px - text-lg */
  
  /* Tailles de texte */
  --font-text-xl: 1.25rem;        /* 20px - text-xl */
  --font-text-lg: 1.125rem;       /* 18px - text-lg */
  --font-text-base: 1rem;         /* 16px - text-base */
  --font-text-sm: 0.875rem;       /* 14px - text-sm */
  --font-text-xs: 0.75rem;        /* 12px - text-xs */
  
  /* Polices */
  --font-heading: 'Montserrat', 'Poppins', sans-serif;
  --font-body: 'Roboto', 'Poppins', sans-serif;
}

/* ========================================== */
/* TITRES PRINCIPAUX (H1) - Style InnovXcoin */
/* ========================================== */
h1,
.hero-title,
.page-title,
.main-title,
.text-4xl,
.text-5xl,
.text-6xl {
  font-family: var(--font-heading) !important;
  font-size: var(--font-h1-mobile) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-bottom: 1.5rem !important;
}

@media (min-width: 1024px) {
  h1,
  .hero-title,
  .page-title,
  .main-title,
  .text-6xl {
    font-size: var(--font-h1-desktop) !important;
  }
}

/* ========================================== */
/* SOUS-TITRES (H2) - Style InnovXcoin */
/* ========================================== */
h2,
.section-title,
.text-3xl {
  font-family: var(--font-heading) !important;
  font-size: var(--font-h2) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin-bottom: 1rem !important;
}

/* ========================================== */
/* SOUS-TITRES (H3) - Style InnovXcoin */
/* ========================================== */
h3,
.subsection-title,
.card-title,
.text-2xl {
  font-family: var(--font-heading) !important;
  font-size: var(--font-h3-large) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  margin-bottom: 0.75rem !important;
}

.text-xl,
h4 {
  font-family: var(--font-heading) !important;
  font-size: var(--font-h3) !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

/* ========================================== */
/* TEXTES DESCRIPTIFS - Style InnovXcoin */
/* ========================================== */
p,
.description,
.text-lg {
  font-family: var(--font-body) !important;
  font-size: var(--font-text-lg) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  margin-bottom: 1rem !important;
}

.text-xl.description,
.hero-description,
.section-description {
  font-size: var(--font-text-xl) !important;
  line-height: 1.8 !important;
}

/* ========================================== */
/* TEXTES DE BASE */
/* ========================================== */
.text-base,
body {
  font-family: var(--font-body) !important;
  font-size: var(--font-text-base) !important;
  line-height: 1.6 !important;
}

/* ========================================== */
/* PETITS TEXTES */
/* ========================================== */
.text-sm,
small,
.caption {
  font-size: var(--font-text-sm) !important;
  line-height: 1.5 !important;
}

.text-xs {
  font-size: var(--font-text-xs) !important;
  line-height: 1.4 !important;
}

/* ========================================== */
/* ICÔNES - Tailles standardisées */
/* ========================================== */
.fa,
.fas,
.fa-solid,
.fa-regular,
.fa-light,
.fa-thin,
.fa-duotone {
  font-family: "Font Awesome 6 Free" !important;
  font-style: normal !important;
}

.fa-brands,
.fab {
  font-family: "Font Awesome 6 Brands" !important;
  font-style: normal !important;
}

.fa-solid,
.fas {
  font-weight: 900 !important;
}

.fa-regular {
  font-weight: 400 !important;
}

.icon-2xl,
i.text-2xl {
  font-size: 1.5rem !important;
}

.icon-xl,
i.text-xl {
  font-size: 1.25rem !important;
}

.icon-lg,
i.text-lg {
  font-size: 1.125rem !important;
}

/* ========================================== */
/* BOUTONS - Tailles cohérentes */
/* ========================================== */
button,
.btn,
a.button {
  font-family: var(--font-heading) !important;
  font-size: var(--font-text-base) !important;
  font-weight: 600 !important;
  padding: 0.875rem 2rem !important;
  line-height: 1.5 !important;
}

.btn-lg {
  font-size: var(--font-text-lg) !important;
  padding: 1rem 2.5rem !important;
}

.btn-sm {
  font-size: var(--font-text-sm) !important;
  padding: 0.625rem 1.5rem !important;
}

/* ========================================== */
/* RESPONSIVE - TABLETTE */
/* ========================================== */
@media (min-width: 769px) and (max-width: 1024px) {
  h1,
  .hero-title,
  .text-6xl {
    font-size: 3rem !important;
  }
  
  h2,
  .section-title,
  .text-3xl {
    font-size: 1.75rem !important;
  }
  
  h3,
  .text-2xl {
    font-size: 1.375rem !important;
  }
  
  p,
  .text-lg {
    font-size: 1.0625rem !important;
  }
  
  .text-xl {
    font-size: 1.1875rem !important;
  }
}

/* ========================================== */
/* RESPONSIVE - MOBILE */
/* ========================================== */
@media (max-width: 768px) {
  h1,
  .hero-title,
  .text-6xl {
    font-size: 2rem !important;
  }
  
  h2,
  .section-title,
  .text-3xl {
    font-size: 1.5rem !important;
  }
  
  h3,
  .text-2xl {
    font-size: 1.25rem !important;
  }
  
  .text-xl {
    font-size: 1.125rem !important;
  }
  
  p,
  .text-lg {
    font-size: 1rem !important;
  }
  
  .text-base {
    font-size: 0.9375rem !important;
  }
  
  button,
  .btn {
    font-size: 0.9375rem !important;
    padding: 0.75rem 1.75rem !important;
  }
}

/* ========================================== */
/* RESPONSIVE - TRÈS PETIT MOBILE */
/* ========================================== */
@media (max-width: 480px) {
  h1,
  .hero-title {
    font-size: 1.75rem !important;
  }
  
  h2,
  .section-title {
    font-size: 1.375rem !important;
  }
  
  h3,
  .text-2xl {
    font-size: 1.125rem !important;
  }
  
  p,
  .text-lg {
    font-size: 0.9375rem !important;
  }
}

/* ========================================== */
/* POIDS DE POLICE STANDARDS */
/* ========================================== */
.font-light {
  font-weight: 300 !important;
}

.font-normal {
  font-weight: 400 !important;
}

.font-medium {
  font-weight: 500 !important;
}

.font-semibold {
  font-weight: 600 !important;
}

.font-bold {
  font-weight: 700 !important;
}

.font-extrabold {
  font-weight: 800 !important;
}

.font-black {
  font-weight: 900 !important;
}

/* ========================================== */
/* HAUTEURS DE LIGNE STANDARDS */
/* ========================================== */
.leading-tight {
  line-height: 1.25 !important;
}

.leading-snug {
  line-height: 1.375 !important;
}

.leading-normal {
  line-height: 1.5 !important;
}

.leading-relaxed {
  line-height: 1.625 !important;
}

.leading-loose {
  line-height: 2 !important;
}