/*
Theme Name: Global Care Force New Future
Theme URI: https://gcforce.org/
Author: Cumulas / Global Care Force
Description: A clean, light, mockup-faithful block theme for Global Care Force, built around the continuity-of-care story. Restructured nav (utility + main bars), photo-bleed hero, Volunteer/Donate action panels, a "What Makes Us Different" section, a "Continuity in Action" timeline, a global Impact section with world map + stats, and a single closing call to action. Official brand palette and standards (primary-only gradients, never-recolored logo), Montserrat typography, and native editable blocks throughout. v2.3.0 introduced a three-layer design-token system; v2.4.0 added Block Patterns + an "Appearance → GCF Editing Guide" admin page; v2.5.0 adds a Person Bio Card pattern (click portrait → native dialog modal with the full bio) — single-artifact, no extra pages required. v2.5.1 dropped the empty placeholder paragraph; v2.5.2 puts a non-empty paragraph back in the Cover; v2.5.3 fixes editor-edit of the bio source; v2.5.4 fixes Person Bio name/title color drift on the front-end; v2.5.5 restores the demo's modal layout — circular thumb of the portrait + name + title in the head, bio paragraphs in the body, sticky close button — by having the JS read the card's photo URL and build the thumb itself (editor uploads once, modal reuses). v2.6.0 adds four general-purpose content patterns: FAQ accordion, testimonial/quote, content split, and feature row. v2.6.1 adds an "About Us (full page)" starter pattern that assembles those sections into a ready-to-edit page.
Version: 2.6.1
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: gcfnf
*/

/* ============================================================== Tokens
   Three-layer system: PRIMITIVE atoms → SEMANTIC roles → COMPONENT recipes.
   Component CSS should reference the semantic layer (or component tokens) —
   not raw primitives — so brand-wide changes are one-line edits at the top. */

