/*
Theme Name: Astra Child
Theme URI: https://gapcompany.org/
Description: Child theme for Astra (custom templates + CSS).
Author: Jason Jones
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

/* =========================================================
   Stars of Light GAP — Base Styles (DROP-IN REPLACEMENT)
   ========================================================= */

/* Color Palette + Globals */
:root{
  --c0:#1E8F8B;
  --c1:#0F5F5C;
  --c2:#0E4F4D;
  --c3:#2F3A3A;
  --c4:#FAFAF7;
  --c5:#F1F4F2;
  --c6:#E3F1EF;
  --c7:#EDF6F5;
  --c8:#D8B84A;

  /* Keep the token (used throughout), clamp in layout helpers */
  --container:1200px;
  --radius:14px;
  --shadow:0 10px 26px rgba(0,0,0,.08);

  --focus: rgba(30,143,139,.45);
}

/* Reset / Layout safety */
*, *::before, *::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

html, body{ height:100%; }

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--c3);
  background:var(--c4);
  line-height:1.6;
  text-rendering:optimizeLegibility;
}

/* Media defaults */
img, svg, video, canvas{
  max-width:100%;
  height:auto;
  display:block;
}

main{ display:block; }

/* Links */
a{
  color:var(--c0);
  text-decoration-thickness:2px;
  text-underline-offset:0.18em;
}
a:hover{ color:var(--c1); }

/* Focus (keyboard) */
:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:3px;
}

/* Typography */
h1,h2,h3{
  margin:0;
  color:var(--c2);
  line-height:1.15;
}

/* Shared container helper */
.section-inner{
  max-width:min(var(--container), 100%);
  margin:0 auto;
  padding:0 24px;
  text-align:center;
}

@media (max-width:767px){
  .section-inner{ padding:0 16px; }
}

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; }
}

/* =========================================================
   Section Divider (Global)
   Matches page background always
   ========================================================= */

.section-divider{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  background:var(--c4); /* page background */
}

.section-divider__top,
.section-divider__bottom{
  height:20px;
  width:100%;
}

.section-divider__line{
  margin:0;
  width:64px;
  height:2px;
  border:none;
  background-color:var(--c0);
}

@media (max-width:1024px){
  .section-divider__top,
  .section-divider__bottom{ height:18px; }
}

@media (max-width:640px){
  .section-divider__top,
  .section-divider__bottom{ height:14px; }
  .section-divider__line{ width:56px; }
}

/* ================================
   Custom Header (Global) — DROP-IN (CLEAN)
   Works with your CURRENT header.php structure:
   .gap-header__inner children are:
     1) .gap-header__brand
     2) .gap-header__right   (Donate + Toggle)
     3) .gap-header__nav     (Menu)

   Goals:
   - Desktop (>=922px): Brand left, Nav links on the right, Donate far-right AFTER links
   - Mobile/Tablet (<=921px): Brand left on same row as Donate + Toggle (right),
     dropdown nav below when opened
   ================================ */

.gap-header{
  background: var(--c1);
  color: #fff;
  width: 100%;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.10),
    0 10px 22px rgba(0,0,0,0.14);
}

.gap-header__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 14px 24px;

  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 18px;
}

/* ------------------------------------------------
   Brand
   ------------------------------------------------ */
.gap-header__brand{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
  flex: 0 0 auto;
}

.gap-header__logo{
  width: 54px;
  height: 54px;
  flex: 0 0 auto;
  display: block;
  border-radius: 12px;
  box-shadow: 0 6px 14px rgba(0,0,0,0.14);
}

.gap-header__title{
  font-weight: 900;
  letter-spacing: -0.2px;
  line-height: 1.1;
  font-size: 18px;
  white-space: nowrap;
}

/* ------------------------------------------------
   IMPORTANT: Visual order on DESKTOP
   Your DOM is brand -> right(actions) -> nav
   We re-order to brand -> nav -> right (Donate far-right)
   ------------------------------------------------ */
.gap-header__inner > .gap-header__brand{ order: 1; }
.gap-header__inner > .gap-header__nav{ order: 2; }
.gap-header__inner > .gap-header__right{ order: 3; }

/* ------------------------------------------------
   Nav (desktop base)
   ------------------------------------------------ */
.gap-header__nav{
  min-width: 0;
  flex: 1 1 auto;              /* NAV takes the expandable space */
}

