:root {
  /* Define Color Variables */
  --color-text-dark: #323232; /* Dark text for readability */
  --color-text-light: #ffffff; /* Light text for contrast */
  --color-primary-bg: #0069c8; /* A vibrant primary blue/indigo */
  --color-primary-accent: #82b8dc; /* Lighter primary for hover */
  --color-secondary-bg: #e5e7eb; /* Light gray for secondary banner */
  --color-secondary-border: #d1d5db;
  --color-cta-symbol: #007bff; /* Blue for the circle symbol */

  /* Define Spacing Variables */
  --spacing-m: 1rem;
  --spacing-l: 1.5rem;
  --spacing-xl: 2rem;

  /* Define button border-radius Variables */
  --border-radius-btn: 8px;
}

.btn-p {
  border-radius: var(--border-radius-btn);
}

.margin-y {
  margin: 40px auto !important;
}

.section-mb {
  margin-bottom: 120px !important;
}
.margin-top {
  margin-top: 10px !important;
}
.margin-bottom {
  margin-bottom: 250px !important;
  padding: 0 80px !important;
}
.margin-left {
  margin-left: 90px !important;
}

.number-2 {
  margin-top: 100px !important;
}
.number-3 {
  margin-top: 150px !important;
}
.number-4 {
  margin-top: 200px !important;
}
.big-number {
    font-size: 111px!important;
}

.font-size {
    font-size: 24px!important;
    font-weight: 300;
    color: #4B5563!important;
}

@media (max-width: 320px) {
  .margin-bottom {
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
  .number-2 {
    margin-top: 0px !important;
  }
  .number-3 {
    margin-top: 0px !important;
  }
  .number-4 {
    margin-top: 0px !important;
  }
}
@media (max-width: 375px) {
  .margin-bottom {
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
  .number-2 {
    margin-top: 0px !important;
  }
  .number-3 {
    margin-top: 0px !important;
  }
  .number-4 {
    margin-top: 0px !important;
  }
}
@media (max-width: 425px) {
  .margin-bottom {
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
}
@media (max-width: 768px) {
  .margin-bottom {
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
  .number-2 {
    margin-top: 0px !important;
  }
  .number-3 {
    margin-top: 0px !important;
  }
  .number-4 {
    margin-top: 0px !important;
  }
}