/*
 Theme Name:   Voyage Child Theme
 Theme URI:    https://tmgweb.co
 Description:  Voyage Senior Living Centers — Official Child Theme
 Author:       TMG Web
 Author URI:   https://tmgweb.co
 Template:     Divi
 Version:      5.1.0
 Text Domain:  voyage-child
*/

/* ============================================================
   VOYAGE SENIOR LIVING CENTERS
   Child Theme for Divi — v5.1
   Built by TMG Web — tmgweb.co
   ============================================================

   COLOR ROLES
   -----------
   SAGE (#8FBF6A)   — heading italic accents (em), checklist
                      icons, sage background sections
   CORAL (#D4614A)  — CTAs, buttons, badges, eyebrows,
                      interactive elements, card borders

   TABLE OF CONTENTS
   -----------------
   01. CSS Variables
   02. Google Fonts
   03. Base & Reset
   04. Heading Size Utilities
   05. Typography — Body & Links
   06. Divi Typography Overrides
   07. ADA / Accessibility
   08. Buttons
   09. Button Size Modifiers
   10. Spacing Utilities
   11. Section Background Utilities
   12. Section Padding Overrides
   13. Row & Column Utilities
   14. Divider / Line Utilities
   15. Card Utilities
   16. Checklist Utility
   17. Eyebrow / Tag / Badge Utilities
   18. Form Styling
   19. Giving Section Utilities
   20. Testimonial Utilities
   21. Blurb & Icon Module Utilities
   22. Number Counter Utilities
   23. Responsive

   NOTE: Header and footer styling is handled entirely by
   Divi Theme Builder. No header/footer CSS here.

   NOTE ON !important
   ------------------
   Used only where Divi's inline styles or high-specificity
   rules must be overridden. Each use is commented.
   ADA focus states also use !important by necessity.
   Button padding, display, and line-height use !important
   to beat Divi's inline style attributes on the element.
   ============================================================ */


/* -----------------------------------------------------------
   01. CSS VARIABLES
   Change these to rebrand the entire site in minutes.
   ----------------------------------------------------------- */
:root {
  /* Brand Colors */
  --v-teal-light:     #9ec3bb;
  --v-teal-mid:       #779996;
  --v-teal-dark:      #41565d;
  --v-grey:           #555453;

  /* Sage — heading accents, checklist, backgrounds */
  --v-sage:           #8FBF6A;
  --v-sage-light:     #d4edbc;
  --v-sage-dark:      #5a8c3e;

  /* Coral — CTAs, buttons, badges, eyebrows */
  --v-coral:          #D4614A;
  --v-coral-dark:     #B04535;
  --v-coral-light:    #f5e8e5;

  /* Neutrals */
  --v-off-white:      #f8f6f2;
  --v-white:          #ffffff;
  --v-text-dark:      #2a2a2a;
  --v-text-mid:       #555453;
  --v-text-light:     #888888;
  --v-footer-bg:      #2a3a40;

  /* Typography */
  --v-font-display:   'Cormorant Garamond', Georgia, serif;
  --v-font-body:      'Jost', 'Helvetica Neue', Arial, sans-serif;

  /* ── Font Sizes ──────────────────────────────────────────
     Adjust these to change heading & body sizes site-wide.
     These are the base values; responsive rules scale them
     down automatically at the bottom of the file.
  ─────────────────────────────────────────────────────── */
  --v-size-hero:      4.2rem;   /* Homepage hero H1          */
  --v-size-display:   3.2rem;   /* Major section headers      */
  --v-size-xl:        2.5rem;   /* H1 on interior pages       */
  --v-size-lg:        2rem;     /* H2 standard                */
  --v-size-md:        1.5rem;   /* H3 / subhead               */
  --v-size-sm:        1.15rem;  /* H4 / card title            */
  --v-size-xs:        0.95rem;  /* H5 / small labels          */
  --v-size-body:      1rem;     /* Body text                  */
  --v-size-body-sm:   0.9rem;   /* Secondary body text        */
  --v-size-caption:   0.78rem;  /* Captions / legal / meta    */

  /* ── Line Heights ─────────────────────────────────────── */
  --v-lh-tight:       1.1;
  --v-lh-snug:        1.25;
  --v-lh-normal:      1.5;
  --v-lh-relaxed:     1.75;
  --v-lh-loose:       2;

  /* ── Letter Spacing ───────────────────────────────────── */
  --v-ls-tight:      -0.02em;
  --v-ls-normal:      0;
  --v-ls-wide:        0.06em;
  --v-ls-wider:       0.12em;
  --v-ls-widest:      0.2em;

  /* ── Spacing Scale ────────────────────────────────────── */
  --v-space-xs:       8px;
  --v-space-sm:       16px;
  --v-space-md:       32px;
  --v-space-lg:       60px;
  --v-space-xl:       90px;
  --v-space-xxl:      130px;

  /* ── Radius & Shadows ─────────────────────────────────── */
  --v-radius:         12px;
  --v-radius-sm:      6px;
  --v-radius-lg:      24px;
  --v-shadow:         0 4px 24px rgba(0, 0, 0, 0.08);
  --v-shadow-hover:   0 12px 36px rgba(0, 0, 0, 0.14);
  --v-shadow-card:    0 2px 12px rgba(0, 0, 0, 0.06);

  /* ── Transitions ──────────────────────────────────────── */
  --v-transition:     all 0.18s ease;
  --v-transition-slow: all 0.3s ease;

  /* ── Max Width ────────────────────────────────────────── */
  --v-max-width:      1200px;
}


/* -----------------------------------------------------------
   02. GOOGLE FONTS
   ----------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Jost:wght@300;400;500;600&display=swap');


/* -----------------------------------------------------------
   03. BASE & RESET
   ----------------------------------------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--v-font-body);
  color: var(--v-text-dark);
  background: var(--v-white);
  font-size: var(--v-size-body);
  line-height: var(--v-lh-relaxed);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
}

hr {
  border: none;
  border-top: 1px solid rgba(65, 86, 93, 0.15);
  margin: var(--v-space-md) 0;
}


/* -----------------------------------------------------------
   04. HEADING SIZE UTILITIES
   Apply as CSS Class on any Divi Text or Blurb module to
   override the font size without touching the Design tab.

   Classes:
     .h-hero       — giant homepage hero heading
     .h-display    — large section headline
     .h-xl         — interior page H1
     .h-lg         — standard H2
     .h-md         — H3 / subhead
     .h-sm         — H4 / card title
     .h-xs         — H5 / small labels

   Weight modifiers (combine with any size class):
     .fw-light     — font-weight 300
     .fw-normal    — font-weight 400
     .fw-medium    — font-weight 500
     .fw-semibold  — font-weight 600

   Alignment modifiers:
     .text-center  — centered
     .text-left    — left aligned
     .text-right   — right aligned
   ----------------------------------------------------------- */