.gap-header__nav .menu{
  list-style: none;
  margin: 0;
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: flex-end;    /* push links toward Donate */
  gap: 16px;

  flex-wrap: nowrap;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;

  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.gap-header__nav .menu::-webkit-scrollbar{ display: none; }

.gap-header__nav a{
  color: rgba(255,255,255,0.92);
  text-decoration: none;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 0.2px;
  padding: 8px 6px;
  border-radius: 10px;
}

.gap-header__nav a:hover,
.gap-header__nav a:focus{
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.gap-header__nav .current-menu-item > a,
.gap-header__nav .current_page_item > a{
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ------------------------------------------------
   Right side actions (Donate + Toggle)
   ------------------------------------------------ */
.gap-header__right{
  display: inline-flex;
  align-items: center;
  gap: 14px;
  flex: 0 0 auto;            /* DO NOT allow it to stretch (prevents "Donate in middle") */
  margin-left: 14px;         /* small breathing room after links */
  min-width: 0;
}

/* Donate CTA */
.gap-header__cta{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px 14px;
  border-radius: 9999px;

  background: var(--c0);
  color: #fff;

  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 10px 20px rgba(0,0,0,0.14);
  white-space: nowrap;

  transition: transform .12s ease, background-color .18s ease, color .18s ease;
  font-size: 14px;
}

.gap-header__cta:hover{
  background: #fff;
  color: var(--c1);
  transform: translateY(-1px);
}

.gap-header__cta:focus-visible{
  outline: 3px solid rgba(255,255,255,0.45);
  outline-offset: 3px;
}

/* Toggle (hidden on desktop by default) */
.gap-header__toggle{
  display: none;
  position: relative;
  padding: 0;
  line-height: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;

  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* Centered hamburger glyph */
.gap-header__toggle-lines{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 999px;
  display: block;
}

.gap-header__toggle-lines::before,
.gap-header__toggle-lines::after{
  content: "";
  position: absolute;
  left: 0;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 999px;
}
.gap-header__toggle-lines::before{ top: -7px; }
.gap-header__toggle-lines::after{ top: 7px; }

/* Open state -> X stays centered */
.gap-header.gap-header--open .gap-header__toggle-lines{ background: transparent; }
.gap-header.gap-header--open .gap-header__toggle-lines::before{ top: 0; transform: rotate(45deg); }
.gap-header.gap-header--open .gap-header__toggle-lines::after{ top: 0; transform: rotate(-45deg); }

/* ------------------------------------------------
   Breakpoints
   ------------------------------------------------ */
@media (min-width: 922px){
  .gap-header__logo{ width: 60px; height: 60px; }
  .gap-header__title{ font-size: 20px; }

  /* Desktop safety */
  .gap-header__toggle{ display: none !important; }
  .gap-header__nav .menu{ display: flex !important; }

  /* keep Donate at far-right */
  .gap-header__right{ margin-left: 14px; }
}

@media (max-width: 980px){
  .gap-header__inner{ padding: 12px 16px; }
  .gap-header__right{ gap: 10px; }
  .gap-header__nav .menu{ gap: 12px; }
  .gap-header__logo{ width: 52px; height: 52px; }
}

/* Tablet + Mobile (<= 921px):
   Brand left, Donate+Toggle right (same row),
   Nav dropdown below (full-width) */
@media (max-width: 921px){
  :root{
    --gap-mob-btn-h: 44px;
    --gap-mob-radius: 9999px;
    --gap-mob-pad-x: 14px;
  }

  .gap-header__inner{
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px var(--gap-mob-pad-x);
  }

  /* Order in mobile: brand, actions, nav */
  .gap-header__inner > .gap-header__brand{ order: 1; }
  .gap-header__inner > .gap-header__right{ order: 2; margin-left: 0; }
  .gap-header__inner > .gap-header__nav{ order: 3; }

  .gap-header__brand{
    flex: 1 1 auto;
    width: auto;
    justify-content: flex-start;
  }

  .gap-header__title{
    white-space: nowrap;
    text-align: left;
    font-size: 18px;
    line-height: 1.15;
  }

  .gap-header__right{
    flex: 0 0 auto;
    width: auto;
    justify-content: flex-end;
  }

  /* Match Donate + Toggle height */
  .gap-header__cta,
  .gap-header__toggle{
    height: var(--gap-mob-btn-h);
  }

  .gap-header__cta{
    padding: 0 16px;
    border-radius: var(--gap-mob-radius);
    font-size: 14px;
  }

  .gap-header__toggle{
    display: inline-flex;
    width: var(--gap-mob-btn-h);
    border-radius: var(--gap-mob-radius);
    background: rgba(255,255,255,0.14);
    box-shadow: 0 10px 20px rgba(0,0,0,0.14);
  }

  .gap-header__toggle:hover{ background: rgba(255,255,255,0.20); }

  .gap-header__toggle:focus-visible{
    outline: 3px solid rgba(255,255,255,0.45);
    outline-offset: 3px;
  }

  /* Nav becomes full-width dropdown area */
  .gap-header__nav{
    width: 100%;
    flex: 0 0 100%;
  }

  /* Hide menu by default */
  .gap-header__nav .menu{
    display: none;
    overflow: visible;
    white-space: normal;
    justify-content: flex-start;
  }

  /* Open state: dropdown */
  .gap-header.gap-header--open .gap-header__nav .menu{
    display: flex;
    flex-direction: column;
    gap: 6px;

    width: 100%;
    margin-top: 12px;

    padding: 10px;
    border-radius: 16px;

    background: rgba(255,255,255,0.10);
    box-shadow:
      0 1px 0 rgba(255,255,255,0.12),
      0 18px 28px rgba(0,0,0,0.20);
  }

  .gap-header.gap-header--open .gap-header__nav a{
    display: block;
    padding: 12px 12px;
    border-radius: 12px;
    text-decoration: none;
  }

  .gap-header.gap-header--open .gap-header__nav a:hover,
  .gap-header.gap-header--open .gap-header__nav a:focus{
    background: rgba(255,255,255,0.10);
    text-decoration: none;
  }
}

@media (max-width: 420px){
  .gap-header__logo{ width: 46px; height: 46px; }
  .gap-header__title{ font-size: 17px; }
  .gap-header__cta{ padding: 0 14px; }
}

@media (prefers-reduced-motion: reduce){
  .gap-header__cta{ transition: none; }
}

/* =========================================================
   Custom Footer (Global) — Improved
   Matches header background: var(--c1)
   ========================================================= */

.gap-footer{
  background: var(--c1);
  color: rgba(255,255,255,0.92);
  width: 100%;
  margin-top: 0;

  box-shadow: 0 -1px 0 rgba(255,255,255,0.10) inset;
}

/* Links */
.gap-footer a{
  color: rgba(255,255,255,0.92);
  text-decoration: none;
}
.gap-footer a:hover,
.gap-footer a:focus{
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.gap-footer a:focus-visible{
  outline: 3px solid rgba(255,255,255,0.45);
  outline-offset: 3px;
  border-radius: 10px;
}

/* =========================================================
   Top section (3 columns)
   ========================================================= */
.gap-footer__inner{
  max-width: var(--container);
  margin: 0 auto;

  padding: clamp(26px, 3.2vw, 40px) 24px;
  display: grid;

  grid-template-columns:
    minmax(280px, 1.25fr)
    minmax(180px, 0.85fr)
    minmax(260px, 1fr);

  column-gap: clamp(18px, 3vw, 42px);
  row-gap: 22px;
  align-items: start;
}

.gap-footer__col{
  min-width: 0;
}

/* =========================================================
   Brand block
   ========================================================= */
.gap-footer__brand-link{
  display: inline-flex;
  align-items: flex-start;
  gap: 14px;
  color: #fff;
}

.gap-footer__logo{
  width: clamp(52px, 4vw, 64px);
  height: clamp(52px, 4vw, 64px);
  border-radius: 14px;
  display: block;

  box-shadow:
    0 10px 22px rgba(0,0,0,0.18),
    0 0 0 1px rgba(255,255,255,0.10);
}

.gap-footer__brand-text{
  min-width: 0;
}

.gap-footer__name{
  color: #fff;
  font-weight: 900;
  letter-spacing: -0.25px;
  font-size: 18px;
  line-height: 1.15;
  margin: 2px 0 0;
}

.gap-footer__tagline{
  margin: 8px 0 0;
  max-width: 52ch;
  line-height: 1.55;
  font-size: 14px;
  opacity: 0.90;
}

/* =========================================================
   Column headings
   ========================================================= */
.gap-footer__heading{
  margin: 0 0 12px;
  color: #fff;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: 0.55px;
  text-transform: uppercase;
  opacity: 0.95;
}

/* =========================================================
   Menu
   ========================================================= */
.gap-footer__menu{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 9px;
}

.gap-footer__menu a{
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.2px;
}

/* =========================================================
   Contact lines
   ========================================================= */
.gap-footer__line{
  margin: 0 0 8px;
  line-height: 1.55;
  font-size: 14px;
}
.gap-footer__line strong{
  color: #fff;
  font-weight: 900;
}

/* NEW: if footer.php uses <address class="gap-footer__address"> */
.gap-footer__address{
  font-style: normal;
  margin: 0;
}

/* =========================================================
   Donate CTA
   ========================================================= */
.gap-footer__cta{
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border-radius: 9999px;

  background: var(--c0);
  color: #fff !important;
  font-weight: 900;

  box-shadow: 0 10px 20px rgba(0,0,0,0.16);
  text-decoration: none !important;
  transition: transform .12s ease, background-color .18s ease, color .18s ease;
}
.gap-footer__cta:hover{
  background: #fff;
  color: var(--c1) !important;
  transform: translateY(-1px);
}
@media (prefers-reduced-motion: reduce){
  .gap-footer__cta{ transition: none; }
}

/* =========================================================
   Bottom bar (copyright)
   ========================================================= */
.gap-footer__bar{
  border-top: 1px solid rgba(255,255,255,0.14);
}
.gap-footer__bar-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 12px 24px;

  display: flex;
  justify-content: center;
  align-items: center;

  font-size: 13px;
  opacity: 0.92;

  /* NEW: nicer on iOS safe-area */
  padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

/* =========================================================
   Responsive: stack + separators
   ========================================================= */
@media (max-width: 980px){
  .gap-footer__inner{
    grid-template-columns: 1fr;
    padding: 26px 16px;
    text-align: center;
  }

  .gap-footer__brand-link{
    justify-content: center;
  }

  .gap-footer__tagline{
    margin-left: auto;
    margin-right: auto;
  }

  .gap-footer__menu{
    justify-items: center;
  }

  .gap-footer__col{
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,0.14);
  }

  .gap-footer__brand-link{
    padding-bottom: 6px;
  }

  /* NEW: ensure Donate centers nicely when stacked */
  .gap-footer__cta{
    margin-left: auto;
    margin-right: auto;
  }

  .gap-footer__bar-inner{
    padding: 12px 16px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
  }
}

/* =========================================================
   HOME PAGE (LOCKED) — page-id-3061
   For /front-page.php inside Astra container markup.
   ========================================================= */

/* ---------- Make Astra container full width on Home ---------- */
.page-id-3061 #primary .ast-container{
  max-width:none;
  padding-left:0;
  padding-right:0;
}

.page-id-3061 #main-content{
  width:100%;
}

/* Home sections should be true full width (no 100vw hacks) */
.page-id-3061 .home-hero,
.page-id-3061 .home-sec2,
.page-id-3061 .home-sec3,
.page-id-3061 .home-cta,
.page-id-3061 .section-divider{
  width:100%;
  margin:0;
}

/* ---------- Shared inner container ---------- */
.page-id-3061 .home-hero__inner,
.page-id-3061 .home-sec2__inner,
.page-id-3061 .home-sec3__inner,
.page-id-3061 .home-cta__inner{
  max-width:var(--container);
  margin:0 auto;
  padding-left:24px;
  padding-right:24px;
  text-align:center;
}

@media (max-width:767px){
  .page-id-3061 .home-hero__inner,
  .page-id-3061 .home-sec2__inner,
  .page-id-3061 .home-sec3__inner,
  .page-id-3061 .home-cta__inner{
    padding-left:16px;
    padding-right:16px;
  }
}

/* =========================================================
   HOME HERO — Single Block (page-id-3061)
   Replace ALL existing HERO rules with this block.
   ========================================================= */

/* --- OPTION B: Brighter center + soft vignette edges --- */
.page-id-3061 .home-hero{
  position:relative;
  overflow:hidden;

  background:
    /* Edge vignette (subtle) */
    radial-gradient(
      circle at 50% 35%,
      rgba(10, 60, 60, 0) 0%,
      rgba(10, 60, 60, 0) 55%,
      rgba(10, 60, 60, 0.08) 78%,
      rgba(10, 60, 60, 0.14) 100%
    ),
    /* Bright center spotlight behind logo/title */
    radial-gradient(
      circle at 50% 18%,
      rgba(255,255,255,0.98) 0%,
      rgba(255,255,255,0.78) 26%,
      rgba(220,240,247,0.96) 48%,
      rgba(200,230,240,1) 70%,
      rgba(185,220,235,1) 100%
    ),
    /* Base vertical sky */
    linear-gradient(
      to bottom,
      #eef9fc 0%,
      #dff2f8 45%,
      #d3edf5 100%
    );
}

/* Replace the old ::after glow with a center “lift” that stays behind content */
/* Glow layer (behind content; does NOT dull logo/text) */
.page-id-3061 .home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background: radial-gradient(circle at 50% 10%, rgba(255,255,255,.55), transparent 55%);
  opacity:.55;
}

/* Ensure content sits above overlays */
.page-id-3061 .home-hero__inner{
  position:relative;
  z-index:2;

  max-width:var(--container);
  margin:0 auto;
  padding: clamp(44px, 5.2vw, 72px) 24px clamp(40px, 4.8vw, 64px);
  text-align:center;
}

@media (max-width:767px){
  .page-id-3061 .home-hero__inner{
    padding-left:16px;
    padding-right:16px;
    padding-top:52px;
    padding-bottom:52px;
  }
}

/* Logo: more pronounced */
.page-id-3061 .home-hero__logo{
  display:block;
  width: clamp(150px, 16vw, 220px);
  margin:0 auto 14px;

  /* “Pop” without looking over-processed */
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.22));
  background: rgba(255,255,255,.35);
  padding: 10px;
  border-radius: 16px;
  backdrop-filter: blur(2px);
}

/* Title */
.page-id-3061 .home-hero__title{
  max-width: 820px;
  margin:0 auto 12px;

  font-size: clamp(30px, 3.8vw, 46px);
  font-weight:800;
  line-height:1.06;
  letter-spacing:-0.35px;
}

@media (max-width:767px){
  .page-id-3061 .home-hero__title{
    max-width:22ch;
    letter-spacing:-0.2px;
  }
}

/* Subtitle */
.page-id-3061 .home-hero__subtitle{
  max-width: 640px;
  margin:0 auto 20px;

  font-size: clamp(15px, 1.55vw, 18px);
  line-height:1.55;
  text-wrap: balance;
}

@media (max-width:767px){
  .page-id-3061 .home-hero__subtitle{
    max-width:36ch;
    margin-bottom:18px;
  }
}

/* CTA spacing */
.page-id-3061 .home-hero__cta{
  margin-top:2px;
}

/* Button */
.page-id-3061 .home-hero__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  padding:14px 22px;
  border-radius:12px;

  background:var(--c0);
  color:var(--c4);
  font-weight:800;
  text-decoration:none;

  box-shadow:0 10px 20px rgba(30,143,139,.20);
  transition:transform .15s ease, background-color .15s ease;
}

.page-id-3061 .home-hero__button:hover{
  color:#ffffff;
  background:var(--c1);
  transform:translateY(-1px);
}

.page-id-3061 .home-hero__button:focus-visible{
  outline:3px solid rgba(30,143,139,.45);
  outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
  .page-id-3061 .home-hero__button{ transition:none; }
}