:root {
  /* ----- PRIMITIVE ----- */

  /* Color (mirrors theme.json palette) */
  --gcfnf-c-navy:     var(--wp--preset--color--navy, #062139);
  --gcfnf-c-teal:     var(--wp--preset--color--teal, #0D636F);
  --gcfnf-c-green:    var(--wp--preset--color--green, #458F53);
  --gcfnf-c-gold:     var(--wp--preset--color--gold, #F6A92C);
  --gcfnf-c-mocha:    var(--wp--preset--color--mocha, #787351);
  --gcfnf-c-sand:     var(--wp--preset--color--sand, #F6F4F0);
  --gcfnf-c-mist:     var(--wp--preset--color--mist, #EEF4F3);
  --gcfnf-c-ink:      var(--wp--preset--color--ink, #14253A);
  --gcfnf-c-slate:    var(--wp--preset--color--slate, #5A6B7B);
  --gcfnf-c-line:     var(--wp--preset--color--line, #E3E8EC);
  --gcfnf-c-white:    #ffffff;
  --gcfnf-c-midnight: var(--wp--preset--color--midnight, #04182B);

  /* Spacing — 8pt grid + 4pt half-step */
  --gcfnf-space-0:   0;
  --gcfnf-space-2xs: 0.25rem;
  --gcfnf-space-xs:  0.5rem;
  --gcfnf-space-sm:  0.75rem;
  --gcfnf-space-md:  1rem;
  --gcfnf-space-lg:  1.5rem;
  --gcfnf-space-xl:  2rem;
  --gcfnf-space-2xl: 3rem;
  --gcfnf-space-3xl: 4.5rem;
  --gcfnf-space-4xl: 7rem;

  /* Type — modular scale, ratio 1.25, base 1rem */
  --gcfnf-fs-caption: 0.75rem;
  --gcfnf-fs-body-sm: 0.875rem;
  --gcfnf-fs-body:    1rem;
  --gcfnf-fs-body-lg: 1.125rem;
  --gcfnf-fs-h4:      1.25rem;
  --gcfnf-fs-h3:      1.5rem;
  --gcfnf-fs-h2:      1.875rem;
  --gcfnf-fs-h1:      2.5rem;
  --gcfnf-fs-display: 3.5rem;

  --gcfnf-lh-tight:   1.08;
  --gcfnf-lh-snug:    1.25;
  --gcfnf-lh-base:    1.6;
  --gcfnf-lh-relaxed: 1.7;

  --gcfnf-tracking-tight:   -0.02em;
  --gcfnf-tracking-base:    0;
  --gcfnf-tracking-eyebrow: 0.12em;

  --gcfnf-fw-regular:  400;
  --gcfnf-fw-semibold: 600;
  --gcfnf-fw-bold:     700;
  --gcfnf-fw-black:    800;

  /* Radii */
  --gcfnf-radius-sm:   4px;
  --gcfnf-radius-md:   8px;
  --gcfnf-radius-lg:   12px;
  --gcfnf-radius-xl:   16px;
  --gcfnf-radius-full: 999px;

  /* Elevation — navy-tinted */
  --gcfnf-elev-0: none;
  --gcfnf-elev-1: 0 8px 20px rgba(6, 33, 57, 0.06);
  --gcfnf-elev-2: 0 14px 32px rgba(6, 33, 57, 0.12);
  --gcfnf-elev-3: 0 22px 48px rgba(6, 33, 57, 0.18);

  /* Motion */
  --gcfnf-duration-fast: 120ms;
  --gcfnf-duration-base: 200ms;
  --gcfnf-duration-slow: 320ms;
  --gcfnf-duration-page: 700ms;
  --gcfnf-ease-out:     cubic-bezier(0.22, 0.61, 0.36, 1);
  --gcfnf-ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);
  --gcfnf-ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ----- SEMANTIC ----- */

  /* Text */
  --gcfnf-text-primary:   var(--gcfnf-c-ink);
  --gcfnf-text-secondary: var(--gcfnf-c-slate);
  --gcfnf-text-inverse:   var(--gcfnf-c-white);
  --gcfnf-text-brand:     var(--gcfnf-c-navy);
  --gcfnf-text-accent:    var(--gcfnf-c-teal);

  /* Surface */
  --gcfnf-surface-default:    var(--gcfnf-c-white);
  --gcfnf-surface-raised:     var(--gcfnf-c-white);
  --gcfnf-surface-sunken:     var(--gcfnf-c-mist);
  --gcfnf-surface-warm:       var(--gcfnf-c-sand);
  --gcfnf-surface-brand:      var(--gcfnf-c-navy);
  --gcfnf-surface-brand-deep: var(--gcfnf-c-midnight);

  /* Border */
  --gcfnf-border-subtle:  var(--gcfnf-c-line);
  --gcfnf-border-strong:  var(--gcfnf-c-slate);
  --gcfnf-border-inverse: rgba(255, 255, 255, 0.18);

  /* Action */
  --gcfnf-action-primary:   var(--gcfnf-c-navy);
  --gcfnf-action-secondary: var(--gcfnf-c-green);
  --gcfnf-action-accent:    var(--gcfnf-c-gold);

  /* Focus */
  --gcfnf-focus-ring-color:  var(--gcfnf-c-teal);
  --gcfnf-focus-ring-width:  3px;
  --gcfnf-focus-ring-offset: 2px;
  --gcfnf-focus-ring:        var(--gcfnf-focus-ring-width) solid var(--gcfnf-focus-ring-color);

  /* Spacing semantic (fluid) */
  --gcfnf-space-gutter:        clamp(1rem, 4vw, 3rem);
  --gcfnf-space-section:       clamp(3.5rem, 7vw, 6rem);
  --gcfnf-space-section-tight: clamp(2rem, 4vw, 3rem);
  --gcfnf-space-stack:         var(--gcfnf-space-md);
  --gcfnf-space-stack-tight:   var(--gcfnf-space-sm);
  --gcfnf-space-stack-loose:   var(--gcfnf-space-lg);

  /* Type semantic (fluid) */
  --gcfnf-fs-h1-fluid:      clamp(2rem, 4.5vw, 2.5rem);
  --gcfnf-fs-h2-fluid:      clamp(1.5rem, 3.6vw, 1.875rem);
  --gcfnf-fs-h3-fluid:      clamp(1.25rem, 2.5vw, 1.5rem);
  --gcfnf-fs-display-fluid: clamp(2.5rem, 5.2vw, 3.5rem);

  /* Layout */
  --gcfnf-container-rail:    1500px;
  --gcfnf-container-content: 1340px;

  /* ----- COMPONENT ----- */

  /* Button (modifier classes override the *-bg / *-fg / *-border tokens) */
  --gcfnf-btn-bg:        var(--gcfnf-action-primary);
  --gcfnf-btn-fg:        var(--gcfnf-text-inverse);
  --gcfnf-btn-border:    transparent;
  --gcfnf-btn-radius:    var(--gcfnf-radius-md);
  --gcfnf-btn-padding-y: 0.85rem;
  --gcfnf-btn-padding-x: 1.4rem;
  --gcfnf-btn-fs:        0.85rem;
  --gcfnf-btn-tracking:  0.02em;
  --gcfnf-btn-fw:        var(--gcfnf-fw-bold);

  /* Card */
  --gcfnf-card-bg:      var(--gcfnf-surface-raised);
  --gcfnf-card-border:  1px solid var(--gcfnf-border-subtle);
  --gcfnf-card-radius:  var(--gcfnf-radius-lg);
  --gcfnf-card-shadow:  var(--gcfnf-elev-1);
  --gcfnf-card-padding: var(--gcfnf-space-lg);

  /* Hero */
  --gcfnf-hero-min-height:    clamp(440px, 64vh, 620px);
  --gcfnf-hero-content-max-w: 42rem;
}

body { background: var(--gcfnf-surface-default); color: var(--gcfnf-text-primary); }
.gcfnf-rail { width: min(var(--gcfnf-container-rail), 100%); margin-inline: auto; padding-inline: var(--gcfnf-space-gutter); }

/* Full-bleed homepage: the <main> and its section children span the full viewport;
   each section then constrains its own content via an inner rail. */
.wp-site-blocks { max-width: none; }
.gcfnf-main { width: 100%; max-width: none; }
.gcfnf-main > * { max-width: none; margin-left: 0; margin-right: 0; }
img { max-width: 100%; height: auto; }
:where(a, button, input, [tabindex]):focus-visible { outline: var(--gcfnf-focus-ring); outline-offset: var(--gcfnf-focus-ring-offset); }

/* ============================================================== Buttons */
.wp-block-button__link {
  background: var(--gcfnf-btn-bg);
  color: var(--gcfnf-btn-fg);
  border: 2px solid var(--gcfnf-btn-border);
  border-radius: var(--gcfnf-btn-radius);
  padding: var(--gcfnf-btn-padding-y) var(--gcfnf-btn-padding-x);
  font-weight: var(--gcfnf-btn-fw);
  font-size: var(--gcfnf-btn-fs);
  letter-spacing: var(--gcfnf-btn-tracking);
  text-transform: uppercase;
  line-height: 1.1;
  transition: transform var(--gcfnf-duration-base) var(--gcfnf-ease-out),
              box-shadow var(--gcfnf-duration-base) var(--gcfnf-ease-out),
              background var(--gcfnf-duration-base) var(--gcfnf-ease-out),
              color var(--gcfnf-duration-base) var(--gcfnf-ease-out);
}
.gcfnf-btn-navy    { --gcfnf-btn-bg: var(--gcfnf-action-primary);   --gcfnf-btn-fg: var(--gcfnf-text-inverse); }
.gcfnf-btn-green   { --gcfnf-btn-bg: var(--gcfnf-action-secondary); --gcfnf-btn-fg: var(--gcfnf-text-inverse); }
.gcfnf-btn-gold    { --gcfnf-btn-bg: var(--gcfnf-action-accent);    --gcfnf-btn-fg: var(--gcfnf-text-brand); }
.gcfnf-btn-outline { --gcfnf-btn-bg: transparent;                   --gcfnf-btn-fg: var(--gcfnf-text-brand);  --gcfnf-btn-border: var(--gcfnf-action-primary); }
.gcfnf-btn-light   { --gcfnf-btn-bg: var(--gcfnf-c-white);          --gcfnf-btn-fg: var(--gcfnf-text-brand); }
.gcfnf-btn-ghost   { --gcfnf-btn-bg: transparent;                   --gcfnf-btn-fg: var(--gcfnf-text-inverse); --gcfnf-btn-border: rgba(255,255,255,0.55); }
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: var(--gcfnf-elev-2); }
.gcfnf-btn-outline .wp-block-button__link:hover { background: var(--gcfnf-action-primary); color: var(--gcfnf-text-inverse); }
.gcfnf-btn-ghost   .wp-block-button__link:hover { background: rgba(255,255,255,0.14); }

/* ============================================================== Header (utility + main bars) */
.gcfnf-header { position: sticky; top: 0; z-index: 100; }
.gcfnf-topbar { background: var(--gcfnf-surface-brand); }
.gcfnf-topbar-inner { width: min(var(--gcfnf-container-rail), 100%); margin-inline: auto; padding: 0.4rem var(--gcfnf-space-gutter); display: flex; justify-content: flex-end; }
.gcfnf-topnav .wp-block-navigation-item__content { color: rgba(255,255,255,.85); font-size: var(--gcfnf-fs-body-sm); font-weight: var(--gcfnf-fw-semibold); padding: 0.2rem 0.65rem; }
.gcfnf-topnav .wp-block-navigation-item__content:hover { color: var(--gcfnf-text-inverse); }
.gcfnf-mainbar { background: var(--gcfnf-surface-default); border-bottom: 1px solid var(--gcfnf-border-subtle); }
.gcfnf-mainbar-inner { width: min(var(--gcfnf-container-rail), 100%); margin-inline: auto; padding: 0.7rem var(--gcfnf-space-gutter); display: flex; align-items: center; justify-content: space-between; gap: var(--gcfnf-space-lg); }
.gcfnf-logo { margin: 0; line-height: 0; }
.gcfnf-logo img { width: clamp(160px, 16vw, 220px); height: auto; }
.gcfnf-mainnav .wp-block-navigation-item__content { color: var(--gcfnf-text-brand); font-weight: var(--gcfnf-fw-bold); font-size: 0.95rem; padding: 0.4rem 0.7rem; }
.gcfnf-mainnav .wp-block-navigation-item__content:hover { color: var(--gcfnf-text-accent); }
.gcfnf-mainnav .wp-block-navigation__responsive-container-open,
.gcfnf-mainnav .wp-block-navigation__responsive-container-close { color: var(--gcfnf-text-brand); }
.gcfnf-topnav .wp-block-navigation__submenu-container,
.gcfnf-mainnav .wp-block-navigation__submenu-container { background: var(--gcfnf-surface-default); border: 1px solid var(--gcfnf-border-subtle); border-radius: var(--gcfnf-radius-lg); box-shadow: var(--gcfnf-elev-3); padding: 0.4rem; min-width: 210px; }
.gcfnf-topnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.gcfnf-mainnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--gcfnf-text-primary); font-weight: var(--gcfnf-fw-semibold); font-size: 0.92rem; padding: 0.5rem 0.75rem; border-radius: var(--gcfnf-radius-sm); }
.gcfnf-topnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.gcfnf-mainnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--gcfnf-surface-sunken); color: var(--gcfnf-text-accent); }

/* Home page: main bar overlays the hero; mini-bar stays solid brand-navy with white text. */
.home .gcfnf-header { position: absolute; top: 0; left: 0; right: 0; }
.home .gcfnf-mainbar { background: transparent; border-bottom: 0; }
.home .gcfnf-mainnav .wp-block-navigation-item__content { color: var(--gcfnf-text-inverse); }
.home .gcfnf-mainnav .wp-block-navigation-item__content:hover { color: rgba(255,255,255,.78); }
.home .gcfnf-mainnav .wp-block-navigation__responsive-container-open,
.home .gcfnf-mainnav .wp-block-navigation__responsive-container-close { color: var(--gcfnf-text-inverse); }
.home .gcfnf-mainnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--gcfnf-text-primary); }
.home .gcfnf-mainnav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--gcfnf-text-accent); }
.home .gcfnf-logo img { filter: brightness(0) invert(1); }
/* Keep the header below the WordPress admin bar when logged in (home overlay header is absolutely positioned). */
.admin-bar .gcfnf-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .gcfnf-header { top: 46px; } }