/* Size classes — override Divi's Design tab inline font-size */
.et_pb_module.h-hero h1,
.et_pb_module.h-hero h2,
.h-hero h1, .h-hero h2 {
  font-size: var(--v-size-hero) !important; /* beats Divi inline style */
  line-height: var(--v-lh-tight);
}

.et_pb_module.h-display h1,
.et_pb_module.h-display h2,
.h-display h1, .h-display h2 {
  font-size: var(--v-size-display) !important;
  line-height: var(--v-lh-tight);
}

.et_pb_module.h-xl h1,
.et_pb_module.h-xl h2,
.h-xl h1, .h-xl h2 {
  font-size: var(--v-size-xl) !important;
  line-height: var(--v-lh-snug);
}

.et_pb_module.h-lg h2,
.et_pb_module.h-lg h3,
.h-lg h2, .h-lg h3 {
  font-size: var(--v-size-lg) !important;
  line-height: var(--v-lh-snug);
}

.et_pb_module.h-md h3,
.et_pb_module.h-md h4,
.h-md h3, .h-md h4 {
  font-size: var(--v-size-md) !important;
  line-height: var(--v-lh-normal);
}

.et_pb_module.h-sm h4,
.et_pb_module.h-sm h5,
.h-sm h4, .h-sm h5 {
  font-size: var(--v-size-sm) !important;
  line-height: var(--v-lh-normal);
}

.et_pb_module.h-xs h5,
.et_pb_module.h-xs h6,
.h-xs h5, .h-xs h6 {
  font-size: var(--v-size-xs) !important;
}

/* Font-weight modifiers */
.fw-light    { font-weight: 300 !important; }
.fw-normal   { font-weight: 400 !important; }
.fw-medium   { font-weight: 500 !important; }
.fw-semibold { font-weight: 600 !important; }

/* Text alignment helpers */
.text-center, .et_pb_module.text-center { text-align: center; }
.text-left,   .et_pb_module.text-left   { text-align: left; }
.text-right,  .et_pb_module.text-right  { text-align: right; }

/* Tighten / loosen line-height on headings */
.lh-tight   h1, .lh-tight   h2, .lh-tight   h3 { line-height: var(--v-lh-tight)   !important; }
.lh-snug    h1, .lh-snug    h2, .lh-snug    h3 { line-height: var(--v-lh-snug)    !important; }
.lh-relaxed h1, .lh-relaxed h2, .lh-relaxed h3 { line-height: var(--v-lh-relaxed) !important; }


/* -----------------------------------------------------------
   05. TYPOGRAPHY — BODY & LINKS
   ----------------------------------------------------------- */

h1, h2, h3,
.et_pb_text h1,
.et_pb_text h2,
.et_pb_text h3 {
  font-family: var(--v-font-display);
  font-weight: 300;
  line-height: var(--v-lh-snug);
  color: var(--v-teal-dark);
}

h4, h5, h6,
.et_pb_text h4,
.et_pb_text h5,
.et_pb_text h6 {
  font-family: var(--v-font-body);
  font-weight: 600;
  line-height: var(--v-lh-normal);
  color: var(--v-text-dark);
}

/* Italic em inside display headings = sage accent */
h1 em, h2 em, h3 em,
.et_pb_text h1 em,
.et_pb_text h2 em,
.et_pb_text h3 em {
  font-style: italic;
  color: var(--v-sage);
}

p,
.et_pb_text_inner p {
  font-family: var(--v-font-body);
  font-weight: 300;
  font-size: var(--v-size-body);
  line-height: var(--v-lh-relaxed);
}

/* Utility: larger intro paragraph */
.et_pb_text.p-intro .et_pb_text_inner p,
.p-intro p {
  font-size: 1.15rem;
  line-height: var(--v-lh-relaxed);
  font-weight: 300;
  color: var(--v-text-mid);
}

/* Utility: small body text */
.et_pb_text.p-sm .et_pb_text_inner p,
.p-sm p {
  font-size: var(--v-size-body-sm);
}

/* Utility: caption / legal / meta */
.et_pb_text.p-caption .et_pb_text_inner p,
.p-caption p {
  font-size: var(--v-size-caption);
  color: var(--v-text-light);
  line-height: var(--v-lh-normal);
}

/* Inline links in content */
.et_pb_text_inner a,
#main-content a {
  color: var(--v-coral-dark);
  text-decoration: underline;
  text-decoration-color: rgba(176, 69, 53, 0.35);
  text-underline-offset: 2px;
  transition: var(--v-transition);
}
.et_pb_text_inner a:hover,
#main-content a:hover {
  color: var(--v-teal-dark);
  text-decoration-color: rgba(65, 86, 93, 0.4);
}

/* Lists inside text modules */
.et_pb_text_inner ul,
.et_pb_text_inner ol {
  font-family: var(--v-font-body);
  font-weight: 300;
  font-size: var(--v-size-body);
  line-height: var(--v-lh-relaxed);
  padding-left: 1.5em;
}
.et_pb_text_inner ul li,
.et_pb_text_inner ol li {
  margin-bottom: 6px;
}


/* -----------------------------------------------------------
   06. DIVI TYPOGRAPHY OVERRIDES
   These override Divi's default font assignments so your
   CSS variables (not Divi's theme customizer) control the
   look. Add or remove selectors as needed.
   ----------------------------------------------------------- */

/* Force display font on all Divi heading elements */
.et_pb_module h1,
.et_pb_module h2,
.et_pb_module h3,
.et_pb_blurb_title,
.et_pb_slide_title,
.et_pb_cta_title,
.et_pb_portfolio_title,
.et_pb_team_member_name {
  font-family: var(--v-font-display);
  font-weight: 300;
}