/* =========================================================
   HOME — Rhythm + shared spacing (page-id-3061)
   Put this once ABOVE sections 2/3/4
   ========================================================= */

.page-id-3061{
  --sec-y: clamp(56px, 6vw, 76px);
  --pad-x: 24px;
  --pad-x-m: 16px;

  --title-mb: 12px;
  --intro-mb: 22px;
  --content-mt: 26px;

  --grid-gap-2: 24px; /* sec2 + cta */
  --grid-gap-3: 32px; /* sec3 */
  --card-pad: 24px;
}

/* unify inner paddings */
.page-id-3061 .home-sec2__inner,
.page-id-3061 .home-sec3__inner,
.page-id-3061 .home-cta__inner{
  padding-top: var(--sec-y);
  padding-bottom: var(--sec-y);
  padding-left: var(--pad-x);
  padding-right: var(--pad-x);
}

@media (max-width: 767px){
  .page-id-3061 .home-sec2__inner,
  .page-id-3061 .home-sec3__inner,
  .page-id-3061 .home-cta__inner{
    padding-left: var(--pad-x-m);
    padding-right: var(--pad-x-m);
  }
}

/* unify title/intro spacing */
.page-id-3061 .home-sec2__title,
.page-id-3061 .home-sec3__title,
.page-id-3061 .home-cta__title{
  margin-bottom: var(--title-mb);
}

.page-id-3061 .home-sec2__intro,
.page-id-3061 .home-sec3__intro,
.page-id-3061 .home-cta__lead{
  margin-bottom: var(--intro-mb);
}

/* unify grid top spacing */
.page-id-3061 .home-sec2__features,
.page-id-3061 .home-sec3__steps,
.page-id-3061 .home-cta__cards{
  margin-top: var(--content-mt);
}

/* unify card padding */
.page-id-3061 .home-sec2__feature,
.page-id-3061 .home-sec3__step,
.page-id-3061 .home-cta__card{
  padding: var(--card-pad);
}

/* divider spacing consistency on home */
.page-id-3061 .section-divider__top,
.page-id-3061 .section-divider__bottom{
  height: 18px;
}
@media (max-width:640px){
  .page-id-3061 .section-divider__top,
  .page-id-3061 .section-divider__bottom{
    height: 14px;
  }
}


/* =========================================================
   HOME — SECTION 2 (page-id-3061) — DROP-IN REPLACEMENT
   ========================================================= */

.page-id-3061 .home-sec2{
  background: var(--c5);
}

.page-id-3061 .home-sec2__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 72px) 24px;
  text-align: center;
}

@media (max-width: 767px){
  .page-id-3061 .home-sec2__inner{
    padding-left: 16px;
    padding-right: 16px;
  }
}

.page-id-3061 .home-sec2__title{
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 800;
  max-width: 22ch;
  margin: 0 auto 12px;
  letter-spacing: -0.3px;
  line-height: 1.08;
}

.page-id-3061 .home-sec2__intro{
  font-size: clamp(15px, 1.55vw, 18px);
  max-width: 72ch;
  margin: 0 auto 22px;
  line-height: 1.65;
  text-wrap: balance;
}

.page-id-3061 .home-sec2__image{
  max-width: 680px;
  margin: 0 auto 32px; /* adds space between image and cards */
}

.page-id-3061 .home-sec2__image img{
  width: 100%;
  max-height: 360px;
  object-fit: cover;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.page-id-3061 .home-sec2__features{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--grid-gap-2);
  margin-top: 0;
  text-align: center;
}

@media (max-width: 1024px){
  .page-id-3061 .home-sec2__features{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px){
  .page-id-3061 .home-sec2__features{
    grid-template-columns: 1fr;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }
}

.page-id-3061 .home-sec2__feature{
  background: var(--c4);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
}

.page-id-3061 .home-sec2__feature-title{
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 800;
  color: var(--c2);
}

.page-id-3061 .home-sec2__feature p{
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}

@media (hover:hover){
  .page-id-3061 .home-sec2__feature{
    transition: transform .15s ease;
  }
  .page-id-3061 .home-sec2__feature:hover{
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce){
  .page-id-3061 .home-sec2__feature{
    transition: none;
  }
}

/* Section 2 image: slightly less dominant on desktop */
.page-id-3061 .home-sec2__image{
  max-width: 680px;
}

.page-id-3061 .home-sec2__image img{
  max-height: 360px;
  object-fit: cover;
}

/* =========================================================
   HOME — SECTION 3 (page-id-3061) — DROP-IN REPLACEMENT
   Center aligns with Section 2; cards row slightly wider; bigger gaps
   ========================================================= */

.page-id-3061 .home-sec3{
  background: var(--c7);
}

.page-id-3061 .home-sec3__inner{
  /* Slightly wider than Section 2, but still centered */
  max-width: calc(var(--container) + 120px);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 72px) 24px;
  text-align: center;
}

@media (max-width: 767px){
  .page-id-3061 .home-sec3__inner{
    padding-left: 16px;
    padding-right: 16px;
  }
}

.page-id-3061 .home-sec3__title{
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 800;
  max-width: 920px;            /* keep text aligned with Section 2 feel */
  margin: 0 auto 12px;
  letter-spacing: -0.3px;
  line-height: 1.08;
}

.page-id-3061 .home-sec3__intro{
  font-size: clamp(15px, 1.55vw, 18px);
  max-width: 760px;
  margin: 0 auto 22px;
  line-height: 1.65;
  text-wrap: balance;
}

/* Cards: perfectly centered, wider via inner max-width, larger gap */
.page-id-3061 .home-sec3__steps{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--grid-gap-3);                   /* increased gap (your request) */
  margin-top: 26px;
  text-align: center;
}

/* Card */
.page-id-3061 .home-sec3__step{
  background: var(--c4);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
}

.page-id-3061 .home-sec3__step-title{
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 800;
  color: var(--c2);
}

.page-id-3061 .home-sec3__step p{
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}

/* Tablet: 2-up */
@media (max-width: 1024px){
  .page-id-3061 .home-sec3__steps{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
  }
}

/* Mobile: 1-up */
@media (max-width: 700px){
  .page-id-3061 .home-sec3__steps{
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* =========================================================
   HOME — CTA (SECTION 4) (page-id-3061) — “CLASSIC CENTERED”
   Single-card friendly (centers 1 card) + button fits content
   ========================================================= */

.page-id-3061 .home-cta{
  background: var(--c4);
}

.page-id-3061 .home-cta__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 72px) 24px clamp(56px, 7vw, 80px);
  text-align: center;
}

@media (max-width: 767px){
  .page-id-3061 .home-cta__inner{
    padding-left: 16px;
    padding-right: 16px;
  }
}

.page-id-3061 .home-cta__title{
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 800;
  max-width: 920px;
  margin: 0 auto 12px;
  letter-spacing: -0.3px;
  line-height: 1.08;
}

.page-id-3061 .home-cta__lead{
  font-size: clamp(15px, 1.55vw, 18px);
  max-width: 72ch;
  margin: 0 auto 22px;
  line-height: 1.65;
  text-wrap: balance;
}

/* Grid: centers a single card and stays nice if you add a 2nd later */
.page-id-3061 .home-cta__cards{
  max-width: 1080px;
  margin: 26px auto 0;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 520px));
  justify-content: center;

  gap: var(--grid-gap-2);
  text-align: center;
}

@media (max-width: 700px){
  .page-id-3061 .home-cta__cards{
    grid-template-columns: 1fr;
    max-width: 720px;
    gap: 18px;
  }
}

.page-id-3061 .home-cta__card{
  background: var(--c6);
  padding: 28px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.page-id-3061 .home-cta__card-title{
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 800;
  color: var(--c2);
}

.page-id-3061 .home-cta__card p{
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}

/* Button: centered, fits content (not full width) */
.page-id-3061 .home-cta__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: auto !important;
  max-width: max-content;
  white-space: nowrap;

  margin: 18px auto 0;
  padding: 11px 16px;

  background: var(--c0);
  color: var(--c4);
  border-radius: 12px;
  text-decoration: none;
  font-weight: 800;

  transition: transform .15s ease, background-color .15s ease, color .15s ease;
}

.page-id-3061 .home-cta__btn:hover{
  color: #ffffff;
  background: var(--c1);
  transform: translateY(-1px);
}

.page-id-3061 .home-cta__btn:focus-visible{
  outline: 3px solid rgba(30,143,139,.45);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce){
  .page-id-3061 .home-cta__btn{ transition: none; }
}

/* =========================================================
   ABOUT PAGE — page-id-3080 — FINAL CLEAN (drop-in)
   - Astra container override (About only)
   - Section 1: 2-column hero (text left, framed image right)
   - Section 2: 2-column (framed image left, text right) + vertical centering
   - Section 3: NO frame, keep lines + rounded image
   - Section 4: 2-column (text left, framed image right) + vertical centering
   ========================================================= */

/* ---------- Astra container override (About only) ---------- */
.page-id-3080 #primary .ast-container{
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.page-id-3080 #main-content{
  width: 100%;
}

/* ---------- Tokens (About only) ---------- */
.page-id-3080{
  --about-sec-y: clamp(56px, 6vw, 78px);
  --about-pad-x: 24px;
  --about-pad-x-m: 16px;

  --about-title-mb: 12px;
  --about-block-gap: 16px;

  --about-text: clamp(15px, 1.55vw, 18px);

  /* Frame style used in Sections 1, 2, 4 */
  --about-frame-pad: 12px;
  --about-frame-bg: rgba(255,255,255,0.55);
  --about-frame-border: 1px solid rgba(15, 95, 92, 0.14);
  --about-frame-radius: calc(var(--radius) + 6px);

  /* Section 2 image sizing (safe: never crops words) */
  --about-sec2-img-maxw: 500px;
  --about-sec2-img-maxh: 380px;

  /* Section 4 image sizing */
  --about-sec4-img-maxw: min(560px, 40vw);
  --about-sec4-img-maxh: min(520px, 56vh);

  /* Section 3 line color */
  --about-line: rgba(30, 143, 139, 0.35);
}