/* Header search — core Search block in button-only/icon mode (click magnifier → field expands). */
.gcfnf-mainbar-actions { gap: 0.6rem; }
.gcfnf-search { margin: 0; }
.gcfnf-search .wp-block-search__button { background: transparent; border: 0; min-width: 0; padding: 0.35rem; color: var(--gcfnf-text-brand); cursor: pointer; transition: color var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-search .wp-block-search__button:hover { background: transparent; color: var(--gcfnf-text-accent); }
.gcfnf-search .wp-block-search__button svg { width: 22px; height: 22px; fill: currentColor; }
.gcfnf-search .wp-block-search__input { border: 1px solid var(--gcfnf-border-subtle); border-radius: var(--gcfnf-radius-md); background: var(--gcfnf-surface-default); color: var(--gcfnf-text-primary); font-size: 0.95rem; padding: 0.45rem 0.7rem; max-width: min(60vw, 260px); }
.gcfnf-search .wp-block-search__input:focus { outline: 2px solid var(--gcfnf-focus-ring-color); outline-offset: 1px; }
/* Over the dark hero (home), the magnifier is white. */
.home .gcfnf-search .wp-block-search__button { color: var(--gcfnf-text-inverse); }
.home .gcfnf-search .wp-block-search__button:hover { color: rgba(255,255,255,.78); }

/* ============================================================== Section heads */
.gcfnf-section { padding-block: var(--gcfnf-space-section); padding-inline: var(--gcfnf-space-gutter); }
.gcfnf-eyebrow-text { color: var(--gcfnf-text-accent); font-size: var(--gcfnf-fs-caption); font-weight: var(--gcfnf-fw-black); letter-spacing: var(--gcfnf-tracking-eyebrow); text-transform: uppercase; margin: 0 0 0.6rem; }
.gcfnf-section-title { text-align: center; max-width: min(92%, 680px); margin: 0.3rem auto 0.9rem; color: var(--gcfnf-text-brand); font-size: var(--gcfnf-fs-h1-fluid); line-height: var(--gcfnf-lh-tight); }
.gcfnf-section-lead { text-align: center; max-width: 60ch; margin: 0 auto clamp(2.25rem, 4vw, 3rem); color: var(--gcfnf-text-secondary); font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-base); }