/* Force body font on all other text elements */
.et_pb_module h4,
.et_pb_module h5,
.et_pb_module h6,
.et_pb_module p,
.et_pb_module ul,
.et_pb_module ol,
.et_pb_module a,
.et_pb_blurb_content p,
.et_pb_slide_description p,
.et_pb_cta_description p,
.et_pb_testimonial_description p,
.et_pb_team_member_description p,
.et_pb_accordion_title,
.et_pb_toggle_title {
  font-family: var(--v-font-body);
}

/* Blurb titles default size */
.et_pb_blurb_title {
  font-size: var(--v-size-md);
  color: var(--v-teal-dark);
  margin-bottom: 10px;
}

/* Accordion / toggle title */
.et_pb_accordion_title,
.et_pb_toggle_title {
  font-size: var(--v-size-sm);
  font-weight: 600;
  color: var(--v-teal-dark);
  letter-spacing: var(--v-ls-normal);
}

/* Tab titles */
.et_pb_tab_title {
  font-family: var(--v-font-body);
  font-size: var(--v-size-body-sm);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--v-ls-wide);
}

/* Pricing table */
.et_pb_pricing_heading .et_pb_plan_title {
  font-family: var(--v-font-display);
  font-size: var(--v-size-lg);
  font-weight: 300;
  color: var(--v-teal-dark);
}

/* Number counter value */
.et_pb_counter_amount,
.et_pb_number_counter .title {
  font-family: var(--v-font-display);
  font-weight: 300;
  color: var(--v-teal-dark);
}


/* -----------------------------------------------------------
   07. ADA / ACCESSIBILITY
   !important is required — focus states must never be
   stripped by Divi or browser resets.
   ----------------------------------------------------------- */

.skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  background: var(--v-coral-dark);
  color: var(--v-white);
  padding: 10px 20px;
  border-radius: 0 0 6px 6px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  z-index: 9999;
  transition: top 0.2s;
}
.skip-link:focus {
  top: 0 !important;
}

*:focus-visible {
  outline: 3px solid var(--v-coral-dark) !important;
  outline-offset: 3px !important;
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[tabindex]:focus {
  outline: 3px solid var(--v-coral-dark) !important;
  outline-offset: 3px !important;
}

.et_pb_button:focus,
.et_pb_module a:focus {
  outline: 3px solid var(--v-coral-dark) !important;
  outline-offset: 3px !important;
}

/* Screen-reader-only utility */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* -----------------------------------------------------------
   08. BUTTONS
   Apply color classes in Divi → Advanced → CSS Class.

   IMPORTANT WORKFLOW NOTE:
   Do NOT set top/bottom padding in the Divi Design tab.
   This stylesheet fully owns button padding. Left/right
   padding in the Design tab is also unnecessary — set
   it here via btn-sm / btn-lg or edit the base below.

   Color classes:
   btn-primary       coral bg, white text — main CTAs
   btn-teal          teal-dark bg, white text
   btn-outline       transparent, white border (dark sections)
   btn-teal-outline  transparent, teal border (light sections)
   btn-coral-outline transparent, coral border
   btn-sage          sage bg, dark text
   btn-dark          dark bg, sage text
   btn-donate        coral, for giving sections
   btn-ghost         no border/bg, coral text, underline on hover
   ----------------------------------------------------------- */

/* ── Base button reset ──────────────────────────────────────
   All !important below beat Divi's inline style="" attributes
   written directly on the element at render time.
   Without !important these declarations always lose.
   ─────────────────────────────────────────────────────────── */
.et_pb_button {
  font-family: var(--v-font-body) !important;
  font-weight: 600 !important;
  letter-spacing: var(--v-ls-wider) !important;
  text-transform: uppercase !important;
  border-radius: var(--v-radius-sm) !important;
  transition: var(--v-transition) !important;

  /* Flexbox centering — replaces Divi's broken line-height hack */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;

  /* Padding fully owned here — leave Design tab blank for top/bottom.
     To adjust button size use btn-sm / btn-lg classes instead. */
  padding-top: 15px !important;
  padding-bottom: 15px !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  min-height: 44px !important;
  height: auto !important;
}

/* Divi 5 wraps button text in this span. Neutralize it
   so it doesn't add its own offset inside the flex container. */
.et_pb_button .et_pb_button_inner {
  display: inline !important;
  line-height: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  position: static !important;
}

/* Full arrow kill — display:none alone isn't enough.
   Divi's JS can inject the ::after element and reserve
   box space for it even when hidden. content:none removes
   it from the layout entirely. Targeting ::before as well
   since some Divi versions use that instead. */
.et_pb_button::before,
.et_pb_button::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  position: absolute !important;
}

/* ── Primary (Coral) ── */
.et_pb_button.btn-primary,
a.btn-primary {
  background: var(--v-coral-dark) !important;
  color: var(--v-white) !important;
  border: 2px solid var(--v-coral-dark) !important;
}
.et_pb_button.btn-primary:hover,
a.btn-primary:hover {
  background: #963a2d !important;
  border-color: #963a2d !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(176, 69, 53, 0.3);
}

/* ── Teal ── */
.et_pb_button.btn-teal,
a.btn-teal {
  background: var(--v-teal-dark) !important;
  color: var(--v-white) !important;
  border: 2px solid var(--v-teal-dark) !important;
}
.et_pb_button.btn-teal:hover,
a.btn-teal:hover {
  background: #344850 !important;
  border-color: #344850 !important;
  transform: translateY(-1px);
}