/* ---------- Full-width sections (no 100vw) ---------- */
.page-id-3080 .about-intro,
.page-id-3080 .about-sec2,
.page-id-3080 .about-belief,
.page-id-3080 .about-sec4,
.page-id-3080 .section-divider{
  width: 100%;
  margin: 0;
}

/* Divider band between sections */
.page-id-3080 .section-divider{
  background: var(--c4);
}

/* =========================================================
   SECTION 1 — HERO (2-column)
   ========================================================= */

/* Hero background */
.page-id-3080 .about-intro{
  position: relative;
  overflow: hidden;

  background:
    radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.05) 100%),
    radial-gradient(circle at 32% 38%, rgba(255,255,255,0.72) 0%, rgba(255,255,255,0.22) 26%, rgba(255,255,255,0) 62%),
    radial-gradient(circle at 72% 42%, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 24%, rgba(255,255,255,0) 58%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04),
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 7px
    ),
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--c7) 74%, white) 0%,
      var(--c7) 62%,
      color-mix(in srgb, var(--c7) 86%, var(--c2)) 100%
    );
}

/* Safety: hide any separators INSIDE section 1 only */
.page-id-3080 .about-intro :is(.section-divider, hr, .wp-block-separator){
  display: none !important;
}

.page-id-3080 .about-intro__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--about-sec-y) var(--about-pad-x);
  position: relative;
  z-index: 1;

  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 460px);
  gap: clamp(18px, 2.6vw, 40px);
  align-items: center;

  text-align: left;
}

@media (max-width: 767px){
  .page-id-3080 .about-intro__inner{
    padding-left: var(--about-pad-x-m);
    padding-right: var(--about-pad-x-m);
  }
}

/* Title */
.page-id-3080 .about-intro__title{
  grid-column: 1;
  font-size: clamp(32px, 4.2vw, 52px);
  font-weight: 900;
  letter-spacing: -0.55px;
  line-height: 1.06;
  max-width: 24ch;
  margin: 0 0 14px;
  color: var(--c2);
  text-shadow: 0 1px 0 rgba(255,255,255,0.22);
  text-decoration: none !important;
}
.page-id-3080 .about-intro__title::after{
  content: none !important;
}

.page-id-3080 .about-intro__lead{
  grid-column: 1;
  max-width: 70ch;
  margin: 0 0 14px;
  font-size: var(--about-text);
  line-height: 1.75;
  color: var(--c3);
  text-wrap: balance;
}

.page-id-3080 .about-intro__text{
  grid-column: 1;
  max-width: 70ch;
  margin: 0;
  font-size: var(--about-text);
  line-height: 1.8;
  color: var(--c3);
}

/* Framed image right */
.page-id-3080 figure.about-intro__image{
  grid-column: 2;
  grid-row: 1 / span 3;
  justify-self: end;
  align-self: center;

  width: 100%;
  margin: 0;

  background: var(--about-frame-bg);
  padding: var(--about-frame-pad);
  border: var(--about-frame-border);
  border-radius: var(--about-frame-radius);

  box-shadow:
    0 18px 34px rgba(0,0,0,0.14),
    0 0 0 1px rgba(255,255,255,0.18) inset;

  overflow: hidden;
  transform: translateZ(0);
}

.page-id-3080 figure.about-intro__image img{
  display: block !important;
  width: 100% !important;
  height: auto !important;

  /* Keep full image visible (no crop) */
  max-height: min(560px, 72vh);
  object-fit: contain;
  object-position: 50% 50%;

  border-radius: var(--radius) !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Stack on tablet/mobile */
@media (max-width: 900px){
  .page-id-3080 .about-intro__inner{
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
    align-items: start;
  }

  .page-id-3080 figure.about-intro__image{
    grid-column: 1;
    grid-row: auto;
    justify-self: center;
    max-width: min(560px, 92vw);
    margin-top: clamp(12px, 2vw, 18px);
  }

  .page-id-3080 figure.about-intro__image img{
    max-height: 520px;
  }

  .page-id-3080 .about-intro__title,
  .page-id-3080 .about-intro__lead,
  .page-id-3080 .about-intro__text{
    max-width: 78ch;
  }
}

/* =========================================================
   Shared typography for sections 2–4
   ========================================================= */

.page-id-3080 .about-sec2{ background: var(--c5); }
.page-id-3080 .about-belief{ background: var(--c7); }
.page-id-3080 .about-sec4{ background: var(--c5); }

.page-id-3080 .about-sec2__inner,
.page-id-3080 .about-belief__inner,
.page-id-3080 .about-sec4__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--about-sec-y) var(--about-pad-x);
  position: relative;
  z-index: 1;
}

@media (max-width: 767px){
  .page-id-3080 .about-sec2__inner,
  .page-id-3080 .about-belief__inner,
  .page-id-3080 .about-sec4__inner{
    padding-left: var(--about-pad-x-m);
    padding-right: var(--about-pad-x-m);
  }
}

.page-id-3080 .about-sec2__title,
.page-id-3080 .about-belief__title,
.page-id-3080 .about-sec4__title{
  font-size: clamp(26px, 3.2vw, 44px);
  font-weight: 800;
  letter-spacing: -0.3px;
  line-height: 1.12;
  max-width: 28ch;
  margin: 0 auto var(--about-title-mb);
  color: var(--c2);
}

.page-id-3080 .about-sec2__text,
.page-id-3080 .about-belief__text,
.page-id-3080 .about-sec4__text{
  max-width: 78ch;
  margin: 0 auto;
  font-size: var(--about-text);
  line-height: 1.75;
  color: var(--c3);
}

.page-id-3080 .about-sec2__text + .about-sec2__text,
.page-id-3080 .about-belief__text + .about-belief__text,
.page-id-3080 .about-sec4__text + .about-sec4__text{
  margin-top: var(--about-block-gap);
}

/* =========================================================
   SECTION 2 — 2-column (image left, text right) + framed
   (No crop: keeps all words visible)
   ========================================================= */

@media (min-width: 901px){
  .page-id-3080 .about-sec2__inner{
    display: grid;
    grid-template-columns: minmax(320px, 1fr) minmax(0, 1.15fr);
    gap: clamp(24px, 3vw, 48px);
    align-items: center;
    text-align: left;

    grid-template-areas:
      "image title"
      "image text1"
      "image text2";
  }

  .page-id-3080 .about-sec2__title{
    grid-area: title;
    margin: 0 0 10px;
    max-width: 26ch;
  }

  .page-id-3080 .about-sec2__inner > p.about-sec2__text:nth-of-type(1){
    grid-area: text1;
    margin: 0;
    max-width: 66ch;
  }

  .page-id-3080 .about-sec2__inner > p.about-sec2__text:nth-of-type(2){
    grid-area: text2;
    margin: 14px 0 0;
    max-width: 66ch;
  }

  .page-id-3080 figure.about-sec2__image{
    grid-area: image;
    margin: 0;
    width: 100%;
    max-width: var(--about-sec2-img-maxw);
    align-self: center;
    justify-self: start;

    background: var(--about-frame-bg);
    padding: var(--about-frame-pad);
    border: var(--about-frame-border);
    border-radius: var(--about-frame-radius);

    box-shadow:
      0 10px 22px rgba(0,0,0,0.14),
      0 0 0 1px rgba(255,255,255,0.18) inset;

    overflow: hidden;
    transform: translateZ(0);
  }

  .page-id-3080 figure.about-sec2__image img{
    display: block !important;
    width: 100% !important;
    height: auto !important;

    max-height: var(--about-sec2-img-maxh);
    object-fit: contain;          /* critical: never crop words */
    object-position: 50% 50%;

    border-radius: var(--radius) !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
  }
}

/* Mobile/tablet: stacked + centered */
@media (max-width: 900px){
  .page-id-3080 .about-sec2__inner{
    text-align: center;
  }

  .page-id-3080 figure.about-sec2__image{
    margin: clamp(16px, 2.2vw, 22px) auto clamp(18px, 2.6vw, 28px);
    max-width: 840px;
    border-radius: var(--radius) !important;
    overflow: hidden !important;
  }

  .page-id-3080 figure.about-sec2__image img{
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 360px;
    object-fit: contain;
    box-shadow: var(--shadow) !important;
  }
}

/* =========================================================
   SECTION 3 — NO frame, keep lines + rounded image
   Centered (figure hugs image; no big side padding)
   ========================================================= */

.page-id-3080 figure.about-belief__image{
  position: relative;

  /* key: make the figure a block so margin auto centers it */
  display: block;
  width: fit-content;
  max-width: min(820px, 92vw);

  margin: clamp(16px, 2.2vw, 22px) auto clamp(18px, 2.6vw, 28px);
  padding: 18px 0;               /* space for the lines */
  overflow: visible !important;
  background: transparent !important;
}

