/* ======================================================
   SITE FOOTER — Anchor Corps - South Anchorage Dental
   Styles for footer.php (replaces the Divi Theme Builder footer).
   The #expanding-cta-* scroll effect is driven by Anchor Corps
   components.js -> initExpandingCTA().
====================================================== */

.ac-site-footer {
  width: 100%;
  /* Establish a very high stacking context for the whole footer. This mirrors
     the old Divi footer, where the section wrapping the footer code module had
     z-index:9999999999. It makes the fixed #expanding-cta-background (z-index:-1
     WITHIN this context) paint ABOVE all the page content above the footer, so
     the mountain "takes over the whole screen" when the CTA activates, while the
     footer's own content still renders on top of it. */
  position: relative;
  z-index: 9999999999;
}

.ac-footer-cta-section,
.ac-footer-main {
  width: 100%;
}

.ac-footer-main {
  padding: 0 20px 0px;
}

.ac-footer-inner {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  background: #f4f4f2;
  border-radius: 32px 32px 0 0;
  padding: clamp(36px, 5vw, 72px) clamp(24px, 5vw, 64px) 24px;
}

.ac-footer-top {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 32px;
  margin-bottom: clamp(40px, 6vw, 72px);
}

.ac-footer-heading h2 {
  margin: 0;
  font-size: clamp(56px, 7vw, 100px);
  line-height: 0.98;
  font-weight: 500;
  color: #666;
}

.ac-footer-heading h2 span {
  color: #2f5f91;
}

.ac-footer-buttons {
  padding-top: 42px;
}

.ac-footer-columns {
  display: grid;
  grid-template-columns: minmax(320px, 1.4fr) 1fr 1fr;
  gap: clamp(40px, 8vw, 140px);
  align-items: start;
}

.ac-blurb-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.blurb-link-header {
  margin: 0 0 14px;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.2;
  color: #666;
  font-weight: 600;
}

.blurb-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  color: #37a9e8;
  font-size: clamp(18px, 1.6vw, 26px);
  line-height: 1.3;
  text-decoration: none;
}

.blurb-link i {
  width: 22px;
  min-width: 22px;
  text-align: center;
  color: currentColor;
}

.ac-footer-bottom {
  margin-top: clamp(40px, 5vw, 64px);
  padding-top: 24px;
  border-top: 1px solid rgba(0,0,0,.12);
  text-align: center;
}

.ac-footer-bottom p {
  margin: 0;
  color: #111;
  font-size: clamp(15px, 1.4vw, 20px);
  line-height: 1.4;
}

.ac-footer-bottom a {
  color: inherit;
  text-decoration: underline;
}

@media (max-width: 980px) {
  .ac-footer-top {
    grid-template-columns: 1fr;
  }

  .ac-footer-buttons {
    padding-top: 0;
  }

  .ac-footer-columns {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }

  .ac-footer-contact {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .ac-footer-main {
    padding: 0 12px 12px;
  }

  .ac-footer-inner {
    border-radius: 24px 24px 0 0;
    padding: 36px 22px 22px;
  }

  .ac-footer-columns {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .btn-row {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-row .btn {
    width: 100%;
    justify-content: space-between;
  }

  .blurb-link {
    width: 100%;
    align-items: flex-start;
  }
}

/* ======================================================
   EXPANDING CTA (Footer)
====================================================== */

#expanding-cta-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url('/wp-content/uploads/2026/04/Mountain.avif');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0;
  pointer-events: none;
  z-index: -1;
  transition: opacity 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
}

#expanding-cta-background.active {
  opacity: 1;
}

#expanding-cta-container {
  position: relative;
  cursor: default;
  border-radius: 20px;
  padding: 80px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 800px;
  width: 95%;
  max-width: 1440px;
  margin: 40px auto;
  background-color: var(--theme-main-light);
  transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1),
    background-color 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
  z-index: 1;
}

#expanding-cta-container.active {
  transform: scale(1.05);
  background-color: transparent;
}

.expanding-cta-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #ffffff;
}

.expanding-cta-content .logo {
  max-width: 300px;
  margin-bottom: 20px;
}

.expanding-cta-content h2.h2-h1 {
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 1rem;
  line-height: 1.2;
  font-size: clamp(60px, 7vw, 120px) !important;
  letter-spacing: -.05em !important;
}

.expanding-cta-content p {
  font-size: 1.7rem;
  line-height: 1.7em;
}

.expanding-cta-content .btn-row-container {
  margin-top: 2em;
}