/* ── Outline White (for dark section backgrounds) ── */
.et_pb_button.btn-outline,
a.btn-outline {
  background: transparent !important;
  color: var(--v-white) !important;
  border: 2px solid rgba(255, 255, 255, 0.55) !important;
}
.et_pb_button.btn-outline:hover,
a.btn-outline:hover {
  border-color: rgba(255, 255, 255, 0.9) !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* ── Outline Teal (for light/white section backgrounds) ── */
.et_pb_button.btn-teal-outline,
a.btn-teal-outline {
  background: transparent !important;
  color: var(--v-teal-dark) !important;
  border: 2px solid var(--v-teal-dark) !important;
}
.et_pb_button.btn-teal-outline:hover,
a.btn-teal-outline:hover {
  background: rgba(65, 86, 93, 0.08) !important;
}

/* ── Outline Coral (for white/light backgrounds) ── */
.et_pb_button.btn-coral-outline,
a.btn-coral-outline {
  background: transparent !important;
  color: var(--v-coral-dark) !important;
  border: 2px solid var(--v-coral-dark) !important;
}
.et_pb_button.btn-coral-outline:hover,
a.btn-coral-outline:hover {
  background: var(--v-coral-light) !important;
}

/* ── Sage ── */
.et_pb_button.btn-sage,
a.btn-sage {
  background: var(--v-sage) !important;
  color: var(--v-text-dark) !important;
  border: 2px solid var(--v-sage) !important;
}
.et_pb_button.btn-sage:hover,
a.btn-sage:hover {
  background: #7aad54 !important;
  border-color: #7aad54 !important;
}

/* ── Dark ── */
.et_pb_button.btn-dark,
a.btn-dark {
  background: var(--v-text-dark) !important;
  color: var(--v-sage) !important;
  border: 2px solid var(--v-text-dark) !important;
}
.et_pb_button.btn-dark:hover,
a.btn-dark:hover {
  background: var(--v-teal-dark) !important;
  border-color: var(--v-teal-dark) !important;
}

/* ── Donate ── */
.et_pb_button.btn-donate,
a.btn-donate {
  background: var(--v-coral-dark) !important;
  color: var(--v-white) !important;
  border: 2px solid var(--v-coral-dark) !important;
  letter-spacing: var(--v-ls-widest) !important;
}
.et_pb_button.btn-donate:hover,
a.btn-donate:hover {
  background: #963a2d !important;
  border-color: #963a2d !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(176, 69, 53, 0.35);
}

/* ── Ghost ── */
.et_pb_button.btn-ghost,
a.btn-ghost {
  background: transparent !important;
  color: var(--v-coral-dark) !important;
  border: 2px solid transparent !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-decoration: none;
}
.et_pb_button.btn-ghost:hover,
a.btn-ghost:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}


/* -----------------------------------------------------------
   09. BUTTON SIZE MODIFIERS
   Combine with any button color class above.
   These override the base padding values.

   btn-sm         — compact
   btn-lg         — large
   btn-full       — full-width (any screen)
   btn-full-mobile — full-width on mobile only (see Section 23)
   ----------------------------------------------------------- */

.et_pb_button.btn-sm,
a.btn-sm {
  font-size: 0.72rem !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  min-height: 36px !important;
  letter-spacing: var(--v-ls-wider) !important;
}

.et_pb_button.btn-lg,
a.btn-lg {
  font-size: 0.85rem !important;
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  padding-left: 44px !important;
  padding-right: 44px !important;
  min-height: 54px !important;
  letter-spacing: var(--v-ls-widest) !important;
}

.et_pb_button.btn-full,
a.btn-full {
  display: flex !important;
  width: 100%;
}


/* -----------------------------------------------------------
   10. SPACING UTILITIES
   Apply on Divi sections, rows, or modules.

   Padding Top / Bottom:
     .pt-0  .pt-xs  .pt-sm  .pt-md  .pt-lg  .pt-xl  .pt-xxl
     .pb-0  .pb-xs  .pb-sm  .pb-md  .pb-lg  .pb-xl  .pb-xxl

   Margin Top / Bottom (modules):
     .mt-0  .mt-xs  .mt-sm  .mt-md  .mt-lg  .mt-xl
     .mb-0  .mb-xs  .mb-sm  .mb-md  .mb-lg  .mb-xl

   !important is required to beat Divi's inline padding.
   ----------------------------------------------------------- */

/* ── Section Padding Top ── */
.et_pb_section.pt-0   { padding-top: 0 !important; }
.et_pb_section.pt-xs  { padding-top: var(--v-space-xs)  !important; }
.et_pb_section.pt-sm  { padding-top: var(--v-space-sm)  !important; }
.et_pb_section.pt-md  { padding-top: var(--v-space-md)  !important; }
.et_pb_section.pt-lg  { padding-top: var(--v-space-lg)  !important; }
.et_pb_section.pt-xl  { padding-top: var(--v-space-xl)  !important; }
.et_pb_section.pt-xxl { padding-top: var(--v-space-xxl) !important; }

/* ── Row Padding Top ── */
.et_pb_row.pt-0   { padding-top: 0 !important; }
.et_pb_row.pt-xs  { padding-top: var(--v-space-xs)  !important; }
.et_pb_row.pt-sm  { padding-top: var(--v-space-sm)  !important; }
.et_pb_row.pt-md  { padding-top: var(--v-space-md)  !important; }
.et_pb_row.pt-lg  { padding-top: var(--v-space-lg)  !important; }
.et_pb_row.pt-xl  { padding-top: var(--v-space-xl)  !important; }

/* ── Section Padding Bottom ── */
.et_pb_section.pb-0   { padding-bottom: 0 !important; }
.et_pb_section.pb-xs  { padding-bottom: var(--v-space-xs)  !important; }
.et_pb_section.pb-sm  { padding-bottom: var(--v-space-sm)  !important; }
.et_pb_section.pb-md  { padding-bottom: var(--v-space-md)  !important; }
.et_pb_section.pb-lg  { padding-bottom: var(--v-space-lg)  !important; }
.et_pb_section.pb-xl  { padding-bottom: var(--v-space-xl)  !important; }
.et_pb_section.pb-xxl { padding-bottom: var(--v-space-xxl) !important; }

/* ── Row Padding Bottom ── */
.et_pb_row.pb-0   { padding-bottom: 0 !important; }
.et_pb_row.pb-xs  { padding-bottom: var(--v-space-xs)  !important; }
.et_pb_row.pb-sm  { padding-bottom: var(--v-space-sm)  !important; }
.et_pb_row.pb-md  { padding-bottom: var(--v-space-md)  !important; }
.et_pb_row.pb-lg  { padding-bottom: var(--v-space-lg)  !important; }
.et_pb_row.pb-xl  { padding-bottom: var(--v-space-xl)  !important; }