/* ============================================================== Hero (rotating full-bleed banner) */
.gcfnf-hero { background: var(--gcfnf-surface-brand); }
.gcfnf-hero-slider { position: relative; }
.gcfnf-hero-slide .wp-block-cover__inner-container { width: min(var(--gcfnf-container-rail), 100%); margin-inline: auto; padding-inline: var(--gcfnf-space-gutter); }
.gcfnf-hero-copy2 { max-width: var(--gcfnf-hero-content-max-w); }
.gcfnf-hero-copy2::before { content: ""; display: block; width: 56px; height: 5px; border-radius: var(--gcfnf-radius-sm); background: var(--gcfnf-text-accent); margin-bottom: var(--gcfnf-space-lg); }
.gcfnf-hero-slide :where(h1) { margin: 0; color: var(--gcfnf-text-inverse); font-size: var(--gcfnf-fs-display-fluid); line-height: var(--gcfnf-lh-tight); letter-spacing: var(--gcfnf-tracking-tight); }
.gcfnf-hero-slide .gcfnf-hero-text { margin: var(--gcfnf-space-lg) 0 0; color: rgba(255,255,255,.92); font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-base); max-width: 38rem; }
/* Crossfade carousel — switched on by hero-slider.js when there are 2+ slides. */
.gcfnf-hero-slider.gcfnf-hero-ready { min-height: var(--gcfnf-hero-min-height); }
.gcfnf-hero-slider.gcfnf-hero-ready > .wp-block-cover { position: absolute; inset: 0; opacity: 0; transition: opacity var(--gcfnf-duration-page) var(--gcfnf-ease-in-out); pointer-events: none; }
.gcfnf-hero-slider.gcfnf-hero-ready > .wp-block-cover.is-active { opacity: 1; pointer-events: auto; }
.gcfnf-hero-dots { position: absolute; left: 0; right: 0; bottom: 1.25rem; display: flex; justify-content: center; gap: 0.5rem; z-index: 3; }
.gcfnf-hero-dot { width: 10px; height: 10px; padding: 0; border: 0; border-radius: var(--gcfnf-radius-full); background: rgba(255,255,255,.45); cursor: pointer; transition: background var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-hero-dot.is-active { background: var(--gcfnf-text-inverse); }
.gcfnf-hero-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--gcfnf-radius-full); background: rgba(255,255,255,.16); color: var(--gcfnf-text-inverse); cursor: pointer; transition: background var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-hero-arrow svg { width: 20px; height: 20px; display: block; }
.gcfnf-hero-arrow:hover { background: rgba(255,255,255,.3); }
.gcfnf-hero-prev { left: clamp(0.5rem, 2vw, 1.5rem); }
.gcfnf-hero-next { right: clamp(0.5rem, 2vw, 1.5rem); }