.page-id-3080 figure.about-belief__image img{
  display: block !important;

  width: auto !important;
  max-width: 100% !important;
  height: auto !important;

  max-height: min(46vh, 420px);
  object-fit: contain;
  object-position: 50% 50%;

  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;

  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Lines above + below (match the figure width, centered) */
.page-id-3080 figure.about-belief__image::before,
.page-id-3080 figure.about-belief__image::after{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 2px;
  border-radius: 999px;
  background: var(--about-line);
}

.page-id-3080 figure.about-belief__image::before{ top: 0; }
.page-id-3080 figure.about-belief__image::after{ bottom: 0; }

@media (max-width: 640px){
  .page-id-3080 figure.about-belief__image{
    padding: 14px 0;
  }
  .page-id-3080 figure.about-belief__image img{
    max-height: 360px;
  }
}

/* =========================================================
   SECTION 3 — Center title + text (About page)
   ========================================================= */

.page-id-3080 .about-belief__inner{
  text-align: center !important;
}

.page-id-3080 .about-belief__title{
  margin-left: auto !important;
  margin-right: auto !important;
}

.page-id-3080 .about-belief__text{
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}


/* =========================================================
   SECTION 4 — 2-column (text left, framed image right)
   ========================================================= */

@media (min-width: 901px){
  .page-id-3080 .about-sec4__inner{
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: clamp(22px, 3vw, 44px);
    align-items: center;
    text-align: left;

    grid-template-areas:
      "title image"
      "text1 image"
      "text2 image";
  }

  .page-id-3080 .about-sec4__title{
    grid-area: title;
    margin: 0 0 14px;
    font-size: clamp(30px, 3.6vw, 52px);
    font-weight: 900;
    letter-spacing: -0.55px;
    line-height: 1.06;
    max-width: 24ch;
  }

  .page-id-3080 .about-sec4__inner > p.about-sec4__text:nth-of-type(1){
    grid-area: text1;
    margin: 0;
    max-width: 68ch;
  }

  .page-id-3080 .about-sec4__inner > p.about-sec4__text:nth-of-type(2){
    grid-area: text2;
    margin: 18px 0 0;
    max-width: 68ch;
  }

  .page-id-3080 figure.about-sec4__image{
    grid-area: image;
    margin: 0;
    width: 100%;
    max-width: var(--about-sec4-img-maxw);
    align-self: center;
    justify-self: end;

    background: var(--about-frame-bg);
    padding: 14px;
    border: var(--about-frame-border);
    border-radius: var(--about-frame-radius);

    box-shadow:
      0 18px 34px rgba(0,0,0,0.14),
      0 0 0 1px rgba(255,255,255,0.18) inset;

    overflow: hidden;
    transform: translateZ(0);
  }

  .page-id-3080 figure.about-sec4__image img{
    display: block !important;
    width: 100% !important;
    height: auto !important;

    max-height: var(--about-sec4-img-maxh);
    object-fit: contain;  /* safe: avoids cropping */
    object-position: 50% 50%;

    border-radius: var(--radius) !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
  }
}

/* Stack on tablet/mobile */
@media (max-width: 900px){
  .page-id-3080 .about-sec4__inner{
    text-align: center;
  }

  .page-id-3080 figure.about-sec4__image{
    margin: clamp(14px, 2.2vw, 22px) auto 0;
    max-width: min(640px, 92vw);

    background: var(--about-frame-bg);
    padding: 12px;
    border: var(--about-frame-border);
    border-radius: var(--about-frame-radius);
    box-shadow: var(--shadow);
    overflow: hidden;
  }

  .page-id-3080 figure.about-sec4__image img{
    display: block !important;
    width: 100% !important;
    height: auto !important;

    max-height: 420px;
    object-fit: contain;
    border-radius: var(--radius) !important;
    box-shadow: none !important;
  }
}

/* =========================================================
   THE GAP — page-id-3083 — CONSOLIDATED (style.css)
   - Section backgrounds: ONLY --c5 and --c7
   - Divider stays global (band on --c4 between sections)
   - Markup-aligned gallery: gap-sec3__images / gap-sec3__image
   - Hero “pop” applied (Section 1)
   ========================================================= */

/* ---------- Tokens + Astra safety (GAP only) ---------- */
body.page-id-3083{
  --gap-sec-y: clamp(56px, 6vw, 84px);
  --gap-pad-x: 24px;
  --gap-pad-x-m: 16px;

  --gap-h1: clamp(34px, 5vw, 64px);
  --gap-h2: clamp(28px, 3.5vw, 48px);
  --gap-text: clamp(15px, 1.55vw, 18px);
}

body.page-id-3083 #primary{
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  float: none !important;
}

body.page-id-3083 #main-content{
  width: 100% !important;
}

body.page-id-3083 #primary .ast-container{
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* ---------- Full-width blocks ---------- */
body.page-id-3083 :is(
  .gap-hero,
  .gap-sec2,
  .gap-sec3,
  .gap-support,
  .gap-faith,
  .gap-audience,
  .gap-cta,
  .section-divider
){
  width: 100%;
  margin: 0;
}

/* ---------- Section backgrounds (ONLY c5 & c7) ---------- */
/* HERO (Section 1): POP (base stays --c7; overlays are light/shadow only) */
body.page-id-3083 .gap-hero{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.05) 100%),
    radial-gradient(circle at 78% 42%, rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.22) 22%, rgba(255,255,255,0) 55%),
    radial-gradient(circle at 22% 38%, rgba(255,255,255,0.70) 0%, rgba(255,255,255,0.20) 26%, rgba(255,255,255,0) 60%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04),
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 7px
    ),
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--c7) 72%, white) 0%,
      var(--c7) 62%,
      color-mix(in srgb, var(--c7) 86%, var(--c2)) 100%
    );
}

body.page-id-3083 .gap-sec2{ background: var(--c5); }
body.page-id-3083 .gap-sec3{ background: var(--c7); }
body.page-id-3083 .gap-support{ background: var(--c5); }
body.page-id-3083 .gap-faith{ background: var(--c7); }
body.page-id-3083 .gap-audience{ background: var(--c5); }
body.page-id-3083 .gap-cta{ background: var(--c7); }

/* ---------- Divider (global styles already exist; add safety) ---------- */
body.page-id-3083 .section-divider{ background: var(--c4); }
body.page-id-3083 hr.section-divider__line{ margin: 0 !important; border: none !important; }

/* ---------- Shared inner containers ---------- */
body.page-id-3083 :is(
  .gap-hero__inner,
  .gap-sec2__inner,
  .gap-sec3__inner,
  .gap-support__inner,
  .gap-faith__inner,
  .gap-audience__inner,
  .gap-cta__inner
){
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--gap-sec-y) var(--gap-pad-x);
  text-align: center;
}

@media (max-width: 767px){
  body.page-id-3083 :is(
    .gap-hero__inner,
    .gap-sec2__inner,
    .gap-sec3__inner,
    .gap-support__inner,
    .gap-faith__inner,
    .gap-audience__inner,
    .gap-cta__inner
  ){
    padding-left: var(--gap-pad-x-m);
    padding-right: var(--gap-pad-x-m);
    text-align: center;
  }
}

/* ---------- Typography ---------- */
body.page-id-3083 .gap-hero__title{
  font-size: var(--gap-h1);
  font-weight: 900;
  letter-spacing: -0.5px;
  line-height: 1.05;
  max-width: 18ch;
  margin: 0 auto 12px;
  color: var(--c2);
}

body.page-id-3083 :is(
  .gap-sec2__title,
  .gap-sec3__title,
  .gap-support__title,
  .gap-faith__title,
  .gap-audience__title,
  .gap-cta__title
){
  font-size: var(--gap-h2);
  font-weight: 900;
  letter-spacing: -0.35px;
  line-height: 1.1;
  max-width: 26ch;
  margin: 0 auto 12px;
  color: var(--c2);
}

body.page-id-3083 :is(
  .gap-hero__subtitle,
  .gap-sec2__text,
  .gap-sec3__text,
  .gap-support__text,
  .gap-faith__intro,
  .gap-faith__text,
  .gap-audience__text,
  .gap-cta__lead,
  .gap-cta__text
){
  font-size: var(--gap-text);
  line-height: 1.75;
  color: var(--c3);
  max-width: 78ch;
  margin: 0 auto;
  text-wrap: balance;
}

body.page-id-3083 :is(
  .gap-sec2__text,
  .gap-sec3__text,
  .gap-support__text,
  .gap-faith__text,
  .gap-audience__text
) + :is(
  .gap-sec2__text,
  .gap-sec3__text,
  .gap-support__text,
  .gap-faith__text,
  .gap-audience__text
){
  margin-top: 16px;
}

/* ---------- HERO layout ---------- */
body.page-id-3083 .gap-hero__inner{
  padding-top: clamp(56px, 6vw, 88px);
  padding-bottom: clamp(48px, 6vw, 80px);
}

@media (min-width: 980px){
  body.page-id-3083 .gap-hero__inner{
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    grid-template-areas:
      "title image"
      "subtitle image";
    align-items: center;
    gap: 36px;
    text-align: left;
  }

  body.page-id-3083 .gap-hero__title{ grid-area: title; margin-left: 0; }
  body.page-id-3083 .gap-hero__subtitle{ grid-area: subtitle; margin-left: 0; }
  body.page-id-3083 .gap-hero__image{ grid-area: image; justify-self: end; margin: 0; }
}

@media (max-width: 979px){
  body.page-id-3083 .gap-hero__title{ text-align: center; }
  body.page-id-3083 .gap-hero__subtitle{ text-align: center; margin-top: 10px; }
}

/* ---------- Images (unified) ---------- */
body.page-id-3083 figure:is(.gap-hero__image, .gap-sec3__image, .gap-faith__image){
  margin: clamp(18px, 2.4vw, 28px) auto;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: var(--radius);
  overflow: hidden;
  transform: translateZ(0);
}

body.page-id-3083 figure:is(.gap-hero__image, .gap-sec3__image, .gap-faith__image) img{
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 0;
  box-shadow: var(--shadow);
  background: transparent;
}

/* Hero portrait: never crop */
body.page-id-3083 figure.gap-hero__image{
  max-width: clamp(260px, 34vw, 520px);
  box-shadow:
    0 0 0 1px rgba(15,95,92,0.12),
    0 18px 40px rgba(0,0,0,0.12);
}

body.page-id-3083 figure.gap-hero__image img{
  max-height: min(56vh, 520px);
  object-fit: contain;
  box-shadow: none; /* wrapper owns shadow for hero */
}

/* Faith portrait board: never crop */
body.page-id-3083 figure.gap-faith__image{
  max-width: clamp(280px, 46vw, 460px);
}

body.page-id-3083 figure.gap-faith__image img{
  max-height: min(58vh, 520px);
  object-fit: contain;
}

/* ---------- Section 3 gallery (matches your markup) ---------- */
body.page-id-3083 .gap-sec3__rule{
  max-width: 820px;
  margin: 22px auto 28px;
  border: 0;
  height: 2px;
  background: rgba(15,95,92,0.25);
}

body.page-id-3083 .gap-sec3__images{
  max-width: 980px;
  margin: 26px auto 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 26px);
  align-items: start;
}

body.page-id-3083 figure.gap-sec3__image{
  margin: 0;
}

body.page-id-3083 figure.gap-sec3__image img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
  max-height: 360px;
}

@media (max-width: 800px){
  body.page-id-3083 .gap-sec3__images{
    grid-template-columns: 1fr;
    max-width: 720px;
  }

  body.page-id-3083 figure.gap-sec3__image img{
    max-height: 340px;
  }
}

