/* NaariSamata site layer. Migrated from Divi Theme Options, 2026-09-25.
 * Native Divi settings remain in the builder. Keep CSS-only interactions,
 * pseudo-elements, accessibility helpers and scoped compatibility rules here.
 */

/* ==========================================================================
   NaariSamata — custom layer for what Divi 5 cannot set natively.
   Colours come from Divi variables (NS / … in the Variable Manager).
   ========================================================================== */

/* Hero H1: italic accent word ("every") */
.ns-hero-title em { font-style: italic; color: var(--gcid-ns-action, #B4533A); }

/* Project cards: consistent 16:10 photos; image left / copy right on phones */
.ns-card-img, .ns-card-img .et_pb_image_wrap { display: block; width: 100%; margin: 0 !important; }
.ns-card-img img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.ns-card img { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.ns-card:hover img { transform: scale(1.04); }
@media (max-width: 767px) {
  .ns-card .ns-card-img { flex: 0 0 36%; max-width: 36%; }
  .ns-card-img .et_pb_image_wrap, .ns-card-img img { height: 100%; min-height: 128px; aspect-ratio: auto; }
}

/* Impact counters: "+" suffix and tabular figures */
.ns-stat-plus .percent-value::after { content: "+"; }
.ns-stat .percent-value { font-variant-numeric: lining-nums tabular-nums; }

/* Handwritten notes placed over photos need a shadow to stay legible */
.ns-script-shadow { text-shadow: 0 2px 10px rgba(0, 0, 0, .45); }

/* Keyboard focus that is visible on every NS surface (WCAG 2.4.7 / 2.4.11) */
.et-l a:focus-visible, .et-l .et_pb_button:focus-visible, .et-l button:focus-visible {
  outline: 3px solid var(--gcid-ns-action, #B4533A); outline-offset: 3px; border-radius: 4px;
}
.et-l--footer a:focus-visible { outline-color: #F2C4AE; }

/* Links inside NS text: underline on hover for affordance */
.ns-card-link a:hover, .et-l .preset--group--divi-text--divi-font-body a:hover { text-decoration: underline; text-underline-offset: 4px; }

@media (prefers-reduced-motion: reduce) {
  .ns-card img, .ns-card { transition: none !important; }
  .ns-card:hover img { transform: none; }
}

/* Featured story: cropped photo + decorative opening quote mark */
.ns-story-img, .ns-story-img .et_pb_image_wrap { display: block; margin: 0 !important; }
.ns-story-img img { display: block; width: 100%; height: 100px; object-fit: cover; object-position: 50% 30%; border-radius: 10px; }
.ns-quote { position: relative; }
.ns-quote::before { content: "\201C"; position: absolute; left: -2.75rem; top: -.35em; font: 600 4.5rem/1 "Newsreader", Georgia, serif; color: var(--gcid-ns-terracotta, #BC7C5A); opacity: .55; }
@media (max-width: 767px) {
  .ns-story-img img { height: 170px; }
  .ns-quote::before { left: -2.25rem; font-size: 3.4rem; }
}

/* Footer links: light on charcoal (the NS link colour is for light surfaces) */
.ns-footer-links a { color: #E8DFDA !important; }
.ns-footer-links a:hover { color: #FFFFFF !important; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 767px) {
  .ns-story-img { width: 100% !important; max-width: 100% !important; }
}

/* Counters: remove Divi's default gap between figure and label */
.ns-stat .et_pb_number_counter .percent { margin: 0 !important; height: auto !important; }
.ns-stat .et_pb_number_counter .percent p { margin: 0 !important; padding: 0 !important; }
.ns-stat .et_pb_number_counter .title { margin: 0 !important; padding: 0 !important; }

/* Standalone links get a ≥24px target (WCAG 2.5.8): Link preset, header switcher */
[class*="5c23e951-2e87-4ab9-97e9-60635bcef68e"] a,
.et-l--header .et_pb_text a { display: inline-block; min-width: 24px; padding-block: 4px; }

/* Skip link: hidden until keyboard focus */
.ns-skip { z-index: 100000; background: var(--gcid-ns-action, #B4533A); color: #fff !important; border-radius: 6px; font-weight: 600; }
#et-main-area:focus { outline: none; }

/* NS headings: layout gaps handle spacing, so drop Divi's default padding under h1–h6 */
[class*="preset--group--divi-heading--divi-font"] .et_pb_module_header { padding-bottom: 0 !important; }

/* SDG labels hyphenate rather than split mid-word on narrow desktops */
.ns-sdg p { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: normal; word-break: normal; }

/* Footer: keep the external-link arrow with its label */
.ns-footer-links a { white-space: nowrap; }

/* ---------- Font Awesome arrows (replace typed → / ↗) ---------- */
.ns-arrow a::after, .ns-ext a::after {
  font-family: "FontAwesome"; font-weight: 900; font-style: normal; display: inline-block;
  margin-left: .45em; font-size: .78em; line-height: 1; transition: transform .25s cubic-bezier(.2,.7,.2,1);
}
.ns-arrow a::after { content: "\f061"; content: "\f061" / ""; }
.ns-ext a::after { content: "\f35d"; content: "\f35d" / ""; font-size: .7em; opacity: .75; }
.ns-arrow a:hover::after { transform: translateX(3px); }
.ns-ext a:hover::after { transform: translate(2px, -2px); }

/* ---------- Footer details ---------- */
.ns-foot-head .et_pb_module_header::after { content: ""; display: block; width: 28px; height: 2px; margin-top: .6rem; background: var(--gcid-ns-terracotta, #BC7C5A); border-radius: 2px; }
.ns-social a { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); color: #fff !important; transition: background-color .2s, border-color .2s; }
.ns-social a::before { font-family: "FontAwesome"; font-weight: 400; font-size: 20px; line-height: 1; }
.ns-social .ns-i-instagram::before { content: "\f16d"; content: "\f16d" / ""; }
.ns-social a:hover { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); text-decoration: none !important; }
.ns-credit strong { color: #fff; font-weight: 600; }
.ns-credit::before { content: "\f121"; content: "\f121" / ""; font-family: "FontAwesome"; font-weight: 900; margin-right: .45em; font-size: .85em; color: #F2C4AE; }

/* ==========================================================================
   Header: desktop nav ≥ 1100px, custom mobile mega menu below.
   The drawer is built by the "Mobile mega menu" Code module from the same WP menu.
   ========================================================================== */
.ns-brand { margin-right: auto; }
.ns-mobile-nav { display: none; }
@media (max-width: 1099px) {
  .ns-desktop-nav { display: none !important; }
  .ns-mobile-nav { display: block; }
}
@media (max-width: 400px) {
  .ns-header-donate .et_pb_button, a.ns-header-donate { padding: .7em 1.1em !important; }
}

.ns-burger { display: grid; gap: 5px; place-content: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--gcid-ns-line, #EEDCCF); border-radius: 50%; background: #fff; cursor: pointer; }
.ns-burger span { display: block; width: 20px; height: 2px; border-radius: 2px; background: var(--gcid-ns-ink, #1F2945); }
.ns-burger:hover { border-color: var(--gcid-ns-action, #B4533A); }

html.ns-lock, html.ns-lock body { overflow: hidden; }
.ns-drawer { position: fixed; inset: 0; z-index: 100000; }
.ns-drawer[hidden] { display: none; }
.ns-drawer__scrim { position: absolute; inset: 0; background: rgba(31, 41, 69, .45); opacity: 0; transition: opacity .3s; }
.ns-drawer__panel {
  position: absolute; inset: 0 0 0 auto; width: min(440px, 100%); overflow-y: auto; overscroll-behavior: contain;
  background: var(--gcid-ns-paper, #FFFCF6); padding: 18px 22px 32px; display: flex; flex-direction: column; gap: 18px;
  transform: translateX(100%); transition: transform .35s cubic-bezier(.2,.7,.2,1); box-shadow: -20px 0 50px -20px rgba(0,0,0,.35);
  font-family: "Figtree", system-ui, sans-serif;
}
.ns-drawer.is-open .ns-drawer__scrim { opacity: 1; }
.ns-drawer.is-open .ns-drawer__panel { transform: none; }

.ns-drawer__top { display: flex; align-items: center; justify-content: space-between; }
.ns-drawer__brand { font: 600 1.6rem/1 "Newsreader", Georgia, serif; color: var(--gcid-ns-action, #B4533A) !important; }
.ns-drawer__close { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--gcid-ns-line, #EEDCCF); background: #fff; cursor: pointer; color: var(--gcid-ns-ink, #1F2945); }
.ns-drawer__close::before { content: "\f00d"; content: "\f00d" / ""; font: 900 18px/1 "FontAwesome"; }

.ns-drawer__search { display: flex; border: 1.5px solid var(--gcid-ns-line, #EEDCCF); border-radius: 8px; background: #fff; overflow: hidden; }
.ns-drawer__search input { flex: 1; min-width: 0; border: 0; padding: 12px 14px; font: inherit; font-size: .95rem; background: transparent; color: var(--gcid-ns-ink, #1F2945); }
.ns-drawer__search button { width: 48px; border: 0; background: var(--gcid-ns-action, #B4533A); color: #fff; cursor: pointer; }
.ns-drawer__search button::before { content: "\f002"; content: "\f002" / ""; font: 900 16px/1 "FontAwesome"; }

.ns-drawer__nav { list-style: none; margin: 0; padding: 0; }
.ns-drawer__item { border-bottom: 1px solid var(--gcid-ns-line, #EEDCCF); }
.ns-acc { display: flex; align-items: center; justify-content: space-between; }
.ns-acc__link { flex: 1; display: block; padding: 14px 0; font: 600 1.3rem/1.2 "Newsreader", Georgia, serif; color: var(--gcid-ns-ink, #1F2945) !important; }
.ns-acc__link:hover { color: var(--gcid-ns-action, #B4533A) !important; }
.ns-acc__toggle { width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--gcid-ns-blush, #F6E3D9); color: var(--gcid-ns-action, #B4533A); cursor: pointer; }
.ns-acc__toggle::before { content: "\f078"; content: "\f078" / ""; font: 900 14px/1 "FontAwesome"; display: inline-block; transition: transform .25s; }
.ns-acc__toggle[aria-expanded="true"]::before { transform: rotate(180deg); }
/* Sub-menus open as a 2-up tile grid (the "mega" part) */
.ns-acc__panel { list-style: none; margin: 0 0 16px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ns-acc__panel[hidden] { display: none; }
.ns-acc__panel a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 52px; padding: 10px 12px; border-radius: 10px; background: var(--gcid-ns-panel, #FFF3EC); border: 1px solid var(--gcid-ns-panel-line, #F5E6DC); font-size: .9rem; font-weight: 600; line-height: 1.25; color: var(--gcid-ns-ink, #1F2945) !important; }
.ns-acc__panel a::after { content: "\f061"; content: "\f061" / ""; font: 900 11px/1 "FontAwesome"; color: var(--gcid-ns-action, #B4533A); }
.ns-acc__panel a:hover { border-color: var(--gcid-ns-action, #B4533A); }
@media (max-width: 340px) { .ns-acc__panel { grid-template-columns: 1fr; } }

.ns-drawer__donate { padding: 18px; border-radius: 16px; background: linear-gradient(135deg, #FBE6DB, #FDF1EA); border: 1px solid #F5E1D5; }
.ns-drawer__donate p { margin: 0 0 12px; font-size: .9rem; color: var(--gcid-ns-charcoal, #4A4543); padding: 0; }
.ns-drawer__donate .ns-drawer__donate-title { margin-bottom: 4px; font: 600 1.25rem/1.2 "Newsreader", Georgia, serif; color: var(--gcid-ns-ink, #1F2945); }
.ns-drawer__donate-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 6px; background: var(--gcid-ns-action, #B4533A); color: #fff !important; font-weight: 600; font-size: .95rem; }
.ns-drawer__donate-btn::before { content: "\f004"; content: "\f004" / ""; font: 900 14px/1 "FontAwesome"; }
.ns-drawer__donate-btn:hover { background: var(--gcid-ns-action-dark, #9E4230); }

.ns-drawer__family { display: flex; flex-direction: column; }
.ns-drawer__label { margin: 0 0 4px; padding: 0; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--gcid-ns-action-dark, #9E4230); }
.ns-drawer__family a { display: flex; align-items: center; gap: 6px; min-height: 40px; font-size: .95rem; color: var(--gcid-ns-ink, #1F2945) !important; }
.ns-drawer__family a[aria-current] { color: var(--gcid-ns-action, #B4533A) !important; font-weight: 600; }
.ns-drawer__ext::after { content: "\f35d"; content: "\f35d" / ""; font: 900 10px/1 "FontAwesome"; opacity: .7; }
.ns-drawer__script { margin: 0; padding: 0; font: 500 1.5rem/1.1 "Caveat", cursive; color: var(--gcid-ns-action, #B4533A); transform: rotate(-3deg); }
.ns-drawer a:focus-visible, .ns-drawer button:focus-visible, .ns-drawer input:focus-visible { outline: 3px solid var(--gcid-ns-action, #B4533A); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .ns-drawer__panel, .ns-drawer__scrim, .ns-acc__toggle::before { transition: none; } }

/* Drawer fixes: no shrinking inside the scrollable panel; no Divi list bullets/indent */
.ns-drawer__panel > * { flex-shrink: 0; }
.ns-drawer ul, .ns-drawer li { list-style: none !important; margin-left: 0; padding-left: 0 !important; }
.ns-drawer ul { padding-bottom: 0 !important; }
.ns-drawer li::before, .ns-drawer li::marker { content: none !important; }

/* Hamburger hover: fill terracotta, lines turn white and stagger */
.ns-burger { justify-items: end; transition: background-color .25s, border-color .25s, transform .25s; }
.ns-burger span { transition: width .3s cubic-bezier(.2,.7,.2,1), background-color .25s, transform .3s cubic-bezier(.2,.7,.2,1); }
.ns-burger span:nth-child(2) { width: 14px; }
.ns-burger span:nth-child(3) { width: 17px; }
.ns-burger:hover, .ns-burger:focus-visible { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); transform: scale(1.05); }
.ns-burger:hover span, .ns-burger:focus-visible span { background: #fff; }
.ns-burger:hover span:nth-child(1), .ns-burger:focus-visible span:nth-child(1) { width: 14px; }
.ns-burger:hover span:nth-child(2), .ns-burger:focus-visible span:nth-child(2) { width: 20px; transform: translateX(-2px); }
.ns-burger:hover span:nth-child(3), .ns-burger:focus-visible span:nth-child(3) { width: 10px; }
@media (prefers-reduced-motion: reduce) { .ns-burger, .ns-burger span { transition: none; } .ns-burger:hover { transform: none; } }

/* Utility bar: family site switcher as segmented pills */
.ns-switcher p { display: flex; align-items: center; justify-content: inherit; gap: 6px; font-size: 0 !important; line-height: 1 !important; }
.ns-switcher p::before { content: "\f0ac"; content: "\f0ac" / ""; font: 900 13px/1 "FontAwesome"; color: var(--gcid-ns-action, #B4533A); margin-right: 4px; }
.ns-switcher a {
  font-size: .8125rem !important; font-weight: 600; letter-spacing: .02em; line-height: 1;
  padding: 7px 14px !important; border-radius: 999px; border: 1px solid var(--gcid-ns-line, #EEDCCF);
  background: #fff; color: var(--gcid-ns-ink, #1F2945) !important; text-decoration: none !important;
  transition: background-color .2s, border-color .2s, color .2s;
}
.ns-switcher a strong { font-weight: inherit; }
.ns-switcher a:hover { border-color: var(--gcid-ns-action, #B4533A); color: var(--gcid-ns-action, #B4533A) !important; }
.ns-switcher a[aria-current] { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); color: #fff !important; }
@media (max-width: 767px) { .ns-switcher p { justify-content: center; } }

/* Skip link: visually hidden until focused (robust to any wrapper) */
.ns-skip { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; top: 0 !important; left: 0; padding: 0 !important; }
.ns-skip:focus { width: auto; height: auto; clip: auto; overflow: visible; top: 12px !important; left: 16px; padding: 10px 16px !important; }

/* Social icon glyphs (FA brands, shared by header capsule + drawer) */
.ns-i-facebook::before  { content: "\f39e"; content: "\f39e" / ""; }
.ns-i-instagram::before { content: "\f16d"; content: "\f16d" / ""; }
.ns-i-twitter::before   { content: "\f099"; content: "\f099" / ""; }
.ns-i-linkedin::before  { content: "\f0e1"; content: "\f0e1" / ""; }
.ns-i-youtube::before   { content: "\f167"; content: "\f167" / ""; }

/* Header social capsule: hover/tap drops a pill of round icons */
.ns-social-menu { position: relative; }
.ns-social-menu__btn { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 1px solid var(--gcid-ns-line, #EEDCCF); background: #fff; color: var(--gcid-ns-action, #B4533A); cursor: pointer; transition: background-color .25s, color .25s, border-color .25s, transform .25s; }
.ns-social-menu__btn::before { content: "\f1e0"; content: "\f1e0" / ""; font: 900 16px/1 "FontAwesome"; transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.ns-social-menu.is-open .ns-social-menu__btn, .ns-social-menu__btn:hover { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); color: #fff; }
.ns-social-menu.is-open .ns-social-menu__btn::before { transform: rotate(-20deg) scale(1.1); }
.ns-social-menu__list {
  position: absolute; top: calc(100% + 10px); left: 50%; z-index: 1000;
  display: flex; flex-direction: column; gap: 8px; margin: 0 !important; padding: 8px !important; list-style: none !important;
  background: #fff; border: 1px solid var(--gcid-ns-line, #EEDCCF); border-radius: 999px;
  box-shadow: 0 18px 36px -18px rgba(96, 52, 30, .45);
  transform: translate(-50%, -8px) scaleY(.6); transform-origin: top center; opacity: 0; visibility: hidden;
  transition: opacity .25s, transform .35s cubic-bezier(.2,.7,.2,1), visibility .25s;
}
.ns-social-menu__list::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* hover bridge */
.ns-social-menu.is-open .ns-social-menu__list { opacity: 1; visibility: visible; transform: translate(-50%, 0) scaleY(1); }
.ns-social-menu__list li { list-style: none !important; padding: 0 !important; margin: 0 !important; opacity: 0; transform: translateY(-6px); transition: opacity .25s, transform .3s; }
.ns-social-menu.is-open .ns-social-menu__list li { opacity: 1; transform: none; }
.ns-social-menu.is-open .ns-social-menu__list li:nth-child(2) { transition-delay: .04s; }
.ns-social-menu.is-open .ns-social-menu__list li:nth-child(3) { transition-delay: .08s; }
.ns-social-menu.is-open .ns-social-menu__list li:nth-child(4) { transition-delay: .12s; }
.ns-social-menu.is-open .ns-social-menu__list li:nth-child(5) { transition-delay: .16s; }
.ns-social-menu__link { display: grid !important; place-items: center; width: 40px; height: 40px; padding: 0 !important; border-radius: 50%; background: var(--gcid-ns-panel, #FFF3EC); color: var(--gcid-ns-action, #B4533A) !important; transition: background-color .2s, color .2s, transform .2s; }
.ns-social-menu__link::before { font: 400 17px/1 "FontAwesome"; }
.ns-social-menu__link:hover, .ns-social-menu__link:focus-visible { background: var(--gcid-ns-action, #B4533A); color: #fff !important; transform: scale(1.08); }
@media (max-width: 600px) { .ns-social-wrap { display: none !important; } }

/* Drawer social row */
.ns-drawer__social { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 !important; padding: 0 !important; }
.ns-drawer__social-link { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--gcid-ns-line, #EEDCCF); background: #fff; color: var(--gcid-ns-action, #B4533A) !important; }
.ns-drawer__social-link::before { font: 400 18px/1 "FontAwesome"; }
.ns-drawer__social-link:hover { background: var(--gcid-ns-action, #B4533A); color: #fff !important; }

/* Header Donate: heart that beats on hover, lift + glow */
a.ns-header-donate { display: inline-flex !important; align-items: center; gap: .5em; transition: transform .2s cubic-bezier(.2,.7,.2,1), box-shadow .2s, background-color .2s !important; }
a.ns-header-donate::before { content: "\f004"; content: "\f004" / ""; font: 900 .9em/1 "FontAwesome"; display: inline-block; position: static !important; opacity: 1 !important; margin: 0 !important; }
a.ns-header-donate:hover { transform: translateY(-2px); box-shadow: 0 12px 22px -12px rgba(180, 83, 58, .85); }
@media (prefers-reduced-motion: reduce) {
  .ns-social-menu__list, .ns-social-menu__list li, a.ns-header-donate { transition: none !important; }
}
/* Divi hides button ::before and forces ETmodules — override for the Donate heart */
a.ns-header-donate::before, a.ns-header-donate:hover::before {
  content: "\f004" !important; font-family: "FontAwesome" !important; font-weight: 900 !important;
  font-size: .9em !important; line-height: 1 !important; display: inline-block !important;
  position: static !important; opacity: 1 !important; margin: 0 !important;
}
body #page-container .et_pb_section a.ns-header-donate.et_pb_button::before {
  display: inline-block !important; content: "\f004" !important; font-family: "FontAwesome" !important; font-weight: 900 !important;
  font-size: .9em !important; line-height: 1 !important; position: static !important; opacity: 1 !important; margin: 0 !important;
}

/* ==========================================================================
   Desktop mega menu — Divi menu dropdowns restyled as full-width visual panels.
   Links still come from WP menu "NS Main Navigation"; the enhancer script adds imagery.
   ========================================================================== */
@media (min-width: 1100px) {
  /* Let the panel anchor to the header bar, not the menu item */
  .ns-desktop-nav, .ns-desktop-nav .et_pb_menu_inner_container, .ns-desktop-nav .et_pb_menu__wrap,
  .ns-desktop-nav .et_pb_menu__menu, .ns-desktop-nav nav, .ns-desktop-nav ul.et-menu, .ns-desktop-nav .et-menu > li.ns-mega { position: static !important; }

  .ns-desktop-nav .et-menu > li.ns-mega > ul.ns-mega__panel {
    position: absolute !important; left: 0 !important; right: 0 !important; top: calc(100% + 1px) !important;
    width: auto !important; max-width: none !important; margin: 0 !important; padding: 22px !important;
    display: grid !important; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(240px, .9fr);
    background: #fff !important; border: 1px solid var(--gcid-ns-line, #EEDCCF) !important; border-top: 3px solid var(--gcid-ns-action, #B4533A) !important;
    border-radius: 0 0 16px 16px; box-shadow: 0 30px 60px -30px rgba(60, 30, 20, .35) !important;
    transform: translateY(8px); transition: opacity .2s, transform .25s cubic-bezier(.2,.7,.2,1), visibility .2s !important;
  }
  .ns-desktop-nav .et-menu > li.ns-mega:hover > ul.ns-mega__panel,
  .ns-desktop-nav .et-menu > li.ns-mega:focus-within > ul.ns-mega__panel,
  .ns-desktop-nav .et-menu > li.ns-mega.et-show-dropdown > ul.ns-mega__panel { opacity: 1 !important; visibility: visible !important; transform: none; }
  /* Invisible bridge so moving the pointer down to the panel doesn't close it */
  .ns-desktop-nav .et-menu > li.ns-mega > ul.ns-mega__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -28px; height: 28px; }

  .ns-mega__panel--icons { grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(240px, .9fr) !important; grid-auto-rows: 1fr; }
  .ns-mega__panel > li { width: auto !important; padding: 0 !important; margin: 0 !important; list-style: none !important; }
  .ns-mega__panel--cards > li.ns-mega__feature { grid-column: 4; grid-row: 1 / span 2; }
  .ns-mega__panel--icons > li.ns-mega__feature { grid-column: 3; grid-row: 1 / span 2; }

  /* Cards */
  .ns-desktop-nav .ns-mega__panel a.ns-mega__card {
    display: flex !important; gap: 12px; align-items: center; width: auto !important; height: 100%; padding: 10px !important;
    border-radius: 12px; border: 1px solid transparent; background: var(--gcid-ns-panel, #FFF3EC); color: var(--gcid-ns-ink, #1F2945) !important;
    opacity: 1 !important; line-height: 1.3; transition: border-color .2s, transform .2s, box-shadow .2s !important;
  }
  .ns-desktop-nav .ns-mega__panel a.ns-mega__card:hover, .ns-desktop-nav .ns-mega__panel a.ns-mega__card:focus-visible {
    border-color: var(--gcid-ns-action, #B4533A); transform: translateY(-2px); box-shadow: 0 12px 24px -16px rgba(96,52,30,.45);
  }
  .ns-desktop-nav .ns-mega__panel a.ns-mega__card::after { display: none !important; }
  .ns-mega__img { flex: 0 0 92px; width: 92px; height: 72px; object-fit: cover; border-radius: 8px; }
  .ns-mega__icon { flex: 0 0 48px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: var(--gcid-ns-blush, #F6E3D9); color: var(--gcid-ns-action, #B4533A); }
  .ns-mega__icon::before { font: 900 19px/1 "FontAwesome"; }
  .ns-mega__icon--donate::before { content: "\f004"; content: "\f004" / ""; }
  .ns-mega__icon--volunteer::before { content: "\f4c4"; content: "\f4c4" / ""; }
  .ns-mega__icon--sponsor::before { content: "\f501"; content: "\f501" / ""; }
  .ns-mega__icon--corporate::before { content: "\f2b5"; content: "\f2b5" / ""; }
  .ns-mega__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
  .ns-mega__tag { align-self: flex-start; font-size: .625rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gcid-ns-action-dark, #9E4230); background: #fff; padding: 3px 7px; border-radius: 999px; }
  .ns-mega__title { font: 600 1.02rem/1.2 "Newsreader", Georgia, serif; color: var(--gcid-ns-ink, #1F2945); }
  .ns-mega__desc { font-size: .8125rem; line-height: 1.35; color: var(--gcid-ns-charcoal, #4A4543); font-weight: 400; }

  /* Feature column */
  .ns-mega__feature {
    display: flex !important; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 22px !important; border-radius: 14px;
    background: linear-gradient(160deg, var(--gcid-ns-action, #B4533A), var(--gcid-ns-action-dark, #9E4230)); color: #fff;
    position: relative; overflow: hidden;
  }
  .ns-mega__feature::before { content: "\f004"; content: "\f004" / ""; position: absolute; right: -10px; top: -18px; font: 900 120px/1 "FontAwesome"; color: rgba(255,255,255,.1); }
  .ns-mega__feature-title { font: 600 1.35rem/1.15 "Newsreader", Georgia, serif; }
  .ns-mega__feature-text { font-size: .875rem; line-height: 1.45; opacity: .92; }
  .ns-desktop-nav .ns-mega__panel a.ns-mega__feature-link {
    align-self: flex-start; display: inline-flex !important; align-items: center; gap: 8px; width: auto !important; margin-top: 6px;
    padding: 10px 16px !important; border-radius: 6px; background: #fff; color: var(--gcid-ns-action, #B4533A) !important; font-weight: 600; font-size: .875rem;
  }
  .ns-desktop-nav .ns-mega__panel a.ns-mega__feature-link::after { content: "\f061"; content: "\f061" / ""; font: 900 .8em/1 "FontAwesome"; display: inline-block !important; position: static !important; }
}
@media (prefers-reduced-motion: reduce) { .ns-desktop-nav .ns-mega__panel, .ns-mega__card { transition: none !important; transform: none !important; } }

/* Header actions: share, Donate and burger all exactly 46px tall */
.ns-social-menu__btn, .ns-burger { width: 46px !important; height: 46px !important; }
body #page-container .et_pb_section a.ns-header-donate.et_pb_button { height: 46px; padding-top: 0 !important; padding-bottom: 0 !important; box-sizing: border-box; }
.et_pb_button_module_wrapper:has(> a.ns-header-donate) { display: flex; align-items: center; }

/* Mega feature card keeps its padding (beats the generic li reset); menu module has no white box */
.ns-desktop-nav .ns-mega__panel > li.ns-mega__feature { padding: 22px !important; }
.ns-desktop-nav, .ns-desktop-nav .et_pb_menu_inner_container, .ns-desktop-nav .et_pb_menu__wrap, .ns-desktop-nav .et-menu-nav { background: transparent !important; }
body #page-container .et_pb_section a.ns-header-donate.et_pb_button,
body #page-container .et_pb_section a.ns-header-donate.et_pb_button:hover {
  display: inline-flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important;
  gap: .5em; height: 46px !important; padding: 0 1.4em !important; line-height: 1 !important;
}
body #page-container .et_pb_section a.ns-header-donate.et_pb_button::before { top: auto !important; bottom: auto !important; left: auto !important; right: auto !important; align-self: center !important; margin-top: 1px !important; }
body #page-container .et_pb_section a.ns-header-donate.et_pb_button::before { transform: none !important; }
a.ns-header-donate:hover::before { animation: ns-beat-scale 1.1s ease-in-out infinite !important; }
@keyframes ns-beat-scale { 0%, 100% { scale: 1; } 15% { scale: 1.25; } 30% { scale: 1; } 45% { scale: 1.15; } }
@media (prefers-reduced-motion: reduce) { a.ns-header-donate:hover::before { animation: none !important; } }

/* ---------- Compact header search (replaces Divi's full-width search) ---------- */
.ns-hsearch { position: relative; }
.ns-hsearch__btn { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 1px solid var(--gcid-ns-line, #EEDCCF); background: #fff; color: var(--gcid-ns-ink, #1F2945); cursor: pointer; transition: background-color .25s, color .25s, border-color .25s; }
.ns-hsearch__btn::before { content: "\f002"; content: "\f002" / ""; font: 900 16px/1 "FontAwesome"; }
.ns-hsearch.is-open .ns-hsearch__btn::before { content: "\f00d"; content: "\f00d" / ""; }
.ns-hsearch__btn:hover, .ns-hsearch.is-open .ns-hsearch__btn { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); color: #fff; }
.ns-hsearch__panel {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 1001; width: min(360px, calc(100vw - 32px));
  display: flex; padding: 6px; gap: 6px; background: #fff; border: 1px solid var(--gcid-ns-line, #EEDCCF); border-radius: 999px;
  box-shadow: 0 18px 36px -18px rgba(96, 52, 30, .45);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s, transform .25s cubic-bezier(.2,.7,.2,1), visibility .2s;
}
.ns-hsearch.is-open .ns-hsearch__panel { opacity: 1; visibility: visible; transform: none; }
.ns-hsearch__panel input { flex: 1; min-width: 0; border: 0 !important; background: transparent !important; padding: 10px 14px !important; font: 400 .95rem/1.2 "Figtree", system-ui, sans-serif; color: var(--gcid-ns-ink, #1F2945); outline: none; }
.ns-hsearch__panel:focus-within { border-color: var(--gcid-ns-action, #B4533A); }
.ns-hsearch__go { flex: 0 0 40px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--gcid-ns-action, #B4533A); color: #fff; cursor: pointer; }
.ns-hsearch__go::before { content: "\f061"; content: "\f061" / ""; font: 900 14px/1 "FontAwesome"; }
@media (max-width: 1099px) { .ns-hsearch-wrap { display: none !important; } } /* the drawer has its own search */

/* ---------- Testimonials carousel ---------- */
.ns-tcar__track { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.ns-tcar__track::-webkit-scrollbar { display: none; }
.ns-tcar__slide { flex: 0 0 100% !important; max-width: 100% !important; scroll-snap-align: start; box-shadow: 0 30px 60px -40px rgba(96, 52, 30, .45); }
.ns-tcar__img { flex: 0 0 42%; max-width: 42%; margin: 0 !important; }
.ns-tcar__img .et_pb_image_wrap, .ns-tcar__img img { display: block; width: 100%; height: 100%; min-height: clamp(260px, 26vw, 400px); object-fit: cover; object-position: 50% 30%; }
@media (max-width: 980px) { .ns-tcar__img { flex-basis: 38%; max-width: 38%; } }
.ns-tcar__quote p { padding: 0 !important; }
.ns-tcar__nav { display: flex; align-items: center; gap: 10px; }
.ns-tcar__nav[hidden] { display: none; }
.ns-tcar__btn { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--gcid-ns-line, #EEDCCF); background: #fff; color: var(--gcid-ns-ink, #1F2945); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ns-tcar__btn::before { font: 900 15px/1 "FontAwesome"; }
.ns-tcar__btn--prev::before { content: "\f060"; content: "\f060" / ""; }
.ns-tcar__btn--next::before { content: "\f061"; content: "\f061" / ""; }
.ns-tcar__btn:hover { background: var(--gcid-ns-action, #B4533A); border-color: var(--gcid-ns-action, #B4533A); color: #fff; }
.ns-tcar__dots { display: flex; gap: 2px; }
.ns-tcar__dot { width: 24px; height: 44px; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.ns-tcar__dot::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #D9B3A0; transition: background-color .2s, transform .2s; }
.ns-tcar__dot[aria-current="true"]::before { background: var(--gcid-ns-action, #B4533A); transform: scale(1.2); }
@media (max-width: 767px) {
  .ns-tcar__img { flex-basis: auto; max-width: 100%; }
  .ns-tcar__img .et_pb_image_wrap, .ns-tcar__img img { min-height: 0; height: 220px; }
}
.ns-tcar__slide .et_pb_icon { align-self: flex-start; text-align: left; margin: 0 !important; }

/* Client leaf motifs as quiet corner accents (Divi's "initial" size is the full 700px artwork) */
.ns-thanks { background-size: clamp(200px, 20vw, 280px) auto !important; background-position: right -70px bottom -70px !important; }
@media (max-width: 767px) {
    .ns-thanks { background-size: 180px auto !important; }
}
/* Sponsor logos: consistent optical size inside their tiles */
.ns-logo, .ns-logo .et_pb_image_wrap { display: block; margin: 0 auto !important; }
.ns-logo img { display: block; max-height: 88px; width: auto; max-width: 100%; object-fit: contain; margin: 0 auto; }
.ns-sdg-card { box-shadow: 0 16px 30px -24px rgba(96, 52, 30, .35); }

/* ---------- Refinement pass ---------- */
/* Project cards: "Learn more" sits on the bottom edge so every card in a row lines up */
.ns-card .ns-card-link { margin-top: auto !important; }

/* Testimonials: centred portrait layout */
.ns-tcar__slide { position: relative; justify-content: center; }
.ns-tcar__avatar, .ns-tcar__avatar .et_pb_image_wrap { display: block; width: 116px; height: 116px; margin: 0 auto !important; }
.ns-tcar__avatar img { width: 116px; height: 116px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; border: 4px solid #fff; box-shadow: 0 0 0 3px var(--gcid-ns-blush, #F6E3D9), 0 14px 26px -14px rgba(96,52,30,.5); }
.ns-tcar__slide .et_pb_text { position: relative; z-index: 1; }
.ns-tcar__nav { justify-content: center; }
@media (max-width: 767px) {
  .ns-tcar__avatar, .ns-tcar__avatar .et_pb_image_wrap, .ns-tcar__avatar img { width: 92px; height: 92px; }
}
/* Both project panels: card rows fill the panel so UK and International cards share one height */
.ns-pathway-cards { flex: 1 1 auto !important; align-items: stretch !important; }
.ns-pathway-cards > .ns-card { align-self: stretch !important; height: auto !important; }
.ns-card > .et_pb_group { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; }

/* Pathway flags keep their size at every breakpoint */
.ns-flag, .ns-flag .et_pb_image_wrap { width: 56px !important; max-width: 56px !important; margin: 0 !important; }
@media (max-width: 980px) { .ns-flag, .ns-flag .et_pb_image_wrap { width: 48px !important; max-width: 48px !important; } }
@media (max-width: 767px) { .ns-flag, .ns-flag .et_pb_image_wrap { width: 40px !important; max-width: 40px !important; } }

/* Sponsor strip: full-colour logos in one row, optically balanced heights */
.ns-logo-strip .ns-logo { flex: 0 1 auto !important; margin: 0 !important; }
.ns-logo-strip .ns-logo img { display: block; object-fit: contain; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.ns-logo-strip .ns-logo img:hover { transform: scale(1.05); }

/* Testimonials v3: rounded photo left, quote right, full content width */
.ns-tcar__photo { flex: 0 0 clamp(200px, 24vw, 320px) !important; max-width: clamp(200px, 24vw, 320px) !important; margin: 0 !important; }
.ns-tcar__photo .et_pb_image_wrap, .ns-tcar__photo img { display: block; width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: cover; object-position: 50% 30%; border-radius: 18px; }
@media (max-width: 767px) {
  .ns-tcar__photo { flex-basis: auto !important; max-width: 100% !important; }
  .ns-tcar__photo .et_pb_image_wrap, .ns-tcar__photo img { aspect-ratio: 4 / 3; }
}
@media (max-width: 767px) { .ns-tcar__track { align-items: flex-start !important; } .ns-tcar__slide { justify-content: flex-start !important; } }
/* Optical balance: every logo gets the same box; wide marks shrink, square marks fill */
.ns-logo-strip .ns-logo { width: clamp(96px, 9vw, 132px) !important; height: 60px; display: flex !important; align-items: center; justify-content: center; }
.ns-logo-strip .ns-logo .et_pb_image_wrap { width: 100%; height: 100%; display: flex !important; align-items: center; justify-content: center; }
.ns-logo-strip .ns-logo img { height: auto !important; max-height: 56px; width: auto; max-width: 100% !important; }
@media (max-width: 767px) { .ns-logo-strip .ns-logo { width: 88px !important; height: 48px; } .ns-logo-strip .ns-logo img { max-height: 44px; } }

/* Drawer sub-links: small country tag above the project name */
.ns-acc__panel a { display: grid !important; grid-template-columns: 1fr auto; grid-template-rows: auto auto; column-gap: 8px; align-items: center; }
.ns-acc__panel a::after { grid-column: 2; grid-row: 1 / span 2; }
.ns-acc__tag { grid-column: 1; font-size: .625rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gcid-ns-action-dark, #9E4230); }
.ns-acc__label { grid-column: 1; }

/* Footer contact lines with FA icons */
.ns-contact .ns-ci { display: inline-flex; align-items: center; gap: .6em; white-space: normal !important; }
.ns-contact .ns-ci::before { font: 900 .85em/1 "FontAwesome"; color: #F2C4AE; width: 1em; text-align: center; }
.ns-ci--pin::before { content: "\f3c5"; content: "\f3c5" / ""; }
.ns-ci--mail::before { content: "\f0e0"; content: "\f0e0" / ""; }
.ns-ci--tel::before { content: "\f095"; content: "\f095" / ""; }

/* Mega/drawer icons for Impact + Stories dropdowns */
.ns-mega__icon--impact::before { content: "\f201"; content: "\f201" / ""; }
.ns-mega__icon--report::before { content: "\f15c"; content: "\f15c" / ""; }
.ns-mega__icon--newsletter::before { content: "\f1ea"; content: "\f1ea" / ""; }
.ns-mega__icon--stories::before { content: "\f4ad"; content: "\f4ad" / ""; }
.ns-mega__icon--blog::before { content: "\f781"; content: "\f781" / ""; }
.ns-mega__icon--journal::before { content: "\f02d"; content: "\f02d" / ""; }
.ns-mega__icon--pen::before { content: "\f303"; content: "\f303" / ""; }
/* Icon-only panels with 3–4 items: no feature card, so let cards fill the width */
@media (min-width: 1100px) {
  .ns-mega__panel--icons:not(:has(.ns-mega__feature)) { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; }
  .ns-desktop-nav .et-menu > li > a { padding-left: 9px !important; padding-right: 9px !important; }
}

/* ==========================================================================
   Contact page (native rebuild) — form, FAQs, newsletter band
   ========================================================================== */
.ns-req { color: var(--gcid-ns-action, #B4533A); }
/* Contact form: NS inputs */
.ns-contact-form .et_pb_contact_form { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 !important; }
.ns-contact-form .et_pb_contact_field { padding: 0 !important; margin: 0 !important; }
.ns-contact-form input.input, .ns-contact-form textarea.input, .ns-contact-form select.input,
.ns-contact-form input[type="text"], .ns-contact-form input[type="email"], .ns-contact-form textarea, .ns-contact-form select {
  width: 100%; background: #fff !important; border: 1.5px solid var(--gcid-ns-line, #EEDCCF) !important; border-radius: 8px !important;
  padding: 14px 16px !important; font: 400 .95rem/1.4 "Figtree", system-ui, sans-serif !important; color: var(--gcid-ns-ink, #1F2945) !important;
  transition: border-color .2s, box-shadow .2s;
}
.ns-contact-form textarea { min-height: 160px; }
.ns-contact-form input:focus, .ns-contact-form textarea:focus, .ns-contact-form select:focus {
  outline: none; border-color: var(--gcid-ns-action, #B4533A) !important; box-shadow: 0 0 0 3px rgba(180, 83, 58, .18);
}
.ns-contact-form ::placeholder { color: #7A716D; opacity: 1; }
.ns-contact-form .et_pb_contact_field_options_title { font: 600 .9rem/1.4 "Figtree", system-ui, sans-serif; color: var(--gcid-ns-ink, #1F2945); margin-bottom: 6px; }
.ns-contact-form .et_pb_contact_field_checkbox label { font-size: .9rem; color: var(--gcid-ns-charcoal, #4A4543); }
/* Spam question + send button on one line */
.ns-contact-form .et_contact_bottom_container { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; width: 100%; float: none; margin-top: 6px; }
.ns-contact-form .et_pb_contact_right { display: flex; align-items: center; gap: 10px; font: 600 .95rem/1 "Figtree", system-ui, sans-serif; color: var(--gcid-ns-ink, #1F2945); }
.ns-contact-form .et_pb_contact_right p { display: flex; align-items: center; gap: 10px; margin: 0; padding: 0; }
.ns-contact-form .et_pb_contact_right p::before { content: "Quick check:"; font-weight: 500; color: var(--gcid-ns-charcoal, #4A4543); }
.ns-contact-form input.et_pb_contact_captcha { width: 72px !important; padding: 10px 12px !important; text-align: center; }
.ns-contact-form .et_pb_contact_submit {
  background: var(--gcid-ns-action, #B4533A) !important; color: #fff !important; border: 1.5px solid var(--gcid-ns-action, #B4533A) !important;
  border-radius: 6px !important; padding: .85em 1.6em !important; font: 600 .9375rem/1.2 "Figtree", system-ui, sans-serif !important; margin: 0 !important;
  display: inline-flex !important; align-items: center; gap: .55em; cursor: pointer; transition: background-color .2s, transform .2s;
}
.ns-contact-form .et_pb_contact_submit::after { content: "\f1d8" !important; font-family: "FontAwesome" !important; font-weight: 900 !important; position: static !important; opacity: 1 !important; margin: 0 !important; font-size: .9em !important; line-height: 1 !important; display: inline-block !important; transform: none !important; }
.ns-contact-form .et_pb_contact_submit:hover { background: var(--gcid-ns-action-dark, #9E4230) !important; border-color: var(--gcid-ns-action-dark, #9E4230) !important; transform: translateY(-1px); padding: .85em 1.6em !important; }
.ns-contact-form .et-pb-contact-message { font-size: .95rem; color: var(--gcid-ns-ink, #1F2945); }
@media (max-width: 767px) { .ns-contact-form .et_contact_bottom_container { flex-direction: column; align-items: stretch; } .ns-contact-form .et_pb_contact_submit { justify-content: center; } }
/* Detail rows: links in NS action colour */
.ns-form-panel a, .et_pb_group a[href^="mailto"], .et_pb_group a[href^="tel"] { color: var(--gcid-ns-action, #B4533A); }

/* Social icons on light surfaces */
.ns-social--light { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px !important; padding: 0 !important; }
.ns-social--light a { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--gcid-ns-blush, #F6E3D9); color: var(--gcid-ns-action, #B4533A) !important; border: 0; transition: background-color .2s, color .2s; }
.ns-social--light a::before { font: 400 18px/1 "FontAwesome"; }
.ns-social--light a:hover { background: var(--gcid-ns-action, #B4533A); color: #fff !important; }

/* FAQ accordions */
.ns-faq .et_pb_toggle { border: 1px solid var(--gcid-ns-panel-line, #F5E6DC) !important; border-radius: 12px !important; padding: 0 !important; margin-bottom: 10px !important; overflow: hidden; }
.ns-faq .et_pb_toggle_title { padding: 16px 52px 16px 18px !important; cursor: pointer; }
.ns-faq .et_pb_toggle_title::before { content: "\f078" !important; font-family: "FontAwesome" !important; font-weight: 900 !important; font-size: 13px !important; right: 18px !important; color: var(--gcid-ns-action, #B4533A) !important; transition: transform .25s; }
.ns-faq .et_pb_toggle_open .et_pb_toggle_title::before { transform: translateY(-50%) rotate(180deg) !important; display: block !important; }
.ns-faq .et_pb_toggle_content { padding: 0 18px 18px !important; }
.ns-faq .et_pb_toggle_open { box-shadow: 0 16px 30px -24px rgba(96, 52, 30, .45); }

/* Newsletter band: full-bleed terracotta with the client's leaf sprig */
.ns-news-band { position: relative; overflow: hidden; }
.ns-news-band::before { content: ""; position: absolute; left: -24px; top: 50%; width: clamp(90px, 9vw, 150px); height: 220px; transform: translateY(-50%) rotate(8deg); background: url("/wp-content/uploads/2026/09/leaves-3.webp") center / contain no-repeat; opacity: .35; filter: brightness(2.2); pointer-events: none; }
.ns-signup .et_pb_newsletter_form form, .ns-signup .et_pb_newsletter_fields { display: flex !important; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.ns-signup .et_pb_newsletter_field { padding: 0 !important; margin: 0 !important; }
.ns-signup input.input, .ns-signup input[type="text"], .ns-signup input[type="email"] { width: 100%; background: #fff !important; border: 0 !important; border-radius: 8px !important; padding: 14px 16px !important; font: 400 .95rem/1.4 "Figtree", system-ui, sans-serif !important; color: var(--gcid-ns-ink, #1F2945) !important; }
.ns-signup .et_pb_newsletter_button_wrap { margin: 0 !important; }
.ns-signup .et_pb_newsletter_button { background: transparent !important; color: #fff !important; border: 1.5px solid #fff !important; border-radius: 8px !important; padding: 13px 22px !important; font: 600 .95rem/1.2 "Figtree", system-ui, sans-serif !important; height: 100%; }
.ns-signup .et_pb_newsletter_button:hover { background: #fff !important; color: var(--gcid-ns-action, #B4533A) !important; padding: 13px 22px !important; }
.ns-signup .et_pb_newsletter_button::after { display: none !important; }
.ns-signup .et_pb_newsletter, .ns-signup .et_pb_module { background: transparent !important; padding: 0 !important; }
/* Newsletter: email + button on one row */
.ns-signup .et_pb_newsletter_fields { flex-direction: row !important; flex-wrap: wrap !important; align-items: stretch !important; gap: 10px !important; }
.ns-signup .et_pb_newsletter_field { flex: 1 1 240px !important; height: auto !important; display: flex !important; }
.ns-signup .et_pb_newsletter_field input.input { height: auto !important; align-self: stretch; }
.ns-signup .et_pb_newsletter_button_wrap { flex: 0 0 auto !important; width: auto !important; display: flex !important; }
.ns-signup a.et_pb_newsletter_button { width: auto !important; display: inline-flex !important; align-items: center; justify-content: center; }
@media (max-width: 480px) { .ns-signup .et_pb_newsletter_button_wrap, .ns-signup a.et_pb_newsletter_button { width: 100% !important; } }

/* Contact cards + detail rows: icons sit top-left like the mockup */
.ns-intent .et_pb_icon, .ns-detail .et_pb_icon { align-self: flex-start !important; flex: 0 0 50px !important; width: 50px !important; height: 50px !important; margin: 0 !important; }
.ns-detail { align-items: flex-start !important; }

/* Desktop nav: room for dropdown chevrons */
@media (min-width: 1100px) {
  .ns-desktop-nav .et-menu > li.menu-item-has-children > a { padding-right: 22px !important; }
  .ns-desktop-nav .et-menu > li.menu-item-has-children > a::after { right: 4px !important; }
}
/* Contact: form panel fills the column; message box grows so the Send row sits at the bottom */
.ns-form-panel { height: auto !important; }
.ns-form-panel .ns-contact-form { flex: 1 1 auto; display: flex; flex-direction: column; }
/* Grid: names side by side, message row absorbs the extra height so the form fills the panel */
.ns-form-panel .ns-contact-form .et_pb_contact { flex: 1 1 auto; display: flex !important; flex-direction: column; }
.ns-form-panel .ns-contact-form form.et_pb_contact_form {
  flex: 1 1 auto; display: grid !important; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto auto 1fr auto auto; gap: 12px;
}
.ns-form-panel .ns-contact-form form > .et_pb_contact_field { grid-column: 1 / -1; width: 100% !important; max-width: 100% !important; }
.ns-form-panel .ns-contact-form form > .et_pb_contact_field[data-id="firstname"] { grid-column: 1; }
.ns-form-panel .ns-contact-form form > .et_pb_contact_field[data-id="lastname"] { grid-column: 2; }
.ns-form-panel .ns-contact-form form > input[type="hidden"], .ns-form-panel .ns-contact-form form > input:not([type]) { display: none; }
.ns-form-panel .ns-contact-form form > .et_contact_bottom_container { grid-column: 1 / -1; }
.ns-form-panel .ns-contact-form .et_pb_contact_field[data-id="message"] { align-self: stretch; }
.ns-form-panel .ns-contact-form textarea { min-height: 160px; height: 100% !important; }
@media (max-width: 767px) {
  .ns-form-panel .ns-contact-form form.et_pb_contact_form { grid-template-columns: 1fr; grid-template-rows: none; }
  .ns-form-panel .ns-contact-form form > .et_pb_contact_field[data-id="firstname"], .ns-form-panel .ns-contact-form form > .et_pb_contact_field[data-id="lastname"] { grid-column: 1; }
}
.ns-news-band .ns-signup { align-self: center; }

/* Contact: handwritten notes from the mockup (desktop only) */
.ns-form-panel, .ns-reg-card { position: relative; }
.ns-form-script { position: absolute !important; right: clamp(1.25rem, 3vw, 2.5rem); bottom: clamp(1rem, 2vw, 1.75rem); transform: rotate(-10deg); z-index: 1; }
.ns-form-script::before { content: ""; position: absolute; left: -58px; top: -26px; width: 56px; height: 96px; background: url("/wp-content/uploads/2026/09/leaves-3.webp") center / contain no-repeat; opacity: .6; transform: rotate(-18deg); }
.ns-form-panel .ns-contact-form { margin-bottom: 0 !important; }
.ns-form-panel .et_pb_text:last-child { max-width: 62%; }
.ns-reg-script { position: absolute !important; right: clamp(1rem, 2vw, 1.75rem); top: clamp(1rem, 2vw, 1.5rem); transform: rotate(-8deg); text-align: right; }
.ns-intent-link { margin-top: auto !important; }
.ns-social a { margin-right: 6px; }

/* ---------- Contact: in-between widths (Divi keeps the desktop layout up to 981px) ---------- */
.ns-side a[href^="mailto"] { overflow-wrap: anywhere; }
@media (min-width: 981px) { .ns-reg-card .et_pb_heading { padding-right: 120px; } }
@media (max-width: 1279px) {
  /* Form full width, side cards as a 2-column grid underneath */
  .ns-contact-main { flex-direction: column !important; }
  .ns-contact-main > .ns-form-panel, .ns-contact-main > .ns-side { width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
  .ns-form-panel .ns-contact-form form.et_pb_contact_form { grid-template-rows: none; }
  .ns-form-panel .ns-contact-form textarea { height: auto !important; min-height: 180px; }
  .ns-side { display: grid !important; grid-template-columns: 1fr 1fr; gap: var(--gvid-ns-space-gap, 12px) !important; }
  .ns-side > .et_pb_group:first-child { grid-row: span 2; }
  .ns-side > .et_pb_group { width: 100% !important; margin: 0 !important; }
}
@media (min-width: 981px) and (max-width: 1279px) {
  .ns-intent { flex: 0 0 calc(50% - 6px) !important; max-width: calc(50% - 6px) !important; }
}
@media (max-width: 980px) {
  .ns-side { grid-template-columns: 1fr; }
  .ns-side > .et_pb_group:first-child { grid-row: auto; }
}
@media (max-width: 420px) {
  .ns-detail { flex-direction: column !important; gap: 10px !important; }
  .ns-detail > .et_pb_group { width: 100% !important; }
}
/* Contact hero copy: never clip its content on tablet/phone */
@media (max-width: 980px) { .ns-hero-copy { height: auto !important; } }
/* Badge stays a circle with room around the words */
.ns-hero-badge { aspect-ratio: 1 / 1; }

/* Contact form: field labels are visually hidden instead of display:none, so every field keeps an
   accessible name (the Subject <select> has no placeholder to fall back on). */
.ns-contact-form .et_pb_contact_field .et_pb_contact_form_label[for] {
  display: block !important; position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
/* Links inside running text are underlined, not colour-only (WCAG 1.4.1). Stand-alone link rows (.ns-arrow),
   icon/button links (have a class) and bold links (weight already distinguishes them) are excluded. */
.et-l--post .et_pb_text:not(.ns-arrow) .et_pb_text_inner a:not([class]):not(:has(strong, b)) {
  text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px;
}

/* ==========================================================================
   Inner-page patterns (ns_page.py): page_hero, card_grid, loop_cards, steps, feature_band
   ========================================================================== */
/* page_hero: an <em> accent word in the H1 (same look as the Home hero title) */
.ns-hero-copy .et_pb_heading em { font-style: italic; color: var(--gcid-ns-action, #B4533A); }

/* Grids: Divi keeps its desktop layout down to 981px, so wide grids step down in between (see grid()) */
@media (min-width: 981px) and (max-width: 1279px) {
  .ns-grid--mid-2 { --column-count: 2 !important; }
  .ns-grid--mid-3 { --column-count: 3 !important; }
}
.ns-grid > .et_pb_module { margin: 0 !important; }

/* Visually hidden text (screen readers only) */
.ns-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Tag pills (card_grid tags, loop_cards category) */
.ns-tags .et_pb_text_inner p { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 !important; }
.ns-tag { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #fff; border: 1px solid var(--gcid-ns-line, #EEDCCF);
  color: var(--gcid-ns-action-dark, #9E4230); font-size: .6875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; line-height: 1.4; }

/* card_grid: icons top-left; photo tops at 16:10 */
.ns-cg .et_pb_icon { align-self: flex-start !important; margin: 0 !important; }
.ns-cg__photo, .ns-cg__img img { display: block; width: 100% !important; aspect-ratio: 16 / 10; object-fit: cover; }
.ns-cg__img, .ns-cg__img .et_pb_image_wrap { display: block; width: 100%; margin: 0 !important; }
.ns-cg--photo .ns-cg__photo { transition: transform .6s cubic-bezier(.2,.7,.2,1); }

/* loop_cards: photo (or the leaf tile when a post has no featured image), linked title, Read more at the bottom */
.ns-lc__media { width: 100% !important; aspect-ratio: 16 / 10; flex: 0 0 auto; }
.ns-lc__photo { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.ns-lc:hover .ns-lc__photo { transform: scale(1.04); }
.ns-lc__title a { color: inherit !important; text-decoration: none; }
.ns-lc__title a:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.ns-lc__excerpt p { padding-bottom: 0 !important; }
.ns-lc .ns-lc__link { margin-top: auto !important; }
@media (prefers-reduced-motion: reduce) { .ns-lc__photo, .ns-cg__photo { transition: none; } .ns-lc:hover .ns-lc__photo { transform: none; } }

/* steps: action-colour number, FA arrow between steps when they sit in one row (desktop) */
.ns-step__num { color: var(--gcid-ns-action, #B4533A); margin-right: .1em; }
.ns-step .et_pb_icon { margin: 0 !important; }
@media (min-width: 981px) {
  .ns-steps:not(.ns-grid--mid-2):not(.ns-grid--mid-3) > .ns-step:not(:last-child)::after {
    content: "\f061"; content: "\f061" / ""; position: absolute; top: 16px; right: calc(clamp(1.25rem, 1rem + 2vw, 3rem) / -2 - 8px);
    font: 900 16px/1 "FontAwesome"; color: var(--gcid-ns-terracotta, #BC7C5A);
  }
}

/* feature_band: lists inside the copy */
.ns-band .et_pb_text ul { padding-left: 1.2em !important; margin: 0; }
.ns-band .et_pb_text ul li { margin-bottom: .25em; }
@media (max-width: 767px) { .ns-cg__photo, .ns-cg__img img, .ns-lc__media { aspect-ratio: 16 / 9; } }
/* Text links on the blush-soft surface: action (#B4533A) is 4.36:1 there, action-dark passes AA (5.6:1) */
.ns-band .et_pb_text a, .ns-on-blush .et_pb_text a { color: var(--gcid-ns-action-dark, #9E4230) !important; }

/* ==========================================================================
   Our Work (build_pages.py) + shared: status pills, link_strip, loop pagination
   ========================================================================== */
/* Project cards (Home card()) can carry pills above the title; status pills get a dot (filled = active,
   hollow = in development) so they read differently from country pills */
.ns-card .ns-tags { margin: 0 0 2px !important; }
.ns-tag--status { background: var(--gcid-ns-blush-soft, #FBEEE6); }
.ns-tag--status::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 5px 1px 0; border-radius: 50%;
  background: currentColor; vertical-align: middle; }
.ns-tag--dev::before { background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }

/* link_strip: sprig sits in its own space at the right edge (never behind text) */
.ns-strip .et_pb_icon { flex: 0 0 auto; align-self: flex-start; margin: 0 !important; }
@media (min-width: 768px) { .ns-strip .et_pb_icon { align-self: center; } }
.ns-strip .et_pb_button_module_wrapper, .ns-strip .et_pb_button { flex: 0 0 auto; margin: 0 !important; }
.ns-strip__sprig { flex: 0 0 auto; align-self: stretch; }

/* loop_cards pagination (divi/post-nav bound to a Loop): FA arrows instead of Divi's typed ones */
.ns-pager { display: flex !important; justify-content: space-between; gap: 12px; margin-top: var(--gvid-ns-space-3, 24px) !important; }
.ns-pager .nav-next { margin-left: auto; }
.ns-pager .meta-nav { display: none !important; }
.ns-pager a { display: inline-flex; align-items: center; gap: .5em; font-weight: 600; text-decoration: none;
  color: var(--gcid-ns-action-dark, #9E4230) !important; }
.ns-pager a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ns-pager .nav-next a::after { content: "\f061"; content: "\f061" / ""; font: 900 .85em/1 "FontAwesome"; }
.ns-pager .nav-previous a::before { content: "\f060"; content: "\f060" / ""; font: 900 .85em/1 "FontAwesome"; }
/* Code modules that only carry a script take no space in flex columns (scripts still run) */
.ns-script-only { display: none !important; }

/* ==========================================================================
   Our Impact (build_pages.py build_our_impact)
   ========================================================================== */
/* The impact-stats global's "View our full impact" link points at this page: hide it here (page 67438) */
.page-id-67438 #impact .ns-arrow { display: none !important; }
/* How we create impact: icon discs stay their size next to wrapping text */
.ns-outcome .et_pb_icon { flex: 0 0 auto; align-self: flex-start !important; margin: 0 !important; }
.ns-outcome .et_pb_text p, .ns-story__row .et_pb_text p { padding-bottom: 0 !important; }
/* Stories of change: featured image on top (decorative), small FA icons beside need / response / difference,
   link pinned to the bottom so both cards line up */
.ns-story__photo { width: 100% !important; aspect-ratio: 2 / 1; flex: 0 0 auto; }
@media (max-width: 767px) { .ns-story__photo { aspect-ratio: 16 / 9; } }
.ns-story__row .et_pb_icon { flex: 0 0 auto; align-self: flex-start !important; width: 22px; margin: 3px 0 0 !important; }
.ns-story__row strong { color: var(--gcid-ns-ink, #1F2945); }
.ns-story .ns-arrow { margin-top: auto !important; }

/* Full viewport mobile drawer; retain compact desktop search drawer. */
@media(max-width:980px){.ns-drawer .ns-drawer__panel{width:100vw;max-width:none;box-sizing:border-box;}}