/* ============================================================== Action panels (Volunteer / Donate) */
.wp-block-columns.gcfnf-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; }
.gcfnf-action { position: relative; overflow: hidden; padding: clamp(1.75rem, 4vw, var(--gcfnf-space-2xl)); display: flex; flex-direction: column; justify-content: center; min-height: clamp(160px, 16vw, 210px); transition: filter var(--gcfnf-duration-base) var(--gcfnf-ease-out), transform var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-action:hover { filter: brightness(0.93); transform: translateY(-2px); }
.gcfnf-action-copy { position: relative; z-index: 1; max-width: 30rem; }
.gcfnf-action h2 { margin: 0 0 0.4rem; color: var(--gcfnf-text-inverse); font-size: clamp(1.3rem, 2vw, 1.7rem); max-width: 22rem; }
.gcfnf-action p { margin: 0 0 1.1rem; color: rgba(255,255,255,.9); max-width: 26rem; font-size: 0.98rem; }
.gcfnf-action .wp-block-buttons { margin: 0; }

/* ============================================================== What makes us different */
.gcfnf-different { background: var(--gcfnf-surface-default); }
.gcfnf-different-grid { width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.gcfnf-different-grid > * { margin-block: 0; }
.gcfnf-different-copy h2 { margin: 0 0 var(--gcfnf-space-md); color: var(--gcfnf-text-brand); font-size: clamp(2rem, 4vw, 2.9rem); line-height: var(--gcfnf-lh-tight); }
.gcfnf-different-copy p { margin: 0 0 var(--gcfnf-space-md); color: var(--gcfnf-text-secondary); font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-base); max-width: 34rem; }
.gcfnf-different-copy .wp-block-buttons { margin-top: 0.5rem; }
.gcfnf-different-media { min-height: 380px; border-radius: var(--gcfnf-radius-xl); overflow: hidden; }
.gcfnf-different-media img { width: 100%; height: 100%; object-fit: cover; }
.gcfnf-founder { width: min(var(--gcfnf-container-content), 100%); margin: clamp(2rem, 4vw, 3rem) auto 0; display: grid; grid-template-columns: 200px 1fr; gap: clamp(1.25rem, 3vw, 2.5rem); align-items: center; background: var(--gcfnf-surface-warm); border: var(--gcfnf-card-border); border-radius: var(--gcfnf-card-radius); padding: clamp(1.25rem, 3vw, var(--gcfnf-space-xl)); }
.gcfnf-founder > * { margin-block: 0; }
.gcfnf-founder-photo { min-height: 150px; border-radius: var(--gcfnf-radius-lg); overflow: hidden; }
.gcfnf-founder-photo img { width: 100%; height: 100%; object-fit: cover; }
.gcfnf-founder-text h3 { margin: 0 0 0.5rem; color: var(--gcfnf-text-brand); font-size: 1.3rem; }
.gcfnf-founder-text p { margin: 0 0 var(--gcfnf-space-md); color: var(--gcfnf-text-secondary); }
.gcfnf-founder-text .wp-block-buttons { margin: 0; }

/* ============================================================== Partners */
.gcfnf-partners2-grid { width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(0.75rem, 2vw, 1.75rem); align-items: center; }
.gcfnf-partner2 { margin: 0; }
.gcfnf-partner2 img { width: 100%; height: auto; display: block; border-radius: var(--gcfnf-radius-lg); }

/* ============================================================== Continuity in Action (timeline) */
.gcfnf-continuity .gcfnf-eyebrow-text { text-align: center; }
.gcfnf-continuity-cta { margin-top: clamp(2rem, 4vw, 3rem); }
.wp-block-columns.gcfnf-timeline { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 3vw, 2rem); width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; margin-top: 2.75rem; position: relative; }
.gcfnf-timeline::before { content: ""; position: absolute; top: -1.4rem; left: 16.6%; right: 16.6%; height: 2px; background: var(--gcfnf-text-accent); opacity: 0.45; }
.gcfnf-tl-card { position: relative; background: var(--gcfnf-card-bg); border: var(--gcfnf-card-border); border-radius: var(--gcfnf-card-radius); overflow: hidden; box-shadow: var(--gcfnf-card-shadow); transition: box-shadow var(--gcfnf-duration-base) var(--gcfnf-ease-out), transform var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-tl-card:hover { box-shadow: var(--gcfnf-elev-2); transform: translateY(-2px); }
.gcfnf-tl-card > * { margin-block: 0; }
.gcfnf-tl-card::before { content: ""; position: absolute; top: -1.75rem; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; border-radius: var(--gcfnf-radius-full); background: var(--gcfnf-text-accent); border: 3px solid var(--gcfnf-surface-sunken); z-index: 1; }
.gcfnf-tl-photo { min-height: 180px; }
.gcfnf-tl-photo img { width: 100%; height: 100%; object-fit: cover; }
.gcfnf-tl-body { padding: 1.25rem 1.4rem var(--gcfnf-space-lg); }
.gcfnf-tl-month { margin: 0; color: var(--gcfnf-text-accent); font-size: 0.72rem; font-weight: var(--gcfnf-fw-black); letter-spacing: 0.1em; text-transform: uppercase; }
.gcfnf-tl-title { margin: 0.3rem 0 0.5rem; color: var(--gcfnf-text-brand); font-size: 1.3rem; }
.gcfnf-tl-body p:last-child { margin: 0; color: var(--gcfnf-text-secondary); font-size: 0.96rem; line-height: 1.55; }

/* ============================================================== Our Impact (map right + colored stat cards) */
.gcfnf-impact2 { background: var(--gcfnf-surface-default); }
.gcfnf-impact2-head { width: min(var(--gcfnf-container-content), 100%); margin: 0 auto clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.gcfnf-impact2-head > * { margin-block: 0; }
.gcfnf-impact2-intro .gcfnf-eyebrow-text { text-align: left; }
.gcfnf-impact2-title { margin: 0 0 0.75rem; color: var(--gcfnf-text-brand); font-size: clamp(1.9rem, 3.6vw, 2.7rem); line-height: 1.06; text-align: left; }
.gcfnf-impact2-lead { margin: 0; color: var(--gcfnf-text-secondary); font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-base); max-width: 34rem; }
.gcfnf-impact2-map { min-height: clamp(240px, 30vw, 380px); background: url(assets/world-map.svg?v=2) center / contain no-repeat; }
.wp-block-columns.gcfnf-impact2-stats { width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(0.75rem, 1.5vw, 1.25rem); }
.gcfnf-stat2 { display: flex; flex-direction: column; justify-content: flex-end; min-height: clamp(150px, 17vw, 190px); padding: clamp(1.1rem, 2.2vw, 1.6rem); border-radius: var(--gcfnf-radius-lg); }
.gcfnf-stat2-num { margin: 0; font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: var(--gcfnf-fw-black); line-height: 1; }
.gcfnf-stat2-label { margin: 0.35rem 0 0; font-size: 0.88rem; font-weight: var(--gcfnf-fw-semibold); opacity: 0.92; }

/* ============================================================== Closing CTA */
.gcfnf-cta { background: var(--gcfnf-surface-warm); text-align: center; }
.gcfnf-cta .gcfnf-cta-actions { margin-top: 0.5rem; gap: 0.85rem; }

/* ============================================================== Icons
   Decorative icons live in CSS (not in page content) so sections stay as editable
   blocks. Each item carries a gcfnf-ic-* class pointing its ::before at an SVG. */
.gcfnf-ic-people    { --ic: url(assets/icons/people.svg); }
.gcfnf-ic-clinic    { --ic: url(assets/icons/clinic.svg); }
.gcfnf-ic-clock     { --ic: url(assets/icons/clock.svg); }
.gcfnf-ic-globe     { --ic: url(assets/icons/globe.svg); }
.gcfnf-ic-heart     { --ic: url(assets/icons/heart.svg); }
.gcfnf-ic-pulse     { --ic: url(assets/icons/pulse.svg); }
.gcfnf-ic-refresh   { --ic: url(assets/icons/refresh.svg); }
.gcfnf-ic-volunteer { --ic: url(assets/icons/volunteer.svg); }
.gcfnf-ic-partner   { --ic: url(assets/icons/partner.svg); }

.gcfnf-action::before,
.gcfnf-stat2::before,
.gcfnf-feature::before {
  content: ""; display: block;
  background-color: currentColor;
  -webkit-mask-image: var(--ic); mask-image: var(--ic);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
/* Option A: the action-panel icon is a large, faint watermark on the right; the
   heading/text/button sit as a clean left-aligned stack above it (z-index). */
.gcfnf-action::before { position: absolute; right: clamp(-1rem, 1vw, 1.25rem); top: 50%; transform: translateY(-50%); width: clamp(120px, 20vw, 260px); height: clamp(120px, 20vw, 260px); margin: 0; opacity: 0.12; pointer-events: none; }
.gcfnf-stat2::before { width: 32px; height: 32px; margin: 0 0 0.65rem; background-color: currentColor; }

/* ============================================================== Person Bio (modal)
   A square-portrait team card; clicking the photo opens a native <dialog> with the
   full bio. Inline .gcfnf-person-dialog source is hidden via CSS (display:none) and
   moved into <dialog> by assets/person-bio.js on DOM ready. */
.gcfnf-person { background: var(--gcfnf-card-bg); border: var(--gcfnf-card-border); border-radius: var(--gcfnf-card-radius); overflow: hidden; box-shadow: var(--gcfnf-card-shadow); transition: box-shadow var(--gcfnf-duration-base) var(--gcfnf-ease-out), transform var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-person:hover { box-shadow: var(--gcfnf-elev-2); transform: translateY(-2px); }
.gcfnf-person > * { margin-block: 0; }
.gcfnf-person-photo { cursor: pointer; }
.gcfnf-person-photo .wp-block-cover__inner-container { display: none; }
.gcfnf-person-body { padding: 1.1rem 1.25rem 1.25rem; }
.gcfnf-person-body > * { margin-block: 0; }
/* Chained selector (.gcfnf-person .gcfnf-person-name) raises specificity to (0,2,0)
   so the color wins against any theme.json-generated heading/element rules on the
   front-end. (In the editor, add_editor_style auto-prefixes with .editor-styles-wrapper,
   giving (0,3,0) — even safer.) */
.gcfnf-person .gcfnf-person-name { color: var(--gcfnf-text-brand); font-size: 1.15rem; font-weight: var(--gcfnf-fw-black); margin: 0; line-height: var(--gcfnf-lh-snug); }
.gcfnf-person .gcfnf-person-title { color: var(--gcfnf-text-accent); font-size: 0.78rem; font-weight: var(--gcfnf-fw-bold); letter-spacing: 0.08em; text-transform: uppercase; margin: 0.2rem 0 0; }

/* Inline bio source — hidden on the front-end; JS lifts its children into the <dialog>.
   In the block editor (.editor-styles-wrapper), the group is REVEALED with a labeled
   dashed border so editors can click in and edit the bio content. */
.gcfnf-person-dialog { display: none; }
.editor-styles-wrapper .gcfnf-person-dialog,
.block-editor-iframe__body .gcfnf-person-dialog {
  display: block;
  margin: var(--gcfnf-space-md) 0 0;
  padding: var(--gcfnf-space-md) var(--gcfnf-space-md) var(--gcfnf-space-sm);
  border: 2px dashed var(--gcfnf-text-accent);
  border-radius: var(--gcfnf-radius-lg);
  background: var(--gcfnf-surface-sunken);
  position: relative;
}
.editor-styles-wrapper .gcfnf-person-dialog::before,
.block-editor-iframe__body .gcfnf-person-dialog::before {
  content: "Bio — appears in modal when photo is clicked";
  display: block;
  font-size: 0.7rem;
  font-weight: var(--gcfnf-fw-black);
  color: var(--gcfnf-text-accent);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--gcfnf-space-sm);
}
.editor-styles-wrapper .gcfnf-person-dialog .gcfnf-person-dialog-title,
.block-editor-iframe__body .gcfnf-person-dialog .gcfnf-person-dialog-title {
  color: var(--gcfnf-text-accent);
  font-size: 0.82rem;
  font-weight: var(--gcfnf-fw-bold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 0.2rem;
}

/* The dialog the JS creates (appended to <body>). Structure: .gcfnf-person-modal-inner
   = head (thumb + name/title) + body (bio paragraphs); .gcfnf-person-modal-actions =
   sticky close-button row. */
.gcfnf-person-modal { border: 0; padding: 0; max-width: min(680px, 92vw); width: 100%; border-radius: var(--gcfnf-radius-xl); box-shadow: var(--gcfnf-elev-3); background: var(--gcfnf-surface-default); color: var(--gcfnf-text-primary); overflow: hidden; }
.gcfnf-person-modal::backdrop { background: rgba(6, 33, 57, 0.55); backdrop-filter: blur(2px); }

/* Head: thumb on the left, name/title on the right. When no photo uploaded yet, the
   thumb is omitted and the head collapses to text-only. */
.gcfnf-person-modal-head { padding: var(--gcfnf-space-xl) var(--gcfnf-space-xl) 0; }
.gcfnf-person-modal-head.has-thumb { display: grid; grid-template-columns: 140px 1fr; gap: var(--gcfnf-space-md); align-items: center; }
.gcfnf-person-modal-thumb { width: 140px; height: 140px; border-radius: var(--gcfnf-radius-full); overflow: hidden; background: var(--gcfnf-c-mist); }
.gcfnf-person-modal-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gcfnf-person-modal-head-text > * { margin-block: 0; }
.gcfnf-person-modal-head-text h1, .gcfnf-person-modal-head-text h2, .gcfnf-person-modal-head-text h3 { color: var(--gcfnf-text-brand); font-size: var(--gcfnf-fs-h3); line-height: var(--gcfnf-lh-tight); margin: 0; }
.gcfnf-person-modal-head-text .gcfnf-person-dialog-title { color: var(--gcfnf-text-accent); font-size: 0.82rem; font-weight: var(--gcfnf-fw-bold); letter-spacing: 0.08em; text-transform: uppercase; margin: 0.25rem 0 0; }

/* Body: the bio paragraphs. */
.gcfnf-person-modal-body { padding: var(--gcfnf-space-md) var(--gcfnf-space-xl) var(--gcfnf-space-md); }
.gcfnf-person-modal-body > * { margin-block: 0; }
.gcfnf-person-modal-body > * + * { margin-top: var(--gcfnf-space-md); }
.gcfnf-person-modal-body p { color: var(--gcfnf-text-primary); font-size: 0.98rem; line-height: var(--gcfnf-lh-base); }

.gcfnf-person-modal-actions { display: flex; justify-content: flex-end; padding: var(--gcfnf-space-md) var(--gcfnf-space-xl) var(--gcfnf-space-xl); border-top: 1px solid var(--gcfnf-border-subtle); margin: 0; background: var(--gcfnf-surface-sunken); }
.gcfnf-person-modal-close { background: var(--gcfnf-action-primary); color: var(--gcfnf-text-inverse); border: 0; border-radius: var(--gcfnf-radius-md); padding: 0.7rem 1.2rem; font: inherit; font-weight: var(--gcfnf-fw-bold); text-transform: uppercase; letter-spacing: 0.02em; font-size: 0.82rem; cursor: pointer; transition: background var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-person-modal-close:hover { background: var(--gcfnf-text-accent); }

/* Stack head vertically on narrow screens (matches the demo's mobile layout). */
@media (max-width: 540px) {
  .gcfnf-person-modal-head.has-thumb { grid-template-columns: 1fr; text-align: center; }
  .gcfnf-person-modal-thumb { margin: 0 auto; }
}

/* ============================================================== Footer */
.gcfnf-footer { background: var(--gcfnf-surface-brand-deep); color: rgba(255,255,255,.78); }
.gcfnf-footer > * { margin-block: 0; }
.gcfnf-footer::before { content: ""; display: block; height: 5px; background: linear-gradient(135deg, var(--gcfnf-c-navy), var(--gcfnf-c-teal) 55%, var(--gcfnf-c-green)); }
.wp-block-columns.gcfnf-footer-top { width: min(var(--gcfnf-container-rail), 100%); margin-inline: auto; padding: clamp(2.5rem, 5vw, 4rem) var(--gcfnf-space-gutter); display: grid; grid-template-columns: 1.4fr 1.3fr 1fr; gap: var(--gcfnf-space-xl); }
/* Color logo rendered white via CSS over the dark footer — user-approved (do not revert to a chip). */
.gcfnf-footer-logo { display: inline-block; }
.gcfnf-footer-logo img { width: 184px; display: block; filter: brightness(0) invert(1); }
.gcfnf-footer-brand p { margin: 0.95rem 0 0; font-size: 0.92rem; line-height: var(--gcfnf-lh-base); max-width: 24rem; }
.gcfnf-footer h3 { color: var(--gcfnf-text-inverse); font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; margin: 0 0 var(--gcfnf-space-md); }
.gcfnf-footer-links { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem var(--gcfnf-space-lg); }
.gcfnf-footer-links li { margin: 0; }
.gcfnf-footer-links a { color: rgba(255,255,255,.82); text-decoration: none; display: block; padding: 0.2rem 0; font-size: 0.95rem; }
.gcfnf-footer-links a:hover { color: var(--gcfnf-text-inverse); }
.wp-block-social-links.gcfnf-social { gap: 0.65rem; margin: 0 0 var(--gcfnf-space-lg); padding: 0; }
.wp-block-social-links.gcfnf-social .wp-social-link { width: 38px; height: 38px; border-radius: var(--gcfnf-radius-full); border: 1px solid var(--gcfnf-border-inverse); background: transparent; transition: background var(--gcfnf-duration-base) var(--gcfnf-ease-out), border-color var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.wp-block-social-links.gcfnf-social .wp-social-link:hover { background: var(--gcfnf-text-accent); border-color: var(--gcfnf-text-accent); }
.wp-block-social-links.gcfnf-social .wp-social-link a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 0; }
.wp-block-social-links.gcfnf-social .wp-social-link svg { width: 17px; height: 17px; fill: var(--gcfnf-text-inverse); }
.gcfnf-badges { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.gcfnf-badge { flex: 1 1 7rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.2rem; padding: 0.7rem; border: 1px solid rgba(255,255,255,0.2); border-radius: var(--gcfnf-radius-lg); text-align: center; }
.gcfnf-badge .gcfnf-badge-title { margin: 0; color: var(--gcfnf-text-inverse); font-size: 0.78rem; font-weight: var(--gcfnf-fw-black); letter-spacing: 0.08em; text-transform: uppercase; }
.gcfnf-badge .gcfnf-badge-sub { margin: 0; font-size: 0.72rem; color: rgba(255,255,255,.6); }
.gcfnf-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding: var(--gcfnf-space-md) var(--gcfnf-space-gutter); text-align: center; font-size: var(--gcfnf-fs-body-sm); color: rgba(255,255,255,.55); }

/* ============================================================== Interior pages */
.gcfnf-page { padding: clamp(2.5rem, 5vw, 4rem) var(--gcfnf-space-gutter); }
.gcfnf-post-meta { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; color: var(--gcfnf-text-secondary); font-size: 0.9rem; margin-bottom: var(--gcfnf-space-lg); }
.gcfnf-post-meta a { color: var(--gcfnf-text-accent); text-decoration: none; }
.gcfnf-page .wp-block-post-title { color: var(--gcfnf-text-brand); font-size: clamp(2rem, 4vw, 3rem); margin-bottom: var(--gcfnf-space-lg); }
.gcfnf-page-content :where(p, li) { color: var(--gcfnf-text-primary); }
.gcfnf-posts { width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; }
.gcfnf-post-card { display: flex; flex-direction: column; border: var(--gcfnf-card-border); border-radius: var(--gcfnf-card-radius); overflow: hidden; background: var(--gcfnf-card-bg); height: 100%; box-shadow: var(--gcfnf-card-shadow); transition: box-shadow var(--gcfnf-duration-base) var(--gcfnf-ease-out), transform var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-post-card:hover { box-shadow: var(--gcfnf-elev-2); transform: translateY(-2px); }
.gcfnf-post-card > * { margin-block: 0; }
/* Featured image optional: 16:9 banner when set; renders nothing when absent. */
.gcfnf-post-thumb { margin: 0; line-height: 0; }
.gcfnf-post-thumb a { display: block; }
.gcfnf-post-thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.gcfnf-post-card-body { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.25rem; }
.gcfnf-post-card-body > * { margin-block: 0; }
.gcfnf-post-card .wp-block-post-title { font-size: 1.3rem; margin: 0; line-height: var(--gcfnf-lh-snug); }
.gcfnf-post-card .wp-block-post-title a { color: var(--gcfnf-text-brand); text-decoration: none; }
.gcfnf-post-card .wp-block-post-title a:hover { color: var(--gcfnf-text-accent); }
.gcfnf-post-card .wp-block-post-excerpt { margin: 0; color: var(--gcfnf-text-secondary); font-size: 0.96rem; line-height: 1.55; }
.gcfnf-post-card .wp-block-post-excerpt p { margin: 0; }

/* ============================================================== FAQ accordion
   A drop-anywhere expand/collapse list built on core <details> blocks — no JS. */
.gcfnf-faq { width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; display: flex; flex-direction: column; gap: var(--gcfnf-space-sm); }
.gcfnf-faq-item { background: var(--gcfnf-surface-raised); border: var(--gcfnf-card-border); border-radius: var(--gcfnf-radius-md); box-shadow: var(--gcfnf-elev-1); }
.gcfnf-faq-item > summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--gcfnf-space-md); padding: var(--gcfnf-space-md) var(--gcfnf-space-lg); font-weight: var(--gcfnf-fw-bold); color: var(--gcfnf-text-brand); font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-snug); }
.gcfnf-faq-item > summary::-webkit-details-marker { display: none; }
.gcfnf-faq-item > summary::after { content: ""; flex: 0 0 auto; width: 0.6em; height: 0.6em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform var(--gcfnf-duration-base) var(--gcfnf-ease-out); }
.gcfnf-faq-item[open] > summary::after { transform: rotate(-135deg); }
.gcfnf-faq-item > :not(summary) { margin: 0 var(--gcfnf-space-lg) var(--gcfnf-space-md); color: var(--gcfnf-text-secondary); line-height: var(--gcfnf-lh-relaxed); }

/* ============================================================== Testimonial / quote
   A quote card with a decorative quotation mark; quote text + name + role. */
.gcfnf-quote { position: relative; background: var(--gcfnf-surface-warm); border-radius: var(--gcfnf-radius-lg); padding: var(--gcfnf-space-2xl) var(--gcfnf-space-xl) var(--gcfnf-space-xl); box-shadow: var(--gcfnf-elev-1); }
.gcfnf-quote > * { margin-block: 0; }
.gcfnf-quote::before { content: "\201C"; position: absolute; top: var(--gcfnf-space-xs); left: var(--gcfnf-space-lg); font-family: Georgia, "Times New Roman", serif; font-size: var(--gcfnf-fs-display); line-height: 1; color: var(--gcfnf-text-accent); opacity: 0.35; pointer-events: none; }
.gcfnf-quote .gcfnf-quote-text { font-size: var(--gcfnf-fs-body-lg); line-height: var(--gcfnf-lh-relaxed); color: var(--gcfnf-text-primary); margin: 0 0 var(--gcfnf-space-md); }
.gcfnf-quote .gcfnf-quote-cite { display: flex; flex-direction: column; gap: var(--gcfnf-space-2xs); }
.gcfnf-quote .gcfnf-quote-name { font-weight: var(--gcfnf-fw-black); color: var(--gcfnf-text-brand); margin: 0; }
.gcfnf-quote .gcfnf-quote-role { font-size: var(--gcfnf-fs-body-sm); color: var(--gcfnf-text-secondary); margin: 0; }

/* ============================================================== Content split (image + text)
   Two-up grid: a Cover photo beside a heading/paragraph/button. The
   .gcfnf-split-reverse modifier swaps sides for alternating rows. */
.wp-block-columns.gcfnf-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gcfnf-space-gutter); align-items: center; width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; }
.gcfnf-split > .wp-block-column { margin-block: 0; }
.gcfnf-split-media .wp-block-cover { border-radius: var(--gcfnf-radius-lg); overflow: hidden; }
.gcfnf-split-media .wp-block-cover__inner-container { display: none; }
.gcfnf-split-copy { display: flex; flex-direction: column; gap: var(--gcfnf-space-md); }
.gcfnf-split-copy > * { margin-block: 0; }
.gcfnf-split-copy h2 { color: var(--gcfnf-text-brand); font-size: var(--gcfnf-fs-h2-fluid); line-height: var(--gcfnf-lh-snug); margin: 0; }
.gcfnf-split.gcfnf-split-reverse .gcfnf-split-media { order: 2; }