/* ---------- CTA buttons ---------- */
body.page-id-3083 .gap-cta__buttons{
  margin-top: 18px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

body.page-id-3083 .gap-cta__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  background: var(--c0);
  color: var(--c4);
  border-radius: 12px;
  text-decoration: none;
  font-weight: 800;
  box-shadow: 0 10px 20px rgba(30,143,139,.18);
  transition: transform .15s ease, background-color .15s ease;
}

body.page-id-3083 .gap-cta__btn:hover{
  color: #fff;
  background: var(--c1);
  transform: translateY(-1px);
}

body.page-id-3083 .gap-cta__btn:focus-visible{
  outline: 3px solid rgba(30,143,139,.45);
  outline-offset: 3px;
}

body.page-id-3083 .gap-cta__btn--secondary{
  background: transparent;
  color: var(--c1);
  box-shadow: none;
  border: 2px solid rgba(15,95,92,0.35);
}

body.page-id-3083 .gap-cta__btn--secondary:hover{
  background: rgba(15,95,92,0.08);
  color: var(--c1);
}

/* ---------- Motion safety ---------- */
@media (prefers-reduced-motion: reduce){
  body.page-id-3083 .gap-cta__btn{ transition: none; }
}

/* =========================================================
   THE GAP (3083) — Hero: tighten H1 + subtitle spacing (desktop)
   Fixes big gap caused by grid track stretching when image spans rows
   ========================================================= */

@media (min-width: 980px){
  body.page-id-3083 .gap-hero__inner{
    /* IMPORTANT: prevents the two grid rows from stretching tall */
    align-content: start;

    /* controls the vertical spacing between title + subtitle */
    row-gap: 10px;

    /* optional: slightly reduce overall column gap */
    column-gap: 32px;
  }

  body.page-id-3083 .gap-hero__title{
    margin-bottom: 0; /* let row-gap control spacing */
  }

  body.page-id-3083 .gap-hero__subtitle{
    margin-top: 0;    /* let row-gap control spacing */
  }

  /* keep image nicely aligned while text packs upward */
  body.page-id-3083 .gap-hero__image{
    align-self: center;
  }
}

/* Mobile/tablet: slightly tighter subtitle spacing */
@media (max-width: 979px){
  body.page-id-3083 .gap-hero__subtitle{
    margin-top: 6px;
  }
}


/* =========================================================
   BOARD — page-id-3086 — FINAL CONSOLIDATED
   - No 100vw math (prevents horizontal scroll / offsets)
   - Uses Astra container override + 100% sections
   - Divider remains global (band on --c4)
   - Members: consistent rounded media cards
     * Default members: fixed 4/5 card with cover
     * Tim: auto-height card so full photo shows + corners stay rounded
   ========================================================= */

/* ---------- Tokens (Board only) ---------- */
body.page-id-3086{
  --board-sec-y: clamp(56px, 6vw, 84px);
  --board-pad-x: 24px;
  --board-pad-x-m: 16px;

  --board-h1: clamp(34px, 4.6vw, 56px);
  --board-h2: clamp(26px, 3.2vw, 44px);
  --board-text: clamp(15px, 1.55vw, 18px);

  --board-card-radius: 12px;
  --board-card-shadow: 0 6px 14px rgba(0,0,0,0.06);
}

/* ---------- Astra container safety (Board only) ---------- */
body.page-id-3086 #primary{
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body.page-id-3086 #primary .ast-container{
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.page-id-3086 #main-content{
  width: 100%;
}

/* ---------- Full-width blocks (no 100vw) ---------- */
body.page-id-3086 :is(
  .board-intro,
  .board-sec2,
  .board-responsibilities,
  .board-members,
  .board-sec5,
  .section-divider
){
  width: 100%;
  margin: 0;
}

/* Divider stays global; add only safety */
body.page-id-3086 .section-divider{ background: var(--c4); }
body.page-id-3086 hr.section-divider__line{
  margin: 0 !important;
  border: none !important;
}

/* ---------- Section backgrounds ---------- */
body.page-id-3086 .board-intro{ background: var(--c7); }
body.page-id-3086 .board-sec2{ background: var(--c5); }
body.page-id-3086 .board-responsibilities{ background: var(--c7); }
body.page-id-3086 .board-members{ background: var(--c5); }
body.page-id-3086 .board-sec5{ background: var(--c7); }

/* ---------- Shared inner containers ---------- */
body.page-id-3086 :is(
  .board-intro__inner,
  .board-sec2__inner,
  .board-responsibilities__inner,
  .board-members__inner,
  .board-sec5__inner
){
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--board-sec-y) var(--board-pad-x);
  text-align: center;
}

@media (max-width: 767px){
  body.page-id-3086 :is(
    .board-intro__inner,
    .board-sec2__inner,
    .board-responsibilities__inner,
    .board-members__inner,
    .board-sec5__inner
  ){
    padding-left: var(--board-pad-x-m);
    padding-right: var(--board-pad-x-m);
    text-align: center;
  }
}

/* ---------- Typography ---------- */
body.page-id-3086 .board-intro__title{
  font-size: var(--board-h1);
  font-weight: 900;
  letter-spacing: -0.45px;
  line-height: 1.06;
  max-width: 22ch;
  margin: 0 auto 14px;
  color: var(--c2);
}

body.page-id-3086 :is(
  .board-sec2__title,
  .board-responsibilities__title,
  .board-members__title,
  .board-sec5__title
){
  font-size: var(--board-h2);
  font-weight: 900;
  letter-spacing: -0.35px;
  line-height: 1.12;
  max-width: 28ch;
  margin: 0 auto 12px;
  color: var(--c2);
}

body.page-id-3086 :is(
  .board-intro__lead,
  .board-intro__text,
  .board-sec2__text,
  .board-responsibilities__lead,
  .board-members__lead,
  .board-sec5__lead,
  .board-sec5__text
){
  font-size: var(--board-text);
  line-height: 1.75;
  color: var(--c3);
  max-width: 78ch;
  margin: 0 auto;
  text-wrap: balance;
}

body.page-id-3086 :is(.board-intro__lead, .board-sec5__lead, .board-members__lead){
  margin-bottom: 18px;
}

body.page-id-3086 :is(.board-intro__text, .board-sec2__text, .board-sec5__text)
+ :is(.board-intro__text, .board-sec2__text, .board-sec5__text){
  margin-top: 16px;
}

/* ---------- Figures (rounded corners guaranteed by wrapper) ---------- */
body.page-id-3086 figure:is(.board-sec2__image, .board-sec5__image){
  margin: clamp(18px, 2.4vw, 28px) auto;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: var(--radius);
  overflow: hidden;
  transform: translateZ(0);
}

body.page-id-3086 figure:is(.board-sec2__image, .board-sec5__image) img{
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 0;
  box-shadow: var(--shadow);
}

/* Section 2 image (portrait): controlled size + clean frame */
body.page-id-3086 figure.board-sec2__image{
  width: min(380px, 92vw);
  aspect-ratio: 4 / 5;
  box-shadow: var(--shadow);
}
body.page-id-3086 figure.board-sec2__image img{
  height: 100%;
  object-fit: cover;
}

/* ---------- Section 3: Responsibilities list ---------- */
body.page-id-3086 .board-list{
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 760px;
  text-align: left;
  display: grid;
  gap: 12px;
}

body.page-id-3086 .board-list li{
  background: var(--c4);
  border-radius: var(--board-card-radius);
  padding: 14px 16px;
  box-shadow: var(--board-card-shadow);
}

/* ---------- Section 4: Members ---------- */
body.page-id-3086 .board-members__lead{ margin-bottom: 32px; }

body.page-id-3086 .board-members__list{
  max-width: 980px;
  margin: 0 auto;
}

/* 2-column on desktop; stacked on small screens */
body.page-id-3086 .board-member{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: start;
  text-align: left;
  margin: 0;
}

body.page-id-3086 .board-member + .board-member-divider{
  margin: 40px 0;
}

@media (max-width: 900px){
  body.page-id-3086 .board-member{
    grid-template-columns: 1fr;
    text-align: center;
    gap: 22px;
  }
}

/* Media box: stable size + rounded wrapper always */
body.page-id-3086 .board-member__media{
  width: 240px;
  aspect-ratio: 4 / 5;
  margin: 0;

  background: transparent;
  padding: 0;

  border-radius: var(--radius);
  overflow: hidden;
  line-height: 0;            /* prevents baseline “sliver” */
  box-shadow: var(--shadow); /* shadow on wrapper */
}

@media (max-width: 900px){
  body.page-id-3086 .board-member__media{
    width: 260px;
    margin: 0 auto;
  }
}
@media (max-width: 767px){
  body.page-id-3086 .board-member__media{ width: 220px; }
}

/* Default member photos: fill the 4/5 card */
body.page-id-3086 .board-member__media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  border-radius: 0;
}

/* Tim: allow auto-height so full image shows AND corners stay rounded */
body.page-id-3086 .board-member__media--tim{
  aspect-ratio: auto;  /* override fixed card ratio */
  height: auto;
}

body.page-id-3086 .board-member__media--tim img{
  width: 100%;
  height: auto;        /* critical: removes forced “fill box” behavior */
  object-fit: contain; /* show full photo */
  object-position: 60% 28%;
}

/* Member text */
body.page-id-3086 .board-member__name{
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 900;
  color: var(--c2);
}

body.page-id-3086 .board-member__role{
  margin: 0 0 12px;
  font-weight: 900;
  color: var(--c1);
  letter-spacing: 0.2px;
}

body.page-id-3086 .board-member__bio{
  margin: 0;
  line-height: 1.7;
  color: var(--c3);
}

/* Divider between members */
body.page-id-3086 .board-member-divider{
  border: none;
  height: 1px;
  background: rgba(0,0,0,0.12);
}

/* ---------- Section 5 ---------- */
body.page-id-3086 .board-sec5__list{
  list-style: none;
  padding: 0;
  margin: 0 auto 16px;
  max-width: 760px;
  display: grid;
  gap: 12px;
  text-align: left;
}

body.page-id-3086 .board-sec5__list li{
  background: var(--c4);
  border-radius: var(--board-card-radius);
  padding: 14px 16px;
  box-shadow: var(--board-card-shadow);
}