/* ── Module Margin Top ── */
.et_pb_module.mt-0  { margin-top: 0 !important; }
.et_pb_module.mt-xs { margin-top: var(--v-space-xs) !important; }
.et_pb_module.mt-sm { margin-top: var(--v-space-sm) !important; }
.et_pb_module.mt-md { margin-top: var(--v-space-md) !important; }
.et_pb_module.mt-lg { margin-top: var(--v-space-lg) !important; }
.et_pb_module.mt-xl { margin-top: var(--v-space-xl) !important; }

/* ── Module Margin Bottom ── */
.et_pb_module.mb-0  { margin-bottom: 0 !important; }
.et_pb_module.mb-xs { margin-bottom: var(--v-space-xs) !important; }
.et_pb_module.mb-sm { margin-bottom: var(--v-space-sm) !important; }
.et_pb_module.mb-md { margin-bottom: var(--v-space-md) !important; }
.et_pb_module.mb-lg { margin-bottom: var(--v-space-lg) !important; }
.et_pb_module.mb-xl { margin-bottom: var(--v-space-xl) !important; }

/* ── Zero column gap ── */
.et_pb_row.gap-0 .et_pb_column { padding: 0 !important; }

/* ── Narrow content row ── */
.et_pb_row.row-narrow {
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ── Wide content row ── */
.et_pb_row.row-wide { max-width: 1400px !important; }


/* -----------------------------------------------------------
   11. SECTION BACKGROUND UTILITIES
   Apply as CSS Class on any Divi section.
   ----------------------------------------------------------- */

/* ── Teal dark ── */
.et_pb_section.bg-teal { background-color: var(--v-teal-dark); }
.et_pb_section.bg-teal h1,
.et_pb_section.bg-teal h2,
.et_pb_section.bg-teal h3,
.et_pb_section.bg-teal .et_pb_blurb_title { color: var(--v-white); }
.et_pb_section.bg-teal h1 em,
.et_pb_section.bg-teal h2 em,
.et_pb_section.bg-teal h3 em { color: var(--v-sage); }
.et_pb_section.bg-teal p,
.et_pb_section.bg-teal .et_pb_blurb_content p { color: rgba(255, 255, 255, 0.75); }

/* ── Deep teal (footer weight) ── */
.et_pb_section.bg-teal-deep { background-color: var(--v-footer-bg); }
.et_pb_section.bg-teal-deep h1,
.et_pb_section.bg-teal-deep h2,
.et_pb_section.bg-teal-deep h3,
.et_pb_section.bg-teal-deep .et_pb_blurb_title { color: var(--v-white); }
.et_pb_section.bg-teal-deep h1 em,
.et_pb_section.bg-teal-deep h2 em,
.et_pb_section.bg-teal-deep h3 em { color: var(--v-sage); }
.et_pb_section.bg-teal-deep p,
.et_pb_section.bg-teal-deep .et_pb_blurb_content p { color: rgba(255, 255, 255, 0.65); }

/* ── Sage ── */
.et_pb_section.bg-sage { background-color: var(--v-sage); }
.et_pb_section.bg-sage h1,
.et_pb_section.bg-sage h2,
.et_pb_section.bg-sage h3 { color: var(--v-text-dark); }
.et_pb_section.bg-sage h1 em,
.et_pb_section.bg-sage h2 em,
.et_pb_section.bg-sage h3 em { color: var(--v-teal-dark); }
.et_pb_section.bg-sage p { color: var(--v-text-dark); opacity: 0.82; }

/* ── Other backgrounds ── */
.et_pb_section.bg-sage-light   { background-color: var(--v-sage-light); }
.et_pb_section.bg-coral-light  { background-color: var(--v-coral-light); }
.et_pb_section.bg-off-white    { background-color: var(--v-off-white); }
.et_pb_section.bg-white        { background-color: var(--v-white); }

/* ── Gradients ── */
.et_pb_section.bg-gradient-teal {
  background: linear-gradient(135deg, var(--v-teal-dark) 0%, var(--v-footer-bg) 100%);
}
.et_pb_section.bg-gradient-soft {
  background: linear-gradient(160deg, var(--v-off-white) 0%, var(--v-sage-light) 100%);
}


/* -----------------------------------------------------------
   12. SECTION PADDING OVERRIDES
   ----------------------------------------------------------- */

.et_pb_section.section-tight {
  padding-top: var(--v-space-md) !important;
  padding-bottom: var(--v-space-md) !important;
}
.et_pb_section.section-compact {
  padding-top: var(--v-space-sm) !important;
  padding-bottom: var(--v-space-sm) !important;
}
.et_pb_section.section-flush {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.et_pb_section.section-hero {
  padding-top: var(--v-space-xxl) !important;
  padding-bottom: var(--v-space-xxl) !important;
}


/* -----------------------------------------------------------
   13. ROW & COLUMN UTILITIES
   ----------------------------------------------------------- */

.et_pb_row.no-gutter { column-gap: 0; }
.et_pb_row.no-gutter .et_pb_column {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.et_pb_column.valign-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.et_pb_column.col-divider-right {
  border-right: 1px solid rgba(65, 86, 93, 0.15);
}

.et_pb_column.col-sticky > .et_pb_module {
  position: sticky;
  top: 100px;
}

.et_pb_column.col-rounded {
  border-radius: var(--v-radius);
  overflow: hidden;
}

.et_pb_column.col-accent-teal {
  border-left: 4px solid var(--v-teal-dark);
  padding-left: 24px !important;
}

.et_pb_column.col-accent-coral {
  border-left: 4px solid var(--v-coral);
  padding-left: 24px !important;
}


/* -----------------------------------------------------------
   14. DIVIDER / LINE UTILITIES
   Apply as CSS Class on a Divi Divider module.

   div-teal          teal-dark solid line
   div-coral         coral solid line
   div-sage          sage solid line
   div-light         light grey
   div-white         white (for dark backgrounds)
   div-thick         3px weight
   div-thin          0.5px weight
   div-dashed        dashed style
   div-dots          dotted style
   div-ornament      decorative centered diamond
   div-accent        short coral left-aligned line
   div-accent-center short coral centered line
   ----------------------------------------------------------- */

.et_pb_divider.div-teal  .et_pb_divider_internal { border-color: var(--v-teal-dark)         !important; }
.et_pb_divider.div-coral .et_pb_divider_internal { border-color: var(--v-coral)              !important; }
.et_pb_divider.div-sage  .et_pb_divider_internal { border-color: var(--v-sage)               !important; }
.et_pb_divider.div-light .et_pb_divider_internal { border-color: rgba(65, 86, 93, 0.15)      !important; }
.et_pb_divider.div-white .et_pb_divider_internal { border-color: rgba(255, 255, 255, 0.3)    !important; }

.et_pb_divider.div-thick  .et_pb_divider_internal { border-width: 3px    !important; }
.et_pb_divider.div-thin   .et_pb_divider_internal { border-width: 0.5px  !important; }
.et_pb_divider.div-dashed .et_pb_divider_internal { border-style: dashed !important; }
.et_pb_divider.div-dots   .et_pb_divider_internal { border-style: dotted !important; }

.et_pb_divider.div-ornament { position: relative; text-align: center; }
.et_pb_divider.div-ornament .et_pb_divider_internal { border-color: var(--v-teal-light) !important; }
.et_pb_divider.div-ornament::before {
  content: '◆';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  background: var(--v-white);
  color: var(--v-teal-light);
  font-size: 0.6rem;
  padding: 0 10px;
  line-height: 1;
}

.et_pb_divider.div-accent { max-width: 48px; margin-left: 0 !important; }
.et_pb_divider.div-accent-center {
  max-width: 48px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.et_pb_divider.div-accent .et_pb_divider_internal,
.et_pb_divider.div-accent-center .et_pb_divider_internal {
  border-color: var(--v-coral) !important;
  border-width: 2px !important;
}


/* -----------------------------------------------------------
   15. CARD UTILITIES
   ----------------------------------------------------------- */

.v-card {
  background: var(--v-white);
  border-radius: var(--v-radius);
  overflow: hidden;
  box-shadow: var(--v-shadow);
  transition: var(--v-transition-slow);
}
.v-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--v-shadow-hover);
}

.v-location-card {
  background: var(--v-white);
  border-radius: var(--v-radius);
  overflow: hidden;
  box-shadow: var(--v-shadow);
  border-top: 3px solid var(--v-coral);
  transition: var(--v-transition-slow);
}
.v-location-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--v-shadow-hover);
}