/* ============================================================== Feature row (icons + text)
   2–4 columns, each an accent-colored icon (via gcfnf-ic-*) + heading + text.
   auto-fit grid handles 2/3/4 columns and stacks on small screens. */
.wp-block-columns.gcfnf-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--gcfnf-space-gutter); width: min(var(--gcfnf-container-content), 100%); margin-inline: auto; }
.gcfnf-feature { text-align: center; padding: var(--gcfnf-space-md); }
.gcfnf-feature > * { margin-block: 0; }
.gcfnf-feature::before { width: 48px; height: 48px; margin: 0 auto var(--gcfnf-space-xs); background-color: var(--gcfnf-text-accent); }
.gcfnf-feature h3 { color: var(--gcfnf-text-brand); font-size: var(--gcfnf-fs-h3); line-height: var(--gcfnf-lh-snug); margin: var(--gcfnf-space-sm) 0 var(--gcfnf-space-xs); }
.gcfnf-feature p { color: var(--gcfnf-text-secondary); margin: 0; line-height: var(--gcfnf-lh-relaxed); }

/* ============================================================== About page
   Section rhythm for the About Us starter pattern (gcfnf/about-page). */
.gcfnf-about-section { margin-block-start: var(--gcfnf-space-section); }

/* ============================================================== Responsive */
@media (max-width: 1080px) {
  .wp-block-columns.gcfnf-impact2-stats { grid-template-columns: repeat(3, 1fr); row-gap: 1.75rem; }
  .wp-block-columns.gcfnf-footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .gcfnf-different-grid { grid-template-columns: 1fr; }
  .gcfnf-impact2-head { grid-template-columns: 1fr; }
  .gcfnf-partners2-grid { grid-template-columns: repeat(3, 1fr); }
  .wp-block-columns.gcfnf-timeline { grid-template-columns: 1fr; margin-top: 1.5rem; }
  .gcfnf-timeline::before, .gcfnf-tl-card::before { display: none; }
}
@media (max-width: 760px) {
  .wp-block-columns.gcfnf-actions { grid-template-columns: 1fr; }
  .wp-block-columns.gcfnf-split { grid-template-columns: 1fr; }
  .gcfnf-split.gcfnf-split-reverse .gcfnf-split-media { order: 0; }
  .gcfnf-founder { grid-template-columns: 1fr; text-align: center; }
  .gcfnf-founder-photo { max-width: 220px; margin-inline: auto; }
  .wp-block-columns.gcfnf-impact2-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .wp-block-columns.gcfnf-impact2-stats { grid-template-columns: repeat(2, 1fr); }
  .gcfnf-partners2-grid { grid-template-columns: repeat(2, 1fr); }
  .wp-block-columns.gcfnf-footer-top { grid-template-columns: 1fr; }
  .gcfnf-topnav .wp-block-navigation-item__content { font-size: 0.72rem; padding: 0.2rem 0.45rem; }
  .gcfnf-hero-arrow { width: 38px; height: 38px; }
}