/* Section 5 image (landscape): comfortable max height */
body.page-id-3086 figure.board-sec5__image{ max-width: 720px; }
body.page-id-3086 figure.board-sec5__image img{
  max-height: min(52vh, 520px);
  object-fit: contain;
}

/* CTA button */
body.page-id-3086 .board-sec5__cta{
  margin-top: 24px;
  display: flex;
  justify-content: center;
}

body.page-id-3086 .board-sec5__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  border-radius: 10px;
  background: var(--c0);
  color: var(--c4);
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 10px 20px rgba(30,143,139,0.20);
  transition: transform .12s ease, background-color .2s ease;
}

body.page-id-3086 .board-sec5__btn:hover{
  background: var(--c1);
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce){
  body.page-id-3086 .board-sec5__btn{ transition: none; }
}

@media (max-width: 767px){
  body.page-id-3086 .board-sec5__btn{ padding: 12px 22px; }
}

/* =========================================================
   BOARD (3086) — SECTION 1 HERO “POP” + HEADER SPACING
   Paste at the VERY BOTTOM of your board.css
   ========================================================= */

/* Give the hero more separation from the header */
body.page-id-3086 .board-intro__inner{
  /* adds extra top space only for section 1 */
  padding-top: calc(var(--board-sec-y) + clamp(14px, 2vw, 28px));
}

/* Hero background: match the “pop” style used on newer pages */
body.page-id-3086 .board-intro{
  position: relative;
  overflow: hidden;

  /* base stays --c7; overlays are light/shadow only */
  background:
    /* soft vignette */
    radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.05) 100%),

    /* spotlight behind left/center (title area) */
    radial-gradient(circle at 30% 34%, rgba(255,255,255,0.72) 0%, rgba(255,255,255,0.22) 26%, rgba(255,255,255,0) 62%),

    /* secondary spotlight */
    radial-gradient(circle at 74% 40%, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 24%, rgba(255,255,255,0) 58%),

    /* subtle texture */
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04),
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 7px
    ),

    /* base gradient using only --c7 */
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--c7) 74%, white) 0%,
      var(--c7) 62%,
      color-mix(in srgb, var(--c7) 86%, var(--c2)) 100%
    );
}

/* Title polish + on-brand accent line */
body.page-id-3086 .board-intro__title{
  text-shadow: 0 1px 0 rgba(255,255,255,0.25);
  margin-bottom: 10px; /* slightly tighter */
}

/* Keep the hero text feeling crisp */
body.page-id-3086 .board-intro__lead,
body.page-id-3086 .board-intro__text{
  opacity: 0.98;
}

/* Mobile: align like your newer pages */
@media (max-width: 767px){
  body.page-id-3086 .board-intro__inner{
    /* keep the extra top space but don’t overdo it on small screens */
    padding-top: calc(var(--board-sec-y) + 10px);
  }

  body.page-id-3086 .board-intro__title::after{
    margin-left: 0;
    margin-right: 0;
  }
}

/* BOARD (3086) — Jenny crop centering override */
body.page-id-3086 .board-member__media--jenny img{
  /* default was: center 20% */
  object-position: 15% 20%; /* tweak X: 58%–70% until it looks perfect */
}

@media (max-width: 900px){
  body.page-id-3086 .board-member__media--jenny img{
    object-position: 60% 18%;
  }
}

/* =========================================================
   CONTACT — page-id-3098 — FINAL CONSOLIDATED (style.css)
   - Section backgrounds: ONLY --c5 & --c7 alternating
   - Divider remains global (band on --c4 between sections)
   - WPForms styling scoped to Contact only
   Depends on base/root tokens:
   --c0 --c1 --c2 --c3 --c4 --c5 --c7 --radius --shadow --container
   ========================================================= */

/* ---------- Tokens + Astra safety (Contact only) ---------- */
body.page-id-3098{
  --contact-sec-y: clamp(56px, 6vw, 84px);
  --contact-pad-x: 24px;
  --contact-pad-x-m: 16px;

  --contact-h1: clamp(32px, 4.4vw, 48px);
  --contact-h2: clamp(24px, 3vw, 32px);
  --contact-text: clamp(15px, 1.55vw, 18px);

  --contact-card-radius: 12px;
}

body.page-id-3098 #primary{
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body.page-id-3098 #primary .ast-container{
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

body.page-id-3098 #main-content{
  width: 100%;
}

/* ---------- Full-width blocks (no 100vw) ---------- */
body.page-id-3098 :is(.contact-intro, .contact-form, .contact-alt, .section-divider){
  width: 100%;
  margin: 0;
}

/* Divider stays global; add only safety */
body.page-id-3098 .section-divider{ background: var(--c4); }
body.page-id-3098 hr.section-divider__line{ margin: 0 !important; border: none !important; }

/* ---------- Section backgrounds (ONLY c5 & c7) ---------- */
body.page-id-3098 .contact-intro{ background: var(--c7); }
body.page-id-3098 .contact-form{ background: var(--c5); }
body.page-id-3098 .contact-alt{  background: var(--c7); }

/* ---------- Intro (Hero) — make it pop (c7-only overlays) ---------- */
body.page-id-3098 .contact-intro{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.05) 100%),
    radial-gradient(circle at 32% 38%, rgba(255,255,255,0.72) 0%, rgba(255,255,255,0.22) 26%, rgba(255,255,255,0) 62%),
    radial-gradient(circle at 72% 42%, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 24%, rgba(255,255,255,0) 58%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04),
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 7px
    ),
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--c7) 74%, white) 0%,
      var(--c7) 62%,
      color-mix(in srgb, var(--c7) 86%, var(--c2)) 100%
    );
}

/* Ensure hero content sits above overlays */
body.page-id-3098 .contact-intro__inner{
  position: relative;
  z-index: 1;
}

/* ---------- Shared inner containers ---------- */
body.page-id-3098 :is(.contact-intro__inner, .contact-form__inner, .contact-alt__inner){
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--contact-sec-y) var(--contact-pad-x);
  text-align: center;
}

@media (max-width: 767px){
  body.page-id-3098 :is(.contact-intro__inner, .contact-form__inner, .contact-alt__inner){
    padding-left: var(--contact-pad-x-m);
    padding-right: var(--contact-pad-x-m);
    text-align: center;
  }
}

/* ---------- Typography ---------- */
body.page-id-3098 .contact-intro__title{
  font-size: var(--contact-h1);
  font-weight: 900;
  letter-spacing: -0.45px;
  line-height: 1.08;
  max-width: 22ch;
  margin: 0 auto 14px;
  color: var(--c2);
  text-shadow: 0 1px 0 rgba(255,255,255,0.25);
}

body.page-id-3098 :is(.contact-form__title, .contact-alt__title){
  font-size: var(--contact-h2);
  font-weight: 900;
  letter-spacing: -0.35px;
  line-height: 1.12;
  max-width: 28ch;
  margin: 0 auto 12px;
  color: var(--c2);
}

body.page-id-3098 :is(.contact-intro__lead, .contact-form__lead, .contact-alt__lead){
  font-size: var(--contact-text);
  line-height: 1.75;
  color: var(--c3);
  max-width: 78ch;
  margin: 0 auto;
  text-wrap: balance;
}

body.page-id-3098 .contact-intro__lead{ opacity: 0.98; }
body.page-id-3098 .contact-form__lead{ margin-bottom: 24px; }
body.page-id-3098 .contact-alt__lead{  margin-bottom: 24px; }

/* =========================================================
   WPForms — Scoped Styling (CONTACT PAGE ONLY)
   ========================================================= */

/* Keep the form centered within the section */
body.page-id-3098 .contact-form .wpforms-container{
  max-width: 720px;
  margin: 0 auto;
}

/* Force form content left-aligned inside centered section */
body.page-id-3098 .contact-form .wpforms-container,
body.page-id-3098 .contact-form .wpforms-container label,
body.page-id-3098 .contact-form .wpforms-container .wpforms-field-label,
body.page-id-3098 .contact-form .wpforms-container .wpforms-field,
body.page-id-3098 .contact-form .wpforms-container .wpforms-submit-container{
  text-align: left !important;
}

/* Fields */
body.page-id-3098 .contact-form .wpforms-container .wpforms-field :is(
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="password"],
  select,
  textarea
){
  width: 100% !important;
  max-width: 100% !important;
  background: var(--c4) !important;
  color: var(--c3) !important;
  border: 1px solid rgba(47, 58, 58, 0.22) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color .18s ease, box-shadow .18s ease;
}

body.page-id-3098 .contact-form .wpforms-container .wpforms-field textarea{
  min-height: 140px;
  resize: vertical;
}

/* Focus */
body.page-id-3098 .contact-form .wpforms-container .wpforms-field :is(
  input:focus,
  select:focus,
  textarea:focus
){
  border-color: var(--c0) !important;
  box-shadow: 0 0 0 4px rgba(30, 143, 139, 0.16) !important;
}

/* Placeholder */
body.page-id-3098 .contact-form .wpforms-container ::placeholder{
  color: rgba(47, 58, 58, 0.55);
}

/* Errors */
body.page-id-3098 .contact-form .wpforms-container :is(label.wpforms-error, em.wpforms-error){
  color: #b42318 !important;
  font-weight: 900;
}

body.page-id-3098 .contact-form .wpforms-container .wpforms-field.wpforms-has-error :is(input, select, textarea){
  border-color: #b42318 !important;
}

/* Submit */
body.page-id-3098 .contact-form .wpforms-container .wpforms-submit{
  background: var(--c0) !important;
  color: var(--c4) !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 14px 24px !important;
  font-weight: 900 !important;
  box-shadow: 0 10px 20px rgba(30, 143, 139, 0.20) !important;
  transition: background-color .2s ease, transform .12s ease;
}

body.page-id-3098 .contact-form .wpforms-container .wpforms-submit:hover{
  background: var(--c1) !important;
  transform: translateY(-1px);
}

body.page-id-3098 .contact-form .wpforms-container .wpforms-submit:active{
  transform: scale(0.98);
}

@media (max-width: 767px){
  body.page-id-3098 .contact-form .wpforms-container .wpforms-submit{
    width: 100% !important;
  }
}