.v-giving-card {
  background: var(--v-white);
  border-radius: var(--v-radius);
  box-shadow: var(--v-shadow);
  border-left: 4px solid var(--v-coral);
  transition: var(--v-transition-slow);
}
.v-giving-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--v-shadow-hover);
}

.v-service-card {
  background: var(--v-white);
  border-radius: var(--v-radius);
  overflow: hidden;
  box-shadow: var(--v-shadow-card);
  border-top: 3px solid var(--v-teal-dark);
  transition: var(--v-transition-slow);
}
.v-service-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--v-shadow-hover);
}

.v-card-flat {
  background: var(--v-white);
  border-radius: var(--v-radius);
  border: 1px solid rgba(65, 86, 93, 0.12);
  transition: var(--v-transition-slow);
}
.v-card-flat:hover {
  border-color: var(--v-teal-light);
  box-shadow: var(--v-shadow-card);
}

/* Image zoom on card hover */
.v-card .et_pb_image img,
.v-location-card .et_pb_image img,
.v-service-card .et_pb_image img { transition: transform 0.4s ease; }
.v-card:hover .et_pb_image img,
.v-location-card:hover .et_pb_image img,
.v-service-card:hover .et_pb_image img { transform: scale(1.05); }


/* -----------------------------------------------------------
   16. CHECKLIST UTILITY
   Apply "v-checklist" as CSS Class on a Divi Text module.
   ----------------------------------------------------------- */

.et_pb_text.v-checklist ul {
  list-style: none;
  padding: 0;
  margin: 16px 0 24px;
}
.et_pb_text.v-checklist ul li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--v-size-body-sm);
  color: var(--v-text-dark);
  font-weight: 400;
  margin-bottom: 10px;
  line-height: 1.55;
  padding: 0;
}
.et_pb_text.v-checklist ul li::before {
  content: '✓';
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  min-width: 20px;
  background: var(--v-teal-dark);
  color: var(--v-sage);
  border-radius: 50%;
  font-size: 0.6rem;
  font-weight: 700;
  margin-top: 2px;
  flex-shrink: 0;
}

/* On sage backgrounds */
.et_pb_section.bg-sage .et_pb_text.v-checklist ul li::before {
  background: var(--v-white);
  color: var(--v-teal-dark);
}

/* On dark/teal backgrounds */
.et_pb_section.bg-teal .et_pb_text.v-checklist ul li,
.et_pb_section.bg-teal-deep .et_pb_text.v-checklist ul li { color: rgba(255, 255, 255, 0.85); }
.et_pb_section.bg-teal .et_pb_text.v-checklist ul li::before,
.et_pb_section.bg-teal-deep .et_pb_text.v-checklist ul li::before {
  background: var(--v-sage);
  color: var(--v-teal-dark);
}

/* Larger checklist variant — add both classes: v-checklist checklist-lg */
.et_pb_text.v-checklist.checklist-lg ul li {
  font-size: var(--v-size-body);
  gap: 14px;
  margin-bottom: 14px;
}
.et_pb_text.v-checklist.checklist-lg ul li::before {
  width: 26px; height: 26px;
  min-width: 26px;
  font-size: 0.7rem;
}


/* -----------------------------------------------------------
   17. EYEBROW / TAG / BADGE UTILITIES
   ----------------------------------------------------------- */

.et_pb_text.v-eyebrow .et_pb_text_inner p {
  font-family: var(--v-font-body);
  font-size: var(--v-size-caption);
  font-weight: 600;
  letter-spacing: var(--v-ls-widest);
  text-transform: uppercase;
  color: var(--v-coral-dark);
  margin-bottom: 0;
}

.et_pb_text.v-eyebrow-teal .et_pb_text_inner p {
  font-family: var(--v-font-body);
  font-size: var(--v-size-caption);
  font-weight: 600;
  letter-spacing: var(--v-ls-widest);
  text-transform: uppercase;
  color: var(--v-teal-mid);
  margin-bottom: 0;
}

