/* ===== Typography ===== */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 600;
  line-height: 1.2;
}

p { margin-top: 0; margin-bottom: 1rem; }

/* ======= Base Font Sizes (Global) ======= */
.fs-1 { font-size: calc(1.625rem + 4.5vw); }  /* ~2.5rem */
.fs-2 { font-size: calc(1.475rem + 2.7vw); }  /* ~2rem */
.fs-3 { font-size: calc(1.325rem + 0.9vw); }  /* ~1.75rem */
.fs-4 { font-size: 1.5rem; }                  /* 24px */
.fs-5 { font-size: 1.25rem; }                 /* 20px */
.fs-6 { font-size: 1rem; }                    /* 16px */

/* Optional fixed scale */
.fs-xs { font-size: 0.75rem; }   /* 12px */
.fs-sm { font-size: 0.875rem; }  /* 14px */
.fs-md { font-size: 1rem; }      /* 16px */
.fs-lg { font-size: 1.25rem; }   /* 20px */
.fs-xl { font-size: 1.5rem; }    /* 24px */
.fs-xxl { font-size: 2rem; }     /* 32px */

/* ======= Font Weight ======= */
.fw-light { font-weight: 300; }
.fw-normal { font-weight: 400; }
.fw-medium { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.fw-bold { font-weight: 700; }

/* ======= Line Height ======= */
.lh-1 { line-height: 1; }
.lh-sm { line-height: 1.25; }
.lh-base { line-height: 1.5; }
.lh-lg { line-height: 2; }

/* ======= Text Transform ======= */
.text-uppercase { text-transform: uppercase; }
.text-lowercase { text-transform: lowercase; }
.text-capitalize { text-transform: capitalize; }

/* =======================================
   RESPONSIVE FONT SIZE (Bootstrap-like)
   Breakpoints: sm / md / lg / xl / xxl
   ======================================= */

/* Small ≥576px */
@media (min-width: 576px) {
  .fs-sm-1 { font-size: 2.5rem; }
  .fs-sm-2 { font-size: 2rem; }
  .fs-sm-3 { font-size: 1.75rem; }
  .fs-sm-4 { font-size: 1.5rem; }
  .fs-sm-5 { font-size: 1.25rem; }
  .fs-sm-6 { font-size: 1rem; }
}

/* Medium ≥768px */
@media (min-width: 768px) {
  .f-sub { font-size: 3rem; }
  .fs-md-1 { font-size: 2.5rem; }
  .fs-md-2 { font-size: 2rem; }
  .fs-md-3 { font-size: 1.75rem; }
  .fs-md-4 { font-size: 1.5rem; }
  .fs-md-5 { font-size: 1.25rem; }
  .fs-md-6 { font-size: 1rem; }
}

/* Large ≥992px */
@media (min-width: 992px) {
  .fs-lg-1 { font-size: 2.5rem; }
  .fs-lg-2 { font-size: 2rem; }
  .fs-lg-3 { font-size: 1.75rem; }
  .fs-lg-4 { font-size: 1.5rem; }
  .fs-lg-5 { font-size: 1.25rem; }
  .fs-lg-6 { font-size: 1rem; }
}

/* Extra Large ≥1200px */
@media (min-width: 1200px) {
  .fs-xl-1 { font-size: 2.5rem; }
  .fs-xl-2 { font-size: 2rem; }
  .fs-xl-3 { font-size: 1.75rem; }
  .fs-xl-4 { font-size: 1.5rem; }
  .fs-xl-5 { font-size: 1.25rem; }
  .fs-xl-6 { font-size: 1rem; }
}

/* Extra Extra Large ≥1400px */
@media (min-width: 1400px) {
  .fs-xxl-1 { font-size: 2.5rem; }
  .fs-xxl-2 { font-size: 2rem; }
  .fs-xxl-3 { font-size: 1.75rem; }
  .fs-xxl-4 { font-size: 1.5rem; }
  .fs-xxl-5 { font-size: 1.25rem; }
  .fs-xxl-6 { font-size: 1rem; }
}