/* Select: prevent placeholder truncation */
body.page-id-3098 .contact-form .wpforms-container .wpforms-field select{
  min-height: 48px;
  line-height: 1.2;
  padding-right: 52px !important;
  background-position: right 16px center;
}

/* ---------- Section 3 card (centered text) ---------- */
body.page-id-3098 .contact-alt__card{
  max-width: 720px;
  margin: 0 auto;
  background: var(--c4);
  border-radius: var(--contact-card-radius);
  padding: 18px;
  text-align: center;
  box-shadow: var(--shadow);
}

@media (max-width: 767px){
  body.page-id-3098 .contact-alt__card{ padding: 16px; }
}

body.page-id-3098 .contact-alt__org{
  margin: 0 0 8px;
  color: var(--c2);
}

body.page-id-3098 .contact-alt__loc{  margin: 0 0 12px; }
body.page-id-3098 .contact-alt__line{ margin: 0 0 10px; }

body.page-id-3098 .contact-alt__line a{
  display: inline-block;
  text-decoration: none;
  font-weight: 900;
}

body.page-id-3098 .contact-alt__line a:hover{
  text-decoration: underline;
}

/* =========================================================
   CONTACT (3098) — Section 1 spacing below header
   Paste at VERY BOTTOM of contact.css
   ========================================================= */

body.page-id-3098 .contact-intro__inner{
  /* extra breathing room under the header */
  padding-top: calc(var(--contact-sec-y) + clamp(14px, 2vw, 28px));
}

/* Mobile: slightly smaller bump */
@media (max-width: 767px){
  body.page-id-3098 .contact-intro__inner{
    padding-top: calc(var(--contact-sec-y) + 10px);
  }
}

/* =========================================================
   DONATE — page-id-3103 — FINAL CONSOLIDATED (style.css)
   - Section backgrounds: ONLY --c5 & --c7 alternating
   - Divider stays global (band on --c4 between sections)
   - Hero “pop” uses c7-only overlays
   - Section 2 image reduced
   Depends on base/root tokens:
   --c0 --c1 --c2 --c3 --c4 --c5 --c7 --radius --shadow --container
   ========================================================= */

/* ---------- Tokens + Astra safety (Donate only) ---------- */
body.page-id-3103{
  --donate-sec-y: clamp(56px, 6vw, 84px);
  --donate-pad-x: 24px;
  --donate-pad-x-m: 16px;

  --donate-h1: clamp(32px, 4.4vw, 52px);
  --donate-h2: clamp(24px, 3.2vw, 40px);
  --donate-text: clamp(15px, 1.55vw, 18px);

  --donate-card-radius: 12px;
}

body.page-id-3103 #primary{
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body.page-id-3103 #primary .ast-container{
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

body.page-id-3103 #main-content{
  width: 100%;
}

/* ---------- Full-width blocks (no 100vw) ---------- */
body.page-id-3103 :is(
  .donation-hero,
  .donation-sec2,
  .donation-sec3,
  .donation-sec4,
  .section-divider
){
  width: 100%;
  margin: 0;
}

/* ---------- Divider (global styles + safety only) ---------- */
body.page-id-3103 .section-divider{ background: var(--c4); }
body.page-id-3103 hr.section-divider__line{
  margin: 0 !important;
  border: none !important;
}

/* ---------- Section backgrounds (ONLY c5 & c7) ---------- */
body.page-id-3103 .donation-hero{ background: var(--c7); }
body.page-id-3103 .donation-sec2{ background: var(--c5); }
body.page-id-3103 .donation-sec3{ background: var(--c7); }
body.page-id-3103 .donation-sec4{ background: var(--c5); }

/* =========================================================
   DONATE (3103) — Hero: make it pop (c7-only)
   ========================================================= */
body.page-id-3103 .donation-hero{
  position: relative;
  overflow: hidden;

  background:
    radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.05) 100%),
    radial-gradient(circle at 32% 38%, rgba(255,255,255,0.72) 0%, rgba(255,255,255,0.22) 26%, rgba(255,255,255,0) 62%),
    radial-gradient(circle at 74% 40%, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 24%, rgba(255,255,255,0) 58%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04),
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 7px
    ),
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--c7) 74%, white) 0%,
      var(--c7) 62%,
      color-mix(in srgb, var(--c7) 86%, var(--c2)) 100%
    );
}

/* Keep hero content above overlays */
body.page-id-3103 .donation-hero__inner{
  position: relative;
  z-index: 1;
}

body.page-id-3103 .donation-hero__title{
  text-shadow: 0 1px 0 rgba(255,255,255,0.25);
}

body.page-id-3103 :is(.donation-hero__lead, .donation-hero__note){
  opacity: 0.98;
}

/* ---------- Shared inner containers ---------- */
body.page-id-3103 :is(
  .donation-hero__inner,
  .donation-sec2__inner,
  .donation-sec3__inner,
  .donation-sec4__inner
){
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--donate-sec-y) var(--donate-pad-x);
  text-align: center;
}

@media (max-width: 767px){
  body.page-id-3103 :is(
    .donation-hero__inner,
    .donation-sec2__inner,
    .donation-sec3__inner,
    .donation-sec4__inner
  ){
    padding-left: var(--donate-pad-x-m);
    padding-right: var(--donate-pad-x-m);
    text-align: center;
  }
}

/* ---------- Typography ---------- */
body.page-id-3103 .donation-hero__title{
  font-size: var(--donate-h1);
  font-weight: 900;
  letter-spacing: -0.45px;
  line-height: 1.08;
  max-width: 22ch;
  margin: 0 auto 14px;
  color: var(--c2);
}

body.page-id-3103 :is(
  .donation-sec2__title,
  .donation-sec3__title,
  .donation-sec4__title
){
  font-size: var(--donate-h2);
  font-weight: 900;
  letter-spacing: -0.35px;
  line-height: 1.12;
  max-width: 28ch;
  margin: 0 auto 12px;
  color: var(--c2);
}

body.page-id-3103 :is(
  .donation-hero__lead,
  .donation-hero__note,
  .donation-sec2__text,
  .donation-sec3__lead,
  .donation-sec3__note,
  .donation-sec4__text,
  .donation-sec4__closing,
  .donation-sec3__card-text
){
  font-size: var(--donate-text);
  line-height: 1.75;
  color: var(--c3);
  max-width: 78ch;
  margin: 0 auto;
  text-wrap: balance;
}

body.page-id-3103 .donation-hero__lead{ margin-bottom: 16px; }
body.page-id-3103 .donation-sec3__lead{ margin-bottom: 24px; }
body.page-id-3103 .donation-sec3__note{ margin-bottom: 24px; }
body.page-id-3103 .donation-sec4__text{ margin-bottom: 16px; }

/* ---------- Section 2 image (reduced) ---------- */
body.page-id-3103 figure.donation-sec2__image{
  margin: clamp(18px, 2.4vw, 26px) auto;
  padding: 0;
  border: 0;
  background: transparent;

  max-width: clamp(240px, 28vw, 360px);

  border-radius: var(--radius);
  overflow: hidden;
  transform: translateZ(0);
  box-shadow: var(--shadow);
}

body.page-id-3103 figure.donation-sec2__image img{
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 0;
  object-fit: cover;
}

/* ---------- Section 3 cards ---------- */
body.page-id-3103 .donation-sec3__cards{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  max-width: 900px;
  margin: 0 auto 32px;
  text-align: center;
}

@media (max-width: 900px){
  body.page-id-3103 .donation-sec3__cards{
    grid-template-columns: 1fr;
    max-width: 720px;
  }
}

body.page-id-3103 .donation-sec3__card{
  background: var(--c4);
  border-radius: var(--donate-card-radius);
  padding: 18px;
  box-shadow: var(--shadow);
}

@media (max-width: 767px){
  body.page-id-3103 .donation-sec3__card{ padding: 16px; }
}

body.page-id-3103 .donation-sec3__card-title{
  margin: 0 0 8px;
  color: var(--c2);
  font-weight: 900;
  font-size: 16px;
  line-height: 1.4;
}

body.page-id-3103 .donation-sec3__card-text{
  margin: 0 0 12px;
  line-height: 1.7;
}

body.page-id-3103 .donation-sec3__card-link{
  display: inline-flex;
  font-weight: 900;
  text-decoration: none;
  color: var(--c0);
}

body.page-id-3103 .donation-sec3__card-link:hover{
  color: var(--c1);
  text-decoration: underline;
}

/* Section 3 subhead + CTA */
body.page-id-3103 .donation-sec3__subhead{
  margin: 32px auto 10px;
  max-width: 900px;
  color: var(--c2);
  font-weight: 900;
  line-height: 1.2;
}

body.page-id-3103 .donation-sec3__cta{
  margin-top: 4px;
  display: flex;
  justify-content: center;
}

body.page-id-3103 .donation-sec3__button{
  display: inline-flex;
  justify-content: center;
  padding: 14px 24px;
  background: var(--c0);
  color: var(--c4);
  border-radius: 10px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 10px 20px rgba(30,143,139,.2);
  transition: background-color .2s ease, transform .12s ease;
}

body.page-id-3103 .donation-sec3__button:hover{
  background: var(--c1);
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce){
  body.page-id-3103 .donation-sec3__button{ transition: none; }
}

/* =========================================================
   DONATE (3103) — Section 1 spacing below header
   Paste at VERY BOTTOM of donate CSS
   ========================================================= */

body.page-id-3103 .donation-hero__inner{
  /* extra breathing room under the header */
  padding-top: calc(var(--donate-sec-y) + clamp(14px, 2vw, 28px));
}

/* Mobile: slightly smaller bump */
@media (max-width: 767px){
  body.page-id-3103 .donation-hero__inner{
    padding-top: calc(var(--donate-sec-y) + 10px);
  }
}
/* =========================================================
   GLOBAL — Add breathing room before footer
   Applies to custom page templates (last full-width <section>)
   ========================================================= */

:root{ --page-end-space: clamp(28px, 4vw, 60px); }

.site-main > section:last-of-type{
  padding-bottom: calc(var(--page-end-space) + env(safe-area-inset-bottom));
}