/* =============================================================
   Tilisi – typography.css
   Mobile first → tablet → desktop
============================================================= */

/* -------------------------------------------------------
   Font faces
------------------------------------------------------- */
@font-face {
  font-family: penumbraflarebold;
  src: url("../../fonts/penumbra-flare-std/PenumbraFlareStd-Bold.otf") format("opentype");
  font-display: swap;
}
@font-face {
  font-family: penumbraflarelight;
  src: url("../../fonts/penumbra-flare-std/PenumbraFlareStd-Light.otf") format("opentype");
  font-display: swap;
}
@font-face {
  font-family: penumbraflareregular;
  src: url("../../fonts/penumbra-flare-std/PenumbraFlareStd-Regular.otf") format("opentype");
  font-display: swap;
}
@font-face {
  font-family: MontserratRegular;
  src: url("../../fonts/Montserrat-Font/Montserrat-Regular.otf") format("opentype");
  font-display: swap;
}

/* -------------------------------------------------------
   Base
------------------------------------------------------- */
body {
  font-family: "MontserratRegular", sans-serif;
}

/* -------------------------------------------------------
   Mobile (< 768px)
------------------------------------------------------- */
h1 {
  font-size: 2rem;
  line-height: 1.25;
  font-weight: 700;
  font-family: "penumbraflareregular", serif;
  margin-bottom: 1rem;
}
h2 {
  font-size: 1.75rem;
  line-height: 1.3;
  font-weight: 700;
  font-family: "penumbraflareregular", serif;
  margin-bottom: 0.9rem;
}
h3 {
  font-size: 1.8rem;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 0.8rem;
}
h4 {
  font-size: 1.25rem;
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.75rem;
}
h5 {
  font-size: 1.1rem;
  line-height: 1.45;
  font-weight: 600;
  margin-bottom: 0.7rem;
}
h6 {
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 600;
  margin-bottom: 0.65rem;
}
p {
  font-size: 1.25rem;
  line-height: 1.75;
  margin-bottom: 1rem;
}

/* -------------------------------------------------------
   Tablet (≥ 768px)
------------------------------------------------------- */
@media (min-width: 768px) {
  h1 {
    font-size: 2.75rem;
  }
  h2 {
    font-size: 2.25rem;
  }
  h3 {
    font-size: 1.875rem;
  }
  h4 {
    font-size: 1.5rem;
  }
  h5 {
    font-size: 1.25rem;
  }
  h6 {
    font-size: 1.1rem;
  }
  p {
    font-size: 1.25rem;
  }
}

/* -------------------------------------------------------
   Desktop (≥ 992px)
------------------------------------------------------- */
@media (min-width: 992px) {
  h1 {
    font-size: 3rem;
    line-height: 1.2;
  }
  h2 {
    font-size: 2.75rem;
  }
  h3 {
    font-size: 2rem;
    line-height: 1.1;
  }
  h4 {
    font-size: 1.5rem;
  }
  h5 {
    font-size: 1.25rem;
  }
  h6 {
    font-size: 1.1rem;
  }
  p {
    font-size: 1.25rem;
    line-height: 1.5;
  }
  .md-message p {
    font-size: 1rem;
    line-height: 1.4;
  }
  .md-sign {
    font-size: 1.1rem;
    line-height: 1.2;
  }
}