.et_pb_text.v-eyebrow-light .et_pb_text_inner p {
  font-family: var(--v-font-body);
  font-size: var(--v-size-caption);
  font-weight: 600;
  letter-spacing: var(--v-ls-widest);
  text-transform: uppercase;
  color: var(--v-coral);
  margin-bottom: 0;
}

/* v-tag — coral pill */
.et_pb_text.v-tag .et_pb_text_inner,
.et_pb_text.v-tag .et_pb_text_inner p {
  display: inline-block;
  background: var(--v-coral-light);
  color: var(--v-coral-dark);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: var(--v-ls-wider);
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 10px;
  line-height: 1.8;
}

/* v-tag-teal — teal pill */
.et_pb_text.v-tag-teal .et_pb_text_inner,
.et_pb_text.v-tag-teal .et_pb_text_inner p {
  display: inline-block;
  background: rgba(158, 195, 187, 0.25);
  color: var(--v-teal-dark);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: var(--v-ls-wider);
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 10px;
  line-height: 1.8;
}

/* v-badge — filled coral pill */
.et_pb_text.v-badge .et_pb_text_inner,
.et_pb_text.v-badge .et_pb_text_inner p {
  display: inline-block;
  background: var(--v-coral-dark);
  color: var(--v-white);
  font-family: var(--v-font-body);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: var(--v-ls-wide);
  text-transform: uppercase;
  padding: 4px 11px;
  border-radius: 20px;
  margin: 0;
}

/* v-badge-teal — filled teal pill */
.et_pb_text.v-badge-teal .et_pb_text_inner,
.et_pb_text.v-badge-teal .et_pb_text_inner p {
  display: inline-block;
  background: var(--v-teal-dark);
  color: var(--v-white);
  font-family: var(--v-font-body);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: var(--v-ls-wide);
  text-transform: uppercase;
  padding: 4px 11px;
  border-radius: 20px;
  margin: 0;
}

/* v-stars */
.et_pb_text.v-stars .et_pb_text_inner,
.et_pb_text.v-stars .et_pb_text_inner p {
  color: var(--v-coral);
  font-size: 0.85rem;
  letter-spacing: 3px;
  margin: 0;
}

/* v-501c3-note */
.et_pb_text.v-501c3-note .et_pb_text_inner p {
  font-size: var(--v-size-caption);
  color: rgba(255, 255, 255, 0.4);
  text-align: center;
  margin: 0;
  font-weight: 300;
}


/* -----------------------------------------------------------
   18. FORM STYLING
   Overrides Divi contact/opt-in defaults.
   Also applies to WPForms and CF7 if used.
   ----------------------------------------------------------- */

.et_pb_contact_form_container input[type="text"],
.et_pb_contact_form_container input[type="email"],
.et_pb_contact_form_container input[type="tel"],
.et_pb_contact_form_container textarea,
.et_pb_newsletter_form input[type="text"],
.et_pb_newsletter_form input[type="email"],
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea,
select {
  font-family: var(--v-font-body);
  font-size: var(--v-size-body-sm);
  font-weight: 300;
  color: var(--v-text-dark);
  background: var(--v-white);
  border: 1.5px solid rgba(65, 86, 93, 0.25);
  border-radius: var(--v-radius-sm);
  padding: 12px 16px;
  transition: border-color 0.18s, box-shadow 0.18s;
  width: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
  border-color: var(--v-teal-dark);
  box-shadow: 0 0 0 3px rgba(65, 86, 93, 0.12);
}

.et_pb_contact_form_container label,
label {
  font-family: var(--v-font-body);
  font-size: var(--v-size-body-sm);
  font-weight: 600;
  color: var(--v-text-dark);
  display: block;
  margin-bottom: 6px;
}

input::placeholder,
textarea::placeholder {
  color: var(--v-text-light);
  font-weight: 300;
}

.et_pb_contact_form_container input[type="submit"],
.et_pb_newsletter_form input[type="submit"],
.et_pb_contact_submit {
  font-family: var(--v-font-body);
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: var(--v-ls-wider);
  text-transform: uppercase;
  background: var(--v-coral-dark);
  color: var(--v-white);
  border: 2px solid var(--v-coral-dark);
  border-radius: var(--v-radius-sm);
  padding: 14px 32px;
  cursor: pointer;
  transition: var(--v-transition);
  min-height: 44px;
}
.et_pb_contact_form_container input[type="submit"]:hover,
.et_pb_newsletter_form input[type="submit"]:hover,
.et_pb_contact_submit:hover {
  background: #963a2d;
  border-color: #963a2d;
}

.et_pb_contact_form_container .et_pb_contact_field.et_pb_input_container.et_pb_contact_field_error input,
.et_pb_contact_form_container .et_pb_contact_field.et_pb_input_container.et_pb_contact_field_error textarea {
  border-color: var(--v-coral-dark);
}

/* v-form-light — use on dark section backgrounds */
.v-form-light input[type="text"],
.v-form-light input[type="email"],
.v-form-light input[type="tel"],
.v-form-light textarea {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.3);
  color: var(--v-white);
}
.v-form-light input::placeholder,
.v-form-light textarea::placeholder { color: rgba(255, 255, 255, 0.5); }
.v-form-light label { color: rgba(255, 255, 255, 0.85); }


/* -----------------------------------------------------------
   19. GIVING SECTION UTILITIES
   ----------------------------------------------------------- */

.et_pb_section.giving-section {
  position: relative;
  overflow: hidden;
}

