/* ===========================================
   TYPOGRAPHIE FLUIDE – ÉCHELLE MODULAIRE
   Basée sur clamp() pour adaptabilité optimale
   =========================================== */

   :root {
    /* Texte de base : ~15px à 16px */
    --fs-base: clamp(0.9375rem, 1vw, 1rem);
  
    /* Échelle modulaire réduite (ratio ≈ 1.2) */
    --fs-big: clamp(2.5rem, 5vw, 4rem);   /* 28px -> 40px */
    --fs-h1: clamp(2.5rem, 5vw, 4rem);   /* 28px -> 40px */
    --fs-h2: clamp(1.5rem, 3.5vw, 2rem);    /* 24px -> 32px */
    --fs-h3: clamp(1.375rem, 3vw, 1.75rem); /* 22px -> 28px */
    --fs-h4: clamp(1.25rem, 2.5vw, 1.5rem); /* 20px -> 24px */
    --fs-h5: clamp(1.125rem, 2vw, 1.375rem);/* 18px -> 22px */
    --fs-h6: clamp(1rem, 1.5vw, 1.125rem);  /* 16px -> 18px */
  
    --lh-base: 1.6;
  }

  .hero-title{
font-size: var(--fs-big);
font-weight: 400;
letter-spacing: 1px  }

.hero_slider p{
  font-size: var(--fs-h6);
}
  
  body {
    font-size: var(--fs-base);
    line-height: var(--lh-base);
  }
  
  p {
    margin-bottom: 1rem;
  }
  
  .btn_odb {
    font-size: var(--fs-base);
  }
  
  /* Titres */
  h1 {
    font-size: var(--fs-h1);
    line-height: 1.2;
    font-weight: 500;
    margin-bottom: 1rem;
  }
  
  h2 {
    font-size: var(--fs-h2);
    line-height: 1.25;
    font-weight: 500;
    margin-bottom: 0.9rem;
  }
  
  h3 {
    font-size: var(--fs-h3);
    line-height: 1.3;
    font-weight: 500;
    margin-bottom: 0.8rem;
  }
  
  h4 {
    font-size: var(--fs-h4);
    line-height: 1.35;
    font-weight: 500;
    margin-bottom: 0.7rem;
  }
  
  h5 {
    font-size: var(--fs-h5);
    line-height: 1.4;
    font-weight: 500;
    margin-bottom: 0.6rem;
  }
  
  h6 {
    font-size: var(--fs-h6);
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }
  

  .fb{
background-color: #54aaff;
color: rgb(255, 255, 255);
  }
  .fb svg,.li svg,.in svg,.te svg{
    stroke: rgb(255, 255, 255) !important;
  }

  .in{
    background-color: #ff8ffd;
    color: rgb(255, 255, 255);
  }

  .li{
    background-color: #3391ff;
    color: #FFF;
  }

  .te{
    background-color: #43cf78;
    color: rgb(255, 255, 255);
  }