/* ==========================================================================
   PatientSavvy — pillar-footer.css
   Shared footer for all three pillar pages (Cancer Stories, Cancer
   Treatment, Discuss). Appended after each page's own content via
   patientsavvy-hub-nav.php so all three get identical site chrome —
   mirrors the styling previously duplicated only on the Stories page
   (see wordpress_plugin/patientsavvy/assets/css/patientsavvy-page.css).
   ========================================================================== */

.pshubnav-footer {
  background: #1B3A2D;
  padding: 3rem 20px 0;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  /* Astra's block-editor content-width rule (.entry-content[data-ast-
     blocks-layout] > *) targets this footer too on pages where that data
     attribute is present, since it's appended directly into the_content —
     it insets the footer ~25px from each true edge with a ~1200px max-width,
     letting the page background show through as a strip on both sides
     instead of the green filling the full viewport width (only visible on
     pages carrying that attribute, e.g. Discuss, not on every pillar page —
     see the identical fix on .pshubnav in pillar-nav.css). */
  max-width: none !important;
  margin: 0 !important;
}

.pshubnav-footer__inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
  width: 100%;
  padding-bottom: 2.5rem;
}

.pshubnav-footer__brand {
  flex: 1 1 340px;
  min-width: 260px;
  max-width: 420px;
}

.pshubnav-footer__logo {
  font-size: 1.3rem;
  font-weight: 600;
  color: #fff;
}
.pshubnav-footer__logo span { color: #6FCF9A; }

.pshubnav-footer__disclaimer {
  font-size: .8rem;
  color: rgba(255,255,255,.5);
  margin: .85rem 0 0;
  max-width: 400px;
  line-height: 1.6;
}

.pshubnav-footer__links {
  display: flex;
  flex-direction: column;
  gap: .65rem;
}

.pshubnav-footer__link {
  font-size: .85rem;
  color: rgba(255,255,255,.75);
  text-decoration: none;
  transition: color .15s;
  width: fit-content;
}
.pshubnav-footer__link:hover {
  color: #6FCF9A;
  text-decoration: underline;
}

.pshubnav-footer__social {
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.pshubnav-footer__heading {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  margin: 0 0 .4rem;
}
.pshubnav-footer__social-links {
  display: flex;
  gap: .75rem;
}
.pshubnav-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: #fff;
  transition: background .2s, color .2s, transform .15s;
}
.pshubnav-footer__social-link:hover {
  background: #3A7A57;
  color: #fff;
  transform: translateY(-2px);
}
.pshubnav-footer__social-link svg { width: 17px; height: 17px; }

.pshubnav-footer__bottom {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 1.25rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .75rem;
}
.pshubnav-footer__copyright {
  font-size: .78rem;
  color: rgba(255,255,255,.35);
  margin: 0;
}

@media (max-width: 782px) {
  .pshubnav-footer {
    padding: 1.75rem 1.25rem 0;
  }
  .pshubnav-footer__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    row-gap: 1.1rem;
    column-gap: 1rem;
    padding-bottom: 1.1rem;
  }
  .pshubnav-footer__brand {
    grid-column: 1 / -1;
    max-width: none;
  }
  .pshubnav-footer__disclaimer {
    max-width: none;
  }
  .pshubnav-footer__links {
    gap: .5rem;
  }
  .pshubnav-footer__social {
    align-items: flex-end;
  }
  .pshubnav-footer__bottom {
    padding: .85rem 0 1.1rem;
  }
}