.et_pb_section.giving-section::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 480px; height: 480px;
  background: radial-gradient(circle, rgba(212, 97, 74, 0.12) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.et_pb_section.giving-section::after {
  content: '';
  position: absolute;
  bottom: -60px; left: -60px;
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(212, 97, 74, 0.07) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.et_pb_section.giving-section h2 em,
.et_pb_section.giving-section h3 em {
  color: var(--v-coral);
  font-style: italic;
}

.et_pb_module.v-impact-card,
.et_pb_column.v-impact-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(212, 97, 74, 0.25);
  border-radius: var(--v-radius);
  text-align: center;
}


/* -----------------------------------------------------------
   20. TESTIMONIAL UTILITIES
   ----------------------------------------------------------- */

.et_pb_testimonial.v-testimonial {
  background: var(--v-white);
  border-radius: var(--v-radius);
  box-shadow: var(--v-shadow);
  padding: 32px;
  border: none;
}
.et_pb_testimonial.v-testimonial .et_pb_testimonial_description_inner {
  font-family: var(--v-font-display);
  font-size: 1.05rem;
  font-weight: 400;
  font-style: italic;
  color: var(--v-teal-dark);
  line-height: var(--v-lh-relaxed);
}
.et_pb_testimonial.v-testimonial .et_pb_testimonial_author {
  font-family: var(--v-font-body);
  font-size: var(--v-size-body-sm);
  font-weight: 600;
  color: var(--v-text-dark);
  margin-top: 16px;
}
.et_pb_testimonial.v-testimonial .et_pb_testimonial_company {
  font-family: var(--v-font-body);
  font-size: var(--v-size-caption);
  font-weight: 300;
  color: var(--v-text-light);
}

/* v-testimonial-dark — for use on dark backgrounds */
.et_pb_testimonial.v-testimonial-dark {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--v-radius);
  padding: 32px;
}
.et_pb_testimonial.v-testimonial-dark .et_pb_testimonial_description_inner {
  font-family: var(--v-font-display);
  font-size: 1.05rem;
  font-style: italic;
  color: rgba(255, 255, 255, 0.9);
  line-height: var(--v-lh-relaxed);
}
.et_pb_testimonial.v-testimonial-dark .et_pb_testimonial_author {
  color: var(--v-sage);
  font-weight: 600;
}
.et_pb_testimonial.v-testimonial-dark .et_pb_testimonial_company {
  color: rgba(255, 255, 255, 0.45);
}


/* -----------------------------------------------------------
   21. BLURB & ICON MODULE UTILITIES
   ----------------------------------------------------------- */

.et_pb_blurb.v-blurb-icon-teal .et_pb_main_blurb_image .et-pb-icon {
  color: var(--v-teal-dark);
  background: rgba(158, 195, 187, 0.2);
  border-radius: 50%;
  padding: 16px;
  transition: var(--v-transition);
}
.et_pb_blurb.v-blurb-icon-teal:hover .et_pb_main_blurb_image .et-pb-icon {
  background: rgba(65, 86, 93, 0.12);
}

.et_pb_blurb.v-blurb-icon-coral .et_pb_main_blurb_image .et-pb-icon {
  color: var(--v-coral-dark);
  background: var(--v-coral-light);
  border-radius: 50%;
  padding: 16px;
  transition: var(--v-transition);
}

.et_pb_blurb.v-blurb-icon-sage .et_pb_main_blurb_image .et-pb-icon {
  color: var(--v-sage-dark);
  background: rgba(143, 191, 106, 0.15);
  border-radius: 50%;
  padding: 16px;
  transition: var(--v-transition);
}

.et_pb_blurb.v-blurb-center { text-align: center; }
.et_pb_blurb.v-blurb-center .et_pb_main_blurb_image {
  display: flex;
  justify-content: center;
}


/* -----------------------------------------------------------
   22. NUMBER COUNTER UTILITIES
   ----------------------------------------------------------- */

.et_pb_number_counter.v-counter .title {
  font-family: var(--v-font-body);
  font-size: var(--v-size-body-sm);
  font-weight: 600;
  letter-spacing: var(--v-ls-wide);
  text-transform: uppercase;
  color: var(--v-text-mid);
}
.et_pb_number_counter.v-counter .et_pb_counter_amount {
  font-family: var(--v-font-display);
  font-weight: 300;
  font-size: var(--v-size-display);
  color: var(--v-teal-dark);
  line-height: 1;
}

/* On dark sections */
.et_pb_section.bg-teal .et_pb_number_counter.v-counter .et_pb_counter_amount,
.et_pb_section.bg-teal-deep .et_pb_number_counter.v-counter .et_pb_counter_amount { color: var(--v-white); }
.et_pb_section.bg-teal .et_pb_number_counter.v-counter .title,
.et_pb_section.bg-teal-deep .et_pb_number_counter.v-counter .title { color: rgba(255, 255, 255, 0.6); }


/* -----------------------------------------------------------
   23. RESPONSIVE
   Font size variables and spacing scale down automatically.
   ----------------------------------------------------------- */

/* ── Tablet (≤980px) ── */
@media only screen and (max-width: 980px) {

  :root {
    --v-size-hero:    3rem;
    --v-size-display: 2.4rem;
    --v-size-xl:      2rem;
    --v-size-lg:      1.65rem;
    --v-size-md:      1.3rem;
    --v-space-xl:     70px;
    --v-space-xxl:    90px;
  }

  .et_pb_section.giving-section::before,
  .et_pb_section.giving-section::after { display: none; }

  .et_pb_row.no-gutter .et_pb_column {
    padding-bottom: var(--v-space-md) !important;
  }

  .et_pb_column.col-sticky > .et_pb_module { position: static; }
}

/* ── Mobile (≤767px) ── */
@media only screen and (max-width: 767px) {

  :root {
    --v-size-hero:    2.4rem;
    --v-size-display: 1.9rem;
    --v-size-xl:      1.65rem;
    --v-size-lg:      1.4rem;
    --v-size-md:      1.2rem;
    --v-size-sm:      1.05rem;
    --v-space-lg:     44px;
    --v-space-xl:     60px;
    --v-space-xxl:    70px;
  }

  /* Shrink button padding slightly on small screens */
  .et_pb_button {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  /* Full-width buttons on mobile only */
  .et_pb_button.btn-full-mobile {
    display: flex !important;
    width: 100%;
    margin-bottom: var(--v-space-xs);
  }

  .et_pb_module.text-center-mobile { text-align: center !important; }

  .et_pb_testimonial.v-testimonial,
  .et_pb_testimonial.v-testimonial-dark { padding: 24px 20px; }

  /* Accent column borders convert to top border on mobile */
  .et_pb_column.col-accent-teal,
  .et_pb_column.col-accent-coral {
    border-left: none;
    padding-left: 0 !important;
    border-top: 3px solid var(--v-teal-dark);
    padding-top: var(--v-space-sm) !important;
  }

  .et_pb_divider.div-ornament::before { display: none; }
}