/* ========================
   Footer Get a Quote Section
   ======================== */

.footer-cta-section {
  width: 100%;
  min-height: 18.75rem;
  display: flex;
  align-items: center;
}

.footer-cta-title {
  font-family: var(--font-family-sans);
  font-size: var(--font-size-5xl);
  line-height: var(--line-height-heading);
  color: var(--bs-primary-950);
  margin: 0;
  max-width: 67.625rem;
}

.footer-cta-title span {
  display: block;
}

.footer-cta-title .bold {
  font-weight: var(--font-weight-bold);
}

.footer-cta-title .regular {
  font-weight: var(--font-weight-normal);
}

/* Button override for this specific section */
.footer-cta-section .btn-cta {
  background-color: var(--bs-secondary);
  color: var(--bs-black);
  padding: var(--space-2) var(--space-7);
  border-radius: var(--radius-2xl);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  transition: all var(--transition-base);
  border: none;
  cursor: pointer;
}

.footer-cta-section .btn-cta:hover {
  transform: translateY(-0.125rem);
  background-color: var(--bs-secondary-500);
}

.footer-cta-section .btn-cta:active {
  transform: translateY(0);
}

.footer-cta-section .btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ========================
   RESPONSIVE DESIGN
   ======================== */

/* Large Desktop (1200px and up) */

/* Tablet (992px to 1199.98px) */
@media (max-width: 1199.98px) and (min-width: 992px) {
  .footer-cta-title {
    font-size: var(--font-size-4xl);
  }
}

/* Tablet (768px to 991.98px) */
@media (max-width: 991.98px) {
  .footer-cta-section {
    text-align: center;
  }

  .footer-cta-title {
    font-size: var(--font-size-h2);
    max-width: 100%;
    margin-bottom: var(--space-9);
  }

  .footer-cta-section .btn-cta {
    padding: var(--space-4) var(--space-11);
    font-size: var(--font-size-base);
  }
  .footer-cta-section {
    text-align: left;
  }
}

/* Mobile (576px to 767.98px) */
@media (max-width: 767.98px) {
  .footer-cta-title {
    font-size: var(--font-size-3xl);
    margin-bottom: var(--space-7);
  }

  .footer-cta-section .btn-cta {
    width: 100%;
    justify-content: center;
    padding: var(--space-3) var(--space-9);
    font-size: var(--font-size-sm);
  }
  .footer-cta-section .text-lg-end {
    margin-top: 32px;
  }
  .footer-cta-content .title-4xl {
    font-size: 32px;
  }
}

/* Small Mobile (up to 575.98px) */
@media (max-width: 575.98px) {
  .footer-cta-title {
    font-size: var(--font-size-2xl);
    margin-bottom: var(--space-5);
  }

  .footer-cta-section .btn-cta {
    padding: var(--space-2) var(--space-7);
    font-size: var(--font-size-xs);
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .footer-cta-section .btn-cta {
    transition: none;
  }

  .footer-cta-section .btn-cta:hover {
    transform: none;
  }
}

/* ========================
 Mobile (service get a quote)
   px-5 py-12, bg-emerald-100, gap-8, left stack, auto CTA
   ======================== */

.footer-cta-section-mobile {
  width: 100%;
  min-height: 0;
  display: block;
  background-color: var(--bs-primary-100); /* emerald-100 / mint */
  padding-block: var(--space-20); /* py-12 = 3rem */
  padding-inline: 0;
}

.footer-cta-section-mobile.section-light {
  background-color: var(--bs-primary-100);
  padding-block: var(--space-20);
  padding-inline: 0;
}

.footer-cta-section-mobile .footer-cta-mobile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--space-14); /* gap-8 */
  width: 100%;
  text-align: left;
}

.footer-cta-section-mobile .footer-cta-heading,
.footer-cta-section-mobile .footer-cta-heading.title-2xl {
  width: 100%;
  max-width: 20rem; /* w-80 */
  margin: 0;
  text-align: left !important;
  color: var(--bs-primary-800); /* teal-950-ish */
  font-family: var(--font-family-base);
  font-size: var(--font-size-30); /* text-3xl */
  font-weight: var(--font-weight-regular);
  line-height: 2.5rem; /* leading-10 */
}

.footer-cta-section-mobile .footer-cta-heading *,
.footer-cta-section-mobile .footer-cta-heading p {
  margin: 0;
  text-align: left !important;
  color: inherit;
  font: inherit;
  line-height: inherit;
}

.footer-cta-section-mobile .footer-cta-heading strong,
.footer-cta-section-mobile .footer-cta-heading b {
  font-weight: var(--font-weight-bold);
}

.footer-cta-section-mobile .footer-cta-button {
  display: flex;
  justify-content: flex-start;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  margin: 0;
}

.footer-cta-section-mobile .footer-cta-button .btn,
.footer-cta-section-mobile .footer-cta-button .btn.footer-cta-btn,
.footer-cta-section-mobile a.btn.footer-cta-btn {
  display: inline-flex;
  width: fit-content !important;
  max-width: 100%;
  min-height: 2.5rem; /* h-10 */
  height: 2.5rem;
  padding: var(--space-1) var(--space-7); /* py-1 px-4 */
  background-color: var(--bs-secondary-400);
  border: 0;
  color: var(--bs-black);
  border-radius: var(--radius-2xl);
  justify-content: center;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-medium);
  line-height: 1.25rem;
  text-transform: uppercase;
}

.footer-cta-section-mobile .footer-cta-button .btn .chev,
.footer-cta-section-mobile .footer-cta-button .btn .btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--bs-black);
  background: transparent;
  margin-left: 0;
}