/*
Theme Name: KAIROS Custom AI
Author: KAIROS Tech Team
Description: Custom theme built from stakeholder ChatGPT designs.
Version: 1.0
*/
:root {
  --ink: #172f37;
  --teal: #1c4552;
  --teal-bright: #187575;
  --purple: #8e2288;
  --moss: #6a712d;
  --lime: #e0e320;
  --orange: #f15922;
  --paper: #f7f7f2;
  --white: #ffffff;
  --line: rgba(28, 69, 82, 0.18);
  --shadow: 0 24px 70px rgba(23, 47, 55, 0.13);
  --max: 1240px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
button, summary { font: inherit; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  z-index: 100;
  top: 0.5rem;
  left: 0.5rem;
  padding: 0.8rem 1rem;
  background: var(--white);
  color: var(--ink);
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

/* ==========================================================================
   UNIVERSAL CLICKABLE CONTAINER UTILITY CLASS
   ========================================================================== */

/* 1. Set the container block as the positioning anchor */
.kairos-clickable-area {
    position: relative !important;
    cursor: pointer !important;
    transition: transform 200ms ease, box-shadow 200ms ease !important;
}

/* 2. Stretch the pseudo-element of any nested link to fill the container */
.kairos-clickable-area a::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 10 !important;
}

/* 3. Ensure nested links stay on top if there are multiple text links */
.kairos-clickable-area a {
    position: static !important;
}

/* 4. Subtle hover effect for visual feedback */
.kairos-clickable-area:hover {
    transform: translateY(-3px) !important;
}


.treaty-bar {
  padding: 0.45rem 5vw;
  color: var(--white);
  background: var(--teal);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-align: center;
  text-transform: uppercase;
}


/* ==========================================================================
   TWO-WAY PATH / HERO IMAGE & BUTTON LAYOUT
   ========================================================================== */

/* Parent Wrapper for Image + Button Column */
.twp-hero-media-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important; /* Aligns button to the right under text */
    justify-content: flex-start !important;
    position: relative !important;
}

/* Ensure the composite image displays naturally without absolute offsets */
.twp-hero-media-col img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    margin-bottom: 1.5rem !important;
}

/* Button Placement directly below the image */
.twp-hero-btn,
.wp-block-button.twp-hero-btn {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
}

.twp-hero-btn a,
.wp-block-button.twp-hero-btn .wp-block-button__link {
    background-color: #e0e320 !important; /* KAIROS Lime */
    color: #172f37 !important; /* Dark Ink */
    font-weight: 800 !important;
    padding: 0.85rem 1.6rem !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    transition: transform 180ms ease, background-color 180ms ease !important;
}

.twp-hero-btn a:hover,
.wp-block-button.twp-hero-btn .wp-block-button__link:hover {
    background-color: #8e2288 !important; /* KAIROS Purple */
    color: #ffffff !important;
    transform: translateY(-2px) !important;
}

/* Mobile Alignment Adjustment */
@media (max-width: 768px) {
    .twp-hero-media-col {
        align-items: center !important; /* Center button on mobile devices */
    }
}
.hero {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(480px, 1.12fr);
  min-height: 680px;
  overflow: hidden;
  background: var(--teal);
}
.hero .hero-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(4.5rem, 8vw, 8rem) clamp(2rem, 7vw, 7rem);
  color: var(--white);
}
.hero .hero-copy::after {
  position: absolute;
  right: -80px;
  bottom: -80px;
  width: 270px;
  height: 270px;
  content: "";
  border: 2px solid rgba(224, 227, 32, 0.45);
  border-radius: 50%;
  box-shadow: 0 0 0 28px rgba(224, 227, 32, 0.06), 0 0 0 58px rgba(224, 227, 32, 0.045);
}
.eyebrow {
  margin: 0 0 1.25rem;
  color: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.hero h1,
.section-heading h2,
.memory-cta h2 {
  margin: 0;
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 0.9;
  text-transform: uppercase;
}
.hero h1 { font-size: clamp(4.8rem, 8.4vw, 8.8rem); }
.hero h1 span { color: var(--lime); }
.hero-intro {
  max-width: 34rem;
  margin: 2.2rem 0 1.5rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: clamp(1.06rem, 1.4vw, 1.25rem);
  line-height: 1.6;
}
.text-link {
  width: max-content;
  padding-bottom: 0.25rem;
  color: var(--white);
  border-bottom: 2px solid var(--lime);
  font-weight: 700;
  text-decoration: none;
}
.text-link span { padding-left: 0.4rem; color: var(--lime); }
.hero-gallery {
  position: relative;
  min-height: 680px;
  background: #dce4df;
}
.hero-image { position: absolute; margin: 0; overflow: hidden; }
.hero-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms ease; }
.hero-image:hover img { transform: scale(1.025); }
.hero-image-main { inset: 0 31% 0 0; }
.hero-image-main img { object-position: 52% center; }
.hero-image-top { inset: 0 0 50% 69%; border-left: 8px solid var(--paper); border-bottom: 4px solid var(--paper); }
.hero-image-bottom { inset: 50% 0 0 69%; border-left: 8px solid var(--paper); border-top: 4px solid var(--paper); }
.year-stamp {
  position: absolute;
  left: calc(69% - 62px);
  top: 50%;
  display: flex;
  width: 124px;
  height: 124px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: var(--ink);
  background: var(--lime);
  border-radius: 50%;
  transform: translateY(-50%);
  box-shadow: 0 12px 38px rgba(23, 47, 55, 0.22);
}
.year-stamp strong { font: 800 3rem/0.82 "Barlow Semi Condensed", sans-serif; }
.year-stamp span { font-size: 0.74rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }

.stories { max-width: var(--max); margin: 0 auto; padding: clamp(5rem, 9vw, 9rem) 3rem; }
.section-heading {
  display: grid;
  grid-template-columns: 0.7fr 1fr;
  column-gap: 4rem;
  max-width: 980px;
  margin: 0 0 clamp(4.5rem, 8vw, 8rem);
}
.section-heading .eyebrow { grid-column: 1 / -1; color: var(--purple); }
.section-heading h2 { font-size: clamp(3.5rem, 6vw, 6rem); color: var(--teal); }
.section-heading > p:last-child { align-self: end; margin: 0 0 0.5rem; font-size: 1.08rem; }

.story {
  --accent: var(--purple);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);
  margin-bottom: clamp(7rem, 12vw, 12rem);
}
.story:last-child { margin-bottom: 1rem; }
.story-moss { --accent: var(--moss); }
.story-teal { --accent: var(--teal-bright); }
.story-reverse .story-visual { order: 2; }
.story-visual {
  position: relative;
  padding: 1rem 0 0 1rem;
}
.story-visual::before {
  position: absolute;
  inset: 0 1rem 3.4rem 0;
  z-index: -1;
  content: "";
  background: var(--accent);
  border-radius: 50% 50% 2.5rem 2.5rem;
  transform: rotate(-2deg);
}
.story-reverse .story-visual::before { transform: rotate(2deg); }
.story-visual > img:not(.partner-mark) {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 50% 50% 2rem 2rem;
  box-shadow: var(--shadow);
}
.story-visual .partner-mark {
  position: absolute;
  z-index: 2;
  top: -1.2rem;
  right: -1rem;
  width: min(58%, 250px);
  padding: 1rem;
  background: var(--white);
  border-radius: 0.75rem;
  box-shadow: 0 10px 30px rgba(23, 47, 55, 0.18);
}
.txtdec a {text-decoration: none;}

.caption { margin: 1rem 0 0 1rem; color: #566b71; font-size: 0.8rem; line-height: 1.45; }
.story-meta { display: flex; flex-wrap: wrap; gap: 0.55rem 1.5rem; margin-bottom: 1.2rem; }
.story-meta span {
  color: var(--accent);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.impact-line { margin: 0 0 0.45rem; color: #5b6b6f; font-size: 1rem; font-weight: 700; }
.story h3 {
  margin: 0 0 1.7rem;
  color: var(--ink);
  font: 800 clamp(2.6rem, 4.5vw, 4.5rem)/0.98 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -0.025em;
  text-transform: uppercase;
}
blockquote { position: relative; margin: 0; padding: 1.7rem 0 0; border-top: 3px solid var(--accent); }
blockquote::before {
  position: absolute;
  top: -0.34em;
  right: 0;
  content: "“";
  color: var(--accent);
  background: var(--paper);
  padding-left: 0.5rem;
  font: 800 4.5rem/1 Georgia, serif;
}
blockquote p { margin: 0 0 1rem; }
details { margin-top: 0.9rem; }
summary {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: var(--accent);
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}
summary::-webkit-details-marker { display: none; }
summary::after {
  display: grid;
  width: 1.65rem;
  height: 1.65rem;
  place-items: center;
  content: "+";
  color: var(--white);
  background: var(--accent);
  border-radius: 50%;
  line-height: 1;
}
details[open] summary::after { content: "−"; }
.story-more { padding-top: 1.2rem; }
.attribution { margin: 1.6rem 0 0; font-weight: 800; }
.attribution span { display: block; color: #66787d; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }

.memory-cta {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 4rem;
  align-items: end;
  padding: clamp(4.5rem, 8vw, 8rem) max(5vw, calc((100vw - var(--max)) / 2));
  color: var(--white);
  background: var(--purple);
}
.memory-cta .eyebrow { color: var(--lime); }
.memory-cta h2 { max-width: 700px; font-size: clamp(3.5rem, 6.5vw, 6.8rem); }
.memory-cta > div:last-child { max-width: 390px; }
.memory-cta > div:last-child p { margin: 0 0 1.8rem; font-size: 1.08rem; }
.cta-button {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.9rem 1.25rem;
  color: var(--ink);
  background: var(--lime);
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.cta-button:hover, .cta-button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(23, 47, 55, 0.28); }

.site-footer {
  display: grid;
  grid-template-columns: 0.65fr 1.8fr;
  gap: 4rem;
  padding: 4.5rem max(5vw, calc((100vw - var(--max)) / 2));
  color: rgba(255, 255, 255, 0.78);
  background: #102d35;
  font-size: 0.88rem;
}
.footer-brand img { width: 190px; padding: 0.6rem; background: var(--white); }
.footer-brand p { max-width: 330px; }
.site-footer nav { display: flex; flex-direction: column; gap: 0.55rem; }
.site-footer a { color: var(--white); font-weight: 700; text-decoration: none; }
.site-footer a:hover, .site-footer a:focus-visible { color: var(--lime); }
.footer-meta { grid-column: 1 / -1; display: flex; gap: 2rem; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.15); padding-top: 1.2rem; }
.footer-meta p { max-width: 48rem; margin: 0; }

.site-directory {
  position: relative;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  min-height: 54px;
  padding: .45rem 1rem;
  background: rgba(247,247,242,.98);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 28px rgba(23,47,55,.06);
}
.site-directory > a,
.site-directory summary { padding: .55rem .85rem; border-radius: 999px; cursor: pointer; font-size: .78rem; font-weight: 800; letter-spacing: .035em; list-style: none; text-decoration: none; text-transform: uppercase; }
.site-directory summary::-webkit-details-marker { display: none; }
.site-directory details[open] summary,
.site-directory > a[aria-current="page"] { color: var(--white); background: var(--purple); }
.site-directory details.has-current:not([open]) summary { color: var(--purple); }
.directory-menu { position: absolute; top: calc(100% - .2rem); left: 50%; display: grid; grid-template-columns: repeat(3,minmax(12rem,1fr)); gap: .45rem; width: min(760px,calc(100vw - 2rem)); padding: 1rem; background: var(--white); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow); transform: translateX(-50%); }
.directory-menu a { padding: .7rem .8rem; border-radius: .5rem; font-size: .9rem; font-weight: 700; text-decoration: none; }
.directory-menu a:hover,.directory-menu a:focus-visible,.directory-menu a[aria-current="page"] { color: var(--white); background: var(--teal-bright); }
.footer-groups { display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; width: 100%; }
.footer-groups strong { display: block; margin-bottom: .7rem; color: var(--lime); font-family: "Barlow Semi Condensed",sans-serif; text-transform: uppercase; }
.footer-groups a { display: block; width: max-content; max-width: 100%; margin: .35rem 0; color: rgba(255,255,255,.82); text-decoration: none; }

@media (max-width: 1000px) {
  .site-header { min-height: 78px; }
  .site-map-nav { top: 78px; padding-right: 1rem; padding-left: 1rem; }
  .brand img { width: 175px; }
  .menu-toggle { display: grid; width: 46px; height: 46px; place-content: center; gap: 5px; cursor: pointer; }
  .menu-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; background: var(--teal); transition: transform 180ms ease, opacity 180ms ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .primary-nav {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    display: none;
    align-items: stretch;
    padding: 1.3rem 5vw 1.8rem;
    background: var(--white);
    border-top: 1px solid var(--line);
    box-shadow: 0 18px 40px rgba(23, 47, 55, 0.12);
    flex-direction: column;
  }
  .primary-nav.is-open { display: flex; }
  .primary-nav a { padding: 0.35rem 0; font-size: 1rem; }
  .primary-nav .nav-button { width: max-content; padding: 0.65rem 1.1rem; }
  .hero { grid-template-columns: 1fr; }
  .hero .hero-copy { min-height: 570px; padding-right: 10vw; }
  .hero-gallery { min-height: 600px; }
  .stories { padding-right: 2rem; padding-left: 2rem; }
  .story { gap: 3.5rem; }
  .memory-cta { grid-template-columns: 1fr; gap: 2rem; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-meta { grid-column: 1 / -1; }
  .site-directory { justify-content: flex-start; }
  .directory-menu { position: fixed; top: 9rem; grid-template-columns: repeat(2,1fr); max-height: calc(100vh - 10rem); overflow-y: auto; }
}

@media (max-width: 740px) {
  .treaty-bar { font-size: 0.68rem; }
  .site-map-nav { gap: 0.25rem; padding-top: 0.55rem; padding-bottom: 0.55rem; }
  .site-map-nav a { padding: 0.42rem 0.68rem; font-size: 0.7rem; }
  .site-directory { flex-wrap: wrap; justify-content: center; }
  .site-directory > a,.site-directory summary { padding: .45rem .55rem; font-size: .68rem; }
  .directory-menu { top: 8rem; grid-template-columns: 1fr; }
  .footer-groups { grid-template-columns: repeat(2,1fr); }
  .footer-meta { display: block; }
  .footer-meta p + p { margin-top: .7rem; }
  .hero .hero-copy { min-height: 510px; padding: 4.5rem 1.5rem; }
  .hero h1 { font-size: clamp(4.3rem, 23vw, 7rem); }
  .hero-gallery { min-height: 520px; }
  .hero-image-main { inset: 0 0 35% 0; }
  .hero-image-top { inset: 65% 50% 0 0; border: 6px solid var(--paper); border-bottom: 0; border-left: 0; }
  .hero-image-bottom { inset: 65% 0 0 50%; border: 6px solid var(--paper); border-right: 0; border-bottom: 0; }
  .year-stamp { left: 50%; top: 65%; width: 96px; height: 96px; transform: translate(-50%, -50%); }
  .year-stamp strong { font-size: 2.35rem; }
  .section-heading { display: block; margin-bottom: 5.5rem; }
  .section-heading h2 { margin-bottom: 1.6rem; }
  .story { display: flex; gap: 2.6rem; margin-bottom: 7.5rem; flex-direction: column; }
  .story-reverse .story-visual { order: initial; }
  .story-visual { width: calc(100% - 1rem); }
  .story-copy { width: 100%; }
  .story h3 { font-size: clamp(2.7rem, 13vw, 4.2rem); }
  .memory-cta { padding-right: 1.5rem; padding-left: 1.5rem; }
  .site-footer { grid-template-columns: 1fr; gap: 2.5rem; padding-right: 1.5rem; padding-left: 1.5rem; }
  .footer-meta { grid-column: auto; }
}

@media (max-width: 480px) {
  .footer-groups { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}
.home-page { background: var(--paper); }

.home-hero {
  position: relative;
  min-height: min(820px, calc(100vh - 116px));
  overflow: hidden;
  background: #f4e8e1;
}
.home-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.home-hero-copy {
  position: relative;
  z-index: 2;
  display: flex;
  width: 48%;
  min-height: min(820px, calc(100vh - 116px));
  margin-left: auto;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  padding: clamp(4rem, 7vw, 7rem) 6vw clamp(4rem, 7vw, 7rem) 2rem;
}
.home-hero-copy .eyebrow { margin-bottom: 1rem; color: var(--purple); }
.home-hero h1,
.collective-copy h2,
.work-heading h2,
.two-way-copy h2,
.impact-heading h2,
.anniversary-copy h2,
.home-action h2 {
  margin: 0;
  color: var(--teal);
  font: 800 clamp(4rem, 7vw, 7.7rem)/0.86 "Barlow Semi Condensed", Impact, sans-serif;
  letter-spacing: -0.045em;
  text-transform: uppercase;
}
.home-hero h1 { font-size: clamp(4rem, 7vw, 7.2rem); }
.home-hero h1 em, .collective-copy h2 em, .two-way-copy h2 em, .impact-heading h2 em, .anniversary-copy h2 em, .home-action h2 em { color: var(--purple); font-style: normal; }
.home-hero-copy > p:not(.eyebrow) { max-width: 580px; margin: 1.8rem 0; color: #445b61; font-size: clamp(1.05rem, 1.35vw, 1.22rem); }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.3rem 1.8rem; }
.home-button {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 0.7rem;
  padding: 0.86rem 1.2rem;
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.home-button:hover, .home-button:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(23,47,55,0.2); }
.button-lime { color: var(--ink); background: var(--lime); }
.button-dark { color: var(--white); background: var(--teal); }
.button-outline { color: var(--white); border: 2px solid rgba(255,255,255,0.75); }
.hero-scroll { color: var(--teal); border-bottom: 2px solid var(--purple); font-weight: 800; text-decoration: none; }
.hero-scroll span { padding-left: 0.35rem; color: var(--purple); }
.hero-path-line { position: absolute; z-index: 2; right: 2vw; bottom: 2rem; display: flex; gap: 0.5rem; }
.hero-path-line span { display: block; width: 90px; height: 22px; border-top: 2px solid var(--purple); border-radius: 50%; transform: rotate(-8deg); }
.hero-path-line span:last-child { border-color: var(--teal); transform: rotate(8deg); }

.collective-intro {
  display: grid;
  grid-template-columns: 0.45fr 1.55fr;
  gap: clamp(3rem, 8vw, 8rem);
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(6rem, 11vw, 11rem) 3rem;
  align-items: end;
}
.collective-kicker { padding-bottom: 0.8rem; border-bottom: 4px solid var(--lime); }
.kicker-number { display: block; color: var(--purple); font: 800 clamp(7rem, 15vw, 13rem)/0.72 "Barlow Semi Condensed", sans-serif; letter-spacing: -0.06em; }
.collective-kicker p { max-width: 170px; margin: 1.3rem 0 0; color: var(--teal); font-size: 0.76rem; font-weight: 800; letter-spacing: 0.12em; line-height: 1.4; text-transform: uppercase; }
.collective-copy .eyebrow { color: var(--purple); }
.collective-copy h2 { max-width: 900px; font-size: clamp(4rem, 7.5vw, 7.5rem); }
.collective-copy > p:last-child { max-width: 720px; margin: 2rem 0 0; color: #52676d; font-size: 1.1rem; }

.strategic-work { padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - var(--max)) / 2)); background: #e9e9df; }
.work-heading { display: grid; grid-template-columns: 1.1fr 0.7fr; gap: 1rem 5rem; align-items: end; margin-bottom: 5rem; }
.work-heading .eyebrow { grid-column: 1 / -1; color: var(--purple); }
.work-heading h2 { font-size: clamp(4rem, 7vw, 7rem); }
.work-heading > p:last-child { max-width: 440px; margin: 0 0 0.5rem; color: #52676d; }
.goal-list { border-top: 1px solid rgba(28,69,82,0.25); }
.goal { --goal-accent: var(--teal-bright); display: grid; grid-template-columns: minmax(0, 1fr) 80px; gap: 2rem; align-items: center; padding: 2.2rem 1rem; color: var(--ink); border-bottom: 1px solid rgba(28,69,82,0.25); text-decoration: none; transition: color 240ms ease, background 240ms ease, padding 240ms ease; }
.goal-systems { --goal-accent: var(--orange); }
.goal-power { --goal-accent: var(--purple); }
.goal:hover, .goal:focus-visible { padding-right: 1.5rem; padding-left: 1.5rem; color: var(--white); background: var(--goal-accent); }
.goal-copy { display: grid; grid-template-columns: minmax(280px, 0.8fr) 1fr; gap: 0 3rem; align-items: center; }
.goal-tag { grid-column: 1 / -1; margin: 0 0 0.5rem; color: var(--goal-accent); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.goal:hover .goal-tag, .goal:focus-visible .goal-tag { color: var(--lime); }
.goal h3 { margin: 0; font: 800 clamp(2.6rem, 4.4vw, 4.7rem)/0.9 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.goal-copy > p:last-child { margin: 0; color: #52676d; }
.goal:hover .goal-copy > p:last-child, .goal:focus-visible .goal-copy > p:last-child { color: rgba(255,255,255,0.84); }
.goal-arrow { display: grid; width: 58px; height: 58px; place-items: center; justify-self: end; color: var(--ink); background: var(--lime); border-radius: 50%; font-size: 1.5rem; transition: transform 220ms ease; }
.goal:hover .goal-arrow, .goal:focus-visible .goal-arrow { transform: rotate(45deg); }

.two-way { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(4rem, 8vw, 8rem); align-items: center; padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - var(--max)) / 2)); color: var(--white); background: var(--teal); overflow: hidden; }
.two-way-visual { position: relative; min-height: 530px; display: grid; place-items: center; }
.two-way-visual::before, .two-way-visual::after { position: absolute; width: 86%; height: 52%; content: ""; border: 1px solid rgba(224,227,32,0.45); border-radius: 50%; transform: rotate(-8deg); }
.two-way-visual::after { width: 70%; height: 72%; border-color: rgba(255,255,255,0.18); transform: rotate(12deg); }
.two-way-visual img { position: relative; z-index: 2; width: min(100%, 540px); }
.path-label { position: absolute; z-index: 3; padding: 0.65rem 0.9rem; color: var(--ink); background: var(--lime); border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; box-shadow: 0 12px 30px rgba(8,29,35,0.3); }
.path-one { top: 13%; left: 0; transform: rotate(-4deg); }
.path-two { right: 0; bottom: 12%; transform: rotate(4deg); }
.two-way-copy .eyebrow { color: var(--lime); }
.two-way-copy h2 { color: var(--white); font-size: clamp(4rem, 7vw, 7rem); }
.two-way-copy h2 em { color: var(--lime); }
.two-way-copy p { max-width: 620px; color: rgba(255,255,255,0.78); }
.two-way-copy .two-way-lead { margin-top: 2rem; color: var(--white); font-size: 1.12rem; }
.two-way-copy .home-button { margin-top: 1rem; }

.impact-home { max-width: var(--max); margin: 0 auto; padding: clamp(6rem, 11vw, 11rem) 3rem; }
.impact-heading { max-width: 980px; margin-bottom: 4.5rem; }
.impact-heading .eyebrow { color: var(--purple); }
.impact-heading h2 { font-size: clamp(4rem, 7vw, 7rem); }
.impact-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.5rem; }
.impact-item { --impact-accent: var(--teal-bright); min-height: 390px; padding: 2rem; background: var(--white); border-top: 10px solid var(--impact-accent); box-shadow: 0 18px 50px rgba(23,47,55,0.08); }
.impact-orange { --impact-accent: var(--orange); margin-top: 3rem; }
.impact-purple { --impact-accent: var(--purple); margin-top: 6rem; }
.impact-item h3 { margin: 1.4rem 0 1rem; font: 800 clamp(2rem, 3vw, 3.2rem)/0.95 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.impact-item p { margin: 0; color: #566a70; }
.impact-links { display: flex; flex-wrap: wrap; gap: 1.2rem 2rem; margin-top: 3.5rem; }
.impact-links a, .anniversary-text-link { color: var(--teal); border-bottom: 2px solid var(--purple); font-weight: 800; text-decoration: none; }
.impact-links span, .anniversary-text-link span { color: var(--purple); }

.anniversary { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(4rem, 8vw, 8rem); align-items: center; padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - var(--max)) / 2)); background: var(--lime); }
.anniversary-art { position: relative; }
.anniversary-art img { width: 100%; border-radius: 50%; mix-blend-mode: multiply; }
.anniversary-stamp { position: absolute; right: 0; bottom: 4%; display: flex; width: 130px; height: 130px; align-items: center; justify-content: center; flex-direction: column; color: var(--white); background: var(--purple); border-radius: 50%; box-shadow: 0 15px 40px rgba(23,47,55,0.2); }
.anniversary-stamp strong { font: 800 3.7rem/0.78 "Barlow Semi Condensed", sans-serif; }
.anniversary-stamp span { font-size: 0.74rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.anniversary-copy .eyebrow { color: var(--purple); }
.anniversary-copy h2 { font-size: clamp(4rem, 7vw, 7rem); }
.anniversary-copy > p:not(.eyebrow) { max-width: 620px; margin: 2rem 0; color: #3f565c; font-size: 1.08rem; }
.anniversary-links { display: flex; flex-wrap: wrap; align-items: center; gap: 1.3rem 1.8rem; }

.home-action { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 4rem; align-items: end; padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - var(--max)) / 2)); color: var(--white); background: var(--purple); }
.home-action .eyebrow { color: var(--lime); }
.home-action h2 { color: var(--white); font-size: clamp(3.6rem, 6.5vw, 6.5rem); }
.home-action h2 em { color: var(--lime); }
.action-buttons { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: flex-end; }

.reveal { opacity: 0; transform: translateY(30px); transition: opacity 650ms ease, transform 650ms ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1000px) {
  .home-hero { min-height: 920px; }
  .home-hero-image { object-position: 38% center; }
  .home-hero::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, transparent 10%, rgba(247,236,229,0.45) 42%, #f3e6de 75%); }
  .home-hero-copy { min-height: 920px; width: 56%; padding-right: 4vw; }
  .collective-intro { grid-template-columns: 0.55fr 1.45fr; gap: 4rem; }
  .work-heading { grid-template-columns: 1fr; }
  .work-heading .eyebrow { grid-column: auto; }
  .goal-copy { grid-template-columns: 1fr; gap: 0.7rem; }
  .two-way { grid-template-columns: 1fr; }
  .two-way-visual { min-height: 450px; }
  .impact-grid { grid-template-columns: 1fr 1fr; }
  .impact-purple { margin-top: 0; }
  .anniversary { grid-template-columns: 0.8fr 1.2fr; }
  .home-action { grid-template-columns: 1fr; }
  .action-buttons { justify-content: flex-start; }
}

@media (max-width: 740px) {
  .home-hero { min-height: 790px; display: flex; align-items: flex-end; }
  .home-hero-image { height: 48%; top: 0; object-position: 40% center; }
  .home-hero::after { inset: 35% 0 0; background: linear-gradient(0deg, #f3e6de 72%, transparent); }
  .home-hero-copy { width: 100%; min-height: 0; margin-top: 280px; padding: 6rem 1.5rem 4rem; }
  .home-hero h1 { font-size: clamp(4rem, 20vw, 6.2rem); }
  .hero-path-line { display: none; }
  .collective-intro, .strategic-work, .two-way, .impact-home, .anniversary, .home-action { padding-right: 1.5rem; padding-left: 1.5rem; }
  .collective-intro { grid-template-columns: 1fr; gap: 4rem; }
  .kicker-number { font-size: 9rem; }
  .collective-copy h2, .work-heading h2, .two-way-copy h2, .impact-heading h2, .anniversary-copy h2 { font-size: clamp(3.5rem, 17vw, 5.5rem); }
  .goal { grid-template-columns: 58px minmax(0,1fr); gap: 1rem; padding-right: 0; padding-left: 0; }
  .goal-arrow { display: none; }
  .goal h3 { font-size: clamp(2.4rem, 12vw, 3.8rem); }
  .goal-copy > p:last-child { font-size: 0.93rem; }
  .two-way-visual { min-height: 360px; }
  .path-label { font-size: 0.62rem; }
  .path-one { top: 5%; }
  .path-two { bottom: 5%; }
  .impact-grid { grid-template-columns: 1fr; }
  .impact-item, .impact-orange, .impact-purple { min-height: 0; margin-top: 0; }
  .impact-item h3 { margin-top: 2.3rem; }
  .anniversary { grid-template-columns: 1fr; }
  .anniversary-art { max-width: 430px; margin: 0 auto; }
  .anniversary-stamp { width: 105px; height: 105px; }
  .anniversary-stamp strong { font-size: 3rem; }
  .home-action h2 { font-size: clamp(3.2rem, 15vw, 5rem); }
}

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
}
/* WordPress Dynamic Menu Reset */
.primary-nav-list {
display: flex;
align-items: center;
gap: clamp(1rem, 2.2vw, 2rem);
list-style: none;
margin: 0;
padding: 0;
}
.primary-nav-list li { margin: 0; }
.primary-nav-list a { font-size: 0.86rem; font-weight: 700; text-decoration: none; border-bottom: 2px solid transparent; }
.primary-nav-list a:hover, .primary-nav-list a:focus-visible { border-bottom-color: var(--purple); }

/* WordPress Full-Width Override */
.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
/* Override default WP block gap margins on all pages */
#main > section,
#main > .wp-block-group,
#main > .wp-block-columns {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* Prevent word breaking and enable fluid scaling for the Two-Way Path headline */
.two-way-copy h2, 
.two-way-copy .wp-block-heading {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    font-size: clamp(2rem, 7vw, 6rem) !important;
    line-height: 1.1;
}
/* 1. Make the parent card a relative anchor point */
.goal {
    position: relative !important;
}

/* 2. Stretch the link inside the card to cover the entire box */
.goal a::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
}

/* 3. Restore the circle arrow appearance with solid lime background */
.goal-arrow {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;   /* Prevents flexbox from squishing the width */
    min-height: 48px !important;  /* Prevents flexbox from squishing the height */
    aspect-ratio: 1 / 1;          /* Locks a strict 1:1 circle ratio */
    padding: 0 !important;        /* Removes horizontal padding stretching it into an oval */
    border-radius: 50%;
    background-color: #E0E320 !important; /* Solid KAIROS Lime */
    border: none !important;               /* Deletes the hollow outline */
    text-decoration: none !important;
    margin-left: auto;                     /* Pushes the arrow to the right edge */
    flex-shrink: 0;                        /* Stops parent layouts from compressing it */
    transition: transform 0.3s ease, background-color 0.3s ease;
}

/* Create the staggered staircase effect on top, level on bottom */
@media (min-width: 768px) {
    .impact-grid {
        align-items: stretch !important;
    }
    
    .impact-grid .impact-item:nth-child(2) {
        margin-top: 3rem !important;
    }
    
    .impact-grid .impact-item:nth-child(3) {
        margin-top: 6rem !important;
    }
}
/* Custom Social Media Icon Layout */
.custom-social-links {
    display: flex;
    flex-wrap: wrap; /* Allows the icons to break onto multiple rows */
    gap: 0px;
    align-items: center;
    margin-bottom: 20px;
    max-width: 170px; /* Forces the wrap after ~3 icons. Adjust this number to change the break point! */
}
/* Default state: Lime (Targets both circles and paths) */
.custom-social-icon svg circle.social-bg,
.custom-social-icon svg path.social-bg {
    fill: #E0E320;
    transition: fill 0.3s ease;
}

/* Shrink the YouTube icon to match the built-in padding of the others */
.custom-social-icon[aria-label="YouTube"] svg {
    transform: scale(0.85);
}

/* Hover state: Purple */
.custom-social-icon:hover svg circle.social-bg,
.custom-social-icon:hover svg path.social-bg {
    fill: #8E2288;
}
/* Ensure the SVG scales uniformly */
.custom-social-icon svg {
    width: 44px;
    height: 44px;
    display: block;
}
/* ==========================================================================
   Global Resets & Typographical Variables (Inherited from styles.css)
   ========================================================================== */
:root {
  --ink: #172f37;
  --teal: #1c4552;
  --teal-bright: #187575;
  --purple: #8e2288;
  --moss: #6a712d;
  --lime: #e0e320;
  --paper: #f7f7f2;
  --white: #ffffff;
  --max: 1240px;
}

/* Base Typographical Treatments */
.eyebrow {
  color: var(--purple);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}
.wp-block-heading, 
.collection-hero h1, 
.section-intro h2, 
.feature-strip h2 {
  margin: 0 0 1.25rem;
  color: var(--teal);
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 0.9;
  text-transform: uppercase;
}

.wp-block-heading em { 
  color: var(--purple); 
  font-style: normal; 
}
/* ==========================================================================
   Section 1: Collection Hero
   ========================================================================== */
.collection-hero {
  padding: clamp(2.5rem, 4vw, 4rem) clamp(1rem, 3vw, 3rem);
  background: var(--paper); /* Default contrast fallback */
}
.collection-hero .wp-block-columns {
  align-items: center;
}
.collection-hero h1 { 
  font-size: clamp(4rem, 8.4vw, 7.5rem); 
}
.collection-hero-copy p:last-of-type {
  max-width: 580px;
  color: #445b61;
  font-size: clamp(1.05rem, 1.35vw, 1.22rem);
  line-height: 1.6;
}

/* 25 Years Mark Adaptation */
.collection-hero-mark {
  display: flex;
  justify-content: center;
  align-items: center;
}
.collection-hero-mark p {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 150px;
  height: 150px;
  margin: 0;
  color: var(--ink);
  background: var(--lime);
  border-radius: 50%;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  line-height: 1.1;
  box-shadow: 0 12px 38px rgba(23, 47, 55, 0.22);
}

/* ==========================================================================
   Section 2: Page Section & Grid
   ========================================================================== */
.page-section {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(5rem, 9vw, 9rem) 3rem;
}
.section-intro {
  margin-bottom: clamp(4.5rem, 8vw, 8rem);
  align-items: flex-end;
  gap: 4rem;
}
.section-intro h2 {
  font-size: clamp(3.5rem, 6vw, 6rem);
}
.section-intro .wp-block-column:last-child p {
  font-size: 1.08rem;
  color: var(--ink);
}

/* Path Grid (Nested Columns) */
.path-grid {
  margin-bottom: 2rem;
}
.path-card {
  padding: 2.2rem;
  background: var(--white);
  border-top: 6px solid var(--purple);
  box-shadow: 0 15px 40px rgba(23, 47, 55, 0.05);
  transition: transform 300ms ease, box-shadow 300ms ease;
}
.path-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 50px rgba(23, 47, 55, 0.1);
}
.path-card h3 {
  font-size: clamp(2rem, 3vw, 2.5rem);
  color: var(--ink);
}
.path-card p {
  color: #566a70;
  margin-bottom: 2rem;
}

/* Native Button Override for Links */
.wp-block-button.path-link .wp-block-button__link {
  padding: 0;
  color: var(--teal);
  background: transparent;
  border-bottom: 2px solid var(--purple);
  font-weight: 800;
  text-decoration: none;
  border-radius: 0;
}
.wp-block-button.path-link .wp-block-button__link span { 
  padding-left: 0.35rem; 
  color: var(--purple); 
}

/* ==========================================================================
   Section 3: Feature Strip
   ========================================================================== */
.feature-strip {
  padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - var(--max)) / 2));
  background: var(--teal);
  color: var(--white);
}
.feature-strip .eyebrow {
  color: var(--lime);
}
.feature-strip h2 {
  color: var(--white);
  font-size: clamp(3.6rem, 6.5vw, 6.5rem);
}
.feature-strip-copy p {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.85);
  max-width: 620px;
}

/* Animations */
.reveal { 
  opacity: 0; 
  transform: translateY(30px); 
  transition: opacity 650ms ease, transform 650ms ease; 
}
.reveal.is-visible { 
  opacity: 1; 
  transform: translateY(0); 
}

@media (max-width: 768px) {
  .collection-hero h1 { font-size: clamp(4.3rem, 23vw, 7rem); }
  .collection-hero-mark { margin-top: 3rem; justify-content: flex-start; }
  .page-section { padding-left: 1.5rem; padding-right: 1.5rem; }
  .section-intro, .feature-strip-inner { flex-direction: column; gap: 2rem; }
}
/* Fix Collection Hero / About KAIROS Styling */

/* 1. Add deep purple base + subtle circular line overlay on the left */
.collection-hero {
    background-color: #4C1D4B !important;
    background-image: 
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.08) 29%, rgba(255, 255, 255, 0.08) 30%, transparent 31%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.08) 49%, rgba(255, 255, 255, 0.08) 50%, transparent 51%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 68%, rgba(255, 255, 255, 0.05) 69%, rgba(255, 255, 255, 0.05) 70%, transparent 71%) !important;
    background-repeat: no-repeat !important;
    position: relative;
}

/* 2. Eyebrow Tagline ("AN ECUMENICAL MOVEMENT FOR JUSTICE") */
.collection-hero .eyebrow {
    color: #E0E320 !important; /* Bright KAIROS Lime */
    font-size: 0.85rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin-bottom: 1rem !important;
}

/* 3. Heading: "About" (White) and "KAIROS" / <em> (Lime) */
.collection-hero h1#page-title {
    color: #FFFFFF !important; /* Makes "About" pure white */
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-style: normal !important;
    text-transform: uppercase !important;
    line-height: 0.88 !important;
    font-size: clamp(3.5rem, 8vw, 6rem) !important;
}

.collection-hero h1#page-title em {
    color: #E0E320 !important; /* Makes KAIROS bright lime */
    font-style: normal !important;
    display: block !important;
}

/* 4. Body Paragraph below Heading */
.collection-hero-copy p.wp-block-paragraph:not(.eyebrow) {
    color: #172f37 !important; /* Pure White */
    opacity: 1 !important;
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    max-width: 520px !important;
    margin-top: 1.5rem !important;
}
/* Hero Container Alignment Fix */
.collection-hero .wp-block-group__inner-container,
.collection-hero > .wp-block-columns {
    max-width: 1200px !important; /* Matches standard layout container width */
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

/* Ensure child column padding doesn't pull content past the grid edge */
.collection-hero .collection-hero-copy {
    padding-left: 0 !important;
}
/* Fix Heading Overlap: Allow Natural Multi-line Wrapping */
.section-intro h2,
.page-section h2 {
    /* Allow natural breaks between words */
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    
    /* Font sizing adjustment to fit the column width */
    font-size: clamp(2.2rem, 3.8vw, 3.8rem) !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
}

/* Ensure inner tags wrap naturally */
.section-intro h2 em,
.section-intro h2 span {
    display: inline !important;
    white-space: normal !important;
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* =======================================
   Section: Work Hero (Collection)
   ======================================= */
.collection-hero {
    position: relative;
    min-height: 780px;
    overflow: hidden;
    color: #ffffff;
    background: #172f37; /* var(--ink) */
}

.hero-title em { 
    color: #e0e320; 
    font-style: normal; 
    line-height:150px;
}

.hero-message {
    position: relative;
    padding: 2rem 0 0;
    border-top: 3px solid #f15922; /* var(--orange) */
}

.hero-count, .hero-direction {
    font: 800 clamp(2rem, 3.2vw, 3.4rem)/.95 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
    margin: 0;
}

.hero-direction { color: #f15922; margin-bottom: 1.6rem; }
.hero-message p:last-child { color: rgba(255,255,255,.76); font-size: 1.08rem; }

/* =======================================
   Section: Interconnected
   ======================================= */
.interconnected {
    padding: clamp(7rem, 11vw, 11rem) max(3rem, calc((100vw - 1240px) / 2)) 8rem;
    background: #f7f7f2;
}

.connected-title em { color: #8e2288; font-style: normal; }
.connected-copy p { color: #536a70; }
.connected-copy .lead { color: #172f37; font-size: clamp(1.25rem, 2vw, 1.65rem); font-weight: 700; line-height: 1.38; }

/* =======================================
   Section: Goals & Goal Cards
   ======================================= */
.goals { background: #ffffff; }

.goal-panel {
    --accent: #8e2288;
    padding: clamp(6rem, 10vw, 10rem) 0;
    border-bottom: 1px solid rgba(23,47,55,.2);
}
.goal-panel.systems { --accent: #f15922; color: #ffffff; background: #172f37; }
.goal-panel.power { --accent: #187575; }

.goal-main h2 {
    font-size: clamp(4.7rem, 8.8vw, 9rem);
    max-width: 720px;
}
.goal-main p:not(.eyebrow) { max-width: 650px; margin: 2rem 0; color: #526a70; font-size: 1.16rem; }
.systems .goal-main p:not(.eyebrow) { color: rgba(255,255,255,.76); }

.goal-shift { align-self: end; padding: 2rem 0 0; border-top: 3px solid var(--accent); }
.goal-shift p { color: var(--accent); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.goal-shift li {
    padding: .75rem 0;
    border-bottom: 1px solid rgba(23,47,55,.18);
    font: 700 1.12rem/1.2 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}

/* Utilities */
.goal-arrow {
    display: inline-block;
    color: var(--accent);
    transition: transform 220ms ease;
}
.goal-main a { font-weight: 800; text-decoration: none; border-bottom: 3px solid var(--accent); }

/* =======================================
   Section: Covenants
   ======================================= */
.covenants { padding: clamp(7rem, 11vw, 11rem) max(3rem, calc((100vw - 1240px) / 2)); background: #eceee7; }
.covenants-title em { color: #8e2288; font-style: normal; }

.covenant-grid .covenant {
    padding: 2.2rem;
    border: 1px solid rgba(23,47,55,.22);
    transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}
.covenant-grid .covenant:hover {
    color: #ffffff; background: #187575; transform: translateY(-8px);
}
.covenant h3 a { font: 800 clamp(2.2rem, 3.4vw, 3.5rem)/.94 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; text-decoration: none; }
.covenant h3 b { float: right; color: #f15922; font-size: 1.6rem; }

/* =======================================
   Section: Path Callout
   ======================================= */
.path-callout { background: #8e2288; color: #ffffff; }
.path-copy { padding: clamp(7rem, 11vw, 11rem) 0; }
.path-title em { color: #e0e320; font-style: normal; }

/* =======================================
   Section: Work Close
   ======================================= */
.work-close { background: #e0e320; color: #172f37; padding: clamp(7rem, 10vw, 10rem) max(3rem, calc((100vw - 1240px) / 2)); }
.close-title em { color: #8e2288; font-style: normal; }

.close-action {
    display: inline-flex;
    gap: 1.6rem;
    align-items: center;
    padding: 1rem 1.4rem;
    color: #ffffff;
    background: #172f37;
    border-radius: 999px;
    font-weight: 800;
    text-decoration: none;
    text-transform: uppercase;
    transition: background 180ms ease, transform 180ms ease;
}
.close-action:hover { background: #8e2288; transform: translateY(-3px); }
/* ==========================================================================
   PRODUCTION REMEDIATION OVERRIDES - WHAT WE DO PAGE
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. HERO SECTION & STRATEGY CARDS FIXES
   -------------------------------------------------------------------------- */
/* Hero Section Container - Dark Teal (#1C4552) Background */
.what-we-do-hero.alignfull,
.work-hero.collection-hero {
    background-color: #1C4552 !important; /* Brand Dark Teal */
    background-image: 
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.05) 29%, rgba(255, 255, 255, 0.05) 30%, transparent 31%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.05) 49%, rgba(255, 255, 255, 0.05) 50%, transparent 51%) !important;
}

/* Base Heading Alignment & Sizing */
.what-we-do-hero h1.hero-title {
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(5rem, 10vw, 9.5rem) !important;
    line-height: 0.78 !important;
    text-transform: uppercase !important;
}

.what-we-do-hero h1.hero-title em {
    color: #E0E320 !important; /* KAIROS Lime */
    font-style: normal !important;
    display: block !important;
    margin-left: 1.1ch !important;
}

.what-we-do-hero h1.hero-title span.title-do {
    display: block !important;
    margin-left: 2.3ch !important;
}

.what-we-do-hero .strategy-cards-row {
    gap: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card {
    padding: 0 !important;
    margin: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card:last-child {
    border-right: none !important;
}

.what-we-do-hero .strategy-card a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    padding: 2.2rem 2vw !important;
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.2rem, 2.1vw, 2rem) !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background-color 0.3s ease !important;
}

.what-we-do-hero .strategy-card.goal-one:hover a { background-color: #8E2288 !important; }
.what-we-do-hero .strategy-card.goal-two:hover a { background-color: #E85D35 !important; }
.what-we-do-hero .strategy-card.goal-three:hover a { background-color: #187575 !important; }

/* --------------------------------------------------------------------------
   2. INTERCONNECTED SECTION DISPLAY TYPOGRAPHY
   -------------------------------------------------------------------------- */
.interconnected h2.connected-title {
    color: #172F37 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.8rem, 7.5vw, 6.8rem) !important;
    line-height: 0.82 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
}

.interconnected h2.connected-title em {
    color: #8E2288 !important;
    font-style: normal !important;
    display: block !important;
}

/* --------------------------------------------------------------------------
   3. GOAL PANELS REMEDIATION (RECONCILIATION, SYSTEMS, POWER)
   -------------------------------------------------------------------------- */
/* General Panel Stability - Prevents Layout Shifts */
.goal-panel {
    box-sizing: border-box !important;
    transform: none !important;
    transition: none !important;
}

/* Panel 1: Centre Reconciliation (White BG, Static Purple Left Line) */
.goal-panel.reconciliation {
    background-color: #FFFFFF !important;
    border-left: 4px solid #8E2288 !important;
    padding-left: 3rem !important;
}

.goal-panel.reconciliation:hover {
    background-color: #FFFFFF !important;
}

.goal-panel.reconciliation h2 {
    color: #172F37 !important;
    font-size: clamp(3.2rem, 6.5vw, 5.8rem) !important;
    line-height: 0.88 !important;
    white-space: normal !important;
    word-break: keep-all !important;
    hyphens: none !important;
}

.goal-panel.reconciliation .goal-shift {
    border-top: 2px solid #8E2288 !important;
}

.goal-panel.reconciliation .goal-shift li,
.goal-panel.reconciliation .goal-shift li:hover {
    color: #172F37 !important;
}

/* Panel 2: Drive Systems Change (Teal #1C4552, Orange Left Line) */
.goal-panel.systems {
    background-color: #1C4552 !important;
    border-left: 4px solid #E85D35 !important;
}

.goal-panel.systems:hover {
    background-color: #1C4552 !important;
}

.goal-panel.systems .eyebrow,
.goal-panel.systems .goal-shift p {
    color: #E85D35 !important;
}

.goal-panel.systems .goal-shift {
    border-top: 2px solid #E85D35 !important;
}

.goal-panel.systems h2,
.goal-panel.systems p,
.goal-panel.systems .goal-shift li {
    color: #FFFFFF !important;
}

/* Panel 3: Build People Power (White BG, Teal #187575 Left Line) */
.goal-panel.power {
    background-color: #FFFFFF !important;
    border-left: 4px solid #187575 !important;
}

.goal-panel.power:hover {
    background-color: #FFFFFF !important;
}

.goal-panel.power .eyebrow,
.goal-panel.power .goal-shift p {
    color: #187575 !important;
}

.goal-panel.power .goal-shift {
    border-top: 2px solid #187575 !important;
}

/* --------------------------------------------------------------------------
   4. COVENANTS GRID & PATH CALLOUT
   -------------------------------------------------------------------------- */
.covenant-grid .covenant {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.path-callout.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    background-color: #8E2288 !important;
}
/* ==========================================================================
   WHAT WE DO PAGE - MASTER REMEDIATION BLOCK
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. HERO HEADER: Deep Purple Background & Full-Width Cards
   -------------------------------------------------------------------------- */
.what-we-do-hero,
.work-hero.collection-hero {
    background-color: #4C1D4B !important; /* Deep KAIROS Purple */
    background-image: 
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.08) 29%, rgba(255, 255, 255, 0.08) 30%, transparent 31%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.08) 49%, rgba(255, 255, 255, 0.08) 50%, transparent 51%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    padding-top: 4rem !important;
}

/* Force Strategy Cards Row Edge-to-Edge */
.what-we-do-hero .strategy-cards-row,
.what-we-do-hero .hero-goals {
    display: flex !important;
    width: 100% !important;
    margin-top: 4rem !important;
    gap: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card {
    flex: 1 1 33.333% !important;
    padding: 0 !important;
    margin: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card:last-child {
    border-right: none !important;
}

.what-we-do-hero .strategy-card a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    padding: 2.2rem 2vw !important;
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.2rem, 2vw, 1.8rem) !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background-color 0.3s ease !important;
}

/* --------------------------------------------------------------------------
   2. GOAL PANELS: Zero Layout Shifts & Clean Hover States
   -------------------------------------------------------------------------- */
/* Hide standalone circle arrow button (arrow stays inside inline link) */
.goal-panel .goal-arrow-button,
.goal-panel .goal-main > .goal-arrow {
    display: none !important;
}

/* Lock container dimensions so nothing shifts on mouseover */
.goal-panel {
    box-sizing: border-box !important;
    transform: none !important;
    transition: none !important;
}

/* Reconciliation Panel Hover Locking */
.goal-panel.reconciliation,
.goal-panel.reconciliation:hover {
    background-color: #FFFFFF !important;
    border-left: 4px solid #8E2288 !important;
}

.goal-panel.reconciliation .goal-shift li,
.goal-panel.reconciliation .goal-shift li:hover,
.goal-panel.reconciliation:hover .goal-shift li {
    color: #172F37 !important;
    transform: none !important;
}

/* Drive Systems Change Panel Hover Locking */
.goal-panel.systems,
.goal-panel.systems:hover {
    background-color: #1C4552 !important;
    border-left: 4px solid #E85D35 !important;
}

.goal-panel.systems .goal-shift li,
.goal-panel.systems .goal-shift li:hover,
.goal-panel.systems:hover .goal-shift li {
    color: #FFFFFF !important;
    transform: none !important;
}

/* Build People Power Panel Hover Locking & Visible List Fix */
.goal-panel.power,
.goal-panel.power:hover {
    background-color: #FFFFFF !important;
    border-left: 4px solid #187575 !important;
}

.goal-panel.power .eyebrow,
.goal-panel.power .goal-shift p {
    color: #187575 !important;
}

.goal-panel.power .goal-shift {
    border-top: 2px solid #187575 !important;
}

/* Keep list text visible in Dark Slate (#172F37) on hover instead of turning white */
.goal-panel.power .goal-shift li,
.goal-panel.power .goal-shift li:hover,
.goal-panel.power:hover .goal-shift li {
    color: #172F37 !important;
    opacity: 1 !important;
    transform: none !important;
}

/* Inline Link Arrow Hover Glide */
.goal-panel a .goal-arrow,
.goal-panel a span {
    display: inline-block !important;
    transition: transform 0.2s ease !important;
}

.goal-panel a:hover .goal-arrow,
.goal-panel a:hover span {
    transform: translate(3px, -3px) !important;
}

/* --------------------------------------------------------------------------
   3. COVENANTS GRID: Scale Heading & White Text Hover Fix
   -------------------------------------------------------------------------- */
.covenants-heading h2.covenants-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.5rem, 6.5vw, 6rem) !important; /* Larger display scale */
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.covenants-heading h2.covenants-title em {
    color: #8E2288 !important;
    font-style: normal !important;
}

/* Force Covenant Card Titles to Turn White on Hover */
.covenant-grid .covenant {
    background-color: #FFFFFF !important;
    border: 1px solid rgba(23, 47, 55, 0.22) !important;
    padding: 2.2rem !important;
    transition: background-color 0.3s ease, transform 0.3s ease !important;
}

.covenant-grid .covenant:hover {
    background-color: #187575 !important; /* Teal Background */
    transform: translateY(-5px) !important;
}

.covenant-grid .covenant:hover h3,
.covenant-grid .covenant:hover h3 a,
.covenant-grid .covenant:hover p {
    color: #FFFFFF !important; /* Forces Text to Crisp White */
}

.covenant-grid .covenant h3 a b {
    color: #F15922 !important; /* Orange Arrow */
}

.covenant-grid .covenant:hover h3 a b {
    color: #E0E320 !important; /* Lime Arrow on Hover */
}

/* --------------------------------------------------------------------------
   4. TWO-WAY PATH & FOOTER CTA: Headline Scaling
   -------------------------------------------------------------------------- */
/* Two-Way Path Section Headline */
.path-callout h2.path-title,
.path-callout h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.8rem, 7vw, 6.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
}

.path-callout h2.path-title em {
    color: #E0E320 !important; /* Lime */
    font-style: normal !important;
}

/* "Find your place in the work" Footer CTA Headline */
.work-close h2.close-title,
.work-close h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.8rem, 7vw, 6.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.work-close h2.close-title em {
    color: #8E2288 !important; /* Purple */
    font-style: normal !important;
}
/* ==========================================================================
   WHAT WE DO PAGE - COMPREHENSIVE VIDEO AUDIT REMEDIATION
   ========================================================================== */

/* 1. HERO SECTION & TYPOGRAPHY FIXES */
.what-we-do-hero.alignfull,
.work-hero.collection-hero {
    background-color: #4C1D4B !important; /* KAIROS Deep Purple */
    background-image: 
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.08) 29%, rgba(255, 255, 255, 0.08) 30%, transparent 31%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.08) 49%, rgba(255, 255, 255, 0.08) 50%, transparent 51%) !important;
}

.what-we-do-hero h1.hero-title {
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(5.5rem, 11vw, 10.5rem) !important; /* Scaled Up */
    line-height: 0.76 !important;
    text-transform: uppercase !important;
}

/* Staggered Indentation for "DO" under the "E" in "WE" */
.what-we-do-hero h1.hero-title em {
    color: #E0E320 !important; /* Lime */
    font-style: normal !important;
    display: block !important;
    margin-left: 1.1ch !important;
}

.what-we-do-hero h1.hero-title span.title-do {
    display: block !important;
    margin-left: 2.1ch !important; /* Positions DO flush under the E in WE */
}

/* 2. STRATEGY CARDS ROW (FULL WIDTH EDGE-TO-EDGE) */
.what-we-do-hero .strategy-cards-row,
.what-we-do-hero .hero-goals {
    display: flex !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    gap: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card {
    flex: 1 1 33.333% !important;
    padding: 0 !important;
    margin: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card:last-child {
    border-right: none !important;
}

.what-we-do-hero .strategy-card a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    padding: 2.2rem 2.5vw !important;
    color: #FFFFFF !important;
    font-size: clamp(1.4rem, 2.2vw, 2rem) !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

/* Clean Box-Sizing & Alignment Lock */
.goal-panel,
.goal-panel * {
    box-sizing: border-box !important;
}

/* Ensure Full-Width Containers Don't Create Horizontal Scrollbars */
.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
}

/* Keep the link arrow inline and prevent text movement */
.goal-panel a {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.goal-panel a:hover .goal-arrow {
    transform: translate(3px, -3px);
    transition: transform 0.2s ease;
}

/* 4. COVENANTS CARDS ARROW BADGE POSITIONING */
.covenant-grid .covenant {
    position: relative !important;
    padding: 2.5rem 2.2rem !important;
}

.covenant-grid .covenant h3 a b,
.covenant-grid .covenant .arrow-badge {
    position: absolute !important;
    top: 1.5rem !important;
    right: 1.5rem !important;
    float: none !important;
}

/* 5. TWO-WAY PATH STANDALONE BUTTON REMOVAL */
.path-callout .goal-arrow-button,
.path-callout .wp-block-group > .goal-arrow {
    display: none !important;
}

.path-callout a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border-bottom: 2px solid #E0E320 !important;
}

.path-callout a span.goal-arrow {
    color: #E0E320 !important;
}
/* ==========================================================================
   HERO HEADER PARITY FIX (DEEP TEAL #1D2A30 + ORANGE ACCENTS)
   ========================================================================== */

/* 1. Container Background & Full-Width Outer Canvas */
.what-we-do-hero.alignfull,
.work-hero.collection-hero {
    background-color: #1D2A30 !important; /* Deep Slate Teal matching target design */
    background-image: none !important;
    padding-top: 3.5rem !important;
}

/* 2. Main Title Typography & Indentation */
.what-we-do-hero h1.hero-title {
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(5rem, 11vw, 10rem) !important;
    line-height: 0.78 !important;
    text-transform: uppercase !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* WE (Lime) Indentation */
.what-we-do-hero h1.hero-title em {
    color: #E0E320 !important;
    font-style: normal !important;
    display: block !important;
    margin-left: 0.8ch !important;
}

/* DO (White) Indentation under the E in WE */
.what-we-do-hero h1.hero-title span.title-do {
    color: #FFFFFF !important;
    display: block !important;
    margin-left: 1.6ch !important;
}

/* 3. Right Content Box ("THREE GOALS. ONE SHARED DIRECTION.") */
.what-we-do-hero .hero-message,
.what-we-do-hero .right-content-box {
    border-top: 3px solid #E85D35 !important; /* Orange Accent Line */
    padding-top: 1.5rem !important;
}

.what-we-do-hero .hero-message h2,
.what-we-do-hero .hero-message .hero-count,
.what-we-do-hero .hero-message .hero-direction {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
    line-height: 0.95 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    margin-bottom: 0.5rem !important;
}

.what-we-do-hero .hero-message h2 em,
.what-we-do-hero .hero-message .hero-direction {
    color: #E85D35 !important; /* Orange Highlight */
    font-style: normal !important;
    display: block !important;
}

.what-we-do-hero .hero-message p {
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
}

/* 4. Bottom Strategy Cards Row Background Alignment */
.what-we-do-hero .strategy-cards-row,
.what-we-do-hero .hero-goals {
    background-color: #1C4552 !important; /* Slightly darker teal base for bottom cards */
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}
/* ==========================================================================
   WHAT WE DO HERO - DARK TEAL & ZERO BOTTOM GAP FIX
   ========================================================================== */

/* 1. Force Brand Dark Teal Background (#1C4552) */
.what-we-do-hero.alignfull,
.work-hero.collection-hero {
    background-color: #1C4552 !important;
    background-image: none !important;
    padding-top: 4rem !important;
    padding-bottom: 0 !important; /* Removes bottom padding inside hero wrapper */
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* 2. Anchor Strategy Cards directly to the bottom boundary */
.what-we-do-hero .strategy-cards-row,
.what-we-do-hero .hero-goals {
    margin-top: 4rem !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.what-we-do-hero .strategy-card {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.what-we-do-hero .strategy-card a {
    padding: 2.2rem 2vw !important;
    margin: 0 !important;
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* =======================================
   Base Typography & Accents
   ======================================= */
.eyebrow {
    color: #8E2288; /* var(--purple) */
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.wp-block-heading em { 
    color: #8E2288; /* var(--purple) */
    font-style: normal; 
}

/* =======================================
   Section: Collection Hero
   ======================================= */
.collection-hero {
    background-color: #4C1D4B;
    background-image: 
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.08) 29%, rgba(255, 255, 255, 0.08) 30%, transparent 31%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.08) 49%, rgba(255, 255, 255, 0.08) 50%, transparent 51%),
        radial-gradient(circle at -5% 50%, transparent 0%, transparent 68%, rgba(255, 255, 255, 0.05) 69%, rgba(255, 255, 255, 0.05) 70%, transparent 71%);
    background-repeat: no-repeat;
    padding: clamp(4.5rem, 8vw, 8rem) clamp(2rem, 7vw, 7rem);
}

.collection-hero .wp-block-columns {
    align-items: center;
}

.collection-hero .eyebrow {
    color: #E0E320; /* var(--lime) */
}

.collection-hero h1 {
    color: #FFFFFF;
    font-size: clamp(3.5rem, 8vw, 6rem);
    font-family: 'Barlow Semi Condensed', Impact, sans-serif;
    font-weight: 800;
    line-height: 0.88;
    text-transform: uppercase;
}

.collection-hero h1 em {
    color: #E0E320; /* var(--lime) */
}

.collection-hero-copy p:not(.eyebrow) {
    color: #FFFFFF;
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 520px;
    margin-top: 1.5rem;
}

/* Hero Badge */
.collection-hero-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    color: #172f37; /* var(--ink) */
    background: #E0E320; /* var(--lime) */
    border-radius: 50%;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
    line-height: 1.1;
    box-shadow: 0 12px 38px rgba(23, 47, 55, 0.22);
}

/* =======================================
   Section: Page Section (Grid)
   ======================================= */
.page-section {
    padding: clamp(5rem, 9vw, 9rem) 3rem;
}

.section-intro {
    align-items: flex-end;
    gap: 4rem;
    margin-bottom: clamp(4.5rem, 8vw, 8rem);
}

.section-intro h2 {
    font-size: clamp(3.5rem, 6vw, 6rem);
    color: #1c4552; /* var(--teal) */
}

.section-intro p:not(.eyebrow) {
    font-size: 1.08rem;
    color: #172f37;
}

/* Path Cards */
.path-card {
    padding: 2.2rem;
    background: #ffffff;
    border-top: 6px solid #8e2288; /* var(--purple) */
    box-shadow: 0 15px 40px rgba(23, 47, 55, 0.05);
    transition: transform 300ms ease, box-shadow 300ms ease;
}

.path-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 50px rgba(23, 47, 55, 0.1);
}

.path-card h3 a {
    font-size: clamp(2rem, 3vw, 2.5rem);
    color: #172f37;
    text-decoration: none;
}

.path-card p {
    color: #566a70;
    margin-bottom: 2rem;
}

.goal-arrow {
    color: #1c4552;
    border-bottom: 2px solid #8e2288;
    font-weight: 800;
    text-decoration: none;
}

.goal-arrow span {
    padding-left: 0.35rem;
    color: #8e2288;
}

/* =======================================
   Section: Feature Strip
   ======================================= */
.feature-strip {
    padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - 1240px) / 2));
    background: #1c4552; /* var(--teal) */
    color: #ffffff;
}

.feature-strip .eyebrow {
    color: #E0E320; /* var(--lime) */
}

.feature-strip h2 {
    color: #ffffff;
    font-size: clamp(3.6rem, 6.5vw, 6.5rem);
}

.feature-strip-copy p {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.85);
    max-width: 620px;
    margin-bottom: 2rem;
}

.principle-list {
    list-style: none;
    padding: 0;
}

.principle-list li {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}

.principle-list strong {
    display: block;
    color: #E0E320; /* var(--lime) */
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 0.05em;
    margin-bottom: 0.25rem;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .collection-hero h1 { font-size: clamp(4.3rem, 23vw, 7rem); }
    .collection-hero-mark { margin-top: 3rem; }
    .page-section { padding-left: 1.5rem; padding-right: 1.5rem; }
}
/* ==========================================================================
   HOW WE CREATE CHANGE - MASTER PARITY OVERRIDES
   ========================================================================== */

/* 1. HERO SECTION: Dark Teal Background (#1C4552) */
.how-we-change-hero.alignfull,
.how-we-change-hero {
    background-color: #1C4552 !important; /* Brand Dark Teal */
    background-image: none !important;
    color: #FFFFFF !important;
    padding: clamp(4.5rem, 8vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

.how-we-change-hero .eyebrow {
    color: #E0E320 !important; /* Lime Eyebrow */
}

.how-we-change-hero h1.hero-title {
    color: #FFFFFF !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.8rem, 9vw, 8.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
}

.how-we-change-hero h1.hero-title em {
    color: #E0E320 !important; /* Lime Highlight */
    font-style: normal !important;
}

/* 2. Floating Lime Circle Badge */
.how-we-change-hero .collection-hero-mark {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 160px !important;
    height: 160px !important;
    margin: 0 auto !important;
    background-color: #E0E320 !important; /* Lime Circle */
    color: #172F37 !important;
    border-radius: 50% !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
    font-size: 1.1rem !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.25) !important;
}

/* 3. SECTION 2: Display Headline & Teal Accents */
.how-we-change-section .eyebrow {
    color: #187575 !important; /* Teal Accent */
}

.how-we-change-section h2.section-display-title {
    color: #172F37 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.8rem, 7vw, 6.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
}

.how-we-change-section h2.section-display-title em {
    color: #187575 !important; /* Teal Highlight */
    font-style: normal !important;
}

/* 4. PATH CARDS GRID (Elevated White Cards + Hover Lift) */
.how-we-change-section .path-grid {
    display: flex !important;
    gap: 1.8rem !important;
    margin-top: 3.5rem !important;
}

.how-we-change-section .path-card {
    flex: 1 1 33.333% !important;
    background-color: #FFFFFF !important;
    border-top: 6px solid #187575 !important; /* Top Teal Border */
    padding: 2.2rem !important;
    border-radius: 0 !important;
    box-shadow: 0 10px 30px rgba(23, 47, 55, 0.06) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.how-we-change-section .path-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 18px 45px rgba(23, 47, 55, 0.12) !important;
}

.how-we-change-section .path-card h3 {
    margin: 0 0 1rem 0 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.8rem, 2.5vw, 2.5rem) !important;
    line-height: 0.95 !important;
    text-transform: uppercase !important;
}

.how-we-change-section .path-card h3 a {
    color: #172F37 !important;
    text-decoration: none !important;
}

.how-we-change-section .path-card p {
    color: #536A70 !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    margin-bottom: 2rem !important;
}

/* Clean Inline "Explore ↗" Link (No squished button wrapper) */
.how-we-change-section .path-card .card-link-wrapper {
    margin-bottom: 0 !important;
}

.how-we-change-section .path-card a.card-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    color: #187575 !important; /* Teal */
    font-weight: 800 !important;
    text-decoration: none !important;
    border-bottom: 2px solid #187575 !important;
    padding-bottom: 2px !important;
    font-size: 0.95rem !important;
    text-transform: uppercase !important;
}

.how-we-change-section .path-card a.card-link span.arrow {
    display: inline-block !important;
    transition: transform 0.2s ease !important;
}

.how-we-change-section .path-card a.card-link:hover span.arrow {
    transform: translate(3px, -3px) !important;
}
/* =======================================
   Section: Get Involved Page Overrides
   ======================================= */
.involved-hero {
    background: #172F37 !important; /* Brand Ink */
    color: #FFFFFF !important;
    padding: clamp(6rem, 10vw, 10rem) 3rem 5rem max(3rem, calc((100vw - 1240px) / 2)) !important;
    position: relative;
    overflow: hidden;
}

.hero-kicker .eyebrow { color: #E0E320 !important; }
.hero-statement h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 9vw, 9rem) !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
}

.hero-statement h1 em { color: #F15922 !important; font-style: normal !important; }

/* Action Cards Board */
.action-board { border-top: 1px solid rgba(23, 47, 55, 0.24) !important; }

.action-card {
    --action: #187575; /* Default: Teal */
    align-items: center !important;
    min-height: 180px !important;
    padding: 2rem 1.4rem !important;
    color: #172F37 !important;
    border-bottom: 1px solid rgba(23, 47, 55, 0.24) !important;
    text-decoration: none !important;
    transition: color 220ms ease, background 220ms ease, padding 220ms ease !important;
}

.action-news { --action: #6A712D !important; }   /* Moss */
.action-events { --action: #F15922 !important; } /* Orange */
.action-donate { --action: #8E2288 !important; } /* Purple */

.action-card:hover {
    padding-right: 2rem !important;
    padding-left: 2rem !important;
    color: #FFFFFF !important;
    background: var(--action) !important;
}

.action-card h3 a {
    font: 800 clamp(2.2rem, 4vw, 4.2rem)/0.9 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    color: inherit !important;
}

.action-verb {
    color: var(--action) !important;
    font-size: 0.76rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

.action-card:hover .action-verb { color: #E0E320 !important; }

/* Movement Steps Section */
.movement-path {
    padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - 1240px) / 2)) !important;
    color: #FFFFFF !important;
    background: #8E2288 !important; /* Deep Purple */
}

.movement-heading .eyebrow { color: #E0E320 !important; }

.movement-steps .wp-block-column {
    position: relative;
    padding: 2rem 1.5rem !important;
    border-right: 1px solid rgba(255, 255, 255, 0.35) !important;
}

.movement-steps .wp-block-column:last-child { border-right: none !important; }

.movement-steps strong {
    display: block !important;
    font: 800 clamp(2rem, 3.5vw, 3.5rem)/1 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
}

/* Step Circle Arrows */
@media (min-width: 768px) {
    .movement-steps .wp-block-column:not(:last-child)::after {
        position: absolute;
        z-index: 2;
        top: 50%;
        right: -18px;
        display: grid;
        width: 36px;
        height: 36px;
        place-items: center;
        content: "→";
        color: #172F37;
        background: #E0E320;
        border-radius: 50%;
        font-weight: 800;
        transform: translateY(-50%);
    }
}
/* ==========================================================================
   GET INVOLVED PAGE - MASTER PARITY OVERRIDES
   ========================================================================== */

/* 1. HERO SECTION: Layout, Rotated Kicker, Enlarged Title & Lime Circle */
.involved-hero {
    background-color: #172F37 !important; /* KAIROS Dark Ink */
    color: #FFFFFF !important;
    padding: clamp(6rem, 11vw, 11rem) clamp(2rem, 6vw, 6rem) !important;
    position: relative !important;
    overflow: hidden !important;
}

.involved-hero .hero-kicker {
    position: relative !important;
}

.involved-hero .hero-kicker .eyebrow {
    color: #E0E320 !important; /* Lime */
    font-size: 0.8rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
}

.involved-hero .hero-kicker .kicker-text {
    color: rgba(255, 255, 255, 0.45) !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.8rem, 2.5vw, 2.8rem) !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    position: absolute !important;
    top: 5rem !important;
    left: 0 !important;
    transform: rotate(-90deg) !important;
    transform-origin: top left !important;
    white-space: nowrap !important;
}

.involved-hero .hero-statement h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(5.2rem, 10vw, 10rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    margin: 0 0 1.5rem 0 !important;
}

.involved-hero .hero-statement h1 em {
    color: #F15922 !important; /* KAIROS Orange */
    font-style: normal !important;
}

.involved-hero .hero-statement p {
    font-size: clamp(1.1rem, 1.6vw, 1.35rem) !important;
    color: rgba(255, 255, 255, 0.85) !important;
    max-width: 580px !important;
}

/* Floating Lime Circle Graphic on Hero */
.involved-hero .hero-lime-circle {
    position: absolute !important;
    right: -80px !important;
    bottom: -80px !important;
    width: 320px !important;
    height: 320px !important;
    background-color: #E0E320 !important;
    border-radius: 50% !important;
    z-index: 1 !important;
}

/* 2. "CHOOSE YOUR WAY IN" SECTION & DISPLAY HEADLINE */
.ways {
    padding: clamp(6rem, 10vw, 10rem) max(2rem, calc((100vw - 1240px) / 2)) !important;
    background-color: #F7F7F2 !important;
}

.ways .ways-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.2rem, 7.5vw, 7.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    margin: 0 !important;
}

/* Action Board Cards */
.action-board {
    border-top: 1px solid rgba(23, 47, 55, 0.2) !important;
    margin-top: 4rem !important;
}

.action-card {
    --action-color: #187575; /* Default Teal */
    align-items: center !important;
    padding: 2.2rem 1.5rem !important;
    border-bottom: 1px solid rgba(23, 47, 55, 0.2) !important;
    transition: background-color 0.25s ease, padding 0.25s ease !important;
}

.action-card.action-join { --action-color: #187575 !important; }   /* Teal */
.action-card.action-news { --action-color: #6A712D !important; }   /* Moss */
.action-card.action-events { --action-color: #F15922 !important; } /* Orange */
.action-card.action-donate { --action-color: #8E2288 !important; } /* Purple */

.action-card:hover {
    background-color: var(--action-color) !important;
    padding-left: 2.2rem !important;
    padding-right: 2.2rem !important;
}

.action-card .action-verb {
    color: var(--action-color) !important;
    font-size: 0.8rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    margin-bottom: 0.4rem !important;
}

.action-card:hover .action-verb {
    color: #E0E320 !important; /* Lime on Hover */
}

.action-card h3 {
    margin: 0 0 0.5rem 0 !important;
}

.action-card h3 a {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(2.5rem, 4.5vw, 4.8rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    text-decoration: none !important;
}

.action-card:hover h3 a,
.action-card:hover p {
    color: #FFFFFF !important;
}

.action-card .action-arrow-col {
    text-align: right !important;
}

.action-card a.action-arrow {
    font-size: 2.5rem !important;
    color: #172F37 !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: transform 0.25s ease !important;
}

.action-card:hover a.action-arrow {
    color: #FFFFFF !important;
    transform: translate(6px, -6px) !important;
}

/* 3. "MOVEMENT PATH" SECTION: Enlarged White Headline & White Border Line */
.movement-path {
    background-color: #8E2288 !important; /* KAIROS Purple */
    color: #FFFFFF !important;
    padding: clamp(6rem, 10vw, 10rem) max(2rem, calc((100vw - 1240px) / 2)) !important;
}

.movement-path .movement-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.2rem, 7.5vw, 7.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    margin-bottom: 3.5rem !important;
}

.movement-steps {
    border-top: 2px solid #FFFFFF !important; /* White Top Divider Line */
    padding-top: 2.5rem !important;
}

.movement-steps .wp-block-column {
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding: 1rem 1.5rem !important;
}

.movement-steps .wp-block-column:last-child {
    border-right: none !important;
}

.movement-steps strong {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(2.2rem, 3.8vw, 3.8rem) !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    display: block !important;
    margin-bottom: 0.8rem !important;
}

/* 4. "BRING WHAT YOU HAVE" FOOTER CTA: KAIROS Lime Background (#E0E320) */
.involved-close {
    background-color: #E0E320 !important; /* Solid KAIROS Lime */
    color: #172F37 !important;
    padding: clamp(6rem, 10vw, 10rem) max(2rem, calc((100vw - 1240px) / 2)) !important;
    position: relative !important;
    overflow: hidden !important;
}

.involved-close .close-copy h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8vw, 8rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    margin: 0 0 1.5rem 0 !important;
}

.involved-close .close-btn-col {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
}

.involved-close a.close-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 1.5rem !important;
    padding: 1.1rem 2.2rem !important;
    background-color: #172F37 !important; /* Dark Ink Pill Button */
    color: #FFFFFF !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
    font-size: 1.1rem !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background-color 0.25s ease, transform 0.25s ease !important;
}

.involved-close a.close-link:hover {
    background-color: #8E2288 !important; /* Flips to Purple on Hover */
    transform: translateY(-3px) !important;
}

/* Circular Watermark Text Graphic ("TOGETHER") */
.involved-close .close-orbit {
    position: absolute !important;
    right: -2rem !important;
    top: 50% !important;
    transform: translateY(-50%) rotate(15deg) !important;
    width: 380px !important;
    height: 380px !important;
    border: 2px solid rgba(23, 47, 55, 0.2) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 2.2rem !important;
    color: rgba(23, 47, 55, 0.15) !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
}
/* ==========================================================================
   GET INVOLVED HERO - KICKER DROPDOWN FIX
   ========================================================================== */

/* 1. Establish Relative Flex Box Context */
.involved-hero .hero-kicker {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-height: 260px !important; /* Ensures container height fits vertical text */
}

/* 2. Anchor Eyebrow at Top */
.involved-hero .hero-kicker .eyebrow {
    color: #E0E320 !important; /* KAIROS Lime */
    font-size: 0.8rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    margin-bottom: 2rem !important; /* Pushes vertical origin down */
    position: relative !important;
    z-index: 2 !important;
}

/* 3. Rotated Vertical Kicker Positioned Underneath Eyebrow */
.involved-hero .hero-kicker .kicker-text {
    color: rgba(255, 255, 255, 0.45) !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(1.8rem, 2.5vw, 2.8rem) !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    
    /* Position transform below the eyebrow line */
    position: absolute !important;
    top: 3.5rem !important; /* Drops kicker origin clear of eyebrow */
    left: 0 !important;
    transform: rotate(-90deg) translateY(-100%) !important;
    transform-origin: top left !important;
    margin: 0 !important;
}
/* =======================================
   Section: Mission & Roots Page Overrides
   ======================================= */
.tone-green { 
    --page-accent: #6a712d !important; 
    --page-wash: #eef0d8 !important; 
    --page-deep: #364a3f !important; 
}

/* Collection Hero Specifics */
.collection-hero.tone-green {
    background-color: var(--page-deep) !important;
    color: #FFFFFF !important;
    padding: clamp(5rem, 10vw, 9rem) clamp(2rem, 6vw, 6rem) !important;
}

.collection-hero.tone-green .eyebrow {
    color: #E0E320 !important; /* KAIROS Lime */
}

.collection-hero.tone-green h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 9vw, 8.5rem) !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
}

.collection-hero.tone-green h1 em {
    color: #E0E320 !important; /* KAIROS Lime */
    font-style: normal !important;
}

.collection-hero-art figure {
    position: relative !important;
    min-height: 480px !important;
    overflow: hidden !important;
    background: var(--page-wash) !important;
    margin: 0 !important;
    border-radius: 999px 999px 2rem 2rem !important;
}

/* Statement Panel Typography & Framing */
.statement-panel .eyebrow { color: var(--page-accent) !important; }

.statement-panel h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.5rem, 7vw, 6.8rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #1C4552 !important; /* Teal */
}

.statement-panel h2 em {
    color: var(--page-accent) !important;
    font-style: normal !important;
}

.statement-panel figure {
    margin: 0 !important;
    min-height: 420px !important;
    overflow: hidden !important;
    border-radius: 55% 55% 1.5rem 1.5rem !important;
}

/* Feature Strip Integration */
.feature-strip.tone-green {
    background: var(--page-deep) !important;
    color: #FFFFFF !important;
}

.feature-strip.tone-green .eyebrow {
    color: #E0E320 !important;
}

.feature-strip.tone-green h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.5rem, 7vw, 7rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
}

.principle-list li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.principle-list strong {
    color: #E0E320 !important; /* KAIROS Lime */
}

/* Quote Panel Card */
.quote-panel {
    background: var(--page-wash) !important;
    border-radius: 2rem !important;
    padding: clamp(3.5rem, 7vw, 6rem) clamp(2rem, 6vw, 5rem) !important;
}

.quote-panel blockquote p {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 700 !important;
    font-size: clamp(2rem, 3.8vw, 3.8rem) !important;
    line-height: 1.08 !important;
    color: #172F37 !important;
}

.quote-panel cite {
    color: var(--page-accent) !important;
    font-weight: 800 !important;
    margin-top: 1.5rem !important;
}
/* ==========================================================================
   OUR MISSION & OUR ROOTS - REMEDIATION OVERRIDES
   ========================================================================== */

/* 1. Remove Arch Frame Mask on Hero Tree Artwork */
.collection-hero-art figure {
    border-radius: 0 !important;
    background: transparent !important;
    min-height: auto !important;
}

.collection-hero-art figure::after {
    display: none !important; /* Removes pseudo-element arch overlay */
}

.collection-hero-art img {
    object-fit: contain !important;
    max-height: 520px !important;
}

/* 2. Headline Color Highlights & Wrap Locking */
.statement-panel h2 em.moss-text {
    color: #6A712D !important; /* Moss Green */
    font-style: normal !important;
}

.no-wrap-title {
    white-space: nowrap !important; /* Prevents trailing period from breaking onto new line */
}

/* 3. 2-Column Key-Value Grid for Our Roots Section */
.roots-grid {
    margin-top: 2rem !important;
    border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.roots-row {
    display: flex !important;
    align-items: flex-start !important;
    padding: 1.25rem 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.roots-label {
    flex: 0 0 35% !important;
    color: #E0E320 !important; /* Kairos Lime */
    font-family: "Barlow Semi Condensed", sans-serif !important;
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
}

.roots-desc {
    flex: 0 0 65% !important;
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
}

@media (max-width: 768px) {
    .no-wrap-title {
        white-space: normal !important;
    }
    .roots-row {
        flex-direction: column !important;
        gap: 0.4rem !important;
    }
}
/* ==========================================================================
   STAFF TEAM / OUR PEOPLE DIRECTORY - PARITY OVERRIDES
   ========================================================================== */

/* Theme Configuration for Light Tone Paper Hub Pages */
.tone-paper { 
    --page-accent: #8E2288 !important; /* KAIROS Purple */
    --page-wash: #F4EFD9 !important;   /* Warm Paper Wash */
    --page-deep: #253D43 !important; 
}

.light-page.collection-hero {
    background: var(--page-wash) !important;
    color: #172F37 !important;
    padding: clamp(5rem, 10vw, 9rem) clamp(2rem, 6vw, 6rem) !important;
}

.light-page.collection-hero .eyebrow { 
    color: var(--page-accent) !important; 
}

.hub-page.collection-hero h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 9vw, 8.5rem) !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.hub-page.collection-hero h1 em {
    color: var(--page-accent) !important;
    font-style: normal !important;
}

.collection-hero-mark {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    width: 150px !important;
    height: 150px !important;
    margin: 0 auto !important;
    color: #172F37 !important;
    background: #E0E320 !important; /* KAIROS Lime Circle Badge */
    border-radius: 50% !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
    box-shadow: 0 12px 38px rgba(23, 47, 55, 0.18) !important;
}

/* Directory Grid Layout & Cards */
.directory-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
    margin-top: 3.5rem !important;
}

.person-card {
    background: #FFFFFF !important;
    border: 1px solid rgba(28, 69, 82, 0.18) !important;
    border-radius: 1.2rem !important;
    box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

.person-card figure {
    margin: 0 !important;
}

.person-card img {
    width: 100 !important;
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    object-position: center 18% !important;
}

.person-card-copy {
    padding: 1.35rem !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

.person-card h3 {
    margin: 0 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.55rem !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.person-card-copy > p {
    margin: 0.6rem 0 0 0 !important;
    color: #53666D !important;
    font-size: 0.92rem !important;
    line-height: 1.4 !important;
}

.person-card details {
    margin-top: auto !important;
    padding-top: 0.9rem !important;
    border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

.person-card summary {
    color: var(--page-accent) !important;
    cursor: pointer !important;
    font-weight: 800 !important;
    font-size: 0.88rem !important;
}

.person-card details p {
    font-size: 0.86rem !important;
    line-height: 1.55 !important;
    margin-top: 0.5rem !important;
    margin-bottom: 0 !important;
    color: #172F37 !important;
}

/* Directory Responsive Breakdown */
@media (max-width: 1100px) {
    .directory-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .directory-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .directory-grid {
        grid-template-columns: 1fr !important;
    }
}
/* ==========================================================================
   STAFF TEAM HERO - TARGET DESIGN MATCH
   ========================================================================== */

/* 1. Background Wash & Arc Graphic Overlay */
.light-page.collection-hero.staff-hero {
    background-color: #F4EFD9 !important; /* Warm Paper Wash */
    color: #172F37 !important;             /* Dark Ink */
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

.light-page.collection-hero.staff-hero::before {
    position: absolute !important;
    inset: auto auto -10rem -8rem !important;
    z-index: 0 !important;
    width: 28rem !important;
    height: 28rem !important;
    content: "" !important;
    border: 2px solid rgba(23, 47, 55, 0.08) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 3rem rgba(23, 47, 55, 0.04), 0 0 0 6rem rgba(23, 47, 55, 0.025) !important;
    pointer-events: none !important;
}

/* 2. Eyebrow Styling */
.staff-hero .eyebrow {
    color: #8E2288 !important; /* KAIROS Purple */
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

/* 3. Stacked Display Title & Lime Text Highlight */
.staff-hero h1.staff-hero-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
    line-height: 0.82 !important;
    letter-spacing: -0.035em !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* Dark Slate Ink */
    margin: 0 0 1.5rem 0 !important;
}

.staff-hero h1.staff-hero-title em.lime-text {
    color: #E0E320 !important; /* Solid KAIROS Lime */
    font-style: normal !important;
    display: block !important;
}

/* 4. Body Paragraph High-Contrast Dark Text */
.staff-hero p.hero-lead {
    color: #172F37 !important;
    opacity: 0.85 !important;
    font-size: clamp(1.05rem, 1.4vw, 1.25rem) !important;
    line-height: 1.55 !important;
    max-width: 38rem !important;
}
/* ==========================================================================
   STAFF HERO PARAGRAPH CONTRAST & FONT SIZE ADJUSTMENT
   ========================================================================== */

/* Force high-contrast dark ink and larger fluid font size */
.light-page.collection-hero.staff-hero .collection-hero-copy p,
.light-page.collection-hero.staff-hero p.hero-lead,
.light-page.collection-hero.staff-hero .collection-hero-copy p:not(.eyebrow) {
    color: #172F37 !important;
    opacity: 0.92 !important;
    font-size: clamp(1.2rem, 1.8vw, 1.5rem) !important; /* Scaled up from 1.05-1.25rem */
    line-height: 1.6 !important;
}

/* Maintain purple color for the eyebrow tagline */
.light-page.collection-hero.staff-hero .collection-hero-copy p.eyebrow {
    color: #8E2288 !important;
}
/* ==========================================================================
   STAFF TEAM - INTRO TITLE SCALE ADJUSTMENT (-25%)
   ========================================================================== */

/* Reduced scale by 25% for balanced visual hierarchy */
.section-intro h2,
.page-section .section-intro h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.6rem, 7.5vw, 7.1rem) !important; /* Scaled down 25% */
    line-height: 0.85 !important;
    letter-spacing: -0.04em !important;
    text-transform: uppercase !important;
    color: #1C4552 !important; /* KAIROS Dark Teal */
}

/* Maintain purple accent highlight */
.section-intro h2 em,
.page-section .section-intro h2 em {
    color: #8E2288 !important; /* KAIROS Purple */
    font-style: normal !important;
}
/* ==========================================================================
   STAFF CARD DETAILS SUMMARY LINK STYLING
   ========================================================================== */

/* Make the summary text render in KAIROS Purple and look like a clickable link */
.person-card details summary {
    color: #8E2288 !important; /* KAIROS Purple */
    font-weight: 800 !important;
    font-size: 0.9rem !important;
    cursor: pointer !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: color 0.2s ease !important;
}

/* Hover & Focus state effect */
.person-card details summary:hover,
.person-card details summary:focus {
    color: #1C4552 !important; /* Flips to KAIROS Dark Teal on hover */
}
/* ==========================================================================
   SHARED GOVERNANCE & NAME CLOUD PARITY OVERRIDES
   ========================================================================== */

/* Tone Green Colors */
.tone-green { 
    --page-accent: #6A712D !important; /* Moss */
    --page-wash: #EEF0D8 !important;   /* Green Wash */
    --page-deep: #364A3F !important;   /* Deep Green */
}

/* Light Hero Section */
.collection-hero.light-page {
    background-color: var(--page-wash) !important;
    color: #172F37 !important;
    padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

.collection-hero.light-page .eyebrow {
    color: var(--page-accent) !important;
}

.collection-hero.light-page h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.3rem, 8vw, 8rem) !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.collection-hero.light-page h1 em {
    color: var(--page-accent) !important;
    font-style: normal !important;
}

/* Name Cloud Pills */
.name-cloud { 
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: 0.75rem !important; 
    align-items: stretch !important; 
    margin-top: 2rem !important;
}

.name-cloud p,
.name-cloud span,
.name-cloud a { 
    margin: 0 !important;
    padding: 0.8rem 1.2rem !important; 
    color: #172F37 !important; /* Dark Ink */
    background-color: #FFFFFF !important; 
    border: 1px solid rgba(28, 69, 82, 0.18) !important; 
    border-radius: 999px !important; 
    font-weight: 700 !important; 
    font-size: 0.95rem !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(23, 47, 55, 0.04) !important;
}

.feature-strip .name-cloud p {
    color: #172F37 !important; /* Ensures dark readable text inside white pills on dark background */
}
/* ==========================================================================
   SHARED GOVERNANCE HERO - MASTER PARITY OVERRIDES
   ========================================================================== */

/* 1. Background Wash & Dual Arch Overlay */
.governance-hero {
    background-color: #EEF0D8 !important; /* Green Wash Background */
    color: #172F37 !important;             /* KAIROS Dark Ink */
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

/* Left Background Arcs */
.governance-hero::before {
    position: absolute !important;
    inset: auto auto -10rem -8rem !important;
    z-index: 0 !important;
    width: 32rem !important;
    height: 32rem !important;
    content: "" !important;
    border: 2px solid rgba(23, 47, 55, 0.12) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 3.5rem rgba(23, 47, 55, 0.05), 0 0 0 7rem rgba(23, 47, 55, 0.03) !important;
    pointer-events: none !important;
}

/* Right Giant Outer Circle Arc */
.governance-hero::after {
    position: absolute !important;
    top: -12rem !important;
    right: -10rem !important;
    z-index: 0 !important;
    width: 48rem !important;
    height: 48rem !important;
    content: "" !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* 2. Eyebrow Tagline */
.governance-hero .eyebrow {
    color: #6A712D !important; /* Moss Green */
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

/* 3. Title Styling & Word Wrap Fix */
.governance-hero h1.governance-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8.5vw, 8.5rem) !important;
    line-height: 0.85 !important;
    letter-spacing: -0.035em !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* Force Dark Slate Ink on "SHARED" */
    margin: 0 0 1.5rem 0 !important;
    white-space: nowrap !important; /* Prevents "GOVERNANCE" from wrapping prematurely */
}

.governance-hero h1.governance-title em.lime-text {
    color: #E0E320 !important; /* Solid KAIROS Lime */
    font-style: normal !important;
    display: block !important;
}

/* 4. High-Contrast Lead Paragraph */
.governance-hero p.hero-lead {
    color: #172F37 !important; /* Force Dark Ink */
    opacity: 0.9 !important;
    font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
    line-height: 1.55 !important;
    max-width: 38rem !important;
}

/* 5. Tilted Circle "FAITH IN ACTION" Line Art Badge */
.governance-hero .governance-badge {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: clamp(260px, 22vw, 340px) !important;
    height: clamp(260px, 22vw, 340px) !important;
    margin: 0 auto !important;
    border: 2px solid #172F37 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.governance-hero .governance-badge span {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(2.2rem, 3.5vw, 3.8rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    text-align: center !important;
    transform: rotate(-10deg) !important; /* Tilted text */
    display: block !important;
}

@media (max-width: 900px) {
    .governance-hero h1.governance-title {
        white-space: normal !important;
    }
}
/* ==========================================================================
   SHARED GOVERNANCE - HERO BODY TEXT CONTRAST FIX
   ========================================================================== */

/* Force solid dark ink / black text on the lead paragraph under the title */
.governance-hero .collection-hero-copy p,
.governance-hero p.hero-lead,
.governance-hero .collection-hero-copy p:not(.eyebrow) {
    color: #172F37 !important; /* KAIROS Dark Slate Ink / Black */
    opacity: 1 !important;
}

/* Maintain moss green color on the eyebrow tagline */
.governance-hero .collection-hero-copy p.eyebrow {
    color: #6A712D !important;
}
/* ==========================================================================
   SHARED GOVERNANCE - FIXES FOR HEADINGS, COLORS & NAME CLOUDS
   ========================================================================== */

/* 1. Fix "MANY TRADITIONS. ONE TABLE." Moss Green Accent & Display Scale */
.governance-section .section-intro .eyebrow {
    color: #6A712D !important; /* Moss Green */
}

.governance-section .section-intro h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4rem, 8vw, 7.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* Dark Slate Ink */
}

.governance-section .section-intro h2 em.moss-text,
.governance-section .section-intro h2 em {
    color: #6A712D !important; /* KAIROS Moss Green */
    font-style: normal !important;
}

/* 2. Fix Feature Strip "GOVERNANCE IN RELATIONSHIP." Title & Column Width */
.governance-strip .strip-title-col {
    flex-basis: 45% !important;
}

.governance-strip h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4rem, 8vw, 7.8rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    white-space: nowrap !important; /* Prevents "GOVERNANCE" from wrapping across lines */
}

/* 3. Global Name Cloud Pill Styling (Restores Pills in Both Sections) */
.name-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.75rem !important;
    align-items: center !important;
    margin-top: 2rem !important;
}

.name-cloud p {
    margin: 0 !important;
    padding: 0.75rem 1.25rem !important;
    background-color: #FFFFFF !important;
    color: #172F37 !important; /* Dark Ink text */
    border: 1px solid rgba(28, 69, 82, 0.18) !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    line-height: 1.2 !important;
    box-shadow: 0 4px 12px rgba(23, 47, 55, 0.04) !important;
}

@media (max-width: 900px) {
    .governance-strip h2 {
        white-space: normal !important;
    }
}
/* ==========================================================================
   ANNUAL REPORTS ARCHIVE - PARITY OVERRIDES
   ========================================================================== */

/* Theme Configuration for Tone Paper Light Hero */
.tone-paper { 
    --page-accent: #8E2288 !important; /* KAIROS Purple */
    --page-wash: #F4EFD9 !important;   /* Paper Wash */
    --page-deep: #253D43 !important; 
}

.light-page.collection-hero {
    background: var(--page-wash) !important;
    color: #172F37 !important;
    padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

.light-page.collection-hero .eyebrow { 
    color: var(--page-accent) !important; 
}

.light-page.collection-hero h1 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.3rem, 8vw, 8rem) !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.light-page.collection-hero h1 em {
    color: var(--page-accent) !important;
    font-style: normal !important;
}

/* Resource List & Row Styling */
.resource-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin-top: 3rem !important;
    border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

.resource-row {
    align-items: center !important;
    padding: 1.8rem 0 !important;
    border-bottom: 1px solid rgba(28, 69, 82, 0.18) !important;
    margin: 0 !important;
}

.resource-date {
    color: var(--page-accent) !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.4rem !important;
    margin: 0 !important;
}

.resource-row h3 {
    margin: 0 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 700 !important;
    font-size: clamp(1.4rem, 2.2vw, 2rem) !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.resource-links p {
    margin: 0 !important;
    text-align: right !important;
    font-size: 1rem !important;
    color: rgba(23, 47, 55, 0.4) !important;
}

.resource-links a {
    color: var(--page-accent) !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    transition: color 0.2s ease !important;
}

.resource-links a:hover {
    color: #1C4552 !important; /* KAIROS Dark Teal */
    text-decoration: underline !important;
}

@media (max-width: 768px) {
    .resource-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.5rem !important;
    }
    .resource-links p {
        text-align: left !important;
    }
}
/* ==========================================================================
   ANNUAL REPORTS HERO - PARITY OVERRIDES
   ========================================================================== */

/* 1. Base Container & Left Double-Ring Arc Background */
.light-page.collection-hero.reports-hero {
    background-color: #F4EFD9 !important; /* Paper Wash */
    color: #172F37 !important;             /* KAIROS Dark Ink */
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

.light-page.collection-hero.reports-hero::before {
    position: absolute !important;
    inset: auto auto -10rem -8rem !important;
    z-index: 0 !important;
    width: 28rem !important;
    height: 28rem !important;
    content: "" !important;
    border: 2px solid rgba(23, 47, 55, 0.08) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 3rem rgba(23, 47, 55, 0.04), 0 0 0 6rem rgba(23, 47, 55, 0.025) !important;
    pointer-events: none !important;
}

/* 2. Eyebrow Tagline */
.reports-hero .eyebrow {
    color: #8E2288 !important; /* KAIROS Purple */
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

/* 3. Headline Text Colors */
.reports-hero h1.reports-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
    line-height: 0.85 !important;
    letter-spacing: -0.035em !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* KAIROS Dark Slate Ink */
    margin: 0 0 1.5rem 0 !important;
}

.reports-hero h1.reports-title em.lime-text {
    color: #E0E320 !important; /* Force KAIROS Lime */
    font-style: normal !important;
    display: block !important;
}

/* 4. High-Contrast Lead Paragraph Text */
.reports-hero p.hero-lead,
.reports-hero .collection-hero-copy p:not(.eyebrow) {
    color: #172F37 !important; /* Dark Slate Ink */
    opacity: 0.9 !important;
    font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
    line-height: 1.55 !important;
    max-width: 38rem !important;
}
/* ==========================================================================
   ANNUAL REPORTS - SECTION INTRO NO-SPLIT HEADING FIX
   ========================================================================== */

/* Prevent word hyphenation or mid-word breaking */
.section-intro h2.no-split-heading,
.section-intro h2.no-split-heading em {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: manual !important;
}

/* Fluid responsive sizing adjustment to ensure word fit */
.section-intro h2.no-split-heading {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3.2rem, 6.5vw, 6.2rem) !important;
    line-height: 0.88 !important;
    letter-spacing: -0.035em !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.section-intro h2.no-split-heading em {
    color: #8E2288 !important; /* KAIROS Purple */
    font-style: normal !important;
    display: block !important;
}

@media (max-width: 768px) {
    .section-intro h2.no-split-heading {
        white-space: normal !important; /* Reverts on mobile screens to allow clean line wrapping */
    }
}
/* ==========================================================================
   CONTACT PAGE - TONE BLUE PARITY OVERRIDES
   ========================================================================== */

/* 1. Theme Variables for Blue Profile */
.tone-blue { 
    --page-accent: #167575 !important; /* Bright Teal */
    --page-wash: #DBECEC !important;   /* Light Teal Wash */
    --page-deep: #183F4A !important;   /* Deep Teal */
}

/* 2. Contact Hero Layout & Typography */
.light-page.collection-hero.contact-hero {
    background-color: var(--page-wash) !important;
    color: #172F37 !important;
    padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
    position: relative !important;
    overflow: hidden !important;
}

.contact-hero .eyebrow {
    color: var(--page-accent) !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

.contact-hero h1.contact-hero-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    margin: 0 0 1.5rem 0 !important;
}

.contact-hero h1.contact-hero-title em.teal-text,
.contact-hero h1.contact-hero-title em {
    color: var(--page-accent) !important; /* KAIROS Bright Teal */
    font-style: normal !important;
}

.contact-hero p.hero-lead,
.contact-hero .collection-hero-copy p:not(.eyebrow) {
    color: #172F37 !important;
    opacity: 0.9 !important;
    font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
    line-height: 1.55 !important;
    max-width: 38rem !important;
}

/* 3. Contact Cards & Button Styling */
.form-copy h2 {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(3rem, 6vw, 5.5rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #1C4552 !important;
    margin: 0 0 1.5rem 0 !important;
}

.contact-card {
    padding: 2.2rem !important;
    background-color: var(--page-wash) !important;
    border-radius: 1.4rem !important;
    margin-bottom: 1.5rem !important;
}

.contact-card h3 {
    margin: 0 0 0.8rem 0 !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.5rem !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
}

.contact-card h3:not(:first-child) {
    margin-top: 2rem !important;
}

.contact-card p a {
    color: var(--page-accent) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

.contact-card p a:hover {
    text-decoration: underline !important;
}

/* Action Pill Buttons */
.button-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.8rem !important;
    margin: 2rem 0 !important;
}

.action-button,
.secondary-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.6rem !important;
    padding: 0.9rem 1.4rem !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
    font-size: 0.95rem !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.action-button {
    color: #FFFFFF !important;
    background-color: var(--page-accent) !important;
}

.action-button:hover {
    background-color: #183F4A !important;
}

.secondary-button {
    color: #172F37 !important;
    background-color: transparent !important;
    border: 1px solid #172F37 !important;
}

.secondary-button:hover {
    background-color: #172F37 !important;
    color: #FFFFFF !important;
}
/* ==========================================================================
   CONTACT HERO - MASTER PARITY OVERRIDES
   ========================================================================== */

/* 1. Light Blue Background Wash & Dual Arch Overlay */
.contact-hero {
    background-color: #DBECEC !important; /* Light Teal Wash */
    color: #172F37 !important;             /* KAIROS Dark Ink */
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

/* Left Margin Arcs */
.contact-hero::before {
    position: absolute !important;
    inset: auto auto -10rem -8rem !important;
    z-index: 0 !important;
    width: 32rem !important;
    height: 32rem !important;
    content: "" !important;
    border: 2px solid rgba(23, 47, 55, 0.1) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 3.5rem rgba(23, 47, 55, 0.04), 0 0 0 7rem rgba(23, 47, 55, 0.02) !important;
    pointer-events: none !important;
}

/* Right Giant Outer Circle Arc */
.contact-hero::after {
    position: absolute !important;
    top: -12rem !important;
    right: -10rem !important;
    z-index: 0 !important;
    width: 48rem !important;
    height: 48rem !important;
    content: "" !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

/* 2. Eyebrow Tagline */
.contact-hero .eyebrow {
    color: #167575 !important; /* KAIROS Teal */
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

/* 3. Title Styling & Lime Accent */
.contact-hero h1.contact-hero-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
    line-height: 0.85 !important;
    letter-spacing: -0.035em !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* Dark Slate Ink */
    margin: 0 0 1.5rem 0 !important;
}

.contact-hero h1.contact-hero-title em.lime-text {
    color: #E0E320 !important; /* Solid KAIROS Lime */
    font-style: normal !important;
    display: block !important;
}

/* 4. High-Contrast Dark Ink Paragraph */
.contact-hero p.hero-lead,
.contact-hero .collection-hero-copy p:not(.eyebrow) {
    color: #172F37 !important; /* Force Dark Slate Ink */
    opacity: 0.9 !important;
    font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
    line-height: 1.55 !important;
    max-width: 38rem !important;
}

/* 5. Large Tilted Line-Art Circle Badge */
.contact-hero .contact-badge {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: clamp(260px, 22vw, 340px) !important;
    height: clamp(260px, 22vw, 340px) !important;
    margin: 0 auto !important;
    border: 2px solid #172F37 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.contact-hero .contact-badge span {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(2.2rem, 3.5vw, 3.8rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    text-align: center !important;
    transform: rotate(-10deg) !important;
    display: block !important;
}
/* ==========================================================================
   NAVIGATION HEADER - SLIDE-DOWN SUBMENU DROPDOWN
   ========================================================================== */

/* Main Navigation Container Alignment */
.wp-block-navigation,
nav.main-navigation ul,
.site-header ul.nav-menu {
    display: flex !important;
    align-items: center !important;
    gap: 2rem !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Parent Nav Items Positioning */
.wp-block-navigation-item,
nav.main-navigation li,
.site-header ul.nav-menu > li {
    position: relative !important;
    list-style: none !important;
}

/* Top-Level Menu Links */
.wp-block-navigation-item > a,
nav.main-navigation > ul > li > a,
.site-header ul.nav-menu > li > a {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.05rem !important;
    text-transform: uppercase !important;
    color: #172F37 !important; /* KAIROS Dark Slate Ink */
    text-decoration: none !important;
    padding: 1.2rem 0 !important;
    display: inline-block !important;
    transition: color 0.2s ease !important;
}

.wp-block-navigation-item > a:hover,
nav.main-navigation > ul > li > a:hover {
    color: #8E2288 !important; /* KAIROS Purple Accent */
}

/* Submenu Dropdown Container (Hidden by default with animation properties) */
.wp-block-navigation-submenu,
nav.main-navigation ul.sub-menu,
.site-header ul.nav-menu ul.sub-menu,
ul.wp-block-navigation__container ul {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 9999 !important;
    min-width: 260px !important;
    background-color: #FFFFFF !important;
    border: 1px solid rgba(28, 69, 82, 0.15) !important;
    border-radius: 1rem !important;
    box-shadow: 0 18px 40px rgba(23, 47, 55, 0.12) !important;
    padding: 0.8rem 0 !important;
    margin: 0 !important;
    list-style: none !important;
    
    /* Smooth Slide & Fade Down Animation setup */
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-12px) !important;
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s !important;
    pointer-events: none !important;
}

/* Display Submenu Slide Down on Hover */
.wp-block-navigation-item:hover > .wp-block-navigation-submenu,
nav.main-navigation li:hover > ul.sub-menu,
.site-header ul.nav-menu > li:hover > ul.sub-menu,
.wp-block-navigation-item:focus-within > .wp-block-navigation-submenu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

/* Submenu Link Items */
.wp-block-navigation-submenu li,
nav.main-navigation ul.sub-menu li,
.site-header ul.nav-menu ul.sub-menu li {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    list-style: none !important;
}

.wp-block-navigation-submenu a,
nav.main-navigation ul.sub-menu a,
.site-header ul.nav-menu ul.sub-menu a {
    display: block !important;
    padding: 0.75rem 1.4rem !important;
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    color: #172F37 !important;
    text-decoration: none !important;
    text-transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Submenu Item Hover State */
.wp-block-navigation-submenu a:hover,
nav.main-navigation ul.sub-menu a:hover {
    background-color: #F4EFD9 !important; /* KAIROS Paper Wash */
    color: #8E2288 !important;             /* KAIROS Purple */
}

/* Remove default bullet markers from WordPress lists */
.wp-block-navigation-submenu li::before,
nav.main-navigation ul.sub-menu li::before {
    content: "" !important;
    display: none !important;
}
/* ==========================================================================
   HEADER NAVIGATION RIGHT-ALIGNMENT FIX
   ========================================================================== */

/* Push the primary navigation wrapper to the right margin */
.site-header .header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.site-header .primary-nav,
nav#primary-nav {
    margin-left: auto !important; /* Forces nav container to far right */
    display: flex !important;
    justify-content: flex-end !important;
}

.primary-nav-list,
.site-header ul.nav-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 2.2rem !important; /* Space between top-level items */
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
/* ==========================================================================
   HEADER FLEX CONTAINER & LOGO SEPARATION FIX
   ========================================================================== */

/* Force horizontal layout separation between brand logo and navigation */
.site-header .header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0.8rem 2rem !important;
}

/* Isolate the brand logo to the left margin */
.site-header .brand {
    display: flex !important;
    align-items: center !important;
    margin-right: auto !important; /* Pushes everything else to the right */
    flex-shrink: 0 !important;
}

.site-header .brand img {
    height: clamp(38px, 4vw, 52px) !important;
    width: auto !important;
    display: block !important;
}

/* Push primary navigation container to the far right */
.site-header .primary-nav,
nav#primary-nav {
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
}

/* Top-level menu list horizontal alignment */
.primary-nav-list,
.site-header ul.nav-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(1.5rem, 2.5vw, 2.5rem) !important; /* Generous gap between items */
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Individual top-level menu links */
.primary-nav-list > li > a,
.site-header ul.nav-menu > li > a {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.05rem !important;
    text-transform: uppercase !important;
    color: #172F37 !important;
    text-decoration: none !important;
    white-space: nowrap !important; /* Prevents "ABOUT US" from line wrapping */
}
/* ==========================================================================
   MOBILE HAMBURGER MENU & RESPONSIVE OVERLAY FIX
   ========================================================================== */

@media (max-width: 900px) {
    /* 1. Show the Hamburger Button */
    .menu-toggle {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        width: 44px !important;
        height: 44px !important;
        background: transparent !important;
        border: 1px solid rgba(28, 69, 82, 0.2) !important;
        border-radius: 8px !important;
        cursor: pointer !important;
        z-index: 1001 !important;
        margin-left: auto !important;
    }

    .menu-toggle span:not(.sr-only) {
        display: block !important;
        width: 22px !important;
        height: 2px !important;
        background-color: #172F37 !important; /* Dark Slate Ink */
        margin: 2px 0 !important;
        transition: transform 0.25s ease, opacity 0.25s ease !important;
    }

    /* Animated 'X' icon state when menu is open */
    .menu-toggle[aria-expanded="true"] span:nth-child(1) {
        transform: translateY(6px) rotate(45deg) !important;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity: 0 !important;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg) !important;
    }

    /* 2. Hide Desktop Menu Navigation by Default on Mobile */
    .site-header .primary-nav,
    nav#primary-nav {
        display: none !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        background-color: #FFFFFF !important;
        border-bottom: 2px solid #8E2288 !important; /* KAIROS Purple accent border */
        box-shadow: 0 20px 30px rgba(23, 47, 55, 0.15) !important;
        padding: 1.5rem 2rem !important;
        z-index: 1000 !important;
    }

    /* 3. Reveal Dropdown Drawer When Open */
    .site-header .primary-nav.is-open,
    nav#primary-nav.is-open {
        display: block !important;
    }

    /* 4. Format Vertical List Items for Mobile */
    .primary-nav-list,
    .site-header ul.nav-menu {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0 !important;
        width: 100% !important;
    }

    .primary-nav-list > li,
    .site-header ul.nav-menu > li {
        width: 100% !important;
        border-bottom: 1px solid rgba(28, 69, 82, 0.08) !important;
    }

    .primary-nav-list > li > a,
    .site-header ul.nav-menu > li > a {
        display: block !important;
        width: 100% !important;
        padding: 1rem 0 !important;
        font-size: 1.1rem !important;
    }

    /* 5. Submenu Display on Mobile */
    .wp-block-navigation-submenu,
    nav.main-navigation ul.sub-menu {
        position: static !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        padding-left: 1rem !important;
        background-color: #F4EFD9 !important; /* Paper Wash */
        border-radius: 0.5rem !important;
        margin-bottom: 0.8rem !important;
    }
}
/* ==========================================================================
   UNIVERSAL RESPONSIVE SUBMENU ARCHITECTURE (FOR ALL TOP-LEVEL ITEMS)
   ========================================================================== */

/* --------------------------------------------------------------------------
   DESKTOP (901px+): All submenus slide down smoothly on hover
   -------------------------------------------------------------------------- */
@media (min-width: 901px) {
    .primary-nav-list .menu-item-has-children,
    .site-header ul.nav-menu > li {
        position: relative !important;
    }

    .primary-nav-list ul.sub-menu,
    .site-header ul.nav-menu ul.sub-menu {
        position: absolute !important;
        top: 100% !important;
        right: 0 !important;
        left: auto !important;
        min-width: 260px !important;
        background-color: #FFFFFF !important;
        border: 1px solid rgba(28, 69, 82, 0.15) !important;
        border-radius: 1rem !important;
        box-shadow: 0 18px 40px rgba(23, 47, 55, 0.12) !important;
        padding: 0.8rem 0 !important;
        margin: 0 !important;
        list-style: none !important;

        /* Hidden Animation Setup */
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(-10px) !important;
        transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s !important;
        pointer-events: none !important;
    }

    /* Trigger slide-down for ANY parent item on desktop hover */
    .primary-nav-list .menu-item-has-children:hover > ul.sub-menu,
    .site-header ul.nav-menu > li:hover > ul.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
    }
}

/* --------------------------------------------------------------------------
   MOBILE (900px and under): Vertical stacking for ALL submenus
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
    /* Hide submenus by default on mobile until tapped */
    .primary-nav-list ul.sub-menu,
    .site-header ul.nav-menu ul.sub-menu {
        display: none; /* Controlled via jQuery slideToggle */
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0.5rem 0 0.8rem 0 !important;
        padding: 0.5rem 1rem !important;
        background-color: #F4EFD9 !important; /* KAIROS Paper Wash */
        border: none !important;
        border-left: 3px solid #8E2288 !important; /* KAIROS Purple Indicator */
        border-radius: 0.5rem !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    /* Vertical items in mobile submenus */
    .primary-nav-list ul.sub-menu li,
    .site-header ul.nav-menu ul.sub-menu li {
        display: block !important;
        width: 100% !important;
        border-bottom: 1px solid rgba(28, 69, 82, 0.08) !important;
    }

    .primary-nav-list ul.sub-menu li:last-child {
        border-bottom: none !important;
    }

    .primary-nav-list ul.sub-menu a,
    .site-header ul.nav-menu ul.sub-menu a {
        display: block !important;
        width: 100% !important;
        padding: 0.65rem 0.5rem !important;
        font-size: 0.95rem !important;
        color: #172F37 !important;
        white-space: normal !important;
    }

    /* Visual Indicator for Parent Links with Submenus */
    .menu-item-has-children > a::after {
        content: " ▾";
        font-size: 0.8rem;
        color: #8E2288;
        display: inline-block;
        transition: transform 0.2s ease;
    }

    .menu-item-has-children.submenu-open > a::after {
        transform: rotate(180deg);
    }
}
/* ==========================================================================
   MOBILE SUB-MENU STRICT VERTICAL STACK FIX
   ========================================================================== */

@media (max-width: 900px) {
    /* Force the sub-menu container into a strict single-column flex block */
    .primary-nav-list ul.sub-menu,
    .site-header ul.nav-menu ul.sub-menu,
    .wp-block-navigation-submenu,
    ul.sub-menu {
        display: flex !important;
        flex-direction: column !important; /* Stack items vertically top-to-bottom */
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0.5rem 0 1rem 0 !important;
        padding: 0.5rem 0 !important;
        background-color: #F4EFD9 !important; /* KAIROS Paper Wash */
        border: none !important;
        border-left: 4px solid #8E2288 !important; /* KAIROS Purple Accent Line */
        border-radius: 0.5rem !important;
        box-shadow: none !important;
    }

    /* Force every individual sub-menu item to take full width and stack */
    .primary-nav-list ul.sub-menu > li,
    .site-header ul.nav-menu ul.sub-menu > li,
    .wp-block-navigation-submenu > li,
    ul.sub-menu > li {
        display: block !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid rgba(28, 69, 82, 0.12) !important;
        border-right: none !important; /* Removes horizontal divider lines between columns */
    }

    .primary-nav-list ul.sub-menu > li:last-child,
    .site-header ul.nav-menu ul.sub-menu > li:last-child {
        border-bottom: none !important;
    }

    /* Sub-menu text link formatting */
    .primary-nav-list ul.sub-menu a,
    .site-header ul.nav-menu ul.sub-menu a,
    .wp-block-navigation-submenu a {
        display: block !important;
        width: 100% !important;
        padding: 0.85rem 1.2rem !important;
        font-family: 'DM Sans', sans-serif !important;
        font-weight: 700 !important;
        font-size: 0.95rem !important;
        line-height: 1.3 !important;
        color: #172F37 !important; /* KAIROS Dark Ink */
        text-align: left !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    /* Sub-menu item hover state */
    .primary-nav-list ul.sub-menu a:hover,
    .site-header ul.nav-menu ul.sub-menu a:hover {
        background-color: rgba(142, 34, 136, 0.08) !important;
        color: #8E2288 !important; /* KAIROS Purple */
    }
}
/* ==========================================================================
   MOBILE ACCORDION SUBMENU STRICT COLLAPSE FIX
   ========================================================================== */

@media (max-width: 900px) {
    /* 1. Force submenus hidden by default on mobile */
    .primary-nav-list ul.sub-menu,
    .site-header ul.nav-menu ul.sub-menu,
    .wp-block-navigation-submenu,
    ul.sub-menu {
        display: none !important; /* jQuery slideToggle toggles this via inline style */
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0.5rem 0 0.8rem 0 !important;
        padding: 0.4rem 0 !important;
        background-color: #F4EFD9 !important; /* KAIROS Paper Wash */
        border: none !important;
        border-left: 4px solid #8E2288 !important; /* KAIROS Purple Accent Line */
        border-radius: 0.5rem !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    /* 2. Display override when active class is applied */
    .menu-item-has-children.is-active > ul.sub-menu,
    .menu-item-has-children.is-active > .wp-block-navigation-submenu {
        /* Allowed to display via jQuery */
    }

    /* 3. Single-Column Vertical Stack for Submenu Items */
    .primary-nav-list ul.sub-menu > li,
    .site-header ul.nav-menu ul.sub-menu > li,
    .wp-block-navigation-submenu > li {
        display: block !important;
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid rgba(28, 69, 82, 0.1) !important;
    }

    .primary-nav-list ul.sub-menu > li:last-child {
        border-bottom: none !important;
    }

    /* 4. Formatting Submenu Link Items */
    .primary-nav-list ul.sub-menu a,
    .site-header ul.nav-menu ul.sub-menu a,
    .wp-block-navigation-submenu a {
        display: block !important;
        width: 100% !important;
        padding: 0.8rem 1.2rem !important;
        font-family: 'DM Sans', sans-serif !important;
        font-weight: 700 !important;
        font-size: 0.95rem !important;
        color: #172F37 !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    /* 5. Dropdown Indicator Caret */
    .menu-item-has-children > a {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .menu-item-has-children > a::after {
        content: "▾";
        font-size: 0.9rem;
        color: #8E2288;
        transition: transform 0.25s ease;
    }

    .menu-item-has-children.is-active > a::after {
        transform: rotate(180deg);
    }
}
/* ==========================================================================
   MOBILE ACCORDION SUBMENU STRICT COLLAPSE FIX
   ========================================================================== */

@media (max-width: 900px) {
    /* 1. Force submenus hidden by default on mobile */
    .primary-nav-list ul.sub-menu,
    .site-header ul.nav-menu ul.sub-menu,
    .wp-block-navigation-submenu,
    ul.sub-menu {
        display: none !important; /* jQuery slideToggle toggles this via inline style */
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0.5rem 0 0.8rem 0 !important;
        padding: 0.4rem 0 !important;
        background-color: #F4EFD9 !important; /* KAIROS Paper Wash */
        border: none !important;
        border-left: 4px solid #8E2288 !important; /* KAIROS Purple Accent Line */
        border-radius: 0.5rem !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    /* 2. Display override when active class is applied */
    .menu-item-has-children.is-active > ul.sub-menu,
    .menu-item-has-children.is-active > .wp-block-navigation-submenu {
        /* Allowed to display via jQuery */
    }

    /* 3. Single-Column Vertical Stack for Submenu Items */
    .primary-nav-list ul.sub-menu > li,
    .site-header ul.nav-menu ul.sub-menu > li,
    .wp-block-navigation-submenu > li {
        display: block !important;
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid rgba(28, 69, 82, 0.1) !important;
    }

    .primary-nav-list ul.sub-menu > li:last-child {
        border-bottom: none !important;
    }

    /* 4. Formatting Submenu Link Items */
    .primary-nav-list ul.sub-menu a,
    .site-header ul.nav-menu ul.sub-menu a,
    .wp-block-navigation-submenu a {
        display: block !important;
        width: 100% !important;
        padding: 0.8rem 1.2rem !important;
        font-family: 'DM Sans', sans-serif !important;
        font-weight: 700 !important;
        font-size: 0.95rem !important;
        color: #172F37 !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    /* 5. Dropdown Indicator Caret */
    .menu-item-has-children > a {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .menu-item-has-children > a::after {
        content: "▾";
        font-size: 0.9rem;
        color: #8E2288;
        transition: transform 0.25s ease;
    }

    .menu-item-has-children.is-active > a::after {
        transform: rotate(180deg);
    }
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* =======================================
   Section: Reconciliation Hero 
   ======================================= */
.reconciliation-hero {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    color: #ffffff;
    background: #172f37; /* var(--ink) */
}

/* Image styling & Dark overlay gradient mapped directly */
.hero-bg-image {
    position: absolute;
    inset: 0;
    margin: 0;
}
.hero-bg-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 48%;
}
.hero-bg-image::after {
    position: absolute;
    content: "";
    inset: 0;
    background: linear-gradient(90deg, rgba(16,45,53,.92) 0%, rgba(16,45,53,.5) 53%, rgba(16,45,53,.12) 100%), 
                linear-gradient(0deg, rgba(16,45,53,.72) 0%, transparent 55%);
}

.breadcrumb {
    position: absolute;
    z-index: 2;
    top: clamp(2rem,4vw,4rem);
    left: max(3rem,calc((100vw - 1240px)/2));
    display: flex;
    gap: .8rem;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.breadcrumb a { color: #e0e320; /* var(--lime) */ text-decoration: none; }

.hero-copy {
    position: absolute;
    z-index: 2;
    right: max(3rem,calc((100vw - 1240px)/2));
    bottom: clamp(5rem,9vw,9rem);
    left: max(3rem,calc((100vw - 1240px)/2));
}
.hero-copy .eyebrow { color: #e0e320; }
.hero-copy h1 {
    margin: 0;
    font: 800 clamp(5.7rem,12vw,12.5rem)/.76 "Barlow Semi Condensed", Impact, sans-serif;
    letter-spacing: -.055em;
    text-transform: uppercase;
}
.hero-copy h1 em {
    display: block;
    padding-left: .04em;
    color: #f15922; /* var(--orange) */
    font-size: .43em;
    letter-spacing: .06em;
    line-height: 1.3;
    font-style: normal;
}

.hero-note {
    position: absolute;
    z-index: 3;
    right: max(2rem,calc((100vw - 1240px)/2));
    bottom: 0;
    display: grid;
    width: min(420px,38vw);
    padding: 1.5rem 1.8rem;
    color: #172f37;
    background: #e0e320;
}
.hero-note p { margin: 0; }
.hero-note strong { font: 800 1.45rem/1 "Barlow Semi Condensed",sans-serif; text-transform: uppercase; }
.hero-note span { display: block; margin-top: .45rem; font-size: .88rem; line-height: 1.4; }

/* =======================================
   Section: Living (Principles)
   ======================================= */
.living { padding: clamp(7rem,11vw,11rem) max(3rem,calc((100vw - 1240px)/2)) 8rem; }
.living-copy p { color: #536a70; }
.living-copy .lead { color: #172f37; font-size: clamp(1.35rem,2.1vw,1.75rem); font-weight: 700; line-height: 1.35; }

.principles p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(23,47,55,.25);
}
.principles span {
    color: #1c4552; /* var(--teal) */
    font: 800 clamp(1.15rem,2vw,1.75rem)/1 "Barlow Semi Condensed",sans-serif;
    letter-spacing: .05em;
    text-transform: uppercase;
    position: relative;
}
/* Recreate the circular dots natively via pseudo elements to avoid empty markup */
.principles span:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -2rem; /* adjust positioning */
    top: 50%;
    transform: translateY(-50%);
    width: .55rem;
    height: .55rem;
    background: #f15922; /* var(--orange) */
    border-radius: 50%;
}

/* =======================================
   Section: Two Paths
   ======================================= */
.two-paths {
    position: relative;
    padding: clamp(7rem,11vw,11rem) max(3rem,calc((100vw - 1240px)/2));
    overflow: hidden;
    color: #ffffff;
    background: #8e2288; /* var(--purple) */
}
.paths-heading { margin-bottom: 3.5rem; }
.paths-heading .eyebrow, .paths-heading h2 em { color: #e0e320; /* var(--lime) */ font-style: normal; }

.pathway {
    position: relative;
    z-index: 2;
    padding: 2rem;
    border: 1px solid rgba(255,255,255,.3);
    margin-bottom: 1.3rem;
}
/* Abstracted decorative icons onto the element block */
.pathway::after {
    content: "";
    position: absolute;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 76px;
    height: 76px;
    border: 3px solid #e0e320;
    border-radius: 50%;
}
.pathway::before {
    content: "";
    position: absolute;
    right: calc(2rem + 19px);
    top: calc(50% - 19px);
    width: 38px;
    height: 38px;
    background: #e0e320;
    border-radius: 50%;
    z-index: 10;
}
.pathway-one { background: rgba(28,69,82,.75); }
.pathway-two { background: rgba(241,89,34,.78); }
.pathway-two::after { border-color: #ffffff; }
.pathway-two::before { background: #ffffff; }

.path-label {
    margin: 0 0 .55rem;
    color: rgba(255,255,255,.65);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.pathway h3 { margin: 0; font: 800 clamp(2rem,3.3vw,3.4rem)/.92 "Barlow Semi Condensed",sans-serif; text-transform: uppercase; width: 70%; }

.paths-copy p { color: rgba(255,255,255,.8); }
.paths-copy p:first-child { color: #ffffff; font-size: 1.2rem; font-weight: 700; }

/* =======================================
   Section: Action Framework
   ======================================= */
.action-framework {
    padding: clamp(7rem,11vw,11rem) max(3rem,calc((100vw - 1240px)/2));
    background: #eceee7;
}
.action-heading { position: sticky; top: 140px; align-self: start; }
.action-heading .eyebrow, .action-heading h2 em { color: #187575; /* var(--teal-bright) */ font-style: normal; }
.action-heading p:last-child { max-width: 490px; margin-top: 2rem; color: #536a70; }

.commitment-item {
    --accent: #8e2288;
    min-height: 150px;
    display: flex;
    align-items: center;
    padding: 2rem 1.2rem 2rem 2rem;
    border-bottom: 1px solid rgba(23,47,55,.25);
    border-left: 7px solid var(--accent);
    transition: color 220ms ease, background 220ms ease, padding 220ms ease;
}
.commitment-item:first-child { border-top: 1px solid rgba(23,47,55,.25); }
.commitment-item:nth-child(even) { --accent: #f15922; /* var(--orange) */ }
.commitment-item:nth-child(3) { --accent: #187575; /* var(--teal-bright) */ }
.commitment-item:hover { padding-left: 2.6rem; color: #ffffff; background: var(--accent); }
.commitment-item p { margin: 0; }
.commitment-item strong { font: 800 clamp(1.8rem,3vw,3rem)/1 "Barlow Semi Condensed",sans-serif; text-transform: uppercase; }

/* =======================================
   Section: Transformation
   ======================================= */
.transformation {
    position: relative;
    padding: clamp(8rem,12vw,12rem) max(3rem,calc((100vw - 1240px)/2));
    overflow: hidden;
    color: #ffffff;
    background: #172f37; /* var(--ink) */
}
.transformation-heading { position: relative; z-index: 2; }
.transformation-heading .eyebrow { color: #e0e320; }
.transformation h2 em { color: #f15922; font-style: normal; }
.transformation-copy { position: relative; z-index: 2; align-self: end; }
.transformation-copy p { color: rgba(255,255,255,.73); }
.transformation-copy .lead { color: #ffffff; font-size: clamp(1.3rem,2vw,1.7rem); font-weight: 700; line-height: 1.35; }

.transformation-number {
    position: absolute;
    right: -4vw;
    top: -11rem;
    color: rgba(224,227,32,.09);
    font: 800 52rem/.8 Georgia, serif;
    margin: 0;
}

/* =======================================
   Section: Right Relationship
   ======================================= */
.right-relationship {
    padding: clamp(7rem,10vw,10rem) max(3rem,calc((100vw - 1240px)/2));
    color: #172f37;
    background: #e0e320; /* var(--lime) */
}
.right-relationship .eyebrow, .right-relationship h2 em { color: #8e2288; font-style: normal; }
.relationship-links { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 3rem; }
.relationship-links a {
    display: inline-flex;
    gap: 1rem;
    align-items: center;
    padding: .9rem 1.2rem;
    border: 2px solid #172f37;
    border-radius: 999px;
    font-weight: 800;
    text-decoration: none;
    color: #172f37;
}
.relationship-links .relationship-primary { color: #ffffff; background: #172f37; }
.relationship-links a:hover { color: #ffffff; background: #8e2288; border-color: #8e2288; }

/* Mobile Adjustments */
@media (max-width: 680px) {
    .reconciliation-hero { min-height: 690px; }
    .hero-bg-image::after { background: linear-gradient(0deg,rgba(16,45,53,.92) 0%,rgba(16,45,53,.36) 75%,rgba(16,45,53,.25) 100%); }
    .hero-copy h1 { font-size: clamp(4.1rem,18vw,6.7rem); }
    .hero-note { width: auto; right: 1.25rem; left: 1.25rem; }
    .principles p { flex-direction: column; gap: 0; }
    .principles span { width: 100%; padding: 1rem 0; border-bottom: 1px solid rgba(23,47,55,.2); }
    .principles span::after { display: none; }
    .pathway::after, .pathway::before { display: none; }
    .transformation-number { right: -20vw; font-size: 30rem; }
}
/* ==========================================================================
   PAGE BUILDER: LAYOUT RECOVERY PATCH
   ========================================================================== */

/* 1. Force all alignfull blocks to the edge of the viewport */
.wp-block-group.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 2. Prevent columns from squishing text vertically */
.wp-block-columns {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}
.wp-block-column {
    min-width: 280px !important; /* Forces columns to stack rather than squish to 1 letter wide */
}

/* 3. Bulletproof the Hero Background Image */
.reconciliation-hero {
    position: relative !important;
}
.reconciliation-hero > .wp-block-image {
    position: absolute !important;
    inset: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
}
.reconciliation-hero > .wp-block-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Ensure text sits on top of the hero image */
.reconciliation-hero .breadcrumb,
.reconciliation-hero .hero-copy,
.reconciliation-hero .hero-note {
    position: absolute !important;
    z-index: 10 !important;
}
/* 2. Responsive Gutenberg Columns (Replaces previous squishy rules) */
.wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Keeps columns side-by-side on desktop */
    width: 100% !important;
    box-sizing: border-box !important;
    margin-left: -1.5rem !important; /* Offsets the inner column padding */
    margin-right: -1.5rem !important;
}

.wp-block-column {
    min-width: 0 !important; /* Crucial: Stops text from wrapping vertically */
    padding: 0 1.5rem !important; /* Uses padding for spacing so inline percentages don't break */
    box-sizing: border-box !important;
}

/* Fix the overlapping text in the "Visible in how we work" section */
.action-heading {
    align-self: flex-start !important; 
}

/* Mobile Adjustments for Columns */
@media (max-width: 900px) {
    .wp-block-columns {
        flex-direction: column !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin-bottom: 2.5rem !important;
    }
    .action-heading {
        position: relative !important;
        top: 0 !important; /* Disables sticky positioning on mobile */
    }
}
/* ==========================================================================
   TWO-PATHS (PURPLE SECTION) EXACT MATCH FIX
   ========================================================================== */

/* 1. Expand the container width to match the mockup */
.two-paths .wp-block-group__inner-container {
    max-width: 1350px !important;
    margin: 0 auto !important;
}

/* 2. Enlarge and style the main heading */
.paths-heading h2 {
    font-size: clamp(3rem, 5.5vw, 5.5rem) !important;
    line-height: 0.95 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin-bottom: 2rem !important;
}

/* 3. Fix the Columns structure for this specific section */
.two-paths .wp-block-columns {
    gap: 4rem !important; /* Creates the wide gap between the boxes and the paragraph text */
}

.two-paths .wp-block-column:first-child {
    flex-basis: 55% !important;
    max-width: 55% !important;
    padding: 0 !important; /* Aligns boxes perfectly with the left edge of the heading */
}

.two-paths .wp-block-column:last-child {
    flex-basis: 45% !important;
    max-width: 45% !important;
    padding: 0 !important;
}

/* 4. Stop Box Text from Squishing & Overflowing */
.pathway {
    padding: 2.5rem !important;
    box-sizing: border-box !important;
    min-height: 180px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.pathway h3 {
    font-size: clamp(1.6rem, 2.2vw, 2.4rem) !important;
    line-height: 1.1 !important;
    width: 75% !important; /* Keeps text safely away from the absolute-positioned circles */
    word-wrap: break-word !important;
    white-space: normal !important;
}

/* 5. Mobile Adjustments for this section */
@media (max-width: 900px) {
    .two-paths .wp-block-columns {
        flex-direction: column !important;
        gap: 2rem !important;
    }
    .two-paths .wp-block-column:first-child,
    .two-paths .wp-block-column:last-child {
        flex-basis: 100% !important;
        max-width: 100% !important;
    }
    .pathway h3 {
        width: 100% !important;
        padding-right: 4rem !important; /* Buffer for circles on mobile */
    }
}
/* ==========================================================================
   TWO-PATHS SECTION: EXACT MOCKUP TYPOGRAPHY & COLOR CORRECTIONS
   ========================================================================== */

/* 1. Main Heading - Make "Two responsibilities" white and stretch it wider */
.paths-heading h2 {
    color: #ffffff !important;
    font-size: clamp(3.5rem, 8.3vw, 8.3rem) !important; /* Dramatically increased to span across */
    line-height: 0.9 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 2rem !important;
}

/* Ensure "Held in relationship" remains the accent color (Lime) */
.paths-heading h2 em {
    color: #e0e320 !important;
    font-style: normal !important;
}

/* 2. Box Backgrounds - Solid Dark Ink & Orange, No Hover Effects */
.pathway-one {
    background-color: #172f37 !important; /* KAIROS Dark Ink */
    transition: none !important; /* Kills mouseover animations */
}

.pathway-two {
    background-color: #f15922 !important; /* KAIROS Orange */
    transition: none !important;
}

/* Force disable any rogue hover states inherited from the theme */
.pathway:hover {
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
}

/* 3. Box Text - Make it White and Much Larger */
.pathway h3 {
    color: #ffffff !important;
    font-size: clamp(2.0rem, 3.5vw, 3.5rem) !important; /* Scaled up significantly */
    line-height: 1 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    width: 82% !important; /* Keeps the larger text from hitting the graphic circles */
    word-wrap: break-word !important;
    white-space: normal !important;
}

/* Ensure the small eyebrow text in the boxes is also visible */
.pathway .path-label {
    color: rgba(255, 255, 255, 0.8) !important;
}
/* ==========================================================================
   ACTION FRAMEWORK SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.action-heading h2 {
    /* Scales the default font size up by roughly 1.5x */
    font-size: clamp(3.5rem, 6vw, 6.5rem) !important; 
    
    /* Sets the line height to 1.5 to give the stacked words breathing room */
    line-height: 1.0 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin-bottom: 1.5rem !important;
}

/* Ensure the second half of the phrase keeps its custom color */
.action-heading h2 em {
    color: #187575 !important; /* KAIROS Teal Bright */
    font-style: normal !important;
}

/* Mobile Adjustments for the scaled text */
@media (max-width: 900px) {
    .action-heading h2 {
        font-size: clamp(2.8rem, 8vw, 3.5rem) !important;
    }
}
/* ==========================================================================
   TRANSFORMATION SECTION: REVISED SCALING & COLORS
   ========================================================================== */

/* 1. Main Container Width */
.transformation .wp-block-group__inner-container {
    max-width: 1350px !important;
    margin: 0 auto !important;
}

/* 2. Main Heading Typography (Scaled Down) */
.transformation-heading h2 {
    color: #ffffff !important;
    font-size: clamp(5rem, 6.5vw, 6.5rem) !important; /* Dialed back from 7.5rem */
    line-height: 0.9 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 0 !important;
    opacity: 1 !important;
}

/* 3. Orange Text & White Separator Line */
.transformation-heading h2 em {
    color: #f15922 !important; /* KAIROS Orange */
    font-style: normal !important;
    display: block !important;
    position: relative !important;
    margin-top: 4rem !important; 
}

/* Draws the white line dynamically */
.transformation-heading h2 em::before {
    content: "" !important;
    position: absolute !important;
    top: -1.2rem !important;
    left: 0 !important;
    width: 80px !important;
    height: 10px !important;
    background-color: #ffffff !important;
}

/* 4. Infinity Background Graphic Fix (Scaled Down) */
.transformation {
    position: relative !important;
    overflow: hidden !important;
}

.transformation-number {
    position: absolute !important;
    top: -8rem !important;
    right: -2vw !important;
    color: rgba(24, 117, 117, 0.15) !important; /* KAIROS Teal faint overlay */
    font-family: Georgia, serif !important;
    font-size: 45rem !important; /* Dialed back from 65rem */
    line-height: 0.8 !important;
    font-weight: 800 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* Ensure text stays on top of the graphic */
.transformation-heading, 
.transformation-copy {
    position: relative !important;
    z-index: 10 !important;
}

/* Mobile Adjustments */
@media (max-width: 900px) {
    .transformation-number {
        font-size: 30rem !important;
        top: -6rem !important;
        right: -10vw !important;
    }
}
/* ==========================================================================
   RIGHT RELATIONSHIP SECTION: EXACT MOCKUP MATCH
   ========================================================================== */

/* 1. Container Layout & Left Alignment */
.right-relationship .wp-block-group__inner-container {
    max-width: 1350px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important; /* Forces all content to the left */
    text-align: left !important;
}

/* 2. Massive Heading Typography */
.right-relationship h2 {
    font-size: clamp(4rem, 8vw, 8.5rem) !important;
    line-height: 0.85 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
    color: #172f37 !important; /* KAIROS Dark Ink */
    margin-bottom: 0 !important;
    width: 100% !important;
}

/* 3. Purple Text Formatting */
.right-relationship h2 em {
    color: #8e2288 !important; /* KAIROS Purple */
    font-style: normal !important; /* Removes the italic slant */
    display: block !important;
    margin-top: 0.1em !important;
}

/* 4. Button Layout (Side-by-side) */
.right-relationship .relationship-links {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important; /* Locks buttons to the left */
    gap: 1.5rem !important;
    margin-top: 3.5rem !important;
    width: 100% !important;
}

/* Ensure paragraph tags around the buttons don't break the flex row */
.right-relationship .relationship-links p {
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. Mobile Adjustments */
@media (max-width: 900px) {
    .right-relationship h2 {
        font-size: clamp(3rem, 10vw, 4.5rem) !important;
    }
    .right-relationship .relationship-links {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* Base Typographical Treatments */
.eyebrow {
    color: #f15922; /* var(--orange) */
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

/* =======================================
   Section: Systems Hero
   ======================================= */
.systems-hero {
    position: relative;
    padding: clamp(3rem, 5.5vw, 5.5rem) max(3rem, calc((100vw - 1320px) / 2)) clamp(4rem, 7vw, 7rem);
    background: #f7f7f2;
    overflow: hidden;
}

/* Orbit decorative rings applied via pseudo-element */
.systems-hero::before {
    position: absolute;
    top: 24%;
    right: -9vw;
    width: 34vw;
    height: 34vw;
    content: "";
    border: 2px solid rgba(142,34,136,.18);
    border-radius: 50%;
    box-shadow: 0 0 0 45px rgba(142,34,136,.035), 0 0 0 90px rgba(241,89,34,.025);
    z-index: 1;
}

.systems-hero h1 {
    max-width: 1180px;
    color: #172f37; /* var(--ink) */
    font: 800 clamp(4.9rem, 9.2vw, 10.3rem)/.9 "Barlow Semi Condensed", Impact, sans-serif;
    letter-spacing: -.045em;
    text-transform: uppercase;
    margin-bottom: 2rem;
}
.systems-hero h1 em {
    display: block;
    margin-left: 12%;
    color: #8e2288; /* var(--purple) */
    font-size: .64em;
    font-style: normal;
    letter-spacing: -.025em;
    line-height: 1;
}

.systems-hero-stage {
    position: relative;
    min-height: 470px;
    z-index: 2;
}

.systems-hero-image {
    position: absolute;
    inset: 0 24% 0 3%;
    z-index: 2;
    margin: 0;
    overflow: hidden;
    border: 8px solid #ffffff;
    border-radius: 220px 220px 1.2rem 1.2rem;
    box-shadow: 0 30px 80px rgba(23,47,55,.2);
    transform: rotate(-1.25deg);
}
.systems-hero-image img {
    width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; transition: transform 700ms ease;
}
.systems-hero-image:hover img { transform: scale(1.025); }

.hero-message {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 1.5rem;
    width: min(36%,430px);
    padding: clamp(1.5rem,2.6vw,2.5rem);
    color: #ffffff;
    background: #172f37;
    box-shadow: 0 24px 60px rgba(23,47,55,.24);
    transform: rotate(1deg);
}
.hero-message .lead { margin: 0 0 1.15rem; color: rgba(255,255,255,.86); font-size: clamp(1.02rem,1.25vw,1.18rem); }
.hero-message .visual-note { margin: 0; padding-top: 1rem; color: #e0e320; /* var(--lime) */ border-top: 1px solid rgba(255,255,255,.24); font: 700 1rem/1.3 "Barlow Semi Condensed",sans-serif; text-transform: uppercase; }

/* =======================================
   Section: Different Questions
   ======================================= */
.different-questions { padding: clamp(7rem, 11vw, 11rem) 3rem; max-width: 1240px; margin: 0 auto; }
.different-questions h2 { font-size: clamp(3.7rem, 6.3vw, 6.6rem); margin: 0; }
.questions-intro p:last-child { max-width: 420px; margin-top: 2rem; color: #55696f; }

.question-list { border-top: 1px solid rgba(23,47,55,.25); }
.question-item {
    padding: 2rem .5rem 2rem 1.5rem;
    border-bottom: 1px solid rgba(23,47,55,.25);
    border-left: 6px solid #f15922; /* var(--orange) */
}
.question-item p { margin: 0; font: 700 clamp(1.65rem, 2.6vw, 2.6rem)/1.05 "Barlow Semi Condensed", sans-serif; }

/* =======================================
   Section: Lens
   ======================================= */
.lens { padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - 1180px)/2)); color: #ffffff; background: #1c4552; /* var(--teal) */ }
.lens-heading { align-items: flex-end; margin-bottom: 4.5rem; }
.lens-heading h2 { font-size: clamp(3.7rem, 6.3vw, 6.6rem); margin: 0; }
.lens-heading p:last-child { max-width: 420px; color: rgba(255,255,255,.75); font-size: 1.08rem; }

.lens-comparison { align-items: center; }
.lens-card { min-height: 370px; padding: clamp(2.2rem, 4vw, 4rem); border-radius: 1.2rem; }
.crisis-card { color: #172f37; background: #e7ece8; }
.change-card { color: #172f37; background: #e0e320; }
.lens-number { margin: 0 0 3rem; font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.lens-card h3 { margin: 0 0 1.8rem; font: 800 clamp(2.7rem, 4vw, 4.5rem)/.95 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.lens-card li { padding: .6rem 0; border-top: 1px solid rgba(23,47,55,.22); font-weight: 700; }

.lens-plus {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    width: 62px;
    height: 62px;
    color: #ffffff;
    background: #f15922;
    border-radius: 50%;
    font: 800 2.3rem/1 "Barlow Semi Condensed", sans-serif;
}
.lens-statement { max-width: 840px; margin: 3.5rem auto 0; color: rgba(255,255,255,.88); font-size: clamp(1.25rem, 2vw, 1.7rem); text-align: center; }

/* =======================================
   Section: Named Systems
   ======================================= */
.named-systems { padding: clamp(7rem, 11vw, 11rem) 3rem; max-width: 1240px; margin: 0 auto; }
.named-intro { align-items: flex-end; margin-bottom: 5rem; }
.named-intro h2 { font-size: clamp(3.7rem, 6.3vw, 6.6rem); margin: 0; }
.named-intro p:last-child { max-width: 460px; color: #55696f; }

.root-map-container { position: relative; }
.root-card { position: relative; min-height: 430px; padding: clamp(3.5rem, 5vw, 5rem) clamp(2.2rem, 4vw, 4rem); border-radius: 50% 50% 1.5rem 1.5rem; }
.colonialism { color: #ffffff; background: #8e2288; }
.extraction { color: #ffffff; background: #f15922; }
.root-card h3 { margin: 0 0 1.2rem; font: 800 clamp(2.7rem, 4.7vw, 4.8rem)/.9 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.root-card p { max-width: 440px; color: rgba(255,255,255,.82); }
.root-card p:last-child { margin-top: 2rem; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.3); }

/* Custom Root-Knot applied to paragraph instead of empty tags */
.root-knot {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 148px;
    height: 148px;
    margin: 0;
    transform: translate(-50%, -50%);
    background: #e0e320;
    border: 6px solid #f7f7f2;
    border-radius: 50% 48% 52% 45%;
}
.root-knot::before {
    content: "";
    position: absolute;
    inset: -6px;
    border: 6px solid #f7f7f2;
    background: transparent;
    border-radius: 50% 48% 52% 45%;
    transform: rotate(45deg);
    opacity: .55;
    pointer-events: none;
}
.root-knot strong { position: relative; color: #172f37; font: 800 1rem/1.05 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; z-index: 2; }

/* =======================================
   Section: Meaning (Shifts)
   ======================================= */
.meaning { padding: clamp(7rem, 11vw, 11rem) max(3rem, calc((100vw - 1240px)/2)); background: #ecefe8; }
.meaning-heading { margin-bottom: 5rem; }
.meaning-heading h2 { font-size: clamp(3.7rem, 6.3vw, 6.6rem); margin: 0; }
.shift-grid { margin-bottom: 1.2rem; }
.shift {
    --shift-color: #f15922; /* Default orange */
    min-height: 320px;
    padding: clamp(2rem, 3.5vw, 3.5rem);
    background: #ffffff;
    border-top: 10px solid var(--shift-color);
    transition: transform 220ms ease, box-shadow 220ms ease;
}
.shift:hover { transform: translateY(-6px); box-shadow: 0 22px 50px rgba(23,47,55,.1); }
.shift-purple { --shift-color: #8e2288; }
.shift-teal { --shift-color: #187575; }
.shift-moss { --shift-color: #6a712d; }
.shift h3 { margin: 1.5rem 0 .8rem; font: 800 clamp(2rem, 3vw, 3rem)/.95 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.shift p { max-width: 440px; margin: 0; color: #55696f; }

/* =======================================
   Section: Action Path
   ======================================= */
.action-path { padding: clamp(7rem, 11vw, 11rem) 3rem; max-width: 1240px; margin: 0 auto; }
.action-heading { align-self: start; position: sticky; top: 150px; }
.action-heading h2 { font-size: clamp(3.7rem, 6.3vw, 6.6rem); margin: 0; }

.pathway-links { border-top: 1px solid rgba(23,47,55,.25); }
.pathway {
    align-items: center;
    padding: 2rem .5rem;
    border-bottom: 1px solid rgba(23,47,55,.25);
    text-decoration: none;
    transition: padding 200ms ease, background 200ms ease, color 200ms ease;
}
.pathway:hover { padding-right: 1.1rem; padding-left: 1.1rem; background: #8e2288; }
.pathway p { margin: 0; color: #617278; font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.pathway:hover p, .pathway:hover a { color: rgba(255,255,255,.75); }
.pathway h3 { margin: .2rem 0 0; }
.pathway h3 a { font: 800 clamp(2.2rem, 3.7vw, 3.8rem)/.95 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; text-decoration: none; color: #172f37; }
.pathway:hover h3 a { color: #ffffff; }

/* =======================================
   Section: Systems Close
   ======================================= */
.systems-close {
    align-items: flex-end;
    padding: clamp(7rem, 11vw, 11rem) max(3rem, calc((100vw - 1240px)/2));
    color: #ffffff;
    background: #8e2288;
}
.systems-close .eyebrow { color: #e0e320; /* var(--lime) */ }
.systems-close h2 { font-size: clamp(4rem, 7vw, 7.5rem); margin: 0; }
.close-copy p:last-child { margin: 1.4rem 0 0; color: #e0e320; font: 700 clamp(1.5rem, 2.5vw, 2.5rem)/1 "Barlow Semi Condensed", sans-serif; }
.close-action p { margin: 0 0 2rem; color: rgba(255,255,255,.8); font-size: 1.08rem; }

.systems-button {
    display: inline-flex; width: max-content; align-items: center; gap: .8rem;
    padding: .85rem 1.2rem; border-radius: 999px; font-weight: 700; text-decoration: none;
    transition: transform 200ms ease, background 200ms ease;
}
.systems-button.button-lime { color: #172f37; background: #e0e320; }
.systems-button.button-lime:hover { color: #ffffff; background: #f15922; transform: translateY(-2px); }

/* Responsive Overrides */
@media (max-width: 980px) {
    .systems-hero { min-height: 980px; }
    .systems-hero-stage { min-height: 610px; margin-top: 2rem; }
    .systems-hero-image { inset: 0 8% 18% 0; }
    .hero-message { right: 0; bottom: 0; width: min(52%,440px); }
    .different-questions .wp-block-columns, .action-path .wp-block-columns { flex-direction: column; gap: 4rem; }
    .lens-heading, .named-intro, .systems-close .wp-block-columns { flex-direction: column; gap: 2rem; }
    .action-heading { position: static; }
}

@media (max-width: 720px) {
    .systems-hero { padding-right: 1.25rem; padding-left: 1.25rem; }
    .systems-hero h1 { font-size: clamp(3.9rem, 18vw, 6rem); }
    .systems-hero-stage { min-height: 590px; }
    .systems-hero-image { inset: 0 0 31%; border-width: 5px; border-radius: 130px 130px .8rem .8rem; }
    .hero-message { right: .4rem; bottom: 0; width: calc(100% - .8rem); }
    .lens-comparison, .root-map, .shift-grid { flex-direction: column; }
    .lens-plus { margin: -2.3rem auto; position: relative; z-index: 2; }
    .root-card { min-height: 390px; }
    .root-knot { width: 110px; height: 110px; }
}
/* ==========================================================================
   SYSTEMS HERO SECTION: STACKED GROUPS TO FLEX DESKTOP
   ========================================================================== */

/* 1. Force the off-white background */
.systems-hero {
    background-color: #f7f7f2 !important; 
    padding-bottom: 6rem !important; 
}

/* 2. Top-to-Bottom Layout (Text above Image) */
.systems-hero > .wp-block-group__inner-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2rem !important;
}

/* Allow text to stretch across the top */
.systems-hero-text {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    z-index: 10 !important;
}

/* Ensure the headings obey the left alignment */
.systems-hero-text h1,
.systems-hero-text .eyebrow,
.systems-hero-text .breadcrumb {
    text-align: left !important;
    width: 100% !important;
}

/* Re-adjust the purple text indent to match the mockup */
.systems-hero h1 em {
    display: block !important;
    margin-left: 3rem !important; /* Gives it that slight offset under the main text */
}

/* Allow the visual section to span full width below the text */
.systems-hero-visual {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    z-index: 5 !important;
    position: relative !important;
    min-height: 550px !important; /* Provides enough vertical room for the image */
}

/* Image stretches horizontally with room for the dark box */
.systems-hero-image {
    position: absolute !important;
    inset: 0 3rem 2rem 0 !important; /* Leaves room on the right/bottom for the dark box overlap */
    border-radius: 250px 250px 1.5rem 1.5rem !important;
    overflow: hidden !important;
    margin: 0 !important;
}

.systems-hero-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
/* 3. Typography Color & Sizing Enforcement */
.systems-hero h1 {
    color: #172f37 !important; /* Dark Ink */
    font-size: clamp(3.5rem, 6.5vw, 7rem) !important;
    line-height: 0.9 !important;
    margin-bottom: 1rem !important;
}

.systems-hero h1 em {
    color: #8e2288 !important; /* Purple */
}

/* 4. Fix the Overlapping Box & Image Context */
.systems-hero-visual {
    position: relative !important;
    min-height: 550px !important;
}

.systems-hero-image {
    position: absolute !important;
    inset: 0 4rem 2rem 0 !important; /* Leaves room for the dark box */
    border-radius: 250px 250px 1.5rem 1.5rem !important;
    overflow: hidden !important;
    margin: 0 !important;
}

.systems-hero-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* 5. The Dark Green Box - Lock the Width */
.hero-message {
    position: absolute !important;
    bottom: 0 !important;
    right: 0 !important;
    width: 380px !important; 
    max-width: 90% !important;
    background-color: #172f37 !important;
    padding: 2.5rem !important;
    z-index: 10 !important;
}

/* 6. Mobile Adjustments (Stacks them naturally) */
@media (max-width: 900px) {
    .systems-hero .wp-block-group__inner-container {
        flex-direction: column !important;
    }
    .systems-hero-text,
    .systems-hero-visual {
        flex-basis: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    .hero-message {
        position: relative !important;
        width: 100% !important;
        margin-top: -3rem !important; 
    }
    .systems-hero-visual {
        min-height: 400px !important;
    }
    .systems-hero-image {
        position: relative !important;
        min-height: 400px !important;
        inset: auto !important;
    }
}
/* ==========================================================================
   DIFFERENT QUESTIONS SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.different-questions h2 {
    /* Scaled up 1.5x from original clamp(3.7rem, 6.3vw, 6.6rem) */
    font-size: clamp(5.55rem, 6.45vw, 6.9rem) !important; 
    
    /* Slightly tighter line-height keeps the massive text looking grouped */
    line-height: 0.95 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to ensure the 1.5x scale doesn't break the screen width */
@media (max-width: 900px) {
    .different-questions h2 {
        font-size: clamp(4rem, 12vw, 5.5rem) !important;
    }
}
/* ==========================================================================
   LENS SECTION: HEADING SCALE (1.25x)
   ========================================================================== */

.lens-heading h2 {
    /* Scaled up 1.25x from original clamp(3.7rem, 6.3vw, 6.6rem) */
    font-size: clamp(4.625rem, 7.875vw, 8.25rem) !important; 
    color:#ffffff;
    
    /* Tighter line-height keeps the larger stacked words readable */
    line-height: 0.95 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to ensure the 1.25x scale fits small screens nicely */
@media (max-width: 900px) {
    .lens-heading h2 {
        font-size: clamp(3.5rem, 10vw, 4.625rem) !important;
    }
}
/* ==========================================================================
   NAMED SYSTEMS SECTION: EXACT MOCKUP MATCH
   ========================================================================== */

/* 1. Scale up the main heading (1.25x) */
.named-intro h2 {
    font-size: clamp(4.625rem, 6.875vw, 7.25rem) !important;
    line-height: 0.9 !important;
    text-transform: uppercase !important;
    color: #172f37 !important;
}

/* 2. Fix Dome Cards: Push text inside the curve and color headings white */
.root-card {
    /* Dramatically increases top padding to push text down past the curve */
    padding-top: clamp(8rem, 12vw, 10rem) !important; 
    position: relative !important;
}

/* Force dome headings to be white and slightly larger */
.root-card h3 {
    color: #ffffff !important;
    font-size: clamp(3rem, 5vw, 4.5rem) !important;
    z-index: 2 !important;
    position: relative !important;
}

/* 3. Restore and Style the "Unequal Power" Knot */
.root-map-container {
    position: relative !important;
    display: block !important;
    margin-top: 3rem !important; /* Breathing room from the text above */
}

.root-map {
    gap: 2rem !important; /* Controls the space between the two domes */
}

/* The Yellow Overlapping Circle */
.root-knot {
    display: flex !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 170px !important;
    height: 170px !important;
    background-color: #e0e320 !important; /* KAIROS Yellow */
    border-radius: 50% !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
    border: 8px solid #f7f7f2 !important; /* Creates the cutout effect against the domes */
}

/* Remove any legacy pseudo-elements that might break the circle shape */
.root-knot::before, .root-knot::after {
    display: none !important;
}

/* The Pink Text Inside the Circle */
.root-knot strong {
    color: #8e2288 !important; /* KAIROS Pink/Purple */
    text-align: center !important;
    line-height: 1.1 !important;
    font-size: 1.15rem !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustments */
@media (max-width: 900px) {
    .named-intro h2 {
        font-size: clamp(3.5rem, 10vw, 4.625rem) !important;
    }
    .root-card {
        padding-top: 6rem !important;
    }
}
/* 4. Center Align the Text Inside the Domes */
.root-card h3 {
    text-align: center !important;
    width: 100% !important;
}

.root-card p {
    text-align: center !important;
    /* This centers the paragraph block itself since it has a max-width */
    margin-left: auto !important; 
    margin-right: auto !important;
}
/* ==========================================================================
   MEANING (FOUR SHIFTS) SECTION: HEADING SCALE (1.25x)
   ========================================================================== */

.meaning-heading h2 {
    /* Scaled up 1.25x from original clamp(3.7rem, 6.3vw, 6.6rem) */
    font-size: clamp(4.625rem, 7.875vw, 8.25rem) !important; 
    
    /* Tighter line-height keeps the stacked text looking cohesive */
    line-height: 0.95 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to ensure the scaled text doesn't overflow small screens */
@media (max-width: 900px) {
    .meaning-heading h2 {
        font-size: clamp(3.5rem, 10vw, 4.625rem) !important;
    }
}
/* ==========================================================================
   SYSTEMS CLOSE SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.systems-close h2 {
    /* Scaled up 1.5x from original clamp(4rem, 7vw, 7.5rem) */
    font-size: clamp(6rem, 7.5vw, 8.25rem) !important; 
    color:#ffffff;
    
    /* Tight line-height ensures the massive stacked text remains readable */
    line-height: 0.9 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to keep the massive text fitting cleanly on handheld screens */
@media (max-width: 900px) {
    .systems-close h2 {
        font-size: clamp(3.8rem, 12vw, 6rem) !important;
    }
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* Base Typographical Variables & Fallbacks */
.eyebrow {
    color: #187575; /* var(--teal-bright) */
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.wp-block-heading em {
    color: #8e2288; /* var(--purple) */
    font-style: normal;
}

/* =======================================
   Section: People Hero
   ======================================= */
.BPP-hero-section {
  position: relative;
  padding: clamp(2rem,2vw,2rem) max(1rem,calc((100vw - 1240px)/2));
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 63%, #f1f5ef 63%, #f1f5ef 100%);
  overflow: hidden;
}
.BPP-intro-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 4rem) 1.5rem;
}

.BPP-growth-section {
    padding: 0 max(1rem,calc((100vw - 1240px)/2)) clamp(2rem,4vw,4rem);
}
.people-hero {
    position: relative;
    padding: clamp(2rem,4vw,4rem) max(1rem,calc((100vw - 1240px)/2));
    background: linear-gradient(135deg, #ffffff 0%, #ffffff 63%, #f1f5ef 63%, #f1f5ef 100%);
    overflow: hidden;
}

.people-hero .breadcrumb {
    display: flex;
    gap: .8rem;
    margin: 0 0 4rem;
    color: #61747a;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.people-hero .breadcrumb a { color: #8e2288; text-decoration: none; }

.hero-copy h1 {
    margin: 0;
    color: #172f37; /* var(--ink) */
    font: 800 clamp(6.2rem,11vw,11rem)/.72 "Barlow Semi Condensed", Impact, sans-serif;
    letter-spacing: -.055em;
    text-transform: uppercase;
}

.hero-lead {
    max-width: 470px;
    margin: 2.5rem 0 0;
    color: #1c4552; /* var(--teal) */
    font-size: clamp(1.3rem,2vw,1.75rem);
    font-weight: 700;
    line-height: 1.35;
}

/* Hero Portrait & Pseudo Halo Effect */
.hero-portrait {
    position: relative;
    z-index: 2;
    width: min(100%, 480px);
    margin: 0 auto;
}
.hero-portrait::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -2.5rem;
    right: -3.5rem;
    width: 76%;
    aspect-ratio: 1;
    background: #e0e320; /* var(--lime) */
    border-radius: 50%;
    opacity: .78;
}
.hero-portrait img {
    position: relative;
    z-index: 2;
    width: 100%;
    aspect-ratio: 3/4;
    object-fit: cover;
    border-radius: 48% 48% 1.6rem 1.6rem;
    box-shadow: 0 26px 65px rgba(23,47,55,.16);
}
.hero-portrait figcaption {
    margin-top: .9rem;
    color: #62757a;
    font-size: .75rem;
    text-align: right;
}

/* =======================================
   Section: Power Intro
   ======================================= */
.power-intro {
    padding: clamp(8rem,12vw,12rem) max(3rem,calc((100vw - 1240px)/2));
}
.intro-heading .eyebrow { color: #f15922; /* var(--orange) */ }
.intro-heading h2 {
    margin: 0;
    color: #172f37;
    font: 800 clamp(4.2rem,7.5vw,7.6rem)/.87 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.045em;
    text-transform: uppercase;
}
.intro-copy p { color: #566c72; }
.intro-copy .lead {
    color: #172f37;
    font-size: clamp(1.4rem,2.2vw,1.85rem);
    font-weight: 700;
    line-height: 1.35;
}

/* =======================================
   Section: Power Grows (Cards & Pseudo Marks)
   ======================================= */
.power-grows {
    padding: 0 max(3rem,calc((100vw - 1240px)/2)) clamp(8rem,12vw,12rem);
}
.growth-card {
    position: relative;
    min-height: 390px;
    padding: 2.2rem;
    background: #f4f6ef;
    border-radius: 1.3rem;
}
.growth-card::before {
    content: "";
    display: block;
    width: 74px;
    height: 74px;
    margin-bottom: 6rem;
    border: 2px solid #187575; /* var(--teal-bright) */
    border-radius: 50%;
    box-shadow: inset 0 0 0 17px #f4f6ef, inset 0 0 0 37px #e0e320;
}

/* Specific Card Theme Color Variations */
.growth-trust { background: #f4ecf4; }
.growth-trust::before {
    border-color: #8e2288;
    box-shadow: inset 0 0 0 17px #f4ecf4, inset 0 0 0 37px #8e2288;
}
.growth-trust .eyebrow { color: #8e2288; }

.growth-act { background: #eaf5f3; }
.growth-act::before {
    border-color: #f15922;
    box-shadow: inset 0 0 0 17px #eaf5f3, inset 0 0 0 37px #f15922;
}
.growth-act .eyebrow { color: #f15922; }

.growth-card h3 {
    margin: 0;
    font: 800 clamp(2rem,3.1vw,3.1rem)/.98 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}
.growth-card p:last-child { color: #586d73; }

/* =======================================
   Section: Inseparable
   ======================================= */
.inseparable {
    padding: clamp(2rem,2vw,2rem) max(1rem,calc((100vw - 1240px)/2));
    background: #f6f7f2;
}
.inseparable-heading .eyebrow { color: #8e2288; }
.inseparable-heading p:last-child {
    max-width: 520px;
    margin-top: 2rem;
    color: #566c72;
    font-size: 1.08rem;
}

.practice {
    align-items: center;
    padding: 1.7rem 1rem;
    border-top: 1px solid rgba(23,47,55,.2);
    text-decoration: none;
    transition: padding 180ms ease, color 180ms ease, background 180ms ease;
}
.practice:last-child { border-bottom: 1px solid rgba(23,47,55,.2); }
.practice:hover {
    padding-right: 1.6rem;
    padding-left: 1.6rem;
    color: #ffffff;
    background: #187575;
}
.practice-title { margin: 0; }
.practice-title a {
    color: #187575;
    font: 800 clamp(1.8rem,3vw,3rem)/1 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
    text-decoration: none;
}
.advocacy-practice .practice-title a { color: #f15922; }
.relationship-practice .practice-title a { color: #8e2288; }

.practice:hover .practice-title a { color: #e0e320; }
.practice p { margin: 0; color: #596e74; }
.practice:hover p { color: rgba(255,255,255,.82); }

/* =======================================
   Section: Next
   ======================================= */
.next {
    padding: clamp(8rem,12vw,12rem) max(3rem,calc((100vw - 1240px)/2));
    background: #ffffff;
}
.next-heading { margin-bottom: 4rem; }
.next-heading .eyebrow { color: #187575; }

.next-card {
    min-height: 430px;
    padding: clamp(2rem,5vw,4.5rem);
    color: #172f37;
    background: #e0e320;
    border-radius: 1.5rem;
    text-decoration: none;
    transition: transform 200ms ease, box-shadow 200ms ease;
}
.next-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 60px rgba(23,47,55,.14);
}
.next-card .eyebrow { color: #8e2288; }
.next-card h3 {
    margin: 5rem 0 1.4rem;
    font: 800 clamp(3.2rem,6vw,6rem)/.86 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}
.next-card-action a {
    display: inline-flex;
    gap: .8rem;
    margin-top: 1.5rem;
    padding-bottom: .25rem;
    border-bottom: 2px solid #172f37;
    font-weight: 800;
    text-decoration: none;
    color: #172f37;
}

.stories-link {
    padding: 2.3rem 0;
    border-top: 2px solid #187575;
}
.stories-link p { margin: 0 0 .8rem; color: #5a6d73; }
.stories-link a { color: #1c4552; font-weight: 800; text-decoration: none; }
.stories-link a span { padding-left: .5rem; color: #f15922; }

/* =======================================
   Section: People Close (Pseudo Orbit Rings)
   ======================================= */
.people-close {
    position: relative;
    padding: clamp(7rem,11vw,11rem) max(3rem,calc((100vw - 1240px)/2));
    overflow: hidden;
    color: #ffffff;
    background: #187575;
}
.people-close::before {
    content: "";
    position: absolute;
    right: -5rem;
    top: -8rem;
    width: 480px;
    height: 480px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    opacity: .18;
    box-shadow: inset 0 0 0 60px #187575, inset 0 0 0 62px #ffffff, inset 0 0 0 120px #187575, inset 0 0 0 480px #ffffff;
    pointer-events: none;
}

.close-copy .eyebrow { color: #e0e320; }
.people-close h2 { color: #ffffff; font-size: clamp(4.2rem,7.5vw,7.6rem); margin: 0; }
.people-close h2 em { color: #e0e320; font-style: normal; }
.close-copy p:last-child { max-width: 570px; font-size: 1.15rem; }

.close-button {
    display: inline-flex;
    gap: 1.5rem;
    align-items: center;
    padding: 1rem 1.4rem;
    color: #172f37;
    background: #e0e320;
    border-radius: 999px;
    font-weight: 800;
    text-decoration: none;
    text-transform: uppercase;
    transition: transform 180ms ease, background 180ms ease;
}
.close-button:hover { background: #ffffff; transform: translateY(-3px); }

/* Responsive Overrides */
@media (max-width: 960px) {
    .power-grows .wp-block-columns { flex-direction: column; gap: 1.3rem; }
    .growth-card { min-height: 0; }
}

@media (max-width: 700px) {
    .people-hero { padding: 4rem 1.25rem 5rem; }
    .hero-portrait { width: min(82%,390px); }
    .practice { flex-direction: column; gap: .8rem; }
    .next-grid { flex-direction: column; }
    .next-card { min-height: 390px; }
    .people-close .wp-block-columns { flex-direction: column; gap: 3rem; }
}
/* ==========================================================================
   PEOPLE HERO SECTION: EXACT MOCKUP MATCH
   ========================================================================== */

/* 1. Background & Overall Container */
.people-hero {
    background: linear-gradient(135deg, #ffffff 0%, #ffffff 60%, #f1f5ef 60%, #f1f5ef 100%) !important;
    padding: clamp(4rem, 7vw, 7rem) max(3rem, calc((100vw - 1240px)/2)) !important;
    overflow: hidden !important;
    position: relative !important;
}

/* 2. Side-by-Side Flex Layout */
.people-hero > .wp-block-group__inner-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 4rem !important;
}

/* 3. Text Left Column */
.people-hero-text {
    flex: 1 1 52% !important;
    max-width: 52% !important;
    text-align: left !important;
}

.people-hero-text .breadcrumb {
    color: #61747a !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    margin-bottom: 2rem !important;
}

.people-hero-text .breadcrumb a {
    color: #8e2288 !important;
    text-decoration: none !important;
}

.people-hero-text h1 {
    color: #172f37 !important; /* Dark Ink */
    font: 800 clamp(4.5rem, 8.5vw, 9rem)/0.85 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: -0.04em !important;
    margin: 0 0 2rem 0 !important;
}

.people-hero-text h1 em {
    color: #8e2288 !important; /* Purple */
    font-style: normal !important;
    display: block !important;
}

.people-hero-text .hero-lead {
    color: #1c4552 !important;
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* 4. Visual Right Column & Yellow Circle Overlay */
.people-hero-visual {
    flex: 1 1 44% !important;
    max-width: 44% !important;
    position: relative !important;
}

.hero-portrait {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
}

/* Yellow Accent Circle */
.hero-portrait::before {
    content: "" !important;
    position: absolute !important;
    top: -2.5rem !important;
    right: -2.5rem !important;
    width: 220px !important;
    height: 220px !important;
    background-color: #e0e320 !important; /* KAIROS Lime/Yellow */
    border-radius: 50% !important;
    z-index: 1 !important;
}

.hero-portrait img {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    border-radius: 200px 200px 1.5rem 1.5rem !important;
    box-shadow: 0 20px 50px rgba(23,47,55,0.15) !important;
    display: block !important;
}

.hero-portrait figcaption {
    margin-top: 0.8rem !important;
    color: #62757a !important;
    font-size: 0.75rem !important;
    text-align: right !important;
}

.people-eyebrow {
    margin: 0 0 1.25rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color:#1C4552;

}

/* 5. Mobile Layout */
@media (max-width: 900px) {
    .people-hero > .wp-block-group__inner-container {
        flex-direction: column !important;
    }
    .people-hero-text, .people-hero-visual {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}

/* ==========================================================================
   POWER INTRO SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.intro-heading h2,
#power-title {
    /* Scaled up 1.5x from original clamp(4.2rem, 7.5vw, 7.6rem) */
    font-size: clamp(6.3rem, 7.25vw, 7.4rem) !important; 
    
    /* Tight line-height ensures stacked words remain balanced */
    line-height: 0.88 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to prevent screen overflow on handheld devices */
@media (max-width: 900px) {
    .intro-heading h2,
    #power-title {
        font-size: clamp(3.8rem, 12vw, 6rem) !important;
    }
}
/* ==========================================================================
   Inseperable INTRO SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.inseparable-title h2,
#inseparable-title {
    /* Scaled up 1.5x from original clamp(4.2rem, 7.5vw, 7.6rem) */
    font-size: clamp(4.3rem, 4.25vw, 4.4rem) !important; 
    
    /* Tight line-height ensures stacked words remain balanced */
    line-height: 0.88 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to prevent screen overflow on handheld devices */
@media (max-width: 900px) {
    .intro-heading h2,
    #inseparable-title {
        font-size: clamp(3.8rem, 12vw, 6rem) !important;
    }
}

/* ==========================================================================
   Next INTRO SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.next-title h2,
#next-title {
    /* Scaled up 1.5x from original clamp(4.2rem, 7.5vw, 7.6rem) */
    font-size: clamp(6.3rem, 6.25vw, 6.4rem) !important; 
    
    /* Tight line-height ensures stacked words remain balanced */
    line-height: 0.88 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to prevent screen overflow on handheld devices */
@media (max-width: 900px) {
    .intro-heading h2,
    #next-title {
        font-size: clamp(3.8rem, 12vw, 6rem) !important;
    }
}
/* ==========================================================================
   NEXT SECTION: KAIROS NETWORK CARD FIX
   ========================================================================== */

/* 1. Prevent Container Collapse & Force Horizontal Layout */
.next-grid {
    display: flex !important;
    flex-direction: row !important;
    gap: 2.5rem !important;
    align-items: stretch !important;
    width: 100% !important;
}

.next-card {
    flex: 1 1 60% !important;
    max-width: 60% !important;
    min-width: 0 !important; /* Fixes grid item vertical collapsing */
    background-color: #e0e320 !important; /* KAIROS Lime */
    padding: clamp(3rem, 5vw, 4.5rem) !important;
    border-radius: 1.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
}

/* 2. Reset Heading Layout & Scale Typography */
.next-card h3 {
    color: #172f37 !important; /* Dark Ink */
    font: 800 clamp(3.5rem, 6.5vw, 7rem)/0.88 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: -0.03em !important;
    white-space: normal !important; /* Stops single-character wrapping */
    word-break: normal !important;
    margin: 2rem 0 2rem 0 !important;
    width: 100% !important;
}

/* 3. Eyebrow Text Styling */
.next-card .eyebrow {
    color: #8e2288 !important; /* Purple */
    font-size: 0.85rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    margin: 0 !important;
}

/* 4. Body Paragraph Styling */
.next-card p {
    color: #172f37 !important;
    font-size: 1.15rem !important;
    line-height: 1.4 !important;
    max-width: 540px !important;
    margin: 0 0 2.5rem 0 !important;
}

/* 5. Button Link Alignment */
.next-card-action {
    margin-top: auto !important;
}

.next-card-action a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    color: #172f37 !important;
    font-weight: 800 !important;
    font-size: 1.1rem !important;
    text-decoration: none !important;
    border-bottom: 2px solid #172f37 !important;
    padding-bottom: 0.3rem !important;
}

/* 6. Mobile Responsiveness */
@media (max-width: 900px) {
    .next-grid {
        flex-direction: column !important;
    }
    .next-card {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
    .next-card h3 {
        font-size: clamp(3rem, 10vw, 4.5rem) !important;
    }
}

/* ==========================================================================
   CLOSE INTRO SECTION: HEADING SCALE (1.5x)
   ========================================================================== */

.close-title h2,
#close-title {
    /* Scaled up 1.5x from original clamp(4.2rem, 7.5vw, 7.6rem) */
    font-size: clamp(6.3rem, 6.25vw, 6.4rem) !important; 
    
    /* Tight line-height ensures stacked words remain balanced */
    line-height: 0.88 !important; 
    
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

/* Mobile Adjustment to prevent screen overflow on handheld devices */
@media (max-width: 900px) {
    .intro-heading h2,
    #close-title {
        font-size: clamp(3.8rem, 12vw, 6rem) !important;
    }
}

/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* =======================================
   Tone System (Orange Profile)
   ======================================= */
.tone-orange { 
    --page-accent: #f15922; /* orange */
    --page-wash: #f7dfd1; 
    --page-deep: #7c2f16; 
}

/* =======================================
   Base Typography & Accents
   ======================================= */
.eyebrow {
    color: var(--page-accent, #8E2288);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.wp-block-heading em { 
    color: var(--page-accent, #8E2288); 
    font-style: normal; 
}

/* =======================================
   Section 1: Collection Hero
   ======================================= */
.collection-hero {
    position: relative;
    padding: clamp(4.5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem);
    background: var(--page-deep, #1C4552);
    color: #ffffff;
    isolation: isolate;
    overflow: hidden;
}

/* Circular Background Treatment */
.collection-hero::before {
    position: absolute;
    inset: auto auto -12rem -8rem;
    z-index: -1;
    width: 30rem;
    height: 30rem;
    content: "";
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    box-shadow: 0 0 0 3.4rem rgba(255,255,255,.035), 0 0 0 7rem rgba(255,255,255,.025);
}

.collection-hero .wp-block-columns { 
    align-items: center; 
}

.collection-hero .eyebrow { 
    color: #e0e320; /* var(--lime) */ 
}

.collection-hero h1 {
    max-width: 820px;
    margin: 0;
    font: 800 clamp(4.3rem, 8vw, 8rem)/.88 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.045em;
    text-transform: uppercase;
    color: #ffffff;
}
.collection-hero h1 em { 
    color: #e0e320; /* var(--lime) */ 
}

.collection-hero-copy p:last-of-type:not(.eyebrow) {
    max-width: 42rem;
    margin: 2rem 0 0;
    font-size: clamp(1.08rem, 1.7vw, 1.32rem);
    line-height: 1.55;
    color: rgba(255,255,255,.85);
}

.collection-hero-art figure {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    background: var(--page-wash);
    margin: 0;
}
.collection-hero-art img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}
.collection-hero-art figure::after {
    position: absolute;
    inset: 2rem;
    content: "";
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 999px 999px 2rem 2rem;
}

/* =======================================
   Section 2: Feature Strip & Metrics
   ======================================= */
.feature-strip {
    padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 4vw, 3rem);
    background: var(--page-deep);
    color: #ffffff;
}
.feature-strip-inner { 
    align-items: center; 
    gap: clamp(3rem, 8vw, 8rem); 
}
.feature-strip .eyebrow { 
    color: #e0e320; /* var(--lime) */ 
}
.feature-strip h2 {
    font: 800 clamp(3.5rem, 7vw, 7rem)/.9 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0;
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    background: rgba(255,255,255,.25);
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 1.4rem;
}
.metric {
    padding: 2rem;
    background: rgba(12,40,47,.35);
}
.metric strong {
    display: block;
    color: #e0e320; /* var(--lime) */
    font: 800 clamp(2.6rem, 5vw, 5.5rem)/.9 "Barlow Semi Condensed", sans-serif;
}
.metric span {
    display: block;
    margin-top: 1rem;
    color: rgba(255,255,255,.85);
    font-weight: 700;
    line-height: 1.35;
}

/* =======================================
   Section 3: Page Section & Card Grid
   ======================================= */
.page-section {
    padding: clamp(2.5rem, 4vw, 4rem) clamp(1.0rem, 2vw, 1.5rem);
}

.section-intro {
    align-items: flex-end;
    gap: clamp(2.5rem, 7vw, 7rem);
    margin-bottom: clamp(3rem, 7vw, 6rem);
}

.section-intro h2 {
    margin: 0;
    font: 800 clamp(3.4rem, 7vw, 6.8rem)/.9 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.04em;
    text-transform: uppercase;
    color: #1c4552; /* var(--teal) */
}
.section-intro h2 em { 
    color: var(--page-accent); 
}
.section-intro .wp-block-column:last-child p { 
    max-width: 44rem; 
    margin: 0; 
    font-size: 1.12rem; 
    color: #172f37; 
}

/* Card Grid & Info Cards */
.card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.info-card {
    position: relative;
    min-width: 0;
    padding: clamp(1.6rem, 3vw, 2.6rem);
    background: #ffffff;
    border: 1px solid rgba(28, 69, 82, 0.18);
    border-radius: 1.2rem;
    box-shadow: 0 15px 45px rgba(23,47,55,.06);
}

.info-card h3 {
    margin: 0 0 1rem;
    font: 800 clamp(1.8rem, 3vw, 2.8rem)/1 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.025em;
    text-transform: uppercase;
    color: #172f37;
}

.info-card p {
    margin: 0;
    color: #486069;
}

/* Animations */
.reveal { 
    opacity: 0; 
    transform: translateY(30px); 
    transition: opacity 650ms ease, transform 650ms ease; 
}
.reveal.is-visible { 
    opacity: 1; 
    transform: translateY(0); 
}

/* Mobile & Tablet Responsive Adjustments */
@media (max-width: 1000px) {
    .collection-hero { grid-template-columns: 1fr; }
    .card-grid { grid-template-columns: repeat(2, 1fr); }
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
    .collection-hero-copy { padding: 4.5rem 1.25rem; }
    .collection-hero h1 { font-size: clamp(3.6rem, 18vw, 5.7rem); }
    .section-intro, .feature-strip-inner { flex-direction: column; gap: 2rem; }
    .card-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .metric-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   OUR IMPACT HERO SECTION: EXACT MOCKUP MATCH
   ========================================================================== */

/* Force Deep Rust/Orange Background Override */
.collection-hero.tone-orange {
    background-color: #7c2f16 !important; /* Deep Rust/Orange */
    position: relative !important;
    padding: clamp(4rem, 7vw, 7rem) max(3rem, calc((100vw - 1240px)/2)) !important;
    overflow: hidden !important;
}

/* Background Circular Concentric Rings */
.collection-hero.tone-orange::before {
    position: absolute !important;
    inset: auto auto -12rem -8rem !important;
    z-index: 1 !important;
    width: 34rem !important;
    height: 34rem !important;
    content: "" !important;
    border: 2px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 4rem rgba(255, 255, 255, 0.04), 0 0 0 8rem rgba(255, 255, 255, 0.02) !important;
    pointer-events: none !important;
}

/* ==========================================================================
   OUR IMPACT HERO: WIDER ARCH ADJUSTMENT
   ========================================================================== */

/* 1. Tighten Container Gap */
.collection-hero.tone-orange > .wp-block-group__inner-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    gap: 2rem !important; /* Reduced gap gives more width to the image */
    min-height: 540px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* 2. Adjust Column Ratios (40% Text / 60% Image) */
.impact-hero-copy {
    flex: 1 1 40% !important;
    max-width: 40% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 3rem 0 !important;
}

.impact-hero-art {
    flex: 1 1 60% !important; /* Expanded width for wider arch */
    max-width: 60% !important;
    display: flex !important;
    align-items: stretch !important;
}

/* 3. Wider Arch Framing & Border Radius */
.impact-hero-art figure {
    position: relative !important;
    margin: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    
    /* 320px top curves create a flatter, wider dome across the 60% container */
    border-radius: 320px 320px 0 0 !important; 
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
}

.impact-hero-art img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 20% !important; /* Framing focus on people's faces */
    display: block !important;
}
/* ==========================================================================
   OUR IMPACT: STATIC THREE-CARD GRID (NO HOVER EFFECTS)
   ========================================================================== */

/* 1. Grid Structure */
.card-grid {
    display: flex !important;
    flex-direction: row !important;
    gap: 2rem !important;
    width: 100% !important;
    align-items: stretch !important;
}

/* 2. Static Card Styling */
.info-card {
    flex: 1 1 33.333% !important;
    max-width: 33.333% !important;
    min-width: 0 !important;
    background: #ffffff !important;
    border: 1px solid rgba(23, 47, 55, 0.12) !important;
    border-radius: 1.5rem !important;
    padding: clamp(2rem, 3.5vw, 3rem) !important;
    box-shadow: 0 15px 35px rgba(23, 47, 55, 0.06) !important;
    box-sizing: border-box !important;
    transition: none !important; /* Disables all motion animations */
}

/* 3. Strip All Mouseover / Hover Effects */
.info-card:hover,
.info-card.goal:hover {
    background: #ffffff !important;
    color: inherit !important;
    transform: none !important;
    padding: clamp(2rem, 3.5vw, 3rem) !important;
    box-shadow: 0 15px 35px rgba(23, 47, 55, 0.06) !important;
}

/* 4. Heading Typographic Scaling & Wrapping Fix */
/* ==========================================================================
   OUR IMPACT: STACKED CARD FLOW (TITLE ABOVE PARAGRAPH)
   ========================================================================== */

/* 1. Force Card Content to Stack Vertically */
.info-card {
    display: flex !important;
    flex-direction: column !important; /* Forces title above paragraph */
    justify-content: flex-start !important;
    align-items: flex-start !important;
    flex: 1 1 33.333% !important;
    max-width: 33.333% !important;
    min-width: 0 !important;
    background: #ffffff !important;
    border: 1px solid rgba(23, 47, 55, 0.12) !important;
    border-radius: 1.5rem !important;
    padding: clamp(2rem, 3vw, 2.8rem) !important;
    box-shadow: 0 15px 35px rgba(23, 47, 55, 0.06) !important;
    box-sizing: border-box !important;
}

/* 2. Full Width Title on Top */
.info-card h3 {
    width: 100% !important;
    color: #172f37 !important;
    font: 800 clamp(1.8rem, 2.5vw, 2.4rem)/1.05 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
    white-space: normal !important;
    word-break: normal !important;
    margin: 0 0 1.25rem 0 !important;
}

/* 3. Full Width Paragraph Below */
.info-card p {
    width: 100% !important;
    color: #566c72 !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.info-card:hover h3 {
    color: #172f37 !important;
}

/* 5. Body Text Styling */
.info-card p {
    color: #566c72 !important;
    font-size: 1.0rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.info-card:hover p {
    color: #566c72 !important;
}

/* 6. Mobile Layout */
@media (max-width: 900px) {
    .card-grid {
        flex-direction: column !important;
    }
    .info-card {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}
/* WP Block Container Alignments */
.wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* =======================================
   Tone System (Blue Profile)
   ======================================= */
.tone-blue { 
    --page-accent: #167575; /* bright teal */
    --page-wash: #dbecec; 
    --page-deep: #183f4a; 
}

/* =======================================
   Base Typography & Accents
   ======================================= */
.eyebrow {
    color: var(--page-accent, #8E2288);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.wp-block-heading em { 
    color: var(--page-accent, #8E2288); 
    font-style: normal; 
}

/* =======================================
   Section 1: Collection Hero
   ======================================= */
.collection-hero {
    position: relative;
    padding: clamp(4.5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem);
    background: var(--page-deep, #183f4a);
    color: #ffffff;
    isolation: isolate;
    overflow: hidden;
}

/* Circular Background Treatment */
.collection-hero::before {
    position: absolute;
    inset: auto auto -12rem -8rem;
    z-index: -1;
    width: 30rem;
    height: 30rem;
    content: "";
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    box-shadow: 0 0 0 3.4rem rgba(255,255,255,.035), 0 0 0 7rem rgba(255,255,255,.025);
}

.collection-hero .wp-block-columns { 
    align-items: center; 
}

.collection-hero .eyebrow { 
    color: #e0e320; /* var(--lime) */ 
}

.collection-hero h1 {
    max-width: 820px;
    margin: 0;
    font: 800 clamp(4.3rem, 8vw, 8rem)/.88 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.045em;
    text-transform: uppercase;
    color: #ffffff;
}
.collection-hero h1 em { 
    color: #e0e320; /* var(--lime) */ 
}

.collection-hero-copy p:last-of-type:not(.eyebrow) {
    max-width: 42rem;
    margin: 2rem 0 0;
    font-size: clamp(1.08rem, 1.7vw, 1.32rem);
    line-height: 1.55;
    color: rgba(255,255,255,.85);
}

.collection-hero-art figure {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    background: var(--page-wash);
    margin: 0;
    border-radius: 250px 250px 1.5rem 1.5rem;
}
.collection-hero-art img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}

/* =======================================
   Section 2: Page Section & Card Grid
   ======================================= */
.page-section {
    padding: clamp(5rem, 9vw, 8.5rem) clamp(1.25rem, 4vw, 3rem);
}

.section-intro {
    align-items: flex-end;
    gap: clamp(2.5rem, 7vw, 7rem);
    margin-bottom: clamp(3rem, 7vw, 6rem);
}

.section-intro h2 {
    margin: 0;
    font: 800 clamp(3.4rem, 7vw, 6.8rem)/.9 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.04em;
    text-transform: uppercase;
    color: #1c4552; /* var(--teal) */
}
.section-intro h2 em { 
    color: var(--page-accent); 
}
.section-intro .wp-block-column:last-child p { 
    max-width: 44rem; 
    margin: 0 0 1rem; 
    font-size: 1.12rem; 
    color: #172f37; 
}

/* Static Three-Card Grid (Top-to-Bottom Flow, No Hover Effects) */
.card-grid {
    display: flex !important;
    flex-direction: row !important;
    gap: 1.25rem !important;
    width: 100% !important;
    align-items: stretch !important;
}

.info-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    flex: 1 1 33.333% !important;
    max-width: 33.333% !important;
    min-width: 0 !important;
    background: #ffffff !important;
    border: 1px solid rgba(28, 69, 82, 0.18) !important;
    border-radius: 1.2rem !important;
    padding: clamp(1.6rem, 3vw, 2.6rem) !important;
    box-shadow: 0 15px 45px rgba(23,47,55,.06) !important;
    box-sizing: border-box !important;
    transition: none !important;
}

.info-card:hover,
.info-card.goal:hover {
    background: #ffffff !important;
    color: inherit !important;
    transform: none !important;
    padding: clamp(1.6rem, 3vw, 2.6rem) !important;
    box-shadow: 0 15px 45px rgba(23,47,55,.06) !important;
}

.info-card h3 {
    width: 100% !important;
    margin: 0 0 1rem !important;
    font: 800 clamp(1.8rem, 2.5vw, 2.8rem)/1 "Barlow Semi Condensed", sans-serif !important;
    letter-spacing: -.025em !important;
    text-transform: uppercase !important;
    color: #172f37 !important;
    white-space: normal !important;
    word-break: normal !important;
}

.info-card p {
    width: 100% !important;
    margin: 0 !important;
    color: #486069 !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
}

/* =======================================
   Section 3: Feature Strip & Principle List
   ======================================= */
.feature-strip {
    padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 4vw, 3rem);
    background: var(--page-deep);
    color: #ffffff;
}
.feature-strip-inner { 
    align-items: center; 
    gap: clamp(3rem, 8vw, 8rem); 
}
.feature-strip .eyebrow { 
    color: #e0e320; /* var(--lime) */ 
}
.feature-strip h2 {
    font: 800 clamp(3.5rem, 7vw, 7rem)/.9 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0;
}

.feature-strip-copy p {
    font-size: 1.12rem;
    color: rgba(255, 255, 255, 0.82);
    max-width: 48rem;
}

/* Principle List Layout */
.principle-list {
    display: grid;
    gap: 0;
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}
.principle-list li {
    display: grid;
    grid-template-columns: minmax(10rem, .55fr) 1fr;
    gap: 2rem;
    padding: 1.25rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
.principle-list strong {
    color: #e0e320; /* var(--lime) */
    font-family: "Barlow Semi Condensed", sans-serif;
    font-size: 1.35rem;
    text-transform: uppercase;
}

/* Animations */
.reveal { 
    opacity: 0; 
    transform: translateY(30px); 
    transition: opacity 650ms ease, transform 650ms ease; 
}
.reveal.is-visible { 
    opacity: 1; 
    transform: translateY(0); 
}

/* Mobile & Tablet Responsive Adjustments */
@media (max-width: 1000px) {
    .collection-hero { grid-template-columns: 1fr; }
    .card-grid { flex-direction: column !important; }
    .info-card { flex: 1 1 100% !important; max-width: 100% !important; }
}

@media (max-width: 760px) {
    .collection-hero-copy { padding: 4.5rem 1.25rem; }
    .collection-hero h1 { font-size: clamp(3.6rem, 18vw, 5.7rem); }
    .section-intro, .feature-strip-inner { flex-direction: column; gap: 2rem; }
    .principle-list li { grid-template-columns: 1fr; gap: .3rem; }
}
/* ==========================================================================
   THE TWO-WAY PATH HERO: FULL-HEIGHT RIGHT PANEL OVERRIDE
   ========================================================================== */

/* 1. Main Hero Block Wrapper */
.collection-hero.path-hero {
    background-color: #1C4552 !important; /* Deep Teal */
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Background Concentric Rings */
.collection-hero.path-hero::before {
    position: absolute !important;
    inset: auto auto -10rem -8rem !important;
    z-index: 1 !important;
    width: 32rem !important;
    height: 32rem !important;
    content: "" !important;
    border: 2px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 4rem rgba(255, 255, 255, 0.03), 0 0 0 8rem rgba(255, 255, 255, 0.015) !important;
    pointer-events: none !important;
}

/* 2. Strict 2-Column Grid (Forces Equal Height Columns) */
.collection-hero.path-hero > .wp-block-group__inner-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: stretch !important; /* Forces right panel to stretch full height */
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* 3. Left Column (Text & Spacing) */
.path-hero-text {
    grid-column: 1 !important;
    padding: clamp(4rem, 7vw, 6.5rem) clamp(2rem, 5vw, 6rem) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 2 !important;
}

.path-hero-text .eyebrow {
    color: #e0e320 !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    margin-bottom: 1.5rem !important;
}

.path-hero-text h1 {
    color: #ffffff !important;
    font: 800 clamp(4.2rem, 8vw, 8rem)/0.88 "Barlow Semi Condensed", sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: -0.04em !important;
    margin: 0 0 2rem 0 !important;
}

.path-hero-text h1 em {
    color: #e0e320 !important;
    font-style: normal !important;
}

.path-hero-text p:last-of-type {
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 1.18rem !important;
    line-height: 1.55 !important;
    max-width: 480px !important;
    margin: 0 !important;
}

/* 4. Right Column (Light Blue Full-Height Panel) */
.path-hero-art {
    grid-column: 2 !important;
    background-color: #dbecec !important; /* Light Ice-Blue Wash */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important; /* Fills full column height */
    padding: 3rem !important;
    box-sizing: border-box !important;
}

.path-hero-art figure {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 480px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.path-hero-art img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
}

/* 5. Responsive Mobile Adjustment */
@media (max-width: 900px) {
    .collection-hero.path-hero > .wp-block-group__inner-container {
        grid-template-columns: 1fr !important;
    }
    .path-hero-text, .path-hero-art {
        grid-column: 1 !important;
    }
    .path-hero-art {
        padding: 4rem 2rem !important;
    }
}
/* ==========================================================================
   WWD (What We Do) Page Complete Gutenberg Stylesheet Fix
   ========================================================================== */

:root {
  --ink: #172f37;
  --white: #ffffff;
  --paper: #f4f4f0;
  --lime: #d2e030;
  --orange: #e05a2b;
  --purple: #6a2a60;
  --teal-bright: #008080;
}

/* --------------------------------------------------------------------------
   Global Layout & Full-Bleed Fixes
   -------------------------------------------------------------------------- */
.alignfull {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box;
}

.WWD-hero-section .wp-block-group__inner-container,
.WWD-interconnected .wp-block-group__inner-container,
.WWD-goals-section .wp-block-group__inner-container,
.WWD-covenants .wp-block-group__inner-container,
.WWD-path-callout .wp-block-group__inner-container,
.WWD-work-close .wp-block-group__inner-container {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

/* Global Typography */
.eyebrow {
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.WWD-interconnected h2,
.WWD-goal-panel h2,
.WWD-covenants h2,
.WWD-path-callout h2,
.WWD-work-close h2 {
  font: 800 clamp(3.2rem, 5.5vw, 6rem)/0.9 "Barlow Semi Condensed", Impact, sans-serif;
  text-transform: uppercase;
  letter-spacing: -0.04em;
  margin-top: 0;
  color:#f15922;
}

/* --------------------------------------------------------------------------
   1. Hero Section Fixes
   -------------------------------------------------------------------------- */
.WWD-hero-section {
  position: relative;
  padding: 3rem 0 0;
  color: var(--white);
  background: #187575;
  overflow: hidden;
}

.WWD-hero-section .wp-block-columns {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: .25rem;
  width: 100%;
}

.WWD-hero-section .hero-title-text {
  margin: 0;
  font: 800 clamp(5.5rem, 11vw, 11rem)/0.72 "Barlow Semi Condensed", Impact, sans-serif;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.WWD-hero-section .hero-title-text em {
  color: var(--lime);
  font-style: normal;
}

.WWD-hero-message {
  padding: 1.5rem 0 0;
  border-top: 3px solid var(--orange);
}

.WWD-hero-message .hero-count,
.WWD-hero-message .hero-direction {
  font: 800 clamp(1.8rem, 2.5vw, 2.8rem)/0.95 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
  margin: 0;
}

.WWD-hero-message .hero-direction {
  margin-bottom: 1.2rem;
  color: var(--orange);
}

/* Hero Bottom Navigation Buttons Fix */
.WWD-hero-goals {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between;
  gap: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
  margin-top: 3rem;
  width: 100%;
}

.WWD-hero-goals .wp-block-column {
  flex: 1;
  border-right: 1px solid rgba(255, 255, 255, 0.28);
  padding: 1.25rem 1.5rem 1.25rem 0;
}

.WWD-hero-goals .wp-block-column:last-child {
  border-right: none;
}

.WWD-hero-goals a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--white);
  text-decoration: none;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: clamp(1rem, 1.3vw, 1.25rem);
  text-transform: uppercase;
  font-weight: 800;
  line-height: 1.05;
}

.WWD-hero-goals a strong {
  white-space: pre-line;
}

.WWD-hero-goals .goal-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  background: var(--lime);
  color: var(--ink);
  border-radius: 50%;
  font-size: 0.9rem;
  margin-left: 0.5rem;
}

/* --------------------------------------------------------------------------
   2. Interconnected Section
   -------------------------------------------------------------------------- */
.WWD-interconnected {
  padding: clamp(4rem, 8vw, 7rem) 0;
  background: var(--paper);
  color: var(--ink);
}

.WWD-interconnected h2 em {
  color: var(--purple);
  font-style: normal;
}

.WWD-interconnected .lead {
  color: var(--ink);
  font-size: clamp(1.15rem, 1.8vw, 1.5rem);
  font-weight: 700;
  line-height: 1.35;
}

/* --------------------------------------------------------------------------
   3. Goals Panels & Full-Bleed Systems Section Fix
   -------------------------------------------------------------------------- */
.WWD-goals-section {
  background: var(--white);
}

.WWD-goal-panel {
  --accent: var(--purple);
  padding: clamp(1rem, 2vw, 2rem) 0;
  border-bottom: 1px solid rgba(23, 47, 55, 0.2);
  color: var(--ink);
}

/* Full-width stretch for Systems dark background */
.WWD-goal-panel.systems {
  --accent: var(--orange);
  color: var(--white);
  background: var(--ink);
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box;
}

.WWD-goal-panel.power {
  --accent: var(--teal-bright);
}

.WWD-goal-panel .goal-shift {
  padding: 1.5rem 0 0;
  border-top: 3px solid var(--accent);
}

.WWD-goal-panel .goal-shift ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.WWD-goal-panel .goal-shift li {
  padding: 0.65rem 0;
  border-bottom: 1px solid rgba(23, 47, 55, 0.18);
  font: 700 1.05rem/1.2 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}

.WWD-goal-panel.systems .goal-shift li {
  border-color: rgba(255, 255, 255, 0.18);
}

/* --------------------------------------------------------------------------
   4. Covenants Section
   -------------------------------------------------------------------------- */
.WWD-covenants {
  padding: clamp(4rem, 8vw, 7rem) 0;
  background: #eceee7;
  color: var(--ink);
}

.WWD-covenants h2 em {
  color: var(--orange);
  font-style: normal;
}

.covenant-grid {
  display: flex !important;
  gap: 1.5rem;
  margin-top: 2.5rem;
}

.covenant-grid .wp-block-column {
  flex: 1;
  display: flex;
}

.WWD-covenants .covenant {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 340px;
  padding: 2rem;
  background: var(--white);
  border: 1px solid rgba(23, 47, 55, 0.22);
  transition: color 220ms ease, background 220ms ease, transform 220ms ease;
}

.WWD-covenants .covenant h3 a {
  color: inherit;
  text-decoration: none;
  font: 800 1.8rem/1.05 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}

.WWD-covenants .covenant:hover {
  color: var(--white);
  background: var(--teal-bright);
  transform: translateY(-6px);
}

/* --------------------------------------------------------------------------
   5. Two-Way Path Callout (Padding Tightened)
   -------------------------------------------------------------------------- */
.WWD-path-callout {
  position: relative;
  padding: clamp(.5rem, 1.5vw, 1rem) 0;
  overflow: hidden;
  color: var(--white);
  background: var(--purple);
}

.WWD-path-callout h2 em {
  color: var(--lime);
  font-style: normal;
}

/* --------------------------------------------------------------------------
   6. Work Close Banner
   -------------------------------------------------------------------------- */
.WWD-work-close {
  padding: clamp(4rem, 7vw, 6.5rem) 0;
  color: var(--ink);
  background: var(--lime);
}

.WWD-work-close h2 em {
  color: var(--purple);
  font-style: normal;
}

.close-action {
  display: inline-block;
  padding: 0.9rem 1.8rem;
  background: var(--ink);
  color: var(--white);
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  text-decoration: none;
}
/* ==========================================================================
   WWD Hero Section Layout Overrides
   ========================================================================== */

.WWD-hero-section {
  position: relative;
  padding: 4rem 0 2rem;
  color: var(--white);
  background: var(--ink);
  overflow: hidden;
}

/* Force standard container bounds and prevent column blowout */
.WWD-hero-section .wp-block-group__inner-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

/* Two-column top layout using CSS Grid */
.WWD-hero-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr;
  gap: 3rem;
  align-items: start;
  width: 100%;
  box-sizing: border-box;
}

.WWD-hero-section .hero-title-text {
  margin: 0;
  font: 800 clamp(5rem, 10vw, 11rem)/0.72 "Barlow Semi Condensed", Impact, sans-serif;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.WWD-hero-section .hero-title-text em {
  color: var(--lime);
  font-style: normal;
}

/* Right Message Block Styling */
.hero-right-col {
  width: 100%;
}

.WWD-hero-message {
  padding-top: 1.5rem;
  border-top: 3px solid var(--orange);
}

.WWD-hero-message .hero-count,
.WWD-hero-message .hero-direction {
  font: 800 clamp(1.8rem, 2.5vw, 2.8rem)/0.95 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
  margin: 0;
}

.WWD-hero-message .hero-direction {
  margin-bottom: 1.2rem;
  color: var(--orange);
}

/* Bottom 3-Goal Navigation Bar */
.WWD-hero-goals {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
  margin-top: 4rem;
  width: 100%;
  box-sizing: border-box;
}

.WWD-hero-goals .goal-col {
  border-right: 1px solid rgba(255, 255, 255, 0.28);
  padding: 1.5rem 1.5rem 1.5rem 0;
}

.WWD-hero-goals .goal-col:last-child {
  border-right: none;
}

.WWD-hero-goals a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--white);
  text-decoration: none;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: clamp(1rem, 1.2vw, 1.25rem);
  text-transform: uppercase;
  font-weight: 800;
  line-height: 1.1;
}

.WWD-hero-goals .goal-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  background: var(--lime);
  color: var(--ink);
  border-radius: 50%;
  font-size: 1rem;
}
/* ==========================================================================
   WWD Hero Section Fixes (Teal Color, Grid Fix, and Hover Effects)
   ========================================================================== */

/* 1. Hero Background & Outer Container */
.WWD-hero-section.collection-hero {
  position: relative !important;
  background-color: #187575 !important; /* Updated to KAIROS Bright Teal */
  color: #ffffff !important;
  padding: 4rem 0 0 0 !important;
  min-height: auto !important;
  height: auto !important;
  overflow: hidden;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.WWD-hero-section .wp-block-group__inner-container {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 2rem !important;
  box-sizing: border-box !important;
}

/* 2. Top Two-Column Grid */
.wwd-hero-top-grid {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important; /* Pulls both columns to the left side */
    align-items: flex-start !important;
    gap: 4rem !important; /* This is now the EXACT distance between the two columns. Decrease to 6rem or 4rem to pull them closer. */
    width: 100% !important;
    box-sizing: border-box !important;
}

.wwd-hero-left {
    flex: 0 0 40% !important; /* Shrinks the left container so it stops pushing the right one away */
    max-width: 40% !important;
}

.wwd-hero-right {
    flex: 0 0 45% !important; /* 45% + 40% = 85%, leaving 15% of safe breathing room for the gap */
    max-width: 45% !important;
}

.WWD-hero-section .hero-title-text {
  margin: 0 !important;
  font: 800 clamp(5.5rem, 11vw, 11rem)/0.72 "Barlow Semi Condensed", Impact, sans-serif !important;
  letter-spacing: -0.06em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
}

.WWD-hero-section .hero-title-text em {
  color: #d2e030 !important; /* Lime accent */
  font-style: normal !important;
}

.WWD-hero-message {
  padding-top: 1.5rem !important;
  border-top: 3px solid #e05a2b !important; /* Orange top border */
}

.WWD-hero-message .hero-count,
.WWD-hero-message .hero-direction {
  font: 800 clamp(1.8rem, 2.5vw, 2.8rem)/0.95 "Barlow Semi Condensed", sans-serif !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.WWD-hero-message .hero-direction {
  margin-bottom: 1.2rem !important;
  color: #e05a2b !important;
}

/* 3. Bottom 3-Goal Navigation Row */
.wwd-hero-bottom-row {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  border-top: 1px solid rgba(255, 255, 255, 0.28) !important;
  margin-top: 4rem !important;
  margin-bottom: 0 !important; /* Overrides Gutenberg's default bottom block gap */
  box-sizing: border-box !important;
}

.hero-goal-card {
  flex: 1 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.28) !important;
}

.hero-goal-card:last-child {
  border-right: none !important;
}

/* 4. Goal Link Base & Hover States */
.hero-goal-link {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 1.5rem 1.5rem 1.5rem 1rem !important;
  color: #ffffff !important;
  text-decoration: none !important;
  transition: background-color 250ms ease, color 250ms ease !important;
}

.hero-goal-link .goal-text {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.1rem, 1.4vw, 1.35rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  text-transform: uppercase !important;
}

.hero-goal-link .goal-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  background-color: #d2e030 !important;
  color: #172f37 !important;
  border-radius: 50% !important;
  font-size: 1rem !important;
  transition: transform 250ms ease, background-color 250ms ease !important;
}

/* Hover Effects */
.hero-goal-link:hover {
  background-color: #e05a2b !important; /* Changes card background to orange on hover */
  color: #ffffff !important;
}

.hero-goal-link:hover .goal-arrow {
  background-color: #ffffff !important;
  color: #e05a2b !important;
  transform: translateY(3px) !important; /* Slight downward arrow shift on hover */
}
/* ==========================================================================
   WWD Hero Navigation Individual Hover Colors (Prefixed)
   ========================================================================== */

/* Base Link Styling */
.WWD-hero-goal-link {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 1.5rem 1.25rem !important;
  color: #ffffff !important;
  text-decoration: none !important;
  transition: background-color 250ms ease, color 250ms ease !important;
}

.WWD-hero-goal-link .WWD-goal-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  background-color: #d2e030 !important; /* Lime arrow default */
  color: #172f37 !important;
  border-radius: 50% !important;
  font-size: 1rem !important;
  transition: transform 250ms ease, background-color 250ms ease, color 250ms ease !important;
}

/* --------------------------------------------------------------------------
   Goal 1: Centre Reconciliation -> Purple Hover (#6a2a60)
   -------------------------------------------------------------------------- */
.WWD-hero-goal-card:nth-child(1):hover .WWD-hero-goal-link {
  background-color: #6a2a60 !important; /* Purple */
  color: #ffffff !important;
}

.WWD-hero-goal-card:nth-child(1):hover .WWD-goal-arrow {
  background-color: #ffffff !important;
  color: #6a2a60 !important;
  transform: translateY(4px) !important;
}

/* --------------------------------------------------------------------------
   Goal 2: Drive Systems Change -> Orange Hover (#e05a2b)
   -------------------------------------------------------------------------- */
.WWD-hero-goal-card:nth-child(2):hover .WWD-hero-goal-link {
  background-color: #e05a2b !important; /* Orange */
  color: #ffffff !important;
}

.WWD-hero-goal-card:nth-child(2):hover .WWD-goal-arrow {
  background-color: #ffffff !important;
  color: #e05a2b !important;
  transform: translateY(4px) !important;
}

/* --------------------------------------------------------------------------
   Goal 3: Build People Power -> Bright Teal Hover (#008080)
   -------------------------------------------------------------------------- */
.WWD-hero-goal-card:nth-child(3):hover .WWD-hero-goal-link {
  background-color: #008080 !important; /* Bright Teal */
  color: #ffffff !important;
}

.WWD-hero-goal-card:nth-child(3):hover .WWD-goal-arrow {
  background-color: #ffffff !important;
  color: #008080 !important;
  transform: translateY(4px) !important;
}


/* ==========================================================================
   KAIROS Education Page - Gutenberg Stylesheet
   ========================================================================== */

/* Full-Width Container Alignment */
.edu-collection-hero .wp-block-group__inner-container,
.edu-learning-journey .wp-block-group__inner-container,
.edu-featured-learning .wp-block-group__inner-container,
.edu-supported-learning .wp-block-group__inner-container,
.edu-education-close .wp-block-group__inner-container {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical Treatments */
.edu-eyebrow {
  margin-bottom: 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.edu-collection-hero h1,
.edu-journey-intro h2,
.edu-learning-section-heading h2,
.edu-supported-heading h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  text-transform: uppercase !important;
}

.edu-collection-hero h1 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Collection Hero */
.edu-collection-hero {
  background: var(--paper, #f7f7f2) !important;
  padding: clamp(4.5rem, 7vw, 7.5rem) 0 !important;
}
.edu-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.edu-breadcrumb {
  margin-bottom: 2rem !important;
  color: #63777d !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}
.edu-breadcrumb a {
  text-decoration-color: rgba(28, 69, 82, 0.35) !important;
}
.edu-collection-hero h1 {
  font-size: clamp(4.8rem, 8.5vw, 8.5rem) !important;
  line-height: 0.84 !important;
}
.edu-lead {
  max-width: 36rem !important;
  margin: 2rem 0 !important;
  color: #40565d !important;
  font-size: clamp(1.05rem, 1.4vw, 1.24rem) !important;
  line-height: 1.65 !important;
}
.edu-education-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.8rem !important;
  padding: 0.82rem 1.18rem !important;
  color: var(--white, #ffffff) !important;
  background: var(--teal, #1c4552) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, background 180ms ease !important;
}
.edu-education-button span {
  color: var(--lime, #e0e320) !important;
}
.edu-education-button:hover {
  background: var(--purple, #8e2288) !important;
  transform: translateY(-2px) !important;
}

/* Hero Motion Graphic Container */
.edu-learning-motion {
  position: relative !important;
  min-height: 480px !important;
  background: var(--teal, #1c4552) !important;
  border-radius: 1.5rem !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.edu-motion-ring {
  position: absolute !important;
  border: 1px solid rgba(224, 227, 32, 0.48) !important;
  border-radius: 50% !important;
}
.edu-motion-ring-one { inset: 9% 4% 8% 4% !important; }
.edu-motion-ring-two { inset: 18% 13% 17% 13% !important; border-color: rgba(255,255,255,0.2) !important; }

.edu-motion-image {
  width: 400px !important;
  height: 400px !important;
  margin: 0 !important;
  border: 8px solid var(--paper, #f7f7f2) !important;
  border-radius: 50% !important;
  overflow: hidden !important;
}
.edu-motion-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.edu-motion-word {
  position: absolute !important;
  padding: 0.6rem 1rem !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 999px !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.edu-word-learn { top: 12%; left: 8%; transform: rotate(-5deg); }
.edu-word-connect { top: 46%; right: 4%; transform: rotate(3deg); }
.edu-word-act { bottom: 10%; left: 12%; transform: rotate(4deg); }

/* 2. Learning Journey */
.edu-learning-journey {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: var(--paper, #f7f7f2) !important;
}
.edu-journey-intro h2 {
  font-size: clamp(3rem, 5vw, 4.5rem) !important;
  line-height: 0.95 !important;
}
.edu-journey-step {
  padding-bottom: 2.5rem !important;
  margin-bottom: 2.5rem !important;
  border-bottom: 1px solid rgba(28, 69, 82, 0.18) !important;
}
.edu-journey-step:last-child {
  border-bottom: none !important;
  margin-bottom: 0 !important;
}
.edu-step-verb {
  margin-bottom: 0.25rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}
.edu-journey-step h3 {
  margin: 0 0 0.5rem !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.5rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.edu-journey-step p:last-child {
  color: #54696f !important;
  margin: 0 !important;
}

/* 3. Featured Learning Grid */
.edu-featured-learning {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #e8e9df !important;
}
.edu-learning-section-heading {
  margin-bottom: 3.5rem !important;
}
.edu-learning-section-heading h2 {
  font-size: clamp(3.5rem, 6vw, 5.5rem) !important;
}
.edu-learning-feature {
  background: var(--white, #ffffff) !important;
  border-radius: 0 0 1.5rem 1.5rem !important;
  overflow: hidden !important;
  box-shadow: 0 18px 50px rgba(23, 47, 55, 0.09) !important;
}
.edu-feature-orange .edu-feature-copy { border-top: 6px solid var(--orange, #f15922) !important; }
.edu-feature-purple .edu-feature-copy { border-top: 6px solid var(--purple, #8e2288) !important; }
.edu-feature-orange .edu-feature-type { color: var(--orange, #f15922) !important; }
.edu-feature-purple .edu-feature-type { color: var(--purple, #8e2288) !important; }

.edu-feature-image img {
  width: 100% !important;
  aspect-ratio: 1.25 / 1 !important;
  object-fit: cover !important;
}
.edu-feature-copy {
  padding: 2rem !important;
}
.edu-feature-type {
  font-size: 0.75rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.5rem !important;
}
.edu-feature-copy h3 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 3.5vw, 3rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.edu-feature-link {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 1.5rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--ink, #172f37) !important;
}

/* 4. Supported Learning Initiatives */
.edu-supported-learning {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: var(--white, #ffffff) !important;
}
.edu-supported-heading .edu-eyebrow {
  color: var(--lime, #e0e320) !important;
}
.edu-supported-heading h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 6vw, 5.5rem) !important;
}
.edu-initiative-item {
  padding: 2rem 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.edu-initiative-image img {
  width: 100% !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}
.edu-initiative-label {
  color: var(--lime, #e0e320) !important;
  font-size: 0.75rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.25rem !important;
}
.edu-initiative-copy h3 {
  color: var(--white, #ffffff) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  margin: 0 0 0.5rem !important;
}
.edu-initiative-copy p:last-child {
  color: rgba(255, 255, 255, 0.75) !important;
  margin: 0 !important;
}
.edu-initiative-arrow a {
  display: grid !important;
  width: 54px !important;
  height: 54px !important;
  place-items: center !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 50% !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* 5. Closing Section */
.edu-education-close {
  padding: clamp(4rem, 7vw, 6.5rem) 0 !important;
  text-align: center !important;
}
.edu-close-line {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1rem 1.8rem !important;
  margin: 0 !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 4.5vw, 4rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.edu-close-line b {
  color: var(--purple, #8e2288) !important;
}
/* ==========================================================================
   KAIROS Blanket Exercise (KBE) Page - Gutenberg Stylesheet
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.kbe-hero .wp-block-group__inner-container,
.kbe-introduction .wp-block-group__inner-container,
.kbe-history-ribbon .wp-block-group__inner-container,
.kbe-network .wp-block-group__inner-container,
.kbe-host-field .wp-block-group__inner-container,
.kbe-close .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Accent Styles */
.kbe-section-kicker {
  margin: 0 0 0.9rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.17em !important;
  text-transform: uppercase !important;
}

.kbe-introduction h2,
.kbe-network h2,
.kbe-host-field h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3rem, 5.5vw, 5.7rem) !important;
  line-height: 0.93 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
}

.kbe-introduction h2 em,
.kbe-network h2 em,
.kbe-host-field h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. KBE Hero Section */
.kbe-hero {
  position: relative !important;
  min-height: 790px !important;
  background: var(--ink, #172f37) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
}
.kbe-hero .kbe-hero-bg-img {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.kbe-hero .kbe-hero-bg-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.kbe-hero .kbe-hero-bg-img::after {
  position: absolute !important;
  inset: 0 !important;
  content: "" !important;
  background: linear-gradient(90deg, rgba(23,47,55,0.82) 0%, rgba(23,47,55,0.26) 58%, rgba(23,47,55,0.08) 100%) !important;
}
.kbe-title-card {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  width: min(670px, 58vw) !important;
  color: var(--white, #ffffff) !important;
}
.kbe-title-card .kbe-eyebrow {
  color: var(--lime, #e0e320) !important;
}
.kbe-title-card h1#page-title {
  margin: 0 !important;
  color: var(--white, #ffffff) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-size: clamp(4.5rem, 9vw, 9.5rem) !important;
  font-weight: 800 !important;
  line-height: 0.76 !important;
  letter-spacing: -0.055em !important;
  text-transform: uppercase !important;
}
.kbe-hero-route-wrap {
  position: absolute !important;
  z-index: 3 !important;
  right: 2rem !important;
  bottom: 2.5rem !important;
  margin: 0 !important;
}
.kbe-hero-route {
  display: inline-flex !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: 0.9rem 1.2rem !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* 2. KBE Introduction */
.kbe-introduction {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #f8f3e8 !important;
}
.kbe-intro-copy p {
  margin: 0 0 1.45rem !important;
  color: #455d65 !important;
  font-size: 1.1rem !important;
  line-height: 1.85 !important;
}
.kbe-intro-lead {
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.65rem, 2.7vw, 2.45rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

/* 3. History Ribbon */
.kbe-history-ribbon {
  padding: clamp(3.5rem, 6vw, 5.5rem) 0 !important;
  background: var(--orange, #f15922) !important;
  color: var(--white, #ffffff) !important;
}
.kbe-history-ribbon .kbe-section-kicker {
  color: var(--ink, #172f37) !important;
}
.kbe-history-timeline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1.4rem !important;
  margin: 0 !important;
}
.kbe-history-timeline span {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2.15rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  text-align: center !important;
}
.kbe-history-timeline i {
  flex: 1 1 30px !important;
  height: 2px !important;
  background: rgba(255, 255, 255, 0.58) !important;
}

/* 4. Network Section */
.kbe-network {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #f8f3e8 !important;
}
.kbe-network-image img {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  box-shadow: 24px 24px 0 var(--lime, #e0e320) !important;
}
.kbe-image-caption {
  margin-top: 2rem !important;
  color: #536a71 !important;
  font-size: 0.92rem !important;
}
.kbe-network-intro {
  margin-bottom: 3.5rem !important;
  color: #455d65 !important;
  font-size: 1.1rem !important;
  line-height: 1.8 !important;
}
.kbe-pathway-block {
  padding: 2.5rem 0 !important;
  border-top: 1px solid rgba(28, 69, 82, 0.24) !important;
}
.kbe-pathway-block:last-child {
  border-bottom: 1px solid rgba(28, 69, 82, 0.24) !important;
}
.kbe-pathway-block h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 3.5vw, 3.2rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.kbe-pathway-block p {
  color: #455d65 !important;
  font-size: 1.04rem !important;
  line-height: 1.8 !important;
}
.kbe-pathway-link {
  display: inline-flex !important;
  gap: 0.8rem !important;
  padding-bottom: 0.25rem !important;
  color: var(--teal, #1c4552) !important;
  border-bottom: 3px solid var(--orange, #f15922) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
.kbe-pathway-link:hover {
  color: var(--purple, #8e2288) !important;
}

/* 5. Host Section */
.kbe-host-field {
  padding: clamp(6rem, 10vw, 9rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: var(--white, #ffffff) !important;
}
.kbe-host-field .kbe-eyebrow {
  color: var(--lime, #e0e320) !important;
}
.kbe-host-field h2 {
  color: var(--white, #ffffff) !important;
}
.kbe-host-field h2 em {
  color: var(--lime, #e0e320) !important;
}
.kbe-host-copy p:last-child {
  max-width: 670px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 1.08rem !important;
}
.kbe-host-action-col {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}
.kbe-action-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 2rem !important;
  padding: 1rem 1.35rem !important;
  border-radius: 999px !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, background 180ms ease !important;
}
.kbe-action-button:hover {
  background: var(--white, #ffffff) !important;
  transform: translateY(-2px) !important;
}

/* 6. Closing Ribbon */
.kbe-close {
  background: var(--lime, #e0e320) !important;
  color: var(--ink, #172f37) !important;
  padding: 2.5rem 0 !important;
}
.kbe-close .wp-block-group__inner-container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 3rem !important;
}
.kbe-close p {
  margin: 0 !important;
  font-weight: 700 !important;
}
.kbe-close-link {
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--ink, #172f37) !important;
}

/* Responsive Overrides */
@media (max-width: 760px) {
  .kbe-hero-route-wrap {
    position: static !important;
    margin-top: 2rem !important;
  }
  .kbe-title-card {
    width: 100% !important;
  }
  .kbe-history-timeline {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .kbe-history-timeline i {
    width: 2px !important;
    height: 24px !important;
    margin-left: 0.5rem !important;
  }
  .kbe-host-action-col {
    justify-content: flex-start !important;
    margin-top: 2rem !important;
  }
  .kbe-close .wp-block-group__inner-container {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 1.5rem !important;
  }
}
/* ==========================================================================
   Women Peacebuilders Page - Gutenberg Stylesheet (wpb-)
   ========================================================================== */

/* Full-Width Inner Container Alignment */
.wpb-hero .wp-block-group__inner-container,
.wpb-reading-shell .wp-block-group__inner-container,
.wpb-change-field .wp-block-group__inner-container,
.wpb-learn-field .wp-block-group__inner-container,
.wpb-program-action .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Global Typography & Section Headers */
.wpb-section-kicker {
  margin: 0 0 0.9rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.17em !important;
  text-transform: uppercase !important;
}

.wpb-read-section h2,
.wpb-partner-section h2,
.wpb-learn-heading h2,
.wpb-program-action h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3rem, 5.5vw, 5.7rem) !important;
  line-height: 0.93 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
}

.wpb-read-section h2 em,
.wpb-partner-section h2 em,
.wpb-learn-heading h2 em,
.wpb-program-action h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Hero Section */
.wpb-hero {
  position: relative !important;
  min-height: 700px !important;
  background: var(--purple, #8e2288) !important;
  color: var(--white, #ffffff) !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 6rem !important;
  overflow: hidden !important;
}
.wpb-hero .wpb-breadcrumb {
  display: flex !important;
  gap: 0.6rem !important;
  margin: 0 0 2rem !important;
  color: inherit !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
.wpb-hero .wpb-eyebrow {
  color: var(--lime, #e0e320) !important;
}
.wpb-hero h1#page-title {
  margin: 0 !important;
  color: var(--white, #ffffff) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-size: clamp(5rem, 9.4vw, 10rem) !important;
  font-weight: 800 !important;
  line-height: 0.78 !important;
  letter-spacing: -0.055em !important;
  text-transform: uppercase !important;
}
.wpb-deck {
  max-width: 39rem !important;
  margin: 2rem 0 0 !important;
  color: rgba(255, 255, 255, 0.87) !important;
  font-size: clamp(1.08rem, 1.5vw, 1.3rem) !important;
  line-height: 1.62 !important;
}
.wpb-hero-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.wpb-hero-image figcaption {
  margin-top: 0.5rem !important;
  color: var(--white, #ffffff) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}

/* Nexus Strip Bar */
.wpb-nexus-strip {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(0.7rem, 3vw, 2.5rem) !important;
  margin: 3rem 0 0 !important;
  padding: 1.15rem 2rem !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2.2rem) !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
}
.wpb-nexus-strip i {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 2. Reading Shell & Sticky Navigation */
.wpb-reading-shell {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #fbfbf7 !important;
}
.wpb-contents {
  position: sticky !important;
  top: 120px !important;
  padding: 1.2rem 0 !important;
  border-top: 5px solid var(--lime, #e0e320) !important;
  border-bottom: 1px solid rgba(28, 69, 82, 0.18) !important;
}
.wpb-contents-title {
  margin: 0 0 0.9rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.wpb-contents p a {
  display: block !important;
  padding: 0.35rem 0 !important;
  color: #536a71 !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.wpb-contents p a:hover {
  color: var(--purple, #8e2288) !important;
}

/* Long Read Lead Text & Main Column */
.wpb-article-lead {
  padding-bottom: 3.5rem !important;
}
.wpb-article-lead p, 
.wpb-read-section p {
  color: #455d65 !important;
  font-size: 1.08rem !important;
  line-height: 1.8 !important;
}
.wpb-opening-line {
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.75rem, 3vw, 2.6rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
.wpb-read-section {
  padding: 3.5rem 0 !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

/* Partners Section Ledger */
.wpb-partner-section {
  padding-top: 3.5rem !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}
.wpb-partner-ledger {
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}
.wpb-partner-item {
  display: grid !important;
  grid-template-columns: 100px minmax(200px, 0.8fr) 1fr !important;
  gap: 1.5rem !important;
  align-items: baseline !important;
  padding: 1.55rem 0 !important;
  border-bottom: 1px solid rgba(28, 69, 82, 0.18) !important;
}
.wpb-partner-country {
  color: var(--purple, #8e2288) !important;
  font-size: 0.73rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}
.wpb-partner-item h3 {
  margin: 0 !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.wpb-partner-item p:last-child {
  margin: 0 !important;
  color: #536a71 !important;
}

/* 3. Theory of Change Section */
.wpb-change-field {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: var(--white, #ffffff) !important;
}
.wpb-change-statement .wpb-section-kicker {
  color: var(--lime, #e0e320) !important;
}
.wpb-change-lead {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3.2vw, 3.2rem) !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  margin: 0 !important;
}
.wpb-outcome-lines {
  border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.wpb-outcome-item {
  padding: 2.1rem 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.wpb-outcome-title {
  color: var(--lime, #e0e320) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.7rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}
.wpb-outcome-item p:last-child {
  margin: 0.75rem 0 0 !important;
  color: rgba(255, 255, 255, 0.76) !important;
  max-width: 38rem !important;
}

/* 4. Learn Field & Video Component */
.wpb-learn-field {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #edf0e8 !important;
}
.wpb-video-frame iframe {
  width: 100 !important;
  aspect-ratio: 16 / 9 !important;
  border: none !important;
  display: block !important;
}
.wpb-resource-card {
  background: var(--white, #ffffff) !important;
  border-bottom: 7px solid var(--purple, #8e2288) !important;
  overflow: hidden !important;
  box-shadow: 0 18px 50px rgba(23, 47, 55, 0.08) !important;
}
.wpb-resource-card img {
  width: 100% !important;
  aspect-ratio: 2 / 1 !important;
  object-fit: cover !important;
}
.wpb-resource-card-body {
  padding: 1.6rem !important;
}
.wpb-resource-tag {
  color: var(--purple, #8e2288) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.5rem !important;
}
.wpb-resource-card-body h3 {
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.65rem, 2.4vw, 2.35rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  margin: 0 0 1rem !important;
}
.wpb-resource-link {
  display: flex !important;
  justify-content: space-between !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--ink, #172f37) !important;
}

/* Quote Block */
.wpb-quote {
  margin-top: clamp(4rem, 7vw, 7rem) !important;
  padding-left: 2.3rem !important;
  border-left: 8px solid var(--lime, #e0e320) !important;
}
.wpb-quote-text {
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3.2vw, 3rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
.wpb-quote-cite {
  margin-top: 1.5rem !important;
  color: #536a71 !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
}

/* 5. Program Action CTA */
.wpb-wp-action {
  padding: clamp(5rem, 8vw, 8rem) 0 !important;
  background: var(--purple, #8e2288) !important;
  color: var(--white, #ffffff) !important;
}
.wpb-wp-action .wpb-eyebrow {
  color: var(--lime, #e0e320) !important;
}
.wpb-wp-action h2 {
  color: var(--white, #ffffff) !important;
}
.wpb-wp-action h2 em {
  color: var(--lime, #e0e320) !important;
}
.wpb-action-copy p:last-child {
  color: rgba(255, 255, 255, 0.8) !important;
  max-width: 620px !important;
}
.wpb-action-col {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}
.wpb-action-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 2rem !important;
  padding: 1rem 1.35rem !important;
  border-radius: 999px !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, background 180ms ease !important;
}
.wpb-action-button:hover {
  background: var(--white, #ffffff) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Structural Overrides */
@media (max-width: 768px) {
  .wpb-partner-item {
    grid-template-columns: 1fr !important;
    gap: 0.4rem !important;
  }
  .wpb-contents {
    position: static !important;
    margin-bottom: 3rem !important;
  }
  .wpb-action-col {
    justify-content: flex-start !important;
    margin-top: 2rem !important;
  }
}
/* ==========================================================================
   For the Love of Creation (FLC) Page - Gutenberg Stylesheet (flc-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.flc-collection-hero .wp-block-group__inner-container,
.flc-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Accent Styles */
.flc-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--page-accent, #1C4552) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.flc-collection-hero h1#page-title,
.flc-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.flc-collection-hero h1#page-title {
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.flc-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.flc-collection-hero h1#page-title em,
.flc-section-intro h2 em {
  color: var(--page-accent, #6a712d) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section - Updated Hero Paragraph Color */
.flc-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: var(--page-wash, #eef0d8) !important;
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.flc-collection-hero-copy p:not(.flc-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: #172f37 !important; /* Solid Dark Grey / Dark Ink */
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.flc-collection-hero-art img {
  width: 70% !important;
  height: 70% !important;
  min-height: 280px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

/* 2. Main Page Section */
.flc-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.flc-section-intro {
  margin-bottom: clamp(3rem, 7vw, 5rem) !important;
}

.flc-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Info Card Grid */
.flc-card-grid {
  gap: 1.25rem !important;
  margin-bottom: 3rem !important;
}

.flc-info-card {
  position: relative !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-top: 6px solid var(--page-accent, #6a712d) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
}

.flc-info-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.flc-info-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

/* 4. Action Buttons */
.flc-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.flc-action-button,
.flc-secondary-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.flc-action-button {
  color: var(--white, #ffffff) !important;
  background: var(--page-accent, #6a712d) !important;
  border: none !important;
}

.flc-secondary-button {
  color: var(--teal, #1c4552) !important;
  background: transparent !important;
  border: 1px solid currentColor !important;
}

.flc-action-button:hover,
.flc-secondary-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .flc-collection-hero-art {
    margin-top: 2rem !important;
  }
  .flc-card-grid {
    grid-template-columns: 1fr !important;
  }
  .flc-button-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
/* ==========================================================================
   Fossil Fuel Treaty Initiative (FFT) Page - Gutenberg Stylesheet (fft-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.fft-collection-hero .wp-block-group__inner-container,
.fft-page-section .wp-block-group__inner-container,
.fft-feature-strip .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Orange Theme Vars */
.fft-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--orange, #f15922) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.fft-collection-hero h1#page-title,
.fft-section-intro h2,
.fft-feature-strip h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.fft-collection-hero h1#page-title {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.fft-section-intro h2 {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.fft-feature-strip h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 7vw, 7rem) !important;
  line-height: 0.9 !important;
}

.fft-collection-hero h1#page-title em,
.fft-section-intro h2 em {
  color: var(--orange, #f15922) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Orange Tone) */
.fft-collection-hero {
  position: relative !important;
  padding: clamp(2.5rem, 4vw, 4rem) 0 !important;
  background: #7c2f16 !important;
  color: var(--white, #ffffff) !important;
  overflow: hidden !important;
}

.fft-collection-hero .fft-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.fft-collection-hero-copy p:not(.fft-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: #ffffff !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.fft-collection-hero-art img {
  margin: 50px auto;
  width: 70% !important;
  height: 70% !important;
  min-height: 280px !important;
  object-fit: cover !important;
  border-radius: 1.5rem !important;
}

/* 2. Main Page Section */
.fft-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.fft-section-intro {
  margin-bottom: clamp(1rem, 3vw, 2rem) !important;
}

.fft-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Info Card Grid */
.fft-card-grid {
  gap: 1.25rem !important;
  margin-bottom: 3rem !important;
}

.fft-info-card {
  position: relative !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-top: 6px solid var(--orange, #f15922) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
}

.fft-info-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.fft-info-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

/* 4. Feature Strip & Principle List */
.fft-feature-strip {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #7c2f16 !important;
  color: var(--white, #ffffff) !important;
}

.fft-feature-strip .fft-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.fft-principle-list {
  display: grid !important;
  gap: 0 !important;
  margin: 0 0 2rem !important;
  padding: 0 !important;
  list-style: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.fft-principle-list li {
  display: grid !important;
  grid-template-columns: minmax(10rem, 0.55fr) 1fr !important;
  gap: 2rem !important;
  padding: 1.25rem 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.fft-principle-list strong {
  color: var(--lime, #e0e320) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 1.35rem !important;
  text-transform: uppercase !important;
}

.fft-principle-list span {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 1.1rem !important;
}

/* 5. Action Button */
.fft-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.fft-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--white, #ffffff) !important;
  background: var(--orange, #f15922) !important;
  border: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.fft-action-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .fft-collection-hero-art {
    margin-top: 2rem !important;
  }
  .fft-card-grid {
    grid-template-columns: 1fr !important;
  }
  .fft-principle-list li {
    grid-template-columns: 1fr !important;
    gap: 0.3rem !important;
  }
}
/* ==========================================================================
   Relationship Building Page - Gutenberg Stylesheet (rlb-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.rlb-relationship-hero .wp-block-group__inner-container,
.rlb-relationship-intro .wp-block-group__inner-container,
.rlb-relationship-continuum .wp-block-group__inner-container,
.rlb-relationship-pathways .wp-block-group__inner-container,
.rlb-strategy-links .wp-block-group__inner-container,
.rlb-relationship-close .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules */
.rlb-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--teal-bright, #187575) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.rlb-relationship-hero h1#page-title,
.rlb-relationship-intro h2,
.rlb-pathways-heading h2,
.rlb-strategy-heading h2,
.rlb-relationship-close h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  text-transform: uppercase !important;
}

.rlb-relationship-hero h1#page-title {
  font-size: clamp(4rem, 7.5vw, 7.5rem) !important;
  line-height: 0.78 !important;
}

.rlb-relationship-intro h2,
.rlb-pathways-heading h2,
.rlb-strategy-heading h2,
.rlb-relationship-close h2 {
  font-size: clamp(3.5rem, 6.5vw, 6.5rem) !important;
  line-height: 0.87 !important;
}

.rlb-relationship-hero h1#page-title em,
.rlb-relationship-intro h2 em,
.rlb-pathways-heading h2 em,
.rlb-relationship-close h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Hero Section */
.rlb-relationship-hero {
  position: relative !important;
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: #f3f0ec !important;
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.rlb-breadcrumb {
  margin: 0 0 2rem !important;
  color: #64767a !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.rlb-breadcrumb a {
  color: var(--purple, #8e2288) !important;
  text-decoration: none !important;
}

.rlb-hero-copy p:not(.rlb-eyebrow) {
  max-width: 560px !important;
  margin: 1.5rem 0 0 !important;
  color: #4f666d !important;
  font-size: clamp(1.2rem, 1.8vw, 1.5rem) !important;
  line-height: 1.45 !important;
}

.rlb-hero-values {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 0.5rem !important;
  margin: 0 !important;
}

.rlb-hero-values span {
  padding: 0.45rem 0.85rem !important;
  color: var(--white, #ffffff) !important;
  background: var(--teal, #1c4552) !important;
  border-radius: 999px !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.rlb-hero-values span:nth-child(2) {
  background: var(--purple, #8e2288) !important;
}

.rlb-hero-values span:nth-child(3) {
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
}

/* 2. Intro Section */
.rlb-relationship-intro {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--white, #ffffff) !important;
}

.rlb-intro-heading .rlb-eyebrow {
  color: var(--orange, #f15922) !important;
}

.rlb-intro-copy .rlb-lead {
  color: var(--ink, #172f37) !important;
  font-size: clamp(1.35rem, 2.1vw, 1.8rem) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.rlb-intro-copy p {
  color: #566c72 !important;
  font-size: 1.08rem !important;
  line-height: 1.75 !important;
}

/* 3. Continuum Section */
.rlb-relationship-continuum {
  padding: 4rem 0 6rem !important;
  background: var(--white, #ffffff) !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

.rlb-continuum-point {
  position: relative !important;
  padding: 0 1rem !important;
}

.rlb-continuum-point h3 {
  margin: 0 0 0.5rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.6rem, 2.5vw, 2.4rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.rlb-continuum-point p {
  margin: 0 !important;
  color: #607278 !important;
  font-size: 1rem !important;
}

/* 4. Pathways Section */
.rlb-relationship-pathways {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: var(--white, #ffffff) !important;
}

.rlb-pathways-heading {
  margin-bottom: 3.5rem !important;
}

.rlb-pathways-heading h2 {
  color: var(--white, #ffffff) !important;
}

.rlb-pathways-heading .rlb-eyebrow,
.rlb-pathways-heading h2 em {
  color: var(--lime, #e0e320) !important;
}

.rlb-pathway-grid {
  display: grid !important;
  gap: 1.25rem !important;
}

.rlb-pathway-card {
  padding: 2rem !important;
  background: var(--white, #ffffff) !important;
  border-radius: 1.2rem !important;
  color: var(--ink, #172f37) !important;
}

.rlb-pathway-card img {
  width: 150px !important;
  height: auto !important;
}

.rlb-pathway-card .rlb-eyebrow {
  color: var(--teal-bright, #187575) !important;
}

.rlb-solidarity-card .rlb-eyebrow {
  color: var(--orange, #f15922) !important;
}

.rlb-kbe-card .rlb-eyebrow {
  color: var(--purple, #8e2288) !important;
}

.rlb-pathway-card h3 {
  margin: 0 0 0.5rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 3.5vw, 3.5rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.rlb-pathway-card p:not(.rlb-eyebrow) {
  color: #586d73 !important;
  font-size: 1.05rem !important;
  margin-bottom: 1.5rem !important;
}

.rlb-pathway-link {
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--teal, #1c4552) !important;
}

.rlb-pathway-link b {
  color: var(--orange, #f15922) !important;
}

/* 5. Strategy Links Section (Goal Cards) */
.rlb-strategy-links {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--paper, #f7f7f2) !important;
}

.rlb-strategy-heading .rlb-eyebrow {
  color: var(--purple, #8e2288) !important;
}

.rlb-goal-list {
  border-top: 1px solid rgba(28, 69, 82, 0.25) !important;
}

.rlb-goal {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 58px !important;
  gap: 1.5rem !important;
  align-items: center !important;
  padding: 2rem 1rem !important;
  border-bottom: 1px solid rgba(28, 69, 82, 0.25) !important;
}

.rlb-goal-tag {
  grid-column: 1 / -1 !important;
  margin: 0 0 0.25rem !important;
  color: var(--teal-bright, #187575) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

.rlb-goal-systems .rlb-goal-tag {
  color: var(--orange, #f15922) !important;
}

.rlb-goal-power .rlb-goal-tag {
  color: var(--purple, #8e2288) !important;
}

.rlb-goal h3 {
  margin: 0 !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 3.8vw, 3.8rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.rlb-goal h3 a {
  color: ffffff;
  text-decoration: none !important;
}

.rlb-goal:hover {
    background-color:#8E2288;
    color: #ffffff;
}

.rlb-goal:hover h3 a {
    color: #ffffff;
}

.rlb-goal-arrow a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background-color: var(--lime, #e0e320) !important;
  color: var(--ink, #172f37) !important;
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* 6. Close CTA Section */
.rlb-relationship-close {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--purple, #8e2288) !important;
  color: var(--white, #ffffff) !important;
}

.rlb-relationship-close .rlb-eyebrow,
.rlb-relationship-close h2 em {
  color: var(--lime, #e0e320) !important;
}

.rlb-relationship-close h2 {
  color: var(--white, #ffffff) !important;
}

.rlb-close-action-col {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

.rlb-close-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.8rem !important;
  padding: 1rem 1.4rem !important;
  border-radius: 999px !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, background 180ms ease !important;
}

.rlb-close-link:hover {
  background: var(--white, #ffffff) !important;
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   RELATIONSHIP-BUILDING (RLB): PATHWAY COLUMN HOVER STATE
   ========================================================================== */

/* Base Column Setup */
.rlb-pathway-img-col {
    background-color: #f7f7f2 !important; /* Soft Paper Wash base */
    transition: background-color 250ms ease, transform 250ms ease !important;
    cursor: pointer !important;
}

/* Mouseover / Hover State */
.rlb-pathway-img-col:hover {
    background-color: #e0e320 !important; /* KAIROS Lime Yellow on hover */
    transform: translateY(-4px) !important; /* Subtle lift effect */
}

/* Responsive Structural Overrides */
@media (max-width: 768px) {
  .rlb-hero-values {
    align-items: flex-start !important;
    margin-top: 2rem !important;
  }
  .rlb-continuum-grid {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
  .rlb-close-action-col {
    justify-content: flex-start !important;
    margin-top: 2rem !important;
  }
}
/* ==========================================================================
   The KAIROS Network (KNW) Page - Gutenberg Stylesheet (knw-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.knw-collection-hero .wp-block-group__inner-container,
.knw-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules */
.knw-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.knw-collection-hero h1#page-title,
.knw-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.knw-collection-hero h1#page-title {
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.knw-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.knw-collection-hero h1#page-title em,
.knw-section-intro h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Hero Section (Tone Paper Theme) */
.knw-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: #f4efd9 !important; /* --page-wash for tone-paper */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.knw-collection-hero-copy p:not(.knw-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.knw-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.knw-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid var(--teal, #1c4552) !important;
  border-radius: 48% 52% 50% 50% !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Main Page Section */
.knw-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.knw-section-intro {
  margin-bottom: clamp(2.5rem, 5vw, 4rem) !important;
}

.knw-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Region Map Strip */
.knw-region-map {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0.7rem !important;
  margin: 2.5rem 0 4rem !important;
}

.knw-region-map span {
  display: grid !important;
  min-height: 9rem !important;
  place-items: end start !important;
  padding: 1.2rem !important;
  color: var(--white, #ffffff) !important;
  background: #253d43 !important; /* --page-deep for tone-paper */
  border-radius: 7rem 7rem 1rem 1rem !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.knw-region-map span:nth-child(even) {
  color: var(--ink, #172f37) !important;
  background: #f4efd9 !important; /* --page-wash */
}

/* 4. Info Card Grid */
.knw-card-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  margin-bottom: 3rem !important;
}

.knw-info-card {
  position: relative !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-top: 6px solid var(--purple, #8e2288) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
}

.knw-info-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.knw-info-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

/* 5. Action Buttons */
.knw-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.knw-action-button,
.knw-secondary-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.knw-action-button {
  color: var(--white, #ffffff) !important;
  background: var(--purple, #8e2288) !important;
  border: none !important;
}

.knw-secondary-button {
  color: var(--teal, #1c4552) !important;
  background: transparent !important;
  border: 1px solid currentColor !important;
}

.knw-action-button:hover,
.knw-secondary-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 1000px) {
  .knw-region-map {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .knw-region-map {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .knw-card-grid {
    grid-template-columns: 1fr !important;
  }
  .knw-button-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

@media (max-width: 480px) {
  .knw-region-map {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   Global Solidarity (GSO) Page - Gutenberg Stylesheet (gso-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.gso-collection-hero .wp-block-group__inner-container,
.gso-page-section .wp-block-group__inner-container,
.gso-feature-strip .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules (Tone Purple Theme) */
.gso-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.gso-collection-hero h1#page-title,
.gso-section-intro h2,
.gso-feature-strip h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.gso-collection-hero h1#page-title {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.gso-section-intro h2 {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.gso-feature-strip h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 7vw, 7rem) !important;
  line-height: 0.9 !important;
}

.gso-collection-hero h1#page-title em,
.gso-section-intro h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Purple Tone) */
.gso-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: #54204f !important; /* --page-deep for tone-purple */
  color: var(--white, #ffffff) !important;
  overflow: hidden !important;
}

.gso-collection-hero .gso-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.gso-collection-hero-copy p:not(.gso-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.gso-collection-hero-art img {
  width: 100% !important;
  height: 100% !important;
  min-height: 380px !important;
  object-fit: cover !important;
  border-radius: 1.5rem !important;
}

/* 2. Main Page Section */
.gso-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.gso-section-intro {
  margin-bottom: clamp(3rem, 7vw, 5rem) !important;
}

.gso-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Path Card Grid */
.gso-path-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  margin-bottom: 2rem !important;
}

.gso-path-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
  transition: transform 200ms ease, border-color 200ms ease !important;
}

.gso-path-card::before {
  content: "" !important;
  width: 3.2rem !important;
  height: 0.35rem !important;
  margin-bottom: 2rem !important;
  background: var(--purple, #8e2288) !important;
}

.gso-path-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.gso-path-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

.gso-path-link-wrap {
  margin-top: auto !important;
  padding-top: 2rem !important;
}

.gso-path-link {
  color: var(--purple, #8e2288) !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.gso-path-card:hover {
  border-color: var(--purple, #8e2288) !important;
  transform: translateY(-4px) !important;
}

/* 4. Feature Strip & Name Cloud */
.gso-feature-strip {
  padding: clamp(2rem, 4vw, 4rem) 0 !important;
  background: #54204f !important; /* --page-deep */
  color: var(--white, #ffffff) !important;
}

.gso-feature-strip .gso-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.gso-name-cloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  margin: 0 !important;
}

.gso-name-cloud span {
  padding: 0.8rem 1rem !important;
  color: var(--ink, #172f37) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
}

/* Responsive Overrides */
@media (max-width: 1000px) {
  .gso-path-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .gso-collection-hero-art {
    margin-top: 2rem !important;
  }
  .gso-path-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   Advocacy Page - Gutenberg Stylesheet (adv-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.adv-hero .wp-block-group__inner-container,
.adv-advocacy-methods .wp-block-group__inner-container,
.adv-action-matters .wp-block-group__inner-container,
.adv-campaign-feature .wp-block-group__inner-container,
.adv-advocacy-close .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules */
.adv-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--ink, #172f37) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.adv-hero h1#page-title,
.adv-methods-heading h2,
.adv-action-heading h2,
.adv-campaign-copy h2,
.adv-advocacy-close h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  text-transform: uppercase !important;
}

.adv-hero h1#page-title {
  color: #ffffff !important;
  font-size: clamp(7.2rem, 17vw, 17rem) !important;
  line-height: 0.72 !important;
  letter-spacing: -0.06em !important;
}

.adv-methods-heading h2,
.adv-action-heading h2,
.adv-campaign-copy h2,
.adv-advocacy-close h2 {
  font-size: clamp(4.2rem, 7.8vw, 8rem) !important;
  line-height: 0.86 !important;
}

.adv-methods-heading h2 em,
.adv-action-heading h2 em,
.adv-campaign-copy h2 em,
.adv-advocacy-close h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

.adv-sub-head h1 {
  font-size: clamp(3rem, 3vw, 3rem) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.06em !important;
}

/* 1. Hero Section (Orange Theme) */
.adv-hero {
  position: relative !important;
  padding: clamp(1rem, 1vw, 1rem) 0 !important;
  background: var(--orange, #f15922) !important;
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.adv-breadcrumb {
  margin: 0 0 2rem !important;
  color: rgba(23, 47, 55, 0.72) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.adv-breadcrumb a {
  text-decoration: none !important;
  color: inherit !important;
}

.adv-hero-copy {
  margin-top: clamp(4rem, 8vw, 7rem) !important;
}

.adv-hero-lead {
  max-width: 570px !important;
  margin: 2rem 0 0 !important;
  font-size: clamp(1.45rem, 2.4vw, 2.1rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.adv-hero-action-words {
  display: flex !important;
  gap: 0.8rem !important;
  align-items: center !important;
  margin-top: 3rem !important;
  color: rgba(23, 47, 55, 0.72) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 2rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.adv-hero-action-words b {
  color: var(--lime, #e0e320) !important;
  font-size: 1.3rem !important;
}

.adv-hero-jump {
  display: inline-flex !important;
  gap: 0.8rem !important;
  margin-top: 2rem !important;
  padding-bottom: 0.25rem !important;
  border-bottom: 2px solid var(--ink, #172f37) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--ink, #172f37) !important;
}

/* 2. Methods Section */
.adv-advocacy-methods {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #ffffff !important;
}

.adv-methods-heading {
  margin-bottom: 5rem !important;
}

.adv-methods-heading .adv-eyebrow {
  color: var(--purple, #8e2288) !important;
}

.adv-method {
  align-items: center !important;
  margin-bottom: clamp(6rem, 10vw, 10rem) !important;
}

.adv-method:last-child {
  margin-bottom: 0 !important;
}

.adv-method-image img {
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  border-radius: 1.5rem !important;
  box-shadow: 0 20px 55px rgba(23, 47, 55, 0.12) !important;
}

.adv-educate-method .adv-eyebrow { color: var(--teal-bright, #187575) !important; }
.adv-mobilize-method .adv-eyebrow { color: var(--orange, #f15922) !important; }
.adv-influence-method .adv-eyebrow { color: var(--purple, #8e2288) !important; }

.adv-method-copy-col h3 {
  margin: 0 0 1.5rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(3rem, 5.5vw, 5.7rem) !important;
  font-weight: 800 !important;
  line-height: 0.88 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
}

.adv-method-copy-col p:last-child {
  max-width: 520px !important;
  color: #566c72 !important;
  font-size: 1.12rem !important;
  line-height: 1.65 !important;
}

/* 3. Action Matters Section (Purple Theme) */
.adv-action-matters {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--purple, #8e2288) !important;
  color: #ffffff !important;
}

.adv-action-heading .adv-eyebrow,
.adv-action-heading h2 em {
  color: var(--lime, #e0e320) !important;
}

.adv-action-heading h2 {
  color: #ffffff !important;
}

.adv-action-verbs {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 1.2rem !important;
  margin: 3.5rem 0 2rem !important;
  padding: 1.6rem 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.35) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35) !important;
}

.adv-action-verbs span {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.4rem, 2.6vw, 2.5rem) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.adv-action-verbs i {
  display: inline-block !important;
  width: 0.55rem !important;
  height: 0.55rem !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 50% !important;
}

.adv-action-copy {
  max-width: 660px !important;
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 1.18rem !important;
  margin-bottom: 2rem !important;
}

.adv-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: 0.95rem 1.25rem !important;
  border-radius: 999px !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

/* 4. Campaign Feature Section */
.adv-campaign-feature {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #edf0e9 !important;
}

.adv-campaign-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 1.5rem !important;
}

.adv-campaign-copy .adv-eyebrow,
.adv-campaign-copy h2 em {
  color: var(--orange, #f15922) !important;
}

.adv-campaign-copy p:not(.adv-eyebrow) {
  max-width: 570px !important;
  margin: 1.5rem 0 !important;
  color: #536a70 !important;
  font-size: 1.1rem !important;
  line-height: 1.65 !important;
}

.adv-campaign-link {
  display: inline-flex !important;
  gap: 0.8rem !important;
  padding-bottom: 0.35rem !important;
  border-bottom: 3px solid var(--orange, #f15922) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--ink, #172f37) !important;
}

/* 5. Closing Section */
.adv-advocacy-close {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--ink, #172f37) !important;
  color: #ffffff !important;
}

.adv-advocacy-close .adv-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.adv-advocacy-close h2 {
  color: #ffffff !important;
}

.adv-advocacy-close h2 em {
  color: var(--orange, #f15922) !important;
}

.adv-close-links {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 1rem !important;
}

.adv-btn-primary,
.adv-btn-secondary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: 0.95rem 1.25rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.adv-btn-primary {
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
}

.adv-btn-secondary {
  color: #ffffff !important;
  border: 2px solid rgba(255, 255, 255, 0.75) !important;
}

/* Responsive Structural Overrides */
@media (max-width: 920px) {
  .adv-close-links {
    align-items: flex-start !important;
    margin-top: 2rem !important;
  }
}

@media (max-width: 768px) {
  .adv-action-verbs i {
    display: none !important;
  }
  .adv-action-verbs {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
/* ==========================================================================
   Turn Debt into Hope Page - Gutenberg Stylesheet (tdh-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.tdh-debt-hero .wp-block-group__inner-container,
.tdh-campaign-score .wp-block-group__inner-container,
.tdh-debt-stakes .wp-block-group__inner-container,
.tdh-campaign-call .wp-block-group__inner-container,
.tdh-canada-asks .wp-block-group__inner-container,
.tdh-canada-movement .wp-block-group__inner-container,
.tdh-jubilee .wp-block-group__inner-container,
.tdh-global-cta .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules */
.tdh-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.tdh-debt-hero h1#page-title,
.tdh-stakes-heading h2,
.tdh-call-intro h2,
.tdh-asks-heading h2,
.tdh-movement-copy h2,
.tdh-jubilee-copy h2,
.tdh-cta-copy-col h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  line-height: 0.86 !important;
  text-transform: uppercase !important;
}

.tdh-debt-hero h1#page-title {
  color: #ffffff !important;
  font-size: clamp(5.5rem, 11vw, 11.5rem) !important;
  max-width: 940px !important;
}

.tdh-debt-hero h1#page-title em {
  color: var(--lime, #e0e320) !important;
  font-style: normal !important;
}

.tdh-stakes-heading h2,
.tdh-call-intro h2,
.tdh-asks-heading h2,
.tdh-movement-copy h2,
.tdh-jubilee-copy h2,
.tdh-cta-copy-col h2 {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(4rem, 7vw, 7.2rem) !important;
}

/* 1. Hero Section */
.tdh-debt-hero {
  position: relative !important;
  padding: clamp(1rem, 2vw, 2rem) 0 6rem !important;
  background: var(--ink, #172f37) !important;
  color: #ffffff !important;
  overflow: hidden !important;
}

.tdh-breadcrumb {
  margin: 0 0 3rem !important;
  color: rgba(255, 255, 255, 0.6) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.tdh-breadcrumb a {
  color: inherit !important;
  text-decoration: underline !important;
}

.tdh-debt-hero .tdh-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.tdh-hero-bottom {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 3rem !important;
  margin-top: 3rem !important;
}

.tdh-hero-sub {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.3rem, 2vw, 2rem) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.tdh-debt-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: 1rem 1.35rem !important;
  color: #ffffff !important;
  background: var(--purple, #8e2288) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transition: transform 200ms ease, background 200ms ease !important;
}

.tdh-debt-button:hover {
  background: var(--orange, #f15922) !important;
  transform: translateY(-3px) !important;
}

.tdh-hero-total {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  width: 210px !important;
  height: 210px !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border: 8px solid #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 18px 50px rgba(23, 47, 55, 0.3) !important;
  transform: rotate(6deg) !important;
  margin-left: auto !important;
}

.tdh-hero-total-stat strong {
  display: block !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 3rem !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
}

.tdh-hero-total-stat span {
  display: block !important;
  max-width: 120px !important;
  margin-top: 0.5rem !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

/* 2. Scoreboard Strip */
.tdh-campaign-score {
  background: var(--purple, #8e2288) !important;
  color: #ffffff !important;
}

.tdh-score {
  min-height: 200px !important;
  padding: 2.5rem 1.5rem !important;
  border-right: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.tdh-score:last-child {
  border-right: none !important;
}

.tdh-score-main {
  background: #70206d !important;
}

.tdh-score strong {
  display: block !important;
  color: var(--lime, #e0e320) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(3rem, 4.5vw, 5rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
}

.tdh-score span {
  display: block !important;
  max-width: 190px !important;
  margin-top: 1rem !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* 3. Debt Stakes */
.tdh-debt-stakes {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #f7f7f2 !important;
}

.tdh-stakes-copy .tdh-stakes-lead {
  margin-top: 0 !important;
  color: var(--ink, #172f37) !important;
  font-size: clamp(1.45rem, 2.5vw, 2.35rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.tdh-stakes-copy p {
  color: #53686f !important;
  font-size: 1.08rem !important;
  line-height: 1.75 !important;
}

.tdh-stakes-copy strong {
  color: var(--purple, #8e2288) !important;
}

/* 4. Campaign Demands */
.tdh-campaign-call {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #e9eee9 !important;
}

.tdh-call-intro p:last-child {
  color: #52676d !important;
  font-size: 1.1rem !important;
}

.tdh-demand-summary {
  margin-top: 3.5rem !important;
  border-top: 1px solid rgba(23, 47, 55, 0.25) !important;
}

.tdh-demand-card {
  padding: 2rem 1.5rem !important;
  border-bottom: 1px solid rgba(23, 47, 55, 0.25) !important;
  border-left: 7px solid var(--orange, #f15922) !important;
  background: #ffffff !important;
}

.tdh-demand-card strong {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.6rem, 3vw, 2.8rem) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: var(--ink, #172f37) !important;
}

/* 5. Asks Accordion Alternative / Cards */
.tdh-canada-asks {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #f7f7f2 !important;
}

.tdh-asks-heading p:last-child {
  color: #566a70 !important;
  font-size: 1.1rem !important;
}

.tdh-ask-list {
  margin-top: 3.5rem !important;
  border-top: 1px solid rgba(23, 47, 55, 0.22) !important;
}

.tdh-ask {
  padding: 2rem 1rem !important;
  border-bottom: 1px solid rgba(23, 47, 55, 0.22) !important;
}

.tdh-ask-tag {
  margin: 0 0 0.25rem !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.tdh-ask-orange .tdh-ask-tag { color: var(--orange, #f15922) !important; }
.tdh-ask-purple .tdh-ask-tag { color: var(--purple, #8e2288) !important; }
.tdh-ask-teal .tdh-ask-tag { color: var(--teal-bright, #187575) !important; }

.tdh-ask h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 3.8vw, 3.8rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.tdh-ask p {
  color: #53676d !important;
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
}

/* 6. Movement Section */
.tdh-canada-movement {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: #ffffff !important;
}

.tdh-movement-image img {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 50% 50% 1.2rem 1.2rem !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.2) !important;
}

.tdh-movement-image figcaption {
  margin-top: 1rem !important;
  color: rgba(255, 255, 255, 0.62) !important;
  font-size: 0.78rem !important;
}

.tdh-movement-copy .tdh-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.tdh-movement-copy h2 {
  color: #ffffff !important;
}

.tdh-movement-copy p {
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 1.08rem !important;
  line-height: 1.75 !important;
}

.tdh-movement-copy a {
  color: #ffffff !important;
  text-decoration-color: var(--lime, #e0e320) !important;
}

/* 7. Jubilee Section */
.tdh-jubilee {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: #f7f7f2 !important;
}

.tdh-jubilee-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(100%, 350px) !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 auto !important;
  color: #ffffff !important;
  background: var(--orange, #f15922) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 22px rgba(241, 89, 34, 0.1), 0 0 0 44px rgba(142, 34, 136, 0.06) !important;
  transform: rotate(-5deg) !important;
}

.tdh-jubilee-mark p {
  text-align: center !important;
  margin: 0 !important;
}

.tdh-jubilee-mark strong {
  display: block !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(3.8rem, 6vw, 6rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
}

.tdh-jubilee-mark span {
  display: block !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

.tdh-jubilee-copy p {
  color: #53676d !important;
  font-size: 1.08rem !important;
  line-height: 1.75 !important;
}

/* 8. Global CTA Section */
.tdh-global-cta {
  padding: clamp(6rem, 10vw, 10rem) 0 !important;
  background: var(--purple, #8e2288) !important;
  color: #ffffff !important;
}

.tdh-global-cta .tdh-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.tdh-global-cta h2 {
  color: #ffffff !important;
}

.tdh-global-cta p:last-child {
  color: rgba(255, 255, 255, 0.76) !important;
  font-size: 1.2rem !important;
}

.tdh-cta-button-col {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

.tdh-button-light {
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
}

.tdh-button-light:hover {
  color: #ffffff !important;
  background: var(--orange, #f15922) !important;
}

/* 7. Jubilee Section - Heading Font Size Override */
.tdh-jubilee-copy h2#jubilee-title,
.tdh-jubilee-copy h2.tdh-jubilee-title-lg {
  font-size: clamp(5rem, 8.5vw, 8.5rem) !important;
  line-height: 0.85 !important;
  letter-spacing: -0.04em !important;
}

.tdh-movement-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.2rem, 7.5vw, 7.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    margin-bottom: 3.5rem !important;
}

.tdh-legacy-title {
    font-family: 'Barlow Semi Condensed', sans-serif !important;
    font-weight: 800 !important;
    font-size: clamp(4.0rem, 6.5vw, 6.5rem) !important;
    line-height: 0.85 !important;
    text-transform: uppercase !important;
    color: #F15922 !important;
    margin-bottom: 3.5rem !important;
}


/* Responsive Structural Overrides */
@media (max-width: 920px) {
  .tdh-score {
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
  }
  .tdh-cta-button-col {
    justify-content: flex-start !important;
    margin-top: 2rem !important;
  }
}

@media (max-width: 640px) {
  .tdh-hero-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .tdh-hero-total {
    margin-top: 2rem !important;
    margin-left: 0 !important;
  }
}
/* ==========================================================================
   Canada's Budget Page - Gutenberg Stylesheet (bud-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.bud-collection-hero .wp-block-group__inner-container,
.bud-page-section .wp-block-group__inner-container,
.bud-feature-strip .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical Rules & Tone Orange Theme Mapping */
.bud-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--orange, #f15922) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.bud-collection-hero h1#page-title,
.bud-section-intro h2,
.bud-feature-strip h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.bud-collection-hero h1#page-title {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.bud-section-intro h2 {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.bud-feature-strip h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 7vw, 7rem) !important;
  line-height: 0.9 !important;
}

.bud-collection-hero h1#page-title em,
.bud-section-intro h2 em {
  color: var(--orange, #f15922) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Tone Orange) */
.bud-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: #f7dfd1 !important; /* --page-wash for tone-orange */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.bud-collection-hero-copy p:not(.bud-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.bud-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.bud-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid #7c2f16 !important; /* --page-deep for tone-orange */
  border-radius: 48% 52% 50% 50% !important;
  color: #7c2f16 !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Main Page Section */
.bud-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.bud-section-intro {
  margin-bottom: clamp(2.5rem, 5vw, 4rem) !important;
}

.bud-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Info Card Grid */
.bud-card-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  margin-bottom: 3rem !important;
}

.bud-info-card {
  position: relative !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-top: 6px solid var(--orange, #f15922) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
}

.bud-info-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.bud-info-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

/* 4. Feature Strip Section */
.bud-feature-strip {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #7c2f16 !important; /* --page-deep for tone-orange */
  color: var(--white, #ffffff) !important;
}

.bud-feature-strip .bud-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.bud-feature-strip-copy p {
  font-size: 1.12rem !important;
  color: rgba(255, 255, 255, 0.82) !important;
  line-height: 1.75 !important;
}

/* 5. Action Buttons */
.bud-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.bud-action-button,
.bud-secondary-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.bud-action-button {
  color: var(--white, #ffffff) !important;
  background: var(--orange, #f15922) !important;
  border: none !important;
}

.bud-secondary-button {
  color: var(--white, #ffffff) !important;
  background: transparent !important;
  border: 1px solid currentColor !important;
}

.bud-action-button:hover,
.bud-secondary-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .bud-card-grid {
    grid-template-columns: 1fr !important;
  }
  .bud-button-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
/* ==========================================================================
   Campaigns Hub Page - Gutenberg Stylesheet (cmp-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.cmp-collection-hero .wp-block-group__inner-container,
.cmp-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Orange Theme Mapping */
.cmp-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--orange, #f15922) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.cmp-collection-hero h1#page-title,
.cmp-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.cmp-collection-hero h1#page-title {
  font-size: clamp(4.7rem, 10vw, 9.6rem) !important;
  line-height: 0.88 !important;
}

.cmp-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.cmp-collection-hero h1#page-title em,
.cmp-section-intro h2 em {
  color: var(--orange, #f15922) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Orange) */
.cmp-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: #f7dfd1 !important; /* --page-wash for tone-orange */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.cmp-collection-hero-copy {
  max-width: 1120px !important;
}

.cmp-collection-hero-copy p:not(.cmp-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

/* 2. Main Page Section */
.cmp-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.cmp-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.cmp-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Path Grid & Campaign Cards */
.cmp-path-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
}

.cmp-path-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
  transition: transform 200ms ease, border-color 200ms ease !important;
}

.cmp-path-card::before {
  content: "" !important;
  width: 3.2rem !important;
  height: 0.35rem !important;
  margin-bottom: 2rem !important;
  background: var(--orange, #f15922) !important;
}

.cmp-path-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.cmp-path-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

.cmp-path-link-wrap {
  margin-top: auto !important;
  padding-top: 2rem !important;
}

.cmp-path-link {
  color: var(--orange, #f15922) !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.cmp-path-card:hover {
  border-color: var(--orange, #f15922) !important;
  transform: translateY(-4px) !important;
}

/* Responsive Overrides */
@media (max-width: 1000px) {
  .cmp-path-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .cmp-path-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   Events Hub Page - Gutenberg Stylesheet (evt-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.evt-collection-hero .wp-block-group__inner-container,
.evt-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Blue Theme Mapping */
.evt-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--teal-bright, #167575) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.evt-collection-hero h1#page-title,
.evt-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.evt-collection-hero h1#page-title {
  font-size: clamp(4.7rem, 10vw, 9.6rem) !important;
  line-height: 0.88 !important;
}

.evt-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.evt-collection-hero h1#page-title em,
.evt-section-intro h2 em {
  color: var(--teal-bright, #167575) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Blue) */
.evt-collection-hero {
  position: relative !important;
  padding: clamp(1rem, 2vw, 2rem) 0 !important;
  background: #dbecec !important; /* --page-wash for tone-blue */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.evt-collection-hero-copy {
  max-width: 1120px !important;
}

.evt-collection-hero-copy p:not(.evt-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

/* 2. Main Page Section */
.evt-page-section {
  padding: clamp(2rem, 4vw, 4rem) 0 !important;
  background: #fbfbf7 !important;
}

.evt-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.evt-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Event / Resource Rows */
.evt-resource-list {
  display: grid !important;
  gap: 1rem !important;
  margin-bottom: 3rem !important;
}

.evt-resource-row {
  display: grid !important;
  grid-template-columns: 12rem minmax(0, 1fr) auto !important;
  gap: 1.5rem !important;
  align-items: center !important;
  padding: 1.5rem 0 !important;
  border-top: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
}

.evt-resource-row:last-child {
  border-bottom: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
}

.evt-resource-tag span {
  color: var(--teal-bright, #167575) !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.evt-resource-row h3 {
  margin: 0 !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

.evt-resource-link {
  color: var(--teal-bright, #167575) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* 4. Action Buttons */
.evt-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.evt-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--white, #ffffff) !important;
  background: var(--teal-bright, #167575) !important;
  border: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.evt-action-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .evt-resource-row {
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
  }
}
/* ==========================================================================
   News Hub Page - Gutenberg Stylesheet (nws-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.nws-collection-hero .wp-block-group__inner-container,
.nws-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Paper Theme Mapping */
.nws-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.nws-collection-hero h1#page-title,
.nws-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.nws-collection-hero h1#page-title {
  font-size: clamp(4.7rem, 10vw, 9.6rem) !important;
  line-height: 0.88 !important;
}

.nws-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.nws-collection-hero h1#page-title em,
.nws-section-intro h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Paper) */
.nws-collection-hero {
  position: relative !important;
  padding: clamp(1.5rem, 2vw, 2rem) 0 !important;
  background: #f4efd9 !important; /* --page-wash for tone-paper */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.nws-collection-hero-copy {
  max-width: 1120px !important;
}

.nws-collection-hero-copy p:not(.nws-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

/* 2. Main Page Section */
.nws-page-section {
  padding: clamp(1rem, 1vw, 1rem) 0 !important;
  background: #fbfbf7 !important;
}

.nws-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.nws-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. News Article Rows */
.nws-resource-list {
  display: grid !important;
  gap: 1rem !important;
  margin-bottom: 3rem !important;
}

.nws-resource-row {
  display: grid !important;
  grid-template-columns: 12rem minmax(0, 1fr) auto !important;
  gap: 1.5rem !important;
  align-items: center !important;
  padding: 1.5rem 0 !important;
  border-top: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
}

.nws-resource-row:last-child {
  border-bottom: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
}

.nws-resource-date time {
  color: var(--purple, #8e2288) !important;
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
}

.nws-resource-row h3 {
  margin: 0 !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2rem) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

.nws-resource-link {
  color: var(--purple, #8e2288) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .nws-resource-row {
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
  }
}
/* ==========================================================================
   Join KAIROS Page - Gutenberg Stylesheet (jkm-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.jkm-collection-hero .wp-block-group__inner-container,
.jkm-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Purple Theme Mapping */
.jkm-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.jkm-collection-hero h1#page-title,
.jkm-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.jkm-collection-hero h1#page-title {
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.jkm-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.jkm-collection-hero h1#page-title em,
.jkm-section-intro h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Purple) */
.jkm-collection-hero {
  position: relative !important;
  padding: clamp(2.5rem, 2vw, 2rem) 0 !important;
  background: #efe1ee !important; /* --page-wash for tone-purple */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.jkm-collection-hero-copy p:not(.jkm-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.jkm-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.jkm-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid #54204f !important; /* --page-deep for tone-purple */
  border-radius: 48% 52% 50% 50% !important;
  color: #54204f !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Main Page Section */
.jkm-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.jkm-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.jkm-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Path Grid & Action Cards */
.jkm-path-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
}

.jkm-path-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
  transition: transform 200ms ease, border-color 200ms ease !important;
}

.jkm-path-card::before {
  content: "" !important;
  width: 3.2rem !important;
  height: 0.35rem !important;
  margin-bottom: 2rem !important;
  background: var(--purple, #8e2288) !important;
}

.jkm-path-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.jkm-path-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

.jkm-path-link-wrap {
  margin-top: auto !important;
  padding-top: 2rem !important;
}

.jkm-path-link {
  color: var(--purple, #8e2288) !important;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.jkm-path-card:hover {
  border-color: var(--purple, #8e2288) !important;
  transform: translateY(-4px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .jkm-path-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   Join as an Individual Page - Gutenberg Stylesheet (kac-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.kac-collection-hero .wp-block-group__inner-container,
.kac-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Blue Theme Mapping */
.kac-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--teal-bright, #167575) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.kac-collection-hero h1#page-title,
.kac-form-copy h2,
.kac-contact-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.kac-collection-hero h1#page-title {
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.kac-form-copy h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.kac-collection-hero h1#page-title em,
.kac-form-copy h2 em {
  color: var(--teal-bright, #167575) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Blue) */
.kac-collection-hero {
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: #dbecec !important; /* --page-wash for tone-blue */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.kac-collection-hero-copy p:not(.kac-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.kac-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.kac-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid #183f4a !important; /* --page-deep for tone-blue */
  border-radius: 48% 52% 50% 50% !important;
  color: #183f4a !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Page Section & Form Layout */
.kac-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.kac-form-copy p:not(.kac-eyebrow):not(.kac-inline-note) {
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
  margin-bottom: 1.5rem !important;
}

.kac-inline-note {
  padding: 1.4rem 1.6rem !important;
  background: #dbecec !important; /* --page-wash */
  border-left: 0.4rem solid var(--teal-bright, #167575) !important;
  color: var(--ink, #172f37) !important;
  font-size: 1.05rem !important;
}

/* 3. Registration Card */
.kac-contact-card {
  padding: 2.5rem !important;
  background: #dbecec !important; /* --page-wash for tone-blue */
  border-radius: 1.4rem !important;
}

.kac-contact-card h3 {
  font-size: 1.8rem !important;
}

.kac-contact-card p {
  color: #455d65 !important;
  font-size: 1.05rem !important;
}

.kac-button-row {
  margin: 2rem 0 !important;
}

.kac-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--white, #ffffff) !important;
  background: var(--teal-bright, #167575) !important;
  border: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.kac-action-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

.kac-contact-help a {
  color: var(--teal-bright, #167575) !important;
  font-weight: 700 !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .kac-form-shell {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   Join as a Group Page - Gutenberg Stylesheet (kag-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.kag-collection-hero .wp-block-group__inner-container,
.kag-page-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Green Theme Mapping */
.kag-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--moss, #6a712d) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.kag-collection-hero h1#page-title,
.kag-section-intro h2 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.kag-collection-hero h1#page-title {
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.kag-section-intro h2 {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.kag-collection-hero h1#page-title em,
.kag-section-intro h2 em {
  color: var(--moss, #6a712d) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Light Page + Tone Green) */
.kag-collection-hero {
  position: relative !important;
  padding: clamp(2.5rem, 3vw, 3rem) 0 !important;
  background: #eef0d8 !important; /* --page-wash for tone-green */
  color: var(--ink, #172f37) !important;
  overflow: hidden !important;
}

.kag-collection-hero-copy p:not(.kag-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(23, 47, 55, 0.8) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.kag-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.kag-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid #364a3f !important; /* --page-deep for tone-green */
  border-radius: 48% 52% 50% 50% !important;
  color: #364a3f !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Main Page Section */
.kag-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.kag-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem) !important;
}

.kag-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Info Card Grid */
.kag-card-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  margin-bottom: 3rem !important;
}

.kag-info-card {
  position: relative !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  background: var(--white, #ffffff) !important;
  border: 1px solid var(--line, rgba(28, 69, 82, 0.18)) !important;
  border-top: 6px solid var(--moss, #6a712d) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
}

.kag-info-card h3 {
  margin: 0 0 1rem !important;
  color: var(--teal, #1c4552) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.kag-info-card p {
  margin: 0 !important;
  color: #486069 !important;
  font-size: 1.05rem !important;
}

/* 4. Action Button */
.kag-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.kag-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--white, #ffffff) !important;
  background: var(--moss, #6a712d) !important;
  border: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.kag-action-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 1000px) {
  .kag-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .kag-card-grid {
    grid-template-columns: 1fr !important;
  }
  .kag-button-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
/* ==========================================================================
   Network Stories Page - Gutenberg Stylesheet (nst-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.nst-hero .wp-block-group__inner-container,
.nst-stories .wp-block-group__inner-container,
.nst-memory-cta .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Color Rules */
.nst-eyebrow {
  margin: 0 0 1.25rem !important;
  color: inherit !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.nst-hero h1#page-title,
.nst-section-heading h2,
.nst-memory-cta h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
}

.nst-hero h1#page-title {
  font-size: clamp(4.8rem, 8.4vw, 8.8rem) !important;
  color: var(--white, #ffffff) !important;
}

.nst-hero h1#page-title em {
  color: var(--lime, #e0e320) !important;
  font-style: normal !important;
}

.nst-section-heading h2 {
  font-size: clamp(3.5rem, 6vw, 6rem) !important;
  color: var(--teal, #1c4552) !important;
}

.nst-section-heading h2 em {
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
}

/* 1. Hero Section */
.nst-hero {
  position: relative !important;
  padding: clamp(2.5rem, 4vw, 4rem) 0 !important;
  background: var(--teal, #1c4552) !important;
  color: var(--white, #ffffff) !important;
  overflow: hidden !important;
}

.nst-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.nst-hero-intro {
  max-width: 34rem !important;
  margin: 2.2rem 0 1.5rem !important;
  color: rgba(255, 255, 255, 0.86) !important;
  font-size: clamp(1.06rem, 1.4vw, 1.25rem) !important;
  line-height: 1.6 !important;
}

.nst-text-link {
  display: inline-flex !important;
  align-items: center !important;
  padding-bottom: 0.25rem !important;
  color: var(--white, #ffffff) !important;
  border-bottom: 2px solid var(--lime, #e0e320) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.nst-text-link span {
  padding-left: 0.4rem !important;
  color: var(--lime, #e0e320) !important;
}

/* Hero Gallery */
.nst-hero-gallery {
  position: relative !important;
  min-height: 520px !important;
  background: #dce4df !important;
  border-radius: 1.5rem !important;
  overflow: hidden !important;
}

.nst-hero-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.nst-hero-image-main {
  position: absolute !important;
  inset: 0 31% 0 0 !important;
  margin: 0 !important;
}

.nst-hero-image-top {
  position: absolute !important;
  inset: 0 0 50% 69% !important;
  margin: 0 !important;
  border-left: 8px solid var(--paper, #f7f7f2) !important;
  border-bottom: 4px solid var(--paper, #f7f7f2) !important;
}

.nst-hero-image-bottom {
  position: absolute !important;
  inset: 50% 0 0 69% !important;
  margin: 0 !important;
  border-left: 8px solid var(--paper, #f7f7f2) !important;
  border-top: 4px solid var(--paper, #f7f7f2) !important;
}

.nst-year-stamp {
  position: absolute !important;
  left: calc(69% - 62px) !important;
  top: 50% !important;
  display: flex !important;
  width: 124px !important;
  height: 124px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 50% !important;
  transform: translateY(-50%) !important;
  box-shadow: 0 12px 38px rgba(23, 47, 55, 0.22) !important;
  z-index: 5 !important;
}

.nst-year-stamp p {
  text-align: center !important;
  margin: 0 !important;
}

.nst-year-stamp strong {
  display: block !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: 3rem !important;
  font-weight: 800 !important;
  line-height: 0.82 !important;
}

.nst-year-stamp span {
  display: block !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
}

/* 2. Stories Section */
.nst-stories {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: var(--paper, #f7f7f2) !important;
}

.nst-section-heading {
  margin-bottom: clamp(4.5rem, 8vw, 8rem) !important;
}

.nst-section-heading .nst-eyebrow {
  color: var(--purple, #8e2288) !important;
}

.nst-section-heading p {
  margin: 0 !important;
  font-size: 1.08rem !important;
  color: #455d65 !important;
}

.nst-story {
  --accent: var(--purple, #8e2288);
  margin-bottom: clamp(6rem, 10vw, 10rem) !important;
  align-items: center !important;
}

.nst-story:last-child {
  margin-bottom: 0 !important;
}

.nst-story.story-moss { --accent: var(--moss, #6a712d); }
.nst-story.story-teal { --accent: var(--teal-bright, #187575); }

.nst-story-visual {
  position: relative !important;
  padding: 1rem 0 0 1rem !important;
}

.nst-story-visual::before {
  position: absolute !important;
  inset: 0 1rem 3.4rem 0 !important;
  z-index: 0 !important;
  content: "" !important;
  background: var(--accent) !important;
  border-radius: 50% 50% 2.5rem 2.5rem !important;
  transform: rotate(-2deg) !important;
}

.nst-story-reverse .nst-story-visual::before {
  transform: rotate(2deg) !important;
}

.nst-story-visual img:not(.nst-partner-mark) {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 50% 50% 2rem 2rem !important;
  box-shadow: 0 24px 70px rgba(23, 47, 55, 0.13) !important;
}

.nst-partner-mark {
  position: absolute !important;
  z-index: 2 !important;
  top: -1.2rem !important;
  right: -1rem !important;
  width: min(58%, 250px) !important;
  padding: 1rem !important;
  background: var(--white, #ffffff) !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 10px 30px rgba(23, 47, 55, 0.18) !important;
}

.nst-caption {
  margin: 1rem 0 0 1rem !important;
  color: #566b71 !important;
  font-size: 0.8rem !important;
  line-height: 1.45 !important;
}

.nst-story-meta {
  display: flex !important;
  gap: 1.5rem !important;
  margin-bottom: 1rem !important;
}

.nst-story-meta span {
  color: var(--accent) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

.nst-impact-line {
  margin: 0 0 0.45rem !important;
  color: #5b6b6f !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
}

.nst-story-copy h3 {
  margin: 0 0 1.5rem !important;
  color: var(--ink, #172f37) !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.6rem, 4.5vw, 4.5rem) !important;
  font-weight: 800 !important;
  line-height: 0.98 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

.nst-quote-lead {
  border-top: 3px solid var(--accent) !important;
  padding-top: 1.5rem !important;
  font-weight: 600 !important;
}

.nst-story-copy p {
  color: #455d65 !important;
  font-size: 1.05rem !important;
  line-height: 1.75 !important;
}

.nst-attribution {
  margin-top: 1.5rem !important;
  font-weight: 800 !important;
  color: var(--ink, #172f37) !important;
}

.nst-attribution span {
  display: block !important;
  color: #66787d !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* 3. Memory CTA Section */
.nst-memory-cta {
  padding: clamp(4.5rem, 8vw, 8rem) 0 !important;
  background: var(--purple, #8e2288) !important;
  color: var(--white, #ffffff) !important;
}

.nst-memory-cta .nst-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.nst-memory-cta h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 6.5vw, 6.8rem) !important;
}

.nst-cta-action-col p {
  margin-bottom: 1.8rem !important;
  font-size: 1.08rem !important;
}

.nst-cta-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.8rem !important;
  padding: 0.9rem 1.25rem !important;
  color: var(--ink, #172f37) !important;
  background: var(--lime, #e0e320) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, box-shadow 180ms ease !important;
}

.nst-cta-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(23, 47, 55, 0.28) !important;
}

/* Responsive Overrides */
@media (max-width: 1000px) {
  .nst-hero-gallery {
    min-height: 420px !important;
  }
}

@media (max-width: 768px) {
  .nst-hero-image-main {
    inset: 0 0 35% 0 !important;
  }
  .nst-hero-image-top {
    inset: 65% 50% 0 0 !important;
  }
  .nst-hero-image-bottom {
    inset: 65% 0 0 50% !important;
  }
  .nst-year-stamp {
    left: 50% !important;
    top: 65% !important;
    transform: translate(-50%, -50%) !important;
  }
  .nst-cta-action-col {
    margin-top: 2rem !important;
  }
}
/* ==========================================================================
   Donate Page - Gutenberg Stylesheet (don-)
   ========================================================================== */

/* Full-Width Outer Container Alignment Reset */
.don-collection-hero .wp-block-group__inner-container,
.don-page-section .wp-block-group__inner-container,
.don-feature-strip .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical & Tone Purple Theme Mapping */
.don-eyebrow {
  margin: 0 0 1rem !important;
  color: var(--purple, #8e2288) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.don-collection-hero h1#page-title,
.don-section-intro h2,
.don-feature-strip h2 {
  margin: 0 0 1rem !important;
  font-family: "Barlow Semi Condensed", Impact, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
}

.don-collection-hero h1#page-title {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.6rem, 8vw, 6.5rem) !important;
  line-height: 0.88 !important;
}

.don-section-intro h2 {
  color: var(--teal, #1c4552) !important;
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 0.9 !important;
}

.don-feature-strip h2 {
  color: var(--white, #ffffff) !important;
  font-size: clamp(3.5rem, 7vw, 7rem) !important;
  line-height: 0.9 !important;
}

.don-collection-hero h1#page-title em,
.don-section-intro h2 em {
  color: var(--yellow, #E0E320) !important;
  font-style: normal !important;
}

/* 1. Collection Hero Section (Tone Purple) */
.don-collection-hero {
  position: relative !important;
  padding: clamp(2.5rem, 4vw, 4rem) 0 !important;
 /* background: #54204f !important; /* --page-deep for tone-purple */
  color: var(--white, #ffffff) !important;
  overflow: hidden !important;
}

.don-collection-hero .don-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.don-collection-hero-copy p:not(.don-eyebrow) {
  max-width: 42rem !important;
  margin: 1.5rem 0 0 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
}

.don-collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 380px !important;
}

.don-hero-mark-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: min(22rem, 65vw) !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border: 2px solid var(--purple, #8e2288) !important;
  border-radius: 48% 52% 50% 50% !important;
  color: var(--purple, #8e2288) !important;
  background: #efe1ee !important; /* --page-wash for tone-purple */
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4rem) !important;
  font-weight: 800 !important;
  line-height: 0.9 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  transform: rotate(-6deg) !important;
}

/* 2. Main Page Section */
.don-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0 !important;
  background: #fbfbf7 !important;
}

.don-section-intro {
  margin-bottom: clamp(2.5rem, 5vw, 4rem) !important;
}

.don-section-intro p {
  max-width: 44rem !important;
  margin: 0 0 1rem !important;
  font-size: 1.12rem !important;
  color: #455d65 !important;
  line-height: 1.75 !important;
}

/* 3. Quote Panel */
.don-quote-panel {
  position: relative !important;
  max-width: 1040px !important;
  margin: 0 auto !important;
  padding: clamp(4rem, 8vw, 7rem) clamp(2rem, 7vw, 6rem) !important;
  background: #efe1ee !important; /* --page-wash */
  border-radius: 2rem !important;
}

.don-quote-panel blockquote {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-size: clamp(2rem, 4vw, 4rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  color: var(--teal, #1c4552) !important;
}

.don-quote-panel blockquote::before {
  content: "" !important;
  padding: 0 !important;
}

.don-quote-panel cite {
  display: block !important;
  margin-top: 2rem !important;
  color: var(--purple, #8e2288) !important;
  font-style: normal !important;
  font-weight: 800 !important;
  font-size: 1.1rem !important;
}

/* 4. Feature Strip Section */
.don-feature-strip {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #54204f !important; /* --page-deep for tone-purple */
  color: var(--white, #ffffff) !important;
}

.don-feature-strip .don-eyebrow {
  color: var(--lime, #e0e320) !important;
}

.don-feature-strip-copy p {
  font-size: 1.12rem !important;
  color: rgba(255, 255, 255, 0.82) !important;
  line-height: 1.75 !important;
}

.don-feature-strip-copy a {
  color: var(--lime, #e0e320) !important;
}

/* 5. Action Buttons */
.don-button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  margin-top: 2.5rem !important;
}

.don-action-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  padding: 0.9rem 1.35rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  color: var(--white, #ffffff) !important;
  background: var(--purple, #8e2288) !important;
  border: none !important;
  transition: transform 180ms ease, filter 180ms ease !important;
}

.don-action-button:hover {
  filter: brightness(0.88) !important;
  transform: translateY(-2px) !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .don-button-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
/* Prefixed Stylesheet (HME_) for Theme's Additional CSS */

.HME-home-hero {
  position: relative;
  min-height: min(820px, calc(100vh - 116px));
  overflow: hidden;
  background: #f4e8e1;
}
.HME-home-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; margin: 0; }
.HME-home-hero-copy {
  position: relative;
  z-index: 2;
  display: flex;
  width: 48%;
  min-height: min(820px, calc(100vh - 116px));
  margin-left: auto;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  padding: clamp(4rem, 7vw, 7rem) 6vw clamp(4rem, 7vw, 7rem) 2rem;
}
.HME-home-hero-copy .HME-eyebrow { margin-bottom: 1rem; color: var(--purple); }
.HME-home-hero h1,
.HME-collective-copy h2,
.HME-work-heading h2,
.HME-two-way-copy h2,
.HME-impact-heading h2,
.HME-anniversary-copy h2,
.HME-home-action h2 {
  margin: 0;
  color: var(--teal);
  font: 800 clamp(4rem, 7vw, 7.7rem)/0.86 "Barlow Semi Condensed", Impact, sans-serif;
  letter-spacing: -0.045em;
  text-transform: uppercase;
}
.HME-home-hero h1 { font-size: clamp(4rem, 7vw, 7.2rem); }
.HME-home-hero h1 em, .HME-collective-copy h2 em, .HME-two-way-copy h2 em, .HME-impact-heading h2 em, .HME-anniversary-copy h2 em, .HME-home-action h2 em { color: var(--purple); font-style: normal; }
.HME-home-hero-copy > p:not(.HME-eyebrow) { max-width: 580px; margin: 1.8rem 0; color: #445b61; font-size: clamp(1.05rem, 1.35vw, 1.22rem); }
.HME-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.3rem 1.8rem; }
.HME-home-button {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 0.7rem;
  padding: 0.86rem 1.2rem;
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.HME-home-button a { text-decoration: none; color: inherit; }
.HME-home-button:hover, .HME-home-button:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(23,47,55,0.2); }
.HME-button-lime { color: var(--ink); background: var(--lime); }
.HME-button-dark { color: var(--white); background: var(--teal); }
.HME-button-outline { color: var(--white); border: 2px solid rgba(255,255,255,0.75); }
.HME-hero-scroll { color: var(--teal); border-bottom: 2px solid var(--purple); font-weight: 800; text-decoration: none; }
.HME-hero-scroll a { color: inherit; text-decoration: none; }
.HME-hero-scroll span { padding-left: 0.35rem; color: var(--purple); }

.HME-collective-intro {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(6rem, 11vw, 11rem) 3rem;
}
.HME-collective-kicker { padding-bottom: 0.8rem; border-bottom: 4px solid var(--lime); }
.HME-kicker-number { display: block; color: var(--purple); font: 800 clamp(7rem, 15vw, 13rem)/0.72 "Barlow Semi Condensed", sans-serif; letter-spacing: -0.06em; margin: 0; }
.HME-collective-kicker p { max-width: 170px; margin: 1.3rem 0 0; color: var(--teal); font-size: 0.76rem; font-weight: 800; letter-spacing: 0.12em; line-height: 1.4; text-transform: uppercase; }
.HME-collective-copy .HME-eyebrow { color: var(--purple); }
.HME-collective-copy h2 { max-width: 900px; font-size: clamp(4rem, 7.5vw, 7.5rem); }
.HME-collective-copy > p:last-child { max-width: 720px; margin: 2rem 0 0; color: #52676d; font-size: 1.1rem; }

.HME-strategic-work { padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - var(--max)) / 2)); background: #e9e9df; }
.HME-work-heading { margin-bottom: 5rem; }
.HME-work-heading .HME-eyebrow { color: var(--purple); }
.HME-work-heading h2 { font-size: clamp(4rem, 7vw, 7rem); }
.HME-work-heading p { color: #52676d; }

.HME-goal-list { border-top: 1px solid rgba(28,69,82,0.25); }
.HME-goal { --goal-accent: var(--teal-bright); position: relative !important; border-bottom: 1px solid rgba(28,69,82,0.25); padding: 2.2rem 1rem; transition: color 240ms ease, background 240ms ease; }
.HME-goal a { text-decoration: none; color: inherit; display: flex; width: 100%; align-items: center; justify-content: space-between; }
.HME-goal a::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; }
.HME-goal-systems { --goal-accent: var(--orange); }
.HME-goal-power { --goal-accent: var(--purple); }
.HME-goal:hover, .HME-goal:focus-visible { color: var(--white); background: var(--goal-accent); }
.HME-goal-copy { display: grid; grid-template-columns: minmax(280px, 0.8fr) 1fr; gap: 0 3rem; align-items: center; }
.HME-goal-tag { grid-column: 1 / -1; margin: 0 0 0.5rem; color: var(--goal-accent); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.HME-goal:hover .HME-goal-tag, .HME-goal:focus-visible .HME-goal-tag { color: var(--lime); }
.HME-goal h3 { margin: 0; font: 800 clamp(2.6rem, 4.4vw, 4.7rem)/0.9 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.HME-goal-copy > p:last-child { margin: 0; color: #52676d; }
.HME-goal:hover .HME-goal-copy > p:last-child, .HME-goal:focus-visible .HME-goal-copy > p:last-child { color: rgba(255,255,255,0.84); }
.HME-goal-arrow { display: flex !important; align-items: center; justify-content: center; width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; aspect-ratio: 1 / 1; padding: 0 !important; border-radius: 50%; background-color: #E0E320 !important; border: none !important; color: var(--ink); font-size: 1.5rem; transition: transform 220ms ease; }
.HME-goal:hover .HME-goal-arrow, .HME-goal:focus-visible .HME-goal-arrow { transform: rotate(45deg); }

.HME-two-way { padding: clamp(6rem, 10vw, 10rem) max(3rem, calc((100vw - var(--max)) / 2)); color: var(--white); background: var(--teal); overflow: hidden; }
.HME-two-way-visual { position: relative; min-height: 530px; display: grid; place-items: center; }
.HME-two-way-visual::before, .HME-two-way-visual::after { position: absolute; width: 86%; height: 52%; content: ""; border: 1px solid rgba(224,227,32,0.45); border-radius: 50%; transform: rotate(-8deg); }
.HME-two-way-visual::after { width: 70%; height: 72%; border-color: rgba(255,255,255,0.18); transform: rotate(12deg); }
.HME-two-way-visual img { position: relative; z-index: 2; width: min(100%, 540px); }
.HME-path-label { position: absolute; z-index: 3; padding: 0.65rem 0.9rem; color: var(--ink); background: var(--lime); border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; box-shadow: 0 12px 30px rgba(8,29,35,0.3); margin: 0; }
.HME-path-one { top: 13%; left: 0; transform: rotate(-4deg); }
.HME-path-two { right: 0; bottom: 12%; transform: rotate(4deg); }
.HME-two-way-copy .HME-eyebrow { color: var(--lime); }
.HME-two-way-copy h2 { color: var(--white); font-size: clamp(2rem, 7vw, 6rem) !important; line-height: 1.1; word-break: keep-all !important; }
.HME-two-way-copy h2 em { color: var(--lime); }
.HME-two-way-copy p { max-width: 620px; color: rgba(255,255,255,0.78); }
.HME-two-way-copy .HME-two-way-lead { margin-top: 2rem; color: var(--white); font-size: 1.12rem; }

.HME-impact-home { max-width: var(--max); margin: 0 auto; padding: clamp(6rem, 11vw, 11rem) 3rem; }
.HME-impact-heading { max-width: 980px; margin-bottom: 4.5rem; }
.HME-impact-heading .HME-eyebrow { color: var(--purple); }
.HME-impact-heading h2 { font-size: clamp(4rem, 7vw, 7rem); }
.HME-impact-item { --impact-accent: var(--teal-bright); min-height: 390px; padding: 2rem; background: var(--white); border-top: 10px solid var(--impact-accent); box-shadow: 0 18px 50px rgba(23,47,55,0.08); }
.HME-impact-orange { --impact-accent: var(--orange); }
.HME-impact-purple { --impact-accent: var(--purple); }
.HME-impact-item h3 { margin: 1.4rem 0 1rem; font: 800 clamp(2rem, 3vw, 3.2rem)/0.95 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }
.HME-impact-item p { margin: 0; color: #566a70; }
.HME-impact-links { display: flex; flex-wrap: wrap; gap: 1.2rem 2rem; margin-top: 3.5rem; }
.HME-impact-links a { color: var(--teal); border-bottom: 2px solid var(--purple); font-weight: 800; text-decoration: none; }
.HME-impact-links span { color: var(--purple); }

.HME-anniversary { padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - var(--max)) / 2)); background: var(--lime); }
.HME-anniversary-art { position: relative; }
.HME-anniversary-art img { width: 100%; border-radius: 50%; mix-blend-mode: multiply; }
.HME-anniversary-stamp { position: absolute; right: 0; bottom: 4%; display: flex; width: 130px; height: 130px; align-items: center; justify-content: center; flex-direction: column; color: var(--white); background: var(--purple); border-radius: 50%; box-shadow: 0 15px 40px rgba(23,47,55,0.2); }
.HME-anniversary-stamp strong { font: 800 3.7rem/0.78 "Barlow Semi Condensed", sans-serif; }
.HME-anniversary-stamp span { font-size: 0.74rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.HME-anniversary-copy .HME-eyebrow { color: var(--purple); }
.HME-anniversary-copy h2 { font-size: clamp(4rem, 7vw, 7rem); }
.HME-anniversary-copy > p:not(.HME-eyebrow) { max-width: 620px; margin: 2rem 0; color: #3f565c; font-size: 1.08rem; }
.HME-anniversary-links { display: flex; flex-wrap: wrap; align-items: center; gap: 1.3rem 1.8rem; }

.HME-home-action { padding: clamp(5rem, 9vw, 9rem) max(3rem, calc((100vw - var(--max)) / 2)); color: var(--white); background: var(--purple); }
.HME-home-action .HME-eyebrow { color: var(--lime); }
.HME-home-action h2 { color: var(--white); font-size: clamp(3.6rem, 6.5vw, 6.5rem); }
.HME-home-action h2 em { color: var(--lime); }
.HME-action-buttons { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: flex-end; }

.HME-reveal { opacity: 0; transform: translateY(30px); transition: opacity 650ms ease, transform 650ms ease; }
.HME-reveal.HME-is-visible { opacity: 1; transform: translateY(0); }

.HME-goal h3 { margin: 0; font: 800 clamp(1.6rem, 2.4vw, 2.7rem)/0.9 "Barlow Semi Condensed", sans-serif; text-transform: uppercase; }

@media (min-width: 768px) {
  .HME-impact-grid { align-items: stretch !important; }
  .HME-impact-grid .wp-block-column:nth-child(2) .HME-impact-item { margin-top: 3rem !important; }
  .HME-impact-grid .wp-block-column:nth-child(3) .HME-impact-item { margin-top: 6rem !important; }
}

@media (max-width: 1000px) {
  .HME-home-hero { min-height: 920px; }
  .HME-home-hero-image { object-position: 38% center; }
  .HME-home-hero-copy { min-height: 920px; width: 56%; padding-right: 4vw; }
  .HME-goal-copy { grid-template-columns: 1fr; gap: 0.7rem; }
  .HME-two-way-visual { min-height: 450px; }
  .HME-action-buttons { justify-content: flex-start; }
}

@media (max-width: 740px) {
  .HME-home-hero { min-height: 790px; display: flex; align-items: flex-end; }
  .HME-home-hero-image { height: 48%; top: 0; object-position: 40% center; }
  .HME-home-hero-copy { width: 100%; min-height: 0; margin-top: 280px; padding: 6rem 1.5rem 4rem; }
  .HME-home-hero h1 { font-size: clamp(4rem, 20vw, 6.2rem); }
  .HME-collective-intro, .HME-strategic-work, .HME-two-way, .HME-impact-home, .HME-anniversary, .HME-home-action { padding-right: 1.5rem; padding-left: 1.5rem; }
  .HME-kicker-number { font-size: 9rem; }
  .HME-collective-copy h2, .HME-work-heading h2, .HME-two-way-copy h2, .HME-impact-heading h2, .HME-anniversary-copy h2 { font-size: clamp(3.5rem, 17vw, 5.5rem); }
  .HME-goal { grid-template-columns: 1fr; }
  .HME-goal-arrow { display: none !important; }
  .HME-goal h3 { font-size: clamp(2.4rem, 12vw, 3.8rem); }
  .HME-two-way-visual { min-height: 360px; }
  .HME-path-label { font-size: 0.62rem; }
  .HME-path-one { top: 5%; }
  .HME-path-two { bottom: 5%; }
  .HME-impact-item { min-height: 0; margin-top: 0 !important; }
  .HME-anniversary-art { max-width: 430px; margin: 0 auto; }
  .HME-anniversary-stamp { width: 105px; height: 105px; }
  .HME-anniversary-stamp strong { font-size: 3rem; }
  .HME-home-action h2 { font-size: clamp(3.2rem, 15vw, 5rem); }
}

@media (prefers-reduced-motion: reduce) {
  .HME-reveal { opacity: 1; transform: none; }
}
/* ==========================================================================
   Prefixed CSS Stylesheet (ABT_) - Theme Additional CSS
   ========================================================================== */

/* Inner Container Alignment Utility */
.ABT-collection-hero .wp-block-group__inner-container,
.ABT-page-section .wp-block-group__inner-container,
.ABT-feature-strip .wp-block-group__inner-container {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical Treatments */
.ABT-eyebrow {
  color: var(--purple, #8e2288);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}

/* Heading Accents & Overlaps */
.ABT-collection-hero h1,
.ABT-section-intro h2,
.ABT-feature-strip h2 {
  margin: 0 0 1.25rem;
  color: var(--teal, #1c4552);
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 0.9;
  text-transform: uppercase;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.ABT-collection-hero h1 em,
.ABT-section-intro h2 em,
.ABT-feature-strip h2 em {
  color: #E0E320 !important;
  font-style: normal !important;
  display: inline-block;
}

/* Hero Section Styles */
.ABT-collection-hero {
  background-color: #54204f !important;
  background-image: 
    radial-gradient(circle at -5% 50%, transparent 0%, transparent 28%, rgba(255, 255, 255, 0.08) 29%, rgba(255, 255, 255, 0.08) 30%, transparent 31%),
    radial-gradient(circle at -5% 50%, transparent 0%, transparent 48%, rgba(255, 255, 255, 0.08) 49%, rgba(255, 255, 255, 0.08) 50%, transparent 51%),
    radial-gradient(circle at -5% 50%, transparent 0%, transparent 68%, rgba(255, 255, 255, 0.05) 69%, rgba(255, 255, 255, 0.05) 70%, transparent 71%) !important;
  background-repeat: no-repeat !important;
  position: relative;
  padding: clamp(4.5rem, 8vw, 8rem) 0;
  color: #ffffff;
}

.ABT-collection-hero .ABT-eyebrow {
  color: #E0E320 !important;
}

.ABT-collection-hero h1#page-title {
  color: #ffffff !important;
  font-size: clamp(3.5rem, 8vw, 6rem) !important;
  line-height: 0.88 !important;
}

.ABT-collection-hero-copy p:not(.ABT-eyebrow) {
  color: #ffffff !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
  max-width: 520px !important;
  margin-top: 1.5rem !important;
}

.ABT-collection-hero-mark {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 250px;
}

.ABT-collection-hero-mark p {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: min(25rem, 72vw);
  aspect-ratio: 1;
  margin: 0;
  color: #54204f;
  background: #efe1ee;
  border: 2px solid currentColor;
  border-radius: 48% 52% 50% 50%;
  font: 800 clamp(2.6rem, 6vw, 5rem)/0.9 "Barlow Semi Condensed", sans-serif;
  text-align: center;
  text-transform: uppercase;
  transform: rotate(-6deg);
}

/* Page Section & Cards Grid */
.ABT-page-section {
  padding: clamp(5rem, 9vw, 9rem) 0;
  background: #fbfbf7;
}

.ABT-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem);
}

.ABT-section-intro h2 {
  font-size: clamp(2.2rem, 3.8vw, 3.8rem) !important;
  line-height: 1.05 !important;
}

.ABT-path-grid {
  margin-bottom: 1.25rem;
}

.ABT-path-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(1.6rem, 3vw, 2.6rem);
  background: #ffffff;
  border: 1px solid rgba(28, 69, 82, 0.18);
  border-radius: 1.2rem;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06);
  height: 100%;
  transition: transform 300ms ease, border-color 300ms ease;
}

.ABT-path-card::before {
  display: block;
  width: 3.2rem;
  height: 0.35rem;
  margin-bottom: 2rem;
  content: "";
  background: #8e2288;
}

.ABT-path-card h3 {
  margin: 0 0 1rem;
  font: 800 clamp(1.5rem, 2.8vw, 2.5rem)/1 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: #172f37;
}

.ABT-path-card p {
  margin: 0;
  color: #486069;
}

.ABT-path-explore {
  margin-top: auto !important;
  padding-top: 2rem;
}

.ABT-path-explore a {
  color: #8e2288;
  font-size: 1.5rem;
  font-weight: 800;
  text-decoration: none;
}

.ABT-path-card:hover {
  border-color: #8e2288;
  transform: translateY(-4px);
}

/* Feature Strip Section */
.ABT-feature-strip {
  padding: clamp(5rem, 9vw, 9rem) 0;
  background: #54204f;
  color: #ffffff;
}

.ABT-feature-strip .ABT-eyebrow {
  color: #E0E320;
}

.ABT-feature-strip h2 {
  color: #ffffff;
  font-size: clamp(3.5rem, 7vw, 7rem);
}

.ABT-feature-strip-copy p {
  max-width: 48rem;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.12rem;
}

/* Reveal Animation States */
.ABT-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 650ms ease, transform 650ms ease;
}

.ABT-reveal.ABT-is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Responsive Adjustments */
@media (max-width: 1000px) {
  .ABT-path-grid {
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .ABT-collection-hero h1 {
    font-size: clamp(3.6rem, 18vw, 5.7rem) !important;
  }
  .ABT-section-intro,
  .ABT-feature-strip-inner {
    flex-direction: column;
    gap: 2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ABT-reveal {
    opacity: 1;
    transform: none;
  }
  .ABT-path-card {
    transition: none;
  }
}
/* Prefixed Stylesheet (MIG_) - Theme Additional CSS */

/* Container Consistency Rule */
.MIG-workshop-hero .wp-block-group__inner-container,
.MIG-why-section .wp-block-group__inner-container,
.MIG-workshops-section .wp-block-group__inner-container,
.MIG-action-section .wp-block-group__inner-container,
.MIG-booking-section .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Typography & Headings */
.MIG-eyebrow {
  margin: 0 0 1.25rem;
  color: var(--purple, #8e2288);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.MIG-workshop-hero h1,
.MIG-why-heading h2,
.MIG-workshops-heading h2,
.MIG-action-section h2,
.MIG-booking-section h2 {
  margin: 0;
  color: var(--teal, #1c4552);
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.92;
  text-transform: uppercase;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.MIG-workshop-hero h1 em,
.MIG-workshops-heading h2 em,
.MIG-action-section h2 em {
  color: var(--purple, #8e2288);
  font-style: normal;
}

.MIG-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin: 0 0 3rem;
  color: #65777c;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.MIG-breadcrumb a {
  text-decoration-color: rgba(28, 69, 82, 0.3);
  text-underline-offset: 0.2rem;
  color: inherit;
}

/* Hero Section */
.MIG-workshop-hero {
  min-height: 730px;
  overflow: hidden;
 /* background: #fbfaf5;*/
  padding: clamp(5rem, 8vw, 8.5rem) 0;
}
.MIG-hero-copy {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.MIG-workshop-hero h1 {
  max-width: 820px;
  font-size: clamp(4.6rem, 8.2vw, 8.4rem);
}
.MIG-hero-deck {
  max-width: 660px;
  margin: 2rem 0;
  color: #425a61;
  font-size: clamp(1.1rem, 1.45vw, 1.3rem);
}
.MIG-workshop-button {
  margin: 0;
}
.MIG-workshop-button a {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 0.8rem;
  padding: 0.86rem 1.2rem;
  color: #ffffff;
  background: var(--teal, #1c4552);
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, background 180ms ease;
}
.MIG-workshop-button span {
  color: var(--lime, #e0e320);
}
.MIG-workshop-button a:hover,
.MIG-workshop-button a:focus-visible {
  background: var(--purple, #8e2288);
  transform: translateY(-2px);
}

/* Hero Learning Pathway */
.MIG-hero-path {
  position: relative;
  display: flex;
  justify-content: left;
  flex-direction: column;
  /*padding: clamp(4rem, 7vw, 7rem) clamp(2.5rem, 4vw, 5rem);*/
  color: #ffffff;
  background: var(--teal, #1c4552);
  border-radius: 1.5rem;
  overflow: hidden;
}
.MIG-hero-path::before,
.MIG-hero-path::after {
  position: absolute;
  content: "";
  border: 1px solid rgba(224, 227, 32, 0.28);
  border-radius: 50%;
}
.MIG-hero-path::before { right: -18%; bottom: -10%; width: 420px; height: 420px; }
.MIG-hero-path::after { right: -7%; bottom: 2%; width: 280px; height: 280px; }

.MIG-path-intro {
  margin: 0 0 2rem;
  color: var(--lime, #e0e320);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}
.MIG-path-step {
  position: relative;
  z-index: 1;
  padding: 1.0rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
}
.MIG-path-step p {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(110px, .25fr);
  gap: clamp(.5rem, 1.5vw, 1.4rem);
  align-items: baseline;
  margin: 0;
}
.MIG-path-step span {
  min-width: 0;
  font: 800 clamp(.8rem, 1.5vw, 1.5rem)/0.9 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}
.MIG-path-step small {
  min-width: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
  line-height: 1.35;
}
.MIG-path-step-experience span { color: var(--orange, #f15922); }
.MIG-path-step-accent span { color: var(--lime, #e0e320); }

/* Why Section */
.MIG-why-section {
  padding: clamp(6rem, 10vw, 10rem) 0;
  background: #fbfaf5;
}
.MIG-why-heading h2 {
  font-size: clamp(3.3rem, 5.6vw, 5.8rem);
}
.MIG-why-copy p {
  margin: 0 0 1.35rem;
  color: #425960;
  font-size: 1.07rem;
}
.MIG-dignity-statement {
  max-width: 980px;
  margin: 3rem 0 0 auto;
  padding: 2.5rem 0 0 clamp(1.5rem, 4vw, 4rem);
  color: var(--purple, #8e2288);
  border-top: 1px solid rgba(28, 69, 82, 0.18);
  border-left: none;
}
.MIG-dignity-statement p {
  font: 700 clamp(2rem, 3.5vw, 3.5rem)/1.08 "Barlow Semi Condensed", sans-serif;
  margin: 0;
}

/* Workshops Section */
.MIG-workshops-section {
  padding: clamp(6rem, 10vw, 10rem) 0;
  background: #e9ebe3;
}
.MIG-workshops-heading {
  margin-bottom: 5rem;
}
.MIG-workshops-heading h2 {
  font-size: clamp(3.5rem, 6vw, 6rem);
}
.MIG-workshops-heading p {
  margin: 0;
  color: #4f646b;
  font-size: 1.08rem;
}

.MIG-workshop {
  margin-bottom: 2rem;
  padding: clamp(2rem, 5vw, 5rem);
  background: #ffffff;
  border-top: 8px solid var(--purple, #8e2288);
  box-shadow: 0 16px 50px rgba(23, 47, 55, 0.07);
}
.MIG-workshop-experience { border-top-color: var(--orange, #f15922); }
.MIG-workshop-faith { border-top-color: var(--teal-bright, #187575); }

.MIG-workshop-type {
  margin: 0 0 1rem;
  color: var(--purple, #8e2288);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.MIG-workshop-experience .MIG-workshop-type { color: #b83b10; }
.MIG-workshop-faith .MIG-workshop-type { color: var(--teal-bright, #187575); }

.MIG-workshop-title h3 {
  margin: 0;
  font: 800 clamp(2.8rem, 5vw, 5rem)/0.92 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}
.MIG-workshop-subtitle {
  max-width: 430px;
  margin: 1rem 0 0;
  color: #60747a;
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.MIG-workshop-lede {
  margin: 2rem 0 0;
  color: var(--purple, #8e2288);
  font: 700 clamp(1.5rem, 2.2vw, 2.2rem)/1.1 "Barlow Semi Condensed", sans-serif;
}
.MIG-workshop-experience .MIG-workshop-lede { color: var(--orange, #f15922); }
.MIG-workshop-faith .MIG-workshop-lede { color: var(--teal-bright, #187575); }

.MIG-workshop-body p {
  margin: 0 0 1.25rem;
  color: #465d64;
}

/* Details element inside Workshop */
.MIG-workshop-details {
  margin-top: 2rem;
  border-top: 1px solid rgba(28, 69, 82, 0.18);
  border-bottom: 1px solid rgba(28, 69, 82, 0.18);
}
.MIG-workshop-details summary {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 0;
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}
.MIG-workshop-details summary::-webkit-details-marker { display: none; }
.MIG-workshop-details summary span {
  color: var(--purple, #8e2288);
  font-size: 1.4rem;
  transition: transform 180ms ease;
}
.MIG-workshop-details[open] summary span { transform: rotate(45deg); }
.MIG-workshop-details p {
  margin: 0;
  padding: 0 0 1.35rem;
  color: #52676d;
}

.MIG-workshop-quote {
  margin: 2rem 0 0;
  padding-top: 2rem;
  color: var(--teal, #1c4552);
  border-top: 1px solid rgba(28, 69, 82, 0.18);
  font: 700 clamp(1.5rem, 2.5vw, 2.5rem)/1.1 "Barlow Semi Condensed", sans-serif;
}

/* Action Section */
.MIG-action-section {
  color: #ffffff;
  background: var(--purple, #8e2288);
  padding-bottom: clamp(5rem, 9vw, 9rem);
}
.MIG-action-kicker {
  padding: 0.9rem 1.5rem;
  color: var(--ink, #172f37);
  background: var(--lime, #e0e320);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: clamp(4rem, 6vw, 6rem);
}
.MIG-action-section .MIG-eyebrow { color: var(--lime, #e0e320); }
.MIG-action-section h2 {
  color: #ffffff;
  font-size: clamp(3.4rem, 6vw, 6rem);
}
.MIG-action-copy {
  align-self: end;
}
.MIG-action-copy p {
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.08rem;
}
.MIG-action-callout {
  margin: 2.5rem 0 0 !important;
  padding-top: 2rem;
  color: var(--lime, #e0e320) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  font: 700 clamp(1.4rem, 2.2vw, 2.1rem)/1.2 "Barlow Semi Condensed", sans-serif !important;
}

/* Booking Section */
.MIG-booking-section {
  position: relative;
  padding: clamp(7rem, 11vw, 11rem) 0;
  background: #fbfaf5;
}
.MIG-booking-tag {
  position: absolute;
  top: 0;
  right: 1.5rem;
  padding: 0.55rem 1rem;
  color: #ffffff;
  background: #b83b10;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.MIG-booking-section h2 {
  font-size: clamp(3.2rem, 5.5vw, 5.6rem);
}
.MIG-booking-copy p:last-child {
  max-width: 600px;
  margin: 1.7rem 0 0;
  color: #4b6269;
  font-size: 1.08rem;
}

.MIG-booking-actions {
  align-self: center;
  border-top: 1px solid rgba(28, 69, 82, 0.18);
}
.MIG-booking-link {
  margin: 0;
  border-bottom: 1px solid rgba(28, 69, 82, 0.18);
}
.MIG-booking-link a {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: center;
  padding: 1.7rem 0;
  font-weight: 800;
  text-decoration: none;
  color: inherit;
}
.MIG-booking-link b {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  color: #ffffff;
  background: var(--purple, #8e2288);
  border-radius: 50%;
  font-size: 1.25rem;
  transition: transform 180ms ease, background 180ms ease;
}
.MIG-booking-link:first-child b {
  color: var(--ink, #172f37);
  background: var(--orange, #f15922);
}
.MIG-booking-link a:hover b,
.MIG-booking-link a:focus-visible b {
  background: var(--teal, #1c4552);
  color: #ffffff;
  transform: rotate(45deg);
}

/* Animations */
.MIG-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 600ms ease, transform 600ms ease;
}
.MIG-reveal.MIG-is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .MIG-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/* Prefixed Stylesheet (HWE_) - Theme Additional CSS */

/* Inner Container Alignment Rule */
.HWE-collection-hero .wp-block-group__inner-container,
.HWE-page-section .wp-block-group__inner-container,
.HWE-feature-strip .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical Treatments */
.HWE-eyebrow {
  margin-bottom: 1.25rem;
  color: var(--teal-bright, #187575);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.HWE-collection-hero h1,
.HWE-section-intro h2,
.HWE-feature-strip h2 {
  margin: 0 0 1.25rem;
  color: var(--teal, #1c4552);
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.88;
  text-transform: uppercase;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.HWE-collection-hero h1 em,
.HWE-section-intro h2 em,
.HWE-feature-strip h2 em {
  color: var(--lime, #e0e320);
  font-style: normal;
}

/* Hero Section Styles */
.HWE-collection-hero {
  position: relative;
  min-height: 610px;
  padding: clamp(4.5rem, 9vw, 8rem) 0;
  color: #ffffff;
  background: var(--page-deep, #183f4a);
}

.HWE-collection-hero .HWE-eyebrow {
  color: var(--lime, #e0e320);
}

.HWE-collection-hero h1#page-title {
  color: #ffffff;
  font-size: clamp(4.3rem, 8vw, 8rem);
}

.HWE-collection-hero-copy p:not(.HWE-eyebrow) {
  max-width: 42rem;
  margin-top: 2rem;
  color: rgba(255, 255, 255, 0.85);
  font-size: clamp(1.08rem, 1.7vw, 1.32rem);
  line-height: 1.55;
}

/* 3-Step Hero Mark Stamp */
.HWE-collection-hero-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
}

.HWE-collection-hero-mark p {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: min(25rem, 72vw);
  aspect-ratio: 1;
  margin: 0;
  color: var(--page-deep, #183f4a);
  background: var(--page-wash, #dbecec);
  border: 2px solid currentColor;
  border-radius: 48% 52% 50% 50%;
  font: 800 clamp(2.6rem, 6vw, 5rem)/0.9 "Barlow Semi Condensed", sans-serif;
  text-align: center;
  text-transform: uppercase;
  transform: rotate(-6deg);
}

/* Page Section & Grid */
.HWE-page-section {
  padding: clamp(5rem, 9vw, 8.5rem) 0;
  background: #fbfbf7;
}

.HWE-section-intro {
  margin-bottom: clamp(3rem, 7vw, 6rem);
}

.HWE-section-intro h2 {
  font-size: clamp(3.4rem, 7vw, 6.8rem);
  line-height: 0.9;
}

.HWE-section-intro p {
  max-width: 44rem;
  font-size: 1.12rem;
  color: #172f37;
}

.HWE-path-grid {
  margin-bottom: 2rem;
}

.HWE-path-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: clamp(1.6rem, 3vw, 2.6rem);
  background: #ffffff;
  border: 1px solid rgba(28, 69, 82, 0.18);
  border-radius: 1.2rem;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06);
  transition: transform 300ms ease, border-color 300ms ease;
}

.HWE-path-card::before {
  display: block;
  width:4rem;
  height: 0.35rem;
  margin-bottom: 2rem;
  content: "";
  background: var(--page-accent, #167575);
}

.HWE-path-card h3 {
  margin: 0 0 1rem;
  color: #172f37;
  font: 800 clamp(1.1rem, 1.5vw, 2.0rem)/1 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -0.025em;
  text-transform: uppercase;
}

.HWE-path-card p {
  margin: 0;
  color: #486069;
}

.HWE-path-explore {
  margin-top: auto !important;
  padding-top: 2rem;
}

.HWE-path-explore a {
  color: var(--page-accent, #167575);
  font-size: 1.5rem;
  font-weight: 800;
  text-decoration: none;
}

.HWE-path-card:hover {
  border-color: var(--page-accent, #167575);
  transform: translateY(-4px);
}

/* Feature Strip Section */
.HWE-feature-strip {
  padding: clamp(5rem, 9vw, 9rem) 0;
  color: #ffffff;
  background: var(--page-deep, #183f4a);
}

.HWE-feature-strip .HWE-eyebrow {
  color: var(--lime, #e0e320);
}

.HWE-feature-strip h2 {
  color: #ffffff;
  font-size: clamp(3.5rem, 7vw, 7rem);
  line-height: 0.9;
}

.HWE-feature-strip-copy p {
  max-width: 48rem;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.12rem;
}

/* Principle List */
.HWE-principle-list {
  display: grid;
  gap: 0;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.HWE-principle-list li {
  display: grid;
  grid-template-columns: minmax(10rem, 0.55fr) 1fr;
  gap: 2rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  margin: 0;
}

.HWE-principle-list strong {
  color: var(--lime, #e0e320);
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: 1.35rem;
  text-transform: uppercase;
}

.HWE-principle-list span {
  color: rgba(255, 255, 255, 0.85);
}

/* Animations */
.HWE-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 650ms ease, transform 650ms ease;
}

.HWE-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Responsive Styles */
@media (max-width: 1000px) {
  .HWE-path-grid {
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .HWE-collection-hero h1 {
    font-size: clamp(3.6rem, 18vw, 5.7rem);
  }
  .HWE-section-intro,
  .HWE-feature-strip-inner {
    flex-direction: column;
    gap: 2rem;
  }
  .HWE-principle-list li {
    grid-template-columns: 1fr;
    gap: 0.3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .HWE-reveal {
    opacity: 1;
    transform: none;
  }
  .HWE-path-card {
    transition: none;
  }
}
/* Prefixed Stylesheet (GIN_) - Theme Additional CSS */

/* Container Consistency Alignment Rule */
.GIN-involved-hero .wp-block-group__inner-container,
.GIN-ways .wp-block-group__inner-container,
.GIN-movement-path .wp-block-group__inner-container,
.GIN-involved-close .wp-block-group__inner-container {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Base Typographical Treatments */
.GIN-eyebrow {
  margin-bottom: 1.25rem;
  color: var(--purple, #8e2288);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.GIN-involved-hero h1,
.GIN-ways-heading h2,
.GIN-movement-heading h2,
.GIN-involved-close h2 {
  margin: 0;
  color: var(--teal, #1c4552);
  font-family: "Barlow Semi Condensed", Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.86;
  text-transform: uppercase;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.GIN-involved-hero h1 em,
.GIN-ways-heading h2 em,
.GIN-movement-heading h2 em,
.GIN-involved-close h2 em {
  color: var(--orange, #f15922);
  font-style: normal;
}

/* Hero Section */
.GIN-involved-hero {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  color: #ffffff;
  background: var(--ink, #172f37);
  padding: clamp(2rem, 6vw, 5rem) 0 5rem;
}

.GIN-hero-kicker .GIN-eyebrow {
  color: var(--lime, #e0e320);
}

.GIN-kicker-text {
  display: block;
  color: rgba(255, 255, 255, 0.48);
  font: 800 clamp(1.4rem, 2vw, 2rem)/1 "Barlow Semi Condensed", sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 2rem;
}

.GIN-hero-statement h1 {
  font-size: clamp(5.4rem, 10.8vw, 11rem);
  color: #ffffff;
}

.GIN-hero-statement p {
  max-width: 520px;
  margin: 2rem 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(1.08rem, 1.5vw, 1.3rem);
}

/* Ways Section / Action Board */
.GIN-ways {
  padding: clamp(7rem, 11vw, 11rem) 0;
  background: #f7f7f2;
}

.GIN-ways-heading {
  margin-bottom: 5rem;
}

.GIN-ways-heading h2 {
  font-size: clamp(4rem, 7vw, 7.2rem);
}

.GIN-ways-heading p {
  max-width: 430px;
  color: #586d73;
}

.GIN-action-board {
  border-top: 1px solid rgba(23, 47, 55, 0.24);
}

.GIN-action-card {
  --action: var(--teal-bright, #187575);
  position: relative !important;
  min-height: 210px;
  padding: 2.5rem 1.4rem;
  color: var(--ink, #172f37);
  border-bottom: 1px solid rgba(23, 47, 55, 0.24);
  transition: color 220ms ease, background 220ms ease, padding 220ms ease;
}

.GIN-action-card a {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
  color: inherit;
}

.GIN-action-card a::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}

.GIN-action-news { --action: var(--moss, #6a712d); }
.GIN-action-events { --action: var(--orange, #f15922); }
.GIN-action-donate { --action: var(--purple, #8e2288); }

.GIN-action-card:hover, 
.GIN-action-card:focus-visible {
  padding-right: 2rem;
  padding-left: 2rem;
  color: #ffffff;
  background: var(--action);
}

.GIN-action-copy {
  display: grid;
  grid-template-columns: minmax(250px, 0.75fr) 1fr;
  column-gap: 4rem;
  align-items: center;
}

.GIN-action-verb {
  grid-column: 1 / -1;
  margin: 0 0 0.35rem;
  color: var(--action);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.GIN-action-card:hover .GIN-action-verb,
.GIN-action-card:focus-visible .GIN-action-verb {
  color: var(--lime, #e0e320);
}

.GIN-action-copy h3 {
  margin: 0;
  font: 800 clamp(2.7rem, 4.8vw, 5rem)/0.9 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}

.GIN-action-copy p:last-child {
  max-width: 440px;
  margin: 0;
  color: #5a6d73;
}

.GIN-action-card:hover .GIN-action-copy p:last-child,
.GIN-action-card:focus-visible .GIN-action-copy p:last-child {
  color: rgba(255, 255, 255, 0.82);
}

.GIN-action-arrow {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: var(--lime, #e0e320) !important;
  border: none !important;
  color: var(--ink, #172f37);
  font-size: 1.5rem;
  margin-left: auto;
  flex-shrink: 0;
  transition: transform 220ms ease;
}

.GIN-action-card:hover .GIN-action-arrow,
.GIN-action-card:focus-visible .GIN-action-arrow {
  transform: translate(5px, -5px) rotate(45deg);
}

/* Movement Path Section */
.GIN-movement-path {
  padding: clamp(7rem, 11vw, 11rem) 0;
  color: #ffffff;
  background: var(--purple, #8e2288);
}

.GIN-movement-heading {
  margin-bottom: 5rem;
}

.GIN-movement-heading .GIN-eyebrow {
  color: var(--lime, #e0e320);
}

.GIN-movement-heading h2 {
  color: #ffffff;
  font-size: clamp(4rem, 7vw, 7.2rem);
}

.GIN-movement-steps {
  border-top: 1px solid rgba(255, 255, 255, 0.35);
  padding-top: 2rem;
}

.GIN-step-card {
  position: relative;
  min-height: 280px;
  padding: 2rem 1.5rem 2rem 0;
  border-right: 1px solid rgba(255, 255, 255, 0.35);
  height: 100%;
}

.GIN-movement-steps .wp-block-column:last-child .GIN-step-card {
  border-right: 0;
}

.GIN-step-title strong {
  display: block;
  margin-top: 3.5rem;
  font: 800 clamp(2.2rem, 3.7vw, 3.8rem)/1 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
  color: #ffffff;
}

.GIN-step-card p:not(.GIN-step-title) {
  color: rgba(255, 255, 255, 0.76);
  margin: 0;
}

/* Close Section */
.GIN-involved-close {
  position: relative;
  padding: clamp(3rem, 5vw, 5rem) 0;
  overflow: hidden;
  color: var(--ink, #172f37);
  background: var(--lime, #e0e320);
}

.GIN-close-copy .GIN-eyebrow {
  color: var(--purple, #8e2288);
}

.GIN-close-copy h2 {
  font-size: clamp(4rem, 7vw, 7.2rem);
}

.GIN-close-copy p:last-child {
  max-width: 570px;
  margin: 2rem 0 0;
  font-size: 1.2rem;
}

.GIN-close-link {
  margin: 0;
  align-self: flex-end;
}

.GIN-close-link a {
  display: inline-flex;
  gap: 2rem;
  align-items: center;
  padding: 1.2rem 1.5rem;
  color: #ffffff;
  background: var(--ink, #172f37);
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform 200ms ease, background 200ms ease;
}

.GIN-close-link a:hover,
.GIN-close-link a:focus-visible {
  background: var(--purple, #8e2288);
  transform: translateY(-3px);
}

/* Animations */
.GIN-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 650ms ease, transform 650ms ease;
}

.GIN-reveal.GIN-is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Responsive Adjustments */
@media (max-width: 900px) {
  .GIN-ways-heading,
  .GIN-action-copy {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .GIN-movement-steps {
    flex-wrap: wrap;
  }
  .GIN-step-card {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    min-height: auto;
    padding-bottom: 2rem;
  }
}
.GIN-collection-hero-art img {
  width: 100% !important;
  height: 100% !important;
  min-height: 380px !important;
  object-fit: cover !important;
  border-radius: 1.5rem !important;
}

.GIN-collection-hero-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
}

@media (prefers-reduced-motion: reduce) {
  .GIN-reveal {
    opacity: 1;
    transform: none;
  }
  .GIN-action-card,
  .GIN-action-arrow,
  .GIN-close-link a {
    transition: none;
  }
}

/* ==========================================================================
   MAR (Mission & Roots) Page Gutenberg Stylesheet
   Prefix: .MAR-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Collection Hero Section
   Controls top green-tone hero banner layout, artwork frame, and title typography
   -------------------------------------------------------------------------- */
.MAR-collection-hero {
  position: relative;
  min-height: 610px;
  color: var(--white);
  background: #364a3f; /* --page-deep green tone */
  overflow: hidden;
}

.MAR-collection-hero .wp-block-columns {
  align-items: center;
}

.MAR-collection-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2.5rem, 4vw, 4rem) 0;
}

.MAR-collection-hero-copy .eyebrow {
  color: var(--lime);
}

.MAR-collection-hero h1#page-title {
  margin: 0;
  color: var(--white);
  font: 800 clamp(4.3rem, 8vw, 8rem)/.88 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.MAR-collection-hero h1#page-title em {
  color: var(--lime);
  font-style: normal;
}

.MAR-collection-hero-copy > p:not(.eyebrow) {
  max-width: 42rem;
  margin: 2rem 0 0;
  color: rgba(255, 255, 255, 0.85);
  font-size: clamp(1.08rem, 1.7vw, 1.32rem);
  line-height: 1.55;
}

.MAR-collection-hero-art {
  position: relative;
  min-height: 500px;
  overflow: hidden;
  background: #eef0d8; /* --page-wash green tone */
}

.MAR-collection-hero-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --------------------------------------------------------------------------
   2. Statement Section (Mission Overview)
   Controls 2-column layout for main statement text and partner photo
   -------------------------------------------------------------------------- */
.MAR-statement-section {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(5rem, 9vw, 8.5rem) clamp(1.25rem, 4vw, 3rem);
}

.MAR-statement-panel {
  display: grid;
  align-items: center;
}

.MAR-statement-panel .eyebrow {
  color: #6a712d; /* Green accent */
}

.MAR-statement-panel h2 {
  margin: 0 0 1.5rem;
  color: var(--ink);
  font: 800 clamp(3.4rem, 7vw, 6.8rem)/.9 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -.04em;
  text-transform: uppercase;
}

.MAR-statement-panel h2 em {
  color: #6a712d;
  font-style: normal;
}

.MAR-statement-panel p {
  font-size: 1.1rem;
  color: var(--ink);
}

.MAR-statement-panel figure {
  margin: 0;
  min-height: 420px;
  overflow: hidden;
  border-radius: 55% 55% 1.5rem 1.5rem;
}

.MAR-statement-panel figure img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
}

/* --------------------------------------------------------------------------
   3. Feature Strip (Our Roots)
   Controls full-width dark green background banner and multi-paragraph layout
   -------------------------------------------------------------------------- */
.MAR-feature-strip {
  color: var(--white);
  background: #364a3f;
  padding: clamp(3rem, 4vw, 9rem) 0;
}

.MAR-feature-strip-inner {
  align-items: flex-start;
}

.MAR-feature-strip .eyebrow {
  color: var(--lime);
}

.MAR-feature-strip h2 {
  margin: 0;
  color: var(--white);
  font: 800 clamp(3.5rem, 7vw, 7rem)/.9 "Barlow Semi Condensed", sans-serif;
  text-transform: uppercase;
}

.MAR-feature-strip-copy > p {
  max-width: 48rem;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.12rem;
  margin-bottom: 1.5rem;
}

/* --------------------------------------------------------------------------
   4. Reflection / Quote Section
   Controls light wash background panel and quote typography
   -------------------------------------------------------------------------- */
.MAR-quote-section {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(2rem, 9vw, 8.5rem) clamp(1.25rem, 4vw, 3rem);
}

.MAR-quote-section h3 {
  margin: 0 0 .5rem;
  color: var(--ink);
  font: 800 clamp(2rem, 3vw, 3rem)/.9 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -.04em;
  text-transform: uppercase;
}


.MAR-quote-panel {
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
  padding: clamp(4rem, 4vw, 3.5rem) clamp(2rem, 7vw, 6rem);
  background: #eef0d8;
  border-radius: 2rem;
}

.MAR-quote-panel > p {
  max-width: 48rem;
  margin: 0 0 clamp(2.5rem, 5vw, 4.5rem);
  color: #425b63;
  font-size: 1.12rem;
}

.MAR-quote-panel blockquote {
  margin: 0;
  font: 700 clamp(2rem, 4vw, 4rem)/1.08 "Barlow Semi Condensed", sans-serif;
  letter-spacing: -.025em;
  color: var(--ink);
}

.MAR-quote-panel blockquote em {
  display: block;
  margin-bottom: 1.5rem;
  color: #6a712d;
  font-style: normal;
}

.MAR-quote-panel cite {
  display: block;
  margin-top: 2rem;
  color: #6a712d;
  font-style: normal;
  font-weight: 800;
}
/* ==========================================================================
   PEO (Our People) Page Gutenberg Stylesheet
   Prefix: .PEO-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Hero Section Layout & Arc Graphic Controls
   Controls background paper wash, title typography, and circular background arcs
   -------------------------------------------------------------------------- */
.PEO-hero-section.collection-hero {
  background-color: #f4efd9 !important; /* Warm Paper Wash */
  color: #172f37 !important;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(5rem, 10vw, 9rem) clamp(2rem, 6vw, 6rem) !important;
}

.PEO-hero-section.collection-hero::before {
  position: absolute !important;
  inset: auto auto -10rem -8rem !important;
  z-index: 0 !important;
  width: 28rem !important;
  height: 28rem !important;
  content: "" !important;
  border: 2px solid rgba(23, 47, 55, 0.08) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3rem rgba(23, 47, 55, 0.04), 0 0 0 6rem rgba(23, 47, 55, 0.025) !important;
  pointer-events: none !important;
}

.PEO-hero-section .eyebrow {
  color: #8e2288 !important; /* KAIROS Purple */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.PEO-hero-section h1.staff-hero-title {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
  line-height: 0.82 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1.5rem 0 !important;
}

.PEO-hero-section h1.staff-hero-title em.lime-text {
  color: #e0e320 !important; /* KAIROS Lime */
  font-style: normal !important;
  display: block !important;
}

.PEO-hero-section p.hero-lead {
  color: #172f37 !important;
  opacity: 0.92 !important;
  font-size: clamp(1.2rem, 1.8vw, 1.5rem) !important;
  line-height: 1.6 !important;
  max-width: 38rem !important;
}

.PEO-hero-section .collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  width: 150px !important;
  height: 150px !important;
  margin: 0 auto !important;
  color: #172f37 !important;
  background: #e0e320 !important;
  border-radius: 50% !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
  box-shadow: 0 12px 38px rgba(23, 47, 55, 0.18) !important;
}

/* --------------------------------------------------------------------------
   2. Introductory Text Controls
   Controls section display title sizing and purple accent tags
   -------------------------------------------------------------------------- */
.PEO-intro-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(5rem, 9vw, 9rem) 1.5rem;
}

.PEO-intro-section .section-intro h2 {
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3.6rem, 7.5vw, 7.1rem) !important;
  line-height: 0.85 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
  color: #1c4552 !important; /* KAIROS Dark Teal */
}

.PEO-intro-section .section-intro h2 em {
  color: #8e2288 !important;
  font-style: normal !important;
}

/* --------------------------------------------------------------------------
   3. Directory Grid & Staff Cards
   Controls responsive card layout, headshot aspect ratios, and summary toggles
   -------------------------------------------------------------------------- */
.PEO-directory-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1.5rem !important;
  margin-top: 3.5rem !important;
}

.PEO-person-card {
  background: #ffffff !important;
  border: 1px solid rgba(28, 69, 82, 0.18) !important;
  border-radius: 1.2rem !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

.PEO-person-card figure {
  margin: 0 !important;
}

.PEO-person-card img {
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  object-position: center 18% !important;
}

.PEO-person-card .person-card-copy {
  padding: 1.35rem !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.PEO-person-card h3 {
  margin: 0 !important;
  font-family: "Barlow Semi Condensed", sans-serif !important;
  font-weight: 800 !important;
  font-size: 1.55rem !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
}

.PEO-person-card .person-card-copy > p {
  margin: 0.6rem 0 0 0 !important;
  color: #53666d !important;
  font-size: 0.92rem !important;
  line-height: 1.4 !important;
}

.PEO-person-card details {
  margin-top: auto !important;
  padding-top: 0.9rem !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

.PEO-person-card details summary {
  color: #8e2288 !important;
  font-weight: 800 !important;
  font-size: 0.9rem !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  transition: color 0.2s ease !important;
}

.PEO-person-card details summary:hover,
.PEO-person-card details summary:focus {
  color: #1c4552 !important;
}

.PEO-person-card details p {
  font-size: 0.86rem !important;
  line-height: 1.55 !important;
  margin-top: 0.5rem !important;
  margin-bottom: 0 !important;
  color: #172f37 !important;
}

/* Responsive Directory Breakpoints */
@media (max-width: 1100px) {
  .PEO-directory-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .PEO-directory-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 480px) {
  .PEO-directory-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================================
   MCG (Member Churches & Governance) Page Gutenberg Stylesheet
   Prefix: .MCG-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Hero Section Layout & Tilted Badge Controls
   Controls background wash, top title typography, and circular badge artwork
   -------------------------------------------------------------------------- */
.MCG-hero-section {
  background-color: #eef0d8; /* Green wash background */
  color: #172f37;
  position: relative;
  overflow: hidden;
  padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem);
}

.MCG-hero-section h1.governance-title {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-weight: 800;
  font-size: clamp(4.5rem, 8.5vw, 8.5rem);
  line-height: 0.85;
  letter-spacing: -0.035em;
  text-transform: uppercase;
  color: #172f37;
  margin: 0 0 1.5rem 0;
}

.MCG-hero-section h1.governance-title em.lime-text {
  color: #e0e320; /* Solid KAIROS Lime */
  font-style: normal;
  display: block;
}

.MCG-hero-section .hero-lead {
  color: #172f37;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  line-height: 1.55;
  max-width: 38rem;
}

.MCG-hero-section .governance-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(260px, 22vw, 340px);
  height: clamp(260px, 22vw, 340px);
  margin: 0 auto;
  border: 2px solid #172f37;
  border-radius: 50%;
  background: transparent;
}

.MCG-hero-section .governance-badge p {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-weight: 800;
  font-size: clamp(2.2rem, 3.5vw, 3.8rem);
  line-height: 0.9;
  text-transform: uppercase;
  color: #172f37;
  text-align: center;
  transform: rotate(-10deg);
  margin: 0;
}

/* --------------------------------------------------------------------------
   2. Governance Intro Section Controls
   Controls section display title, moss-green accents, and 2-column intro layout
   -------------------------------------------------------------------------- */
.MCG-governance-section {
  padding: clamp(5rem, 9vw, 8.5rem) 1.5rem;
  max-width: 1240px;
  margin: 0 auto;
}

.MCG-governance-section .section-intro h2 {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-weight: 800;
  font-size: clamp(4rem, 8vw, 7.5rem);
  line-height: 0.85;
  text-transform: uppercase;
  color: #172f37;
}

.MCG-governance-section .section-intro h2 em.moss-text,
.MCG-governance-section .section-intro h2 em {
  color: #6a712d; /* KAIROS Moss Green */
  font-style: normal;
}

/* --------------------------------------------------------------------------
   3. Name Cloud Pill Containers
   Controls interactive pill tags for member churches and steering committee members
   -------------------------------------------------------------------------- */
.MCG-name-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin-top: 2rem;
}

.MCG-name-cloud p {
  margin: 0;
  padding: 0.75rem 1.25rem;
  background-color: #ffffff;
  color: #172f37;
  border: 1px solid rgba(28, 69, 82, 0.18);
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.95rem;
  line-height: 1.2;
  box-shadow: 0 4px 12px rgba(23, 47, 55, 0.04);
}

/* --------------------------------------------------------------------------
   4. Feature Strip Section Controls
   Controls full-width dark green background banner and committee member cloud
   -------------------------------------------------------------------------- */
.MCG-feature-strip {
  background-color: #364a3f; /* Tone Green Deep */
  color: #ffffff;
  padding: clamp(5rem, 9vw, 9rem) 0;
}

.MCG-feature-strip h2 {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-weight: 800;
  font-size: clamp(4rem, 8vw, 7.8rem);
  line-height: 0.85;
  text-transform: uppercase;
  color: #ffffff;
}
/* ==========================================================================
   ANR (Annual Reports Archive) Page Gutenberg Stylesheet
   Prefix: .ANR-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Hero Section Layout & Left Double-Ring Arc Controls
   Controls paper wash background, hero typography, and outer circular graphics
   -------------------------------------------------------------------------- */
.ANR-hero-section.collection-hero {
  background-color: #f4efd9 !important; /* Paper Wash Background */
  color: #172f37 !important;            /* Dark Slate Ink */
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}
.ANR-collection-hero {
  padding: clamp(2.5rem, 4vw, 4rem) clamp(2rem, 7vw, 7rem);
  background: #F3EFDB; /* Default contrast fallback */
}

.ANR-hero-section.collection-hero::before {
  position: absolute !important;
  inset: auto auto -10rem -8rem !important;
  z-index: 0 !important;
  width: 28rem !important;
  height: 28rem !important;
  content: "" !important;
  border: 2px solid rgba(23, 47, 55, 0.08) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3rem rgba(23, 47, 55, 0.04), 0 0 0 6rem rgba(23, 47, 55, 0.025) !important;
  pointer-events: none !important;
}

.ANR-hero-section .eyebrow {
  color: #8e2288 !important; /* KAIROS Purple Accent */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.ANR-hero-section h1.reports-title {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
  line-height: 0.85 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1.5rem 0 !important;
}

.ANR-hero-section h1.reports-title em.lime-text {
  color: #e0e320 !important; /* KAIROS Lime */
  font-style: normal !important;
  display: block !important;
}

.ANR-hero-section p.hero-lead {
  color: #172f37 !important;
  opacity: 0.9 !important;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  line-height: 1.55 !important;
  max-width: 38rem !important;
}

.ANR-hero-section .collection-hero-mark {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  width: 150px !important;
  height: 150px !important;
  margin: 0 auto !important;
  color: #172f37 !important;
  background: #e0e320 !important;
  border-radius: 50% !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
  box-shadow: 0 12px 38px rgba(23, 47, 55, 0.18) !important;
}

/* --------------------------------------------------------------------------
   2. Section Intro Controls
   Controls section display title, purple accent colors, and no-split headings
   -------------------------------------------------------------------------- */
.ANR-reports-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(5rem, 9vw, 8.5rem) 1.5rem;
}

.ANR-reports-section .section-intro h2.no-split-heading {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3.2rem, 6.5vw, 6.2rem) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: manual !important;
}

.ANR-reports-section .section-intro h2.no-split-heading em {
  color: #8e2288 !important; /* KAIROS Purple */
  font-style: normal !important;
  display: block !important;
}

/* --------------------------------------------------------------------------
   3. Document Archive List & Links
   Controls yearly PDF report links, horizontal rule borders, and language options
   -------------------------------------------------------------------------- */
.ANR-resource-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  margin-top: 3rem !important;
  border-top: 1px solid rgba(28, 69, 82, 0.18) !important;
}

.ANR-resource-list .resource-row {
  align-items: center !important;
  padding: 1.8rem 0 !important;
  border-bottom: 1px solid rgba(28, 69, 82, 0.18) !important;
  margin: 0 !important;
}

.ANR-resource-list .resource-date {
  color: #8e2288 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: 1.4rem !important;
  margin: 0 !important;
}

.ANR-resource-list .resource-row h3 {
  margin: 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(1.4rem, 2.2vw, 2rem) !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
}

.ANR-resource-list .resource-links p {
  margin: 0 !important;
  text-align: right !important;
  font-size: 1rem !important;
  color: rgba(23, 47, 55, 0.4) !important;
}

.ANR-resource-list .resource-links a {
  color: #8e2288 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transition: color 0.2s ease !important;
}

.ANR-resource-list .resource-links a:hover {
  color: #1c4552 !important; /* KAIROS Dark Teal */
  text-decoration: underline !important;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .ANR-reports-section .section-intro h2.no-split-heading {
    white-space: normal !important;
  }
  .ANR-resource-list .resource-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
  }
  .ANR-resource-list .resource-links p {
    text-align: left !important;
  }
}
/* ==========================================================================
   CUS (Contact Us) Page Gutenberg Stylesheet
   Prefix: .CUS-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Contact Hero Layout & Background Graphic Controls
   Controls light blue wash background, hero typography, and circular badge artwork
   -------------------------------------------------------------------------- */
.CUS-hero-section.contact-hero {
  background-color: #dbecec !important; /* Light Teal Wash */
  color: #172f37 !important;             /* KAIROS Dark Ink */
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  padding: clamp(5rem, 9vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
}

.CUS-hero-section.contact-hero::before {
  position: absolute !important;
  inset: auto auto -10rem -8rem !important;
  z-index: 0 !important;
  width: 32rem !important;
  height: 32rem !important;
  content: "" !important;
  border: 2px solid rgba(23, 47, 55, 0.1) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3.5rem rgba(23, 47, 55, 0.04), 0 0 0 7rem rgba(23, 47, 55, 0.02) !important;
  pointer-events: none !important;
}

.CUS-hero-section.contact-hero::after {
  position: absolute !important;
  top: -12rem !important;
  right: -10rem !important;
  z-index: 0 !important;
  width: 48rem !important;
  height: 48rem !important;
  content: "" !important;
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.CUS-hero-section .eyebrow {
  color: #167575 !important; /* KAIROS Bright Teal */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.CUS-hero-section h1.contact-hero-title {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(4.5rem, 8.8vw, 8.8rem) !important;
  line-height: 0.85 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1.5rem 0 !important;
}

.CUS-hero-section h1.contact-hero-title em.lime-text,
.CUS-hero-section h1.contact-hero-title em {
  color: #e0e320 !important; /* Solid KAIROS Lime */
  font-style: normal !important;
  display: block !important;
}

.CUS-hero-section p.hero-lead {
  color: #172f37 !important;
  opacity: 0.9 !important;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  line-height: 1.55 !important;
  max-width: 38rem !important;
}

.CUS-hero-section .contact-badge {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: clamp(260px, 22vw, 340px) !important;
  height: clamp(260px, 22vw, 340px) !important;
  margin: 0 auto !important;
  border: 2px solid #172f37 !important;
  border-radius: 50% !important;
  background: transparent !important;
}

.CUS-hero-section .contact-badge p {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2.2rem, 3.5vw, 3.8rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  text-align: center !important;
  transform: rotate(-10deg) !important;
  margin: 0 !important;
}

/* --------------------------------------------------------------------------
   2. Main Section & Form Column Layout Controls
   Controls 2-column main section grid, form shell, and section headings
   -------------------------------------------------------------------------- */
.CUS-contact-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(5rem, 9vw, 8.5rem) 1.5rem;
}

.CUS-contact-section .form-copy h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3rem, 6vw, 5.5rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #1c4552 !important;
  margin: 0 0 1.5rem 0 !important;
}

/* --------------------------------------------------------------------------
   3. Contact Cards & Button Link Controls
   Controls contact card containers, office information, and action buttons
   -------------------------------------------------------------------------- */
.CUS-contact-card {
  padding: 2.2rem !important;
  background-color: #dbecec !important; /* Light Teal Wash */
  border-radius: 1.4rem !important;
  margin-bottom: 1.5rem !important;
}

.CUS-contact-card h3 {
  margin: 0 0 0.8rem 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: 1.5rem !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
}

.CUS-contact-card p a {
  color: #167575 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.CUS-contact-card p a:hover {
  text-decoration: underline !important;
}

.CUS-contact-card .button-row {
  margin: 1.5rem 0 !important;
}

.CUS-contact-card .action-button .wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.9rem 1.4rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: #ffffff !important;
  background-color: #167575 !important;
  border: none !important;
  transition: background-color 0.2s ease !important;
}

.CUS-contact-card .action-button .wp-block-button__link:hover {
  background-color: #183f4a !important;
}

.CUS-contact-card .secondary-button .wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.9rem 1.4rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: #172f37 !important;
  background-color: transparent !important;
  border: 1px solid #172f37 !important;
  transition: all 0.2s ease !important;
}

.CUS-contact-card .secondary-button .wp-block-button__link:hover {
  background-color: #172f37 !important;
  color: #ffffff !important;
}

/* Responsive Overrides */
@media (max-width: 768px) {
  .CUS-contact-section .form-shell {
    flex-direction: column !important;
  }
}
/* ==========================================================================
   TWP (The Two-Way Path) Page Gutenberg Stylesheet
   Prefix: .TWP-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Collection Hero Section
   Controls top dark teal hero background, Two Row Wampum art, and title styling
   -------------------------------------------------------------------------- */
.TWP-hero-section.collection-hero {
  background-color: #183f4a !important; /* Tone Blue Deep */
  color: #ffffff !important;
  position: relative !important;
  padding: clamp(4.5rem, 8vw, 8rem) clamp(2rem, 7vw, 7rem) !important;
  overflow: hidden !important;
}

.TWP-hero-section.collection-hero::before {
  position: absolute !important;
  inset: auto auto -12rem -8rem !important;
  z-index: 1 !important;
  width: 30rem !important;
  height: 30rem !important;
  content: "" !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3.4rem rgba(255, 255, 255, 0.035), 0 0 0 7rem rgba(255, 255, 255, 0.025) !important;
  pointer-events: none !important;
}

.TWP-hero-section .eyebrow {
  color: #e0e320 !important; /* KAIROS Lime */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  margin-bottom: 1rem !important;
}

.TWP-hero-section h1#page-title {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(4.3rem, 8vw, 8rem) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.045em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  margin: 0 !important;
}

.TWP-hero-section h1#page-title em {
  color: #e0e320 !important;
  font-style: normal !important;
}

.TWP-hero-section .collection-hero-copy p:not(.eyebrow) {
  max-width: 42rem !important;
  margin: 2rem 0 0 0 !important;
  font-size: clamp(1.08rem, 1.7vw, 1.32rem) !important;
  line-height: 1.55 !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

.TWP-hero-section .collection-hero-art img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

/* --------------------------------------------------------------------------
   2. Intro Section & Strategic Goals Grid
   Controls section display title, bright teal accents, and 3-card info grid
   -------------------------------------------------------------------------- */
.TWP-intro-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(2rem, 3vw, 3rem) 1.5rem;
}

.TWP-intro-section .section-intro .eyebrow {
  color: #167575 !important; /* KAIROS Bright Teal */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.TWP-intro-section .section-intro h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3.4rem, 7vw, 6.8rem) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
  color: #1c4552 !important;
  margin: 0 !important;
}

.TWP-intro-section .section-intro h2 em {
  color: #167575 !important;
  font-style: normal !important;
}

.TWP-intro-section .card-grid {
  display: flex !important;
  flex-direction: row !important;
  gap: 1.25rem !important;
  margin-top: 3.5rem !important;
}

.TWP-intro-section .info-card {
  flex: 1 1 33.333% !important;
  background: #ffffff !important;
  border: 1px solid rgba(28, 69, 82, 0.18) !important;
  border-top: 6px solid #167575 !important;
  border-radius: 1.2rem !important;
  padding: clamp(1.6rem, 3vw, 2.6rem) !important;
  box-shadow: 0 15px 45px rgba(23, 47, 55, 0.06) !important;
  transition: transform 200ms ease !important;
}

.TWP-intro-section .info-card:hover {
  transform: translateY(-4px) !important;
}

.TWP-intro-section .info-card h3 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem) !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1rem 0 !important;
}

.TWP-intro-section .info-card p {
  color: #486069 !important;
  font-size: 1.05rem !important;
  margin: 0 !important;
}

/* --------------------------------------------------------------------------
   3. Feature Strip & Working Principles
   Controls dark blue background section, header, and principle list layout
   -------------------------------------------------------------------------- */
.TWP-feature-strip {
  background-color: #183f4a !important; /* Tone Blue Deep */
  color: #ffffff !important;
  padding: clamp(2rem, 3vw, 3rem) 1.5rem !important;
}

.TWP-feature-strip .eyebrow {
  color: #e0e320 !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.TWP-feature-strip h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3.5rem, 7vw, 7rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  margin: 0 !important;
}

.TWP-feature-strip .feature-strip-copy > p {
  max-width: 48rem !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 1.12rem !important;
  line-height: 1.65 !important;
  margin: 0 0 2rem 0 !important;
}

.TWP-feature-strip .principle-list {
  display: grid !important;
  gap: 0 !important;
  margin: 2rem 0 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.TWP-feature-strip .principle-list li {
  display: grid !important;
  grid-template-columns: minmax(10rem, 0.55fr) 1fr !important;
  gap: 2rem !important;
  padding: 1.25rem 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.TWP-feature-strip .principle-list strong {
  color: #e0e320 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-size: 1.35rem !important;
  text-transform: uppercase !important;
}

.TWP-feature-strip .principle-list span {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 1.1rem !important;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .TWP-intro-section .card-grid {
    flex-direction: column !important;
  }
  .TWP-feature-strip .principle-list li {
    grid-template-columns: 1fr !important;
    gap: 0.3rem !important;
  }
}
/* ==========================================================================
   IMP (Our Impact) Page Gutenberg Stylesheet
   Prefix: .IMP-
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Impact Hero Section Controls
   Controls deep rust/orange hero background, wider arch image frame, and headline typography
   -------------------------------------------------------------------------- */
.IMP-hero-section.collection-hero.tone-orange {
  background-color: #7c2f16 !important; /* Deep Rust/Orange */
  position: relative !important;
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  overflow: hidden !important;
}

.IMP-hero-section.collection-hero.tone-orange::before {
  position: absolute !important;
  inset: auto auto -12rem -8rem !important;
  z-index: 1 !important;
  width: 34rem !important;
  height: 34rem !important;
  content: "" !important;
  border: 2px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 4rem rgba(255, 255, 255, 0.04), 0 0 0 8rem rgba(255, 255, 255, 0.02) !important;
  pointer-events: none !important;
}

.IMP-hero-section .impact-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  z-index: 2 !important;
}
/* ==========================================================================
   SYS (Systems Change) Page Complete Gutenberg Stylesheet
   Prefix: .SYS-
   ========================================================================== */

/* Global Full-Bleed Breakout Rule */
.SYS-hero-section.alignfull,
.SYS-lens-section.alignfull,
.SYS-meaning-section.alignfull,
.SYS-close-section.alignfull {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   1. Systems Hero Section
   -------------------------------------------------------------------------- */
.SYS-hero-section.systems-hero {
  background-color: #f7f7f2 !important;
  padding: 4rem 0 6rem 0 !important;
  position: relative !important;
  overflow: hidden !important;
}

.SYS-hero-section .wp-block-group__inner-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2rem !important;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.SYS-hero-section .breadcrumb {
  display: flex !important;
  gap: 0.65rem !important;
  margin: 0 0 1rem 0 !important;
  color: #617278 !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.SYS-hero-section .breadcrumb a {
  color: inherit !important;
  text-decoration: underline !important;
}

.SYS-hero-section .systems-hero-text {
  width: 100% !important;
}

.SYS-hero-section .eyebrow {
  color: #f15922 !important; /* KAIROS Orange */
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  margin-bottom: 1rem !important;
}

.SYS-hero-section h1 {
  color: #172f37 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3.5rem, 6.5vw, 7rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  margin-bottom: 1rem !important;
}

.SYS-hero-section h1 em {
  color: #8e2288 !important; /* KAIROS Purple */
  font-style: normal !important;
  display: block !important;
  margin-left: 3rem !important;
}

.SYS-hero-section .systems-hero-visual {
  position: relative !important;
  width: 100% !important;
  min-height: 550px !important;
}

.SYS-hero-section .systems-hero-image {
  position: absolute !important;
  inset: 0 4rem 2rem 0 !important;
  border-radius: 250px 250px 1.5rem 1.5rem !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.SYS-hero-section .systems-hero-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.SYS-hero-section .hero-message {
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 380px !important;
  max-width: 90% !important;
  background-color: #172f37 !important;
  padding: 2.5rem !important;
  z-index: 10 !important;
  color: #ffffff !important;
  box-shadow: 0 24px 60px rgba(23, 47, 55, 0.24) !important;
}

.SYS-hero-section .hero-message p.lead {
  margin: 0 0 1.15rem 0 !important;
  color: rgba(255, 255, 255, 0.86) !important;
  font-size: clamp(1.02rem, 1.25vw, 1.18rem) !important;
}

.SYS-hero-section .hero-message p.visual-note {
  margin: 0 !important;
  padding-top: 1rem !important;
  color: #e0e320 !important; /* KAIROS Lime */
  border-top: 1px solid rgba(255, 255, 255, 0.24) !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   2. Different Questions Section
   -------------------------------------------------------------------------- */
.SYS-questions-section.different-questions {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(6rem, 10vw, 10rem) 1.5rem;
}

.SYS-questions-section .questions-intro .eyebrow {
  color: #f15922 !important;
}

.SYS-questions-section h2#questions-title,
.SYS-questions-section h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(4.5rem, 6.5vw, 6.9rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 !important;
}

.SYS-questions-section .questions-intro p:last-child {
  max-width: 420px !important;
  margin-top: 2rem !important;
  color: #55696f !important;
}

.SYS-questions-section .question-list {
  border-top: 1px solid rgba(23, 47, 55, 0.25) !important;
}

.SYS-questions-section .question-item {
  padding: 2rem 0.5rem 2rem 1.5rem !important;
  border-bottom: 1px solid rgba(23, 47, 55, 0.25) !important;
  border-left: 6px solid #f15922 !important;
}

.SYS-questions-section .question-item p {
  margin: 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(1.65rem, 2.6vw, 2.6rem) !important;
  line-height: 1.05 !important;
  color: #172f37 !important;
}

/* --------------------------------------------------------------------------
   3. Lens Comparison Section
   -------------------------------------------------------------------------- */
.SYS-lens-section.lens {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  color: #ffffff !important;
  background-color: #1c4552 !important;
}

.SYS-lens-section .wp-block-group__inner-container {
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-lens-section .lens-heading .eyebrow {
  color: #f15922 !important;
}

.SYS-lens-section .lens-heading h2#lens-title,
.SYS-lens-section .lens-heading h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(4rem, 7vw, 7.5rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  margin: 0 !important;
}

.SYS-lens-section .lens-comparison {
  align-items: center !important;
  margin-top: 3rem !important;
}

.SYS-lens-section .lens-card {
  min-height: 370px !important;
  padding: clamp(2.2rem, 4vw, 4rem) !important;
  border-radius: 1.2rem !important;
}

.SYS-lens-section .crisis-card {
  color: #172f37 !important;
  background-color: #e7ece8 !important;
}

.SYS-lens-section .change-card {
  color: #172f37 !important;
  background-color: #e0e320 !important;
}

.SYS-lens-section .lens-number {
  margin: 0 0 3rem 0 !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

.SYS-lens-section .lens-card h3 {
  margin: 0 0 1.8rem 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2.7rem, 4vw, 4.5rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
}

.SYS-lens-section .lens-card li {
  padding: 0.6rem 0 !important;
  border-top: 1px solid rgba(23, 47, 55, 0.22) !important;
  font-weight: 700 !important;
}

.SYS-lens-section .lens-plus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 62px !important;
  height: 62px !important;
  margin: 0 auto !important;
  color: #ffffff !important;
  background-color: #f15922 !important;
  border-radius: 50% !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: 2.3rem !important;
  line-height: 1 !important;
}

.SYS-lens-section p.lens-statement {
  max-width: 840px !important;
  margin: 3.5rem auto 0 auto !important;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: clamp(1.25rem, 2vw, 1.7rem) !important;
}

/* --------------------------------------------------------------------------
   4. Named Systems Section
   -------------------------------------------------------------------------- */
.SYS-named-section.named-systems {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-named-section .named-intro .eyebrow {
  color: #f15922 !important;
}

.SYS-named-section .named-intro h2#named-title,
.SYS-named-section .named-intro h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(4rem, 6vw, 6.5rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 !important;
}

.SYS-named-section .root-map-container {
  position: relative !important;
  margin-top: 3rem !important;
}

.SYS-named-section .root-card {
  position: relative !important;
  min-height: 430px !important;
  padding: clamp(8rem, 12vw, 10rem) clamp(2.2rem, 4vw, 4rem) 3rem clamp(2.2rem, 4vw, 4rem) !important;
  border-radius: 50% 50% 1.5rem 1.5rem !important;
  text-align: center !important;
}

.SYS-named-section .colonialism {
  color: #ffffff !important;
  background-color: #8e2288 !important;
}

.SYS-named-section .extraction {
  color: #ffffff !important;
  background-color: #f15922 !important;
}

.SYS-named-section .root-card h3 {
  margin: 0 0 1.2rem 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(3rem, 5vw, 4.5rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: center !important;
}

.SYS-named-section .root-card p {
  max-width: 440px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: rgba(255, 255, 255, 0.82) !important;
  text-align: center !important;
}

.SYS-named-section .root-knot {
  display: flex !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 148px !important;
  height: 148px !important;
  background-color: #e0e320 !important;
  border-radius: 50% !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10 !important;
  border: 6px solid #f7f7f2 !important;
  margin: 0 !important;
}

.SYS-named-section .root-knot strong {
  color: #172f37 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.05 !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

/* --------------------------------------------------------------------------
   5. Four Shifts Section
   -------------------------------------------------------------------------- */
.SYS-meaning-section.meaning {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  background-color: #ecefe8 !important;
}

.SYS-meaning-section .wp-block-group__inner-container {
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-meaning-section .meaning-heading .eyebrow {
  color: #f15922 !important;
}

.SYS-meaning-section .meaning-heading h2#meaning-title,
.SYS-meaning-section .meaning-heading h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(4rem, 7vw, 7.5rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 4rem 0 !important;
}

.SYS-meaning-section .shift-grid {
  margin-bottom: 1.2rem !important;
}

.SYS-meaning-section .shift {
  --shift-color: #f15922;
  min-height: 320px !important;
  padding: clamp(2rem, 3.5vw, 3.5rem) !important;
  background-color: #ffffff !important;
  border-top: 10px solid var(--shift-color) !important;
  transition: transform 220ms ease, box-shadow 220ms ease !important;
}

.SYS-meaning-section .shift:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 22px 50px rgba(23, 47, 55, 0.1) !important;
}

.SYS-meaning-section .shift-purple { --shift-color: #8e2288 !important; }
.SYS-meaning-section .shift-teal { --shift-color: #187575 !important; }
.SYS-meaning-section .shift-moss { --shift-color: #6a712d !important; }

.SYS-meaning-section .shift h3 {
  margin: 1.5rem 0 0.8rem 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
}

.SYS-meaning-section .shift p {
  max-width: 440px !important;
  margin: 0 !important;
  color: #55696f !important;
}

/* --------------------------------------------------------------------------
   6. Action Path & Systems Close
   -------------------------------------------------------------------------- */
.SYS-action-section.action-path {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-action-section .action-heading .eyebrow {
  color: #f15922 !important;
}

.SYS-action-section .action-heading h2#action-title,
.SYS-action-section .action-heading h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(3.5rem, 5.5vw, 6rem) !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1.5rem 0 !important;
}

.SYS-action-section .pathway-links {
  border-top: 1px solid rgba(23, 47, 55, 0.25) !important;
}

.SYS-action-section .pathway {
  align-items: center !important;
  padding: 2rem 0.5rem !important;
  border-bottom: 1px solid rgba(23, 47, 55, 0.25) !important;
  transition: padding 200ms ease, background-color 200ms ease !important;
  margin: 0 !important;
}

.SYS-action-section .pathway:hover {
  padding-right: 1.1rem !important;
  padding-left: 1.1rem !important;
  background-color: #8e2288 !important;
}

.SYS-action-section .pathway h3 a {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2rem, 3.5vw, 3.5rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  text-decoration: none !important;
}

.SYS-action-section .pathway:hover h3 a,
.SYS-action-section .pathway:hover p {
  color: #ffffff !important;
}

.SYS-close-section.systems-close {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  color: #ffffff !important;
  background-color: #8e2288 !important;
}

.SYS-close-section .wp-block-group__inner-container {
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-close-section .close-copy .eyebrow {
  color: #e0e320 !important;
}

.SYS-close-section h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(4.5rem, 7vw, 7.5rem) !important;
  line-height: 0.9 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  margin: 0 !important;
}

.SYS-close-section a.systems-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.8rem !important;
  padding: 0.85rem 1.2rem !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  color: #172f37 !important;
  background-color: #e0e320 !important;
  transition: transform 200ms ease, background-color 200ms ease !important;
}

.SYS-close-section a.systems-button:hover {
  color: #ffffff !important;
  background-color: #f15922 !important;
  transform: translateY(-2px) !important;
}

/* --------------------------------------------------------------------------
   Responsive Layout Adjustments
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .SYS-hero-section .wp-block-group__inner-container {
    flex-direction: column !important;
  }
  .SYS-hero-section .hero-message {
    position: relative !important;
    width: 100% !important;
    margin-top: 1rem !important;
    right: auto !important;
    bottom: auto !important;
  }
  .SYS-hero-section .systems-hero-visual {
    min-height: auto !important;
  }
  .SYS-hero-section .systems-hero-image {
    position: relative !important;
    min-height: 350px !important;
    inset: auto !important;
  }
  .SYS-questions-section h2,
  .SYS-lens-section .lens-heading h2,
  .SYS-named-section .named-intro h2,
  .SYS-meaning-section .meaning-heading h2,
  .SYS-close-section h2 {
    font-size: clamp(3rem, 8vw, 4.5rem) !important;
  }
}
/* ==========================================================================
   SYS Action Path Layout & Text Alignment Fix
   ========================================================================== */

.SYS-action-section.action-path {
  padding: clamp(6rem, 10vw, 10rem) 1.5rem !important;
  max-width: 1240px;
  margin: 0 auto;
}

.SYS-action-section .action-heading .eyebrow {
  color: #f15922 !important;
}

.SYS-action-section .action-heading h2#action-title,
.SYS-action-section .action-heading h2 {
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(3.5rem, 5.5vw, 6rem) !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  margin: 0 0 1.5rem 0 !important;
  text-align: left !important;
}

.SYS-action-section .pathway-links {
  border-top: 1px solid rgba(23, 47, 55, 0.25) !important;
  width: 100% !important;
}

.SYS-action-section .pathway-item {
  border-bottom: 1px solid rgba(23, 47, 55, 0.25) !important;
  width: 100% !important;
}

.SYS-action-section .pathway-link {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 2rem 1rem !important;
  text-decoration: none !important;
  transition: background-color 200ms ease, padding 200ms ease !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.SYS-action-section .pathway-text-col {
  flex: 1 !important;
  text-align: left !important;
}

.SYS-action-section .pathway-sub {
  margin: 0 0 0.3rem 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #55696f !important;
  text-align: left !important;
  transition: color 200ms ease !important;
}

.SYS-action-section .pathway-title {
  margin: 0 !important;
  font-family: 'Barlow Semi Condensed', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(2rem, 3.5vw, 3.5rem) !important;
  line-height: 0.95 !important;
  text-transform: uppercase !important;
  color: #172f37 !important;
  text-align: left !important;
  transition: color 200ms ease !important;
}

.SYS-action-section .pathway-arrow-col {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding-left: 1.5rem !important;
}

.SYS-action-section .pathway-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background-color: #e0e320 !important; /* KAIROS Lime */
  color: #172f37 !important;
  font-weight: 800 !important;
  font-size: 1.2rem !important;
  transition: transform 200ms ease, background-color 200ms ease, color 200ms ease !important;
}

/* Hover Interactions */
.SYS-action-section .pathway-link:hover {
  background-color: #8e2288 !important; /* KAIROS Purple */
  padding-left: 1.5rem !important;
}

.SYS-action-section .pathway-link:hover .pathway-title,
.SYS-action-section .pathway-link:hover .pathway-sub {
  color: #ffffff !important;
}

.SYS-action-section .pathway-link:hover .pathway-arrow {
  background-color: #ffffff !important;
  color: #8e2288 !important;
  transform: translate(3px, -3px) !important;
}
/* ==========================================================================
   PREFIXED STYLESHEET (REC_) - CENTRE RECONCILIATION
   ========================================================================== */

/* Outer Full-Width Alignments */
.REC-collection-hero,
.REC-living,
.REC-two-paths,
.REC-action-framework,
.REC-transformation,
.REC-right-relationship {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	box-sizing: border-box;
}

/* Container Alignments */
.REC-collection-hero .wp-block-group__inner-container,
.REC-living .wp-block-group__inner-container,
.REC-two-paths .wp-block-group__inner-container,
.REC-action-framework .wp-block-group__inner-container,
.REC-transformation .wp-block-group__inner-container,
.REC-right-relationship .wp-block-group__inner-container {
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
}

/* Typography Base */
.REC-eyebrow {
	color: #8e2288;
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin-bottom: 1.25rem;
}

.wp-block-heading em {
	color: #8e2288;
	font-style: normal;
}

/* Section 1: Hero Area Background & Layout */
.REC-reconciliation-hero {
	position: relative;
	min-height: 560px;
	overflow: hidden;
	color: #ffffff;
	background: #172f37;
}

.REC-hero-bg-image {
	position: absolute;
	inset: 0;
	margin: 0;
	z-index: 0;
}

.REC-hero-bg-image img {
	width: 100%;
	height: 50%;
	object-fit: cover;
	object-position: center 48%;
}

.REC-hero-bg-image::after {
	position: absolute;
	content: "";
	inset: 0;
	background: linear-gradient(90deg, rgba(16,45,53,.92) 0%, rgba(16,45,53,.5) 53%, rgba(16,45,53,.12) 100%), 
	            linear-gradient(0deg, rgba(16,45,53,.72) 0%, transparent 55%);
}

.REC-breadcrumb {
	position: absolute;
	z-index: 10;
	top: clamp(2rem, 4vw, 4rem);
	left: max(3rem, calc((100vw - 1240px)/2));
	display: flex;
	gap: .8rem;
	margin: 0;
	color: rgba(255,255,255,.72);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.REC-breadcrumb a {
	color: #e0e320;
	text-decoration: none;
}

.REC-hero-copy {
	position: absolute;
	z-index: 10;
	right: max(3rem, calc((100vw - 1240px)/2));
	bottom: clamp(5rem, 9vw, 9rem);
	left: max(3rem, calc((100vw - 1240px)/2));
}

.REC-hero-copy .REC-eyebrow {
	color: #e0e320;
}

.REC-hero-copy h1 {
	margin: 0;
	font: 800 clamp(5.7rem, 12vw, 12.5rem)/.76 "Barlow Semi Condensed", Impact, sans-serif;
	letter-spacing: -.055em;
	text-transform: uppercase;
	color: #ffffff;
}

.REC-hero-copy h1 em {
	display: block;
	padding-left: .04em;
	color: #f15922;
	font-size: .43em;
	letter-spacing: .06em;
	line-height: 1.3;
	font-style: normal;
}

.REC-hero-note {
	position: absolute;
	z-index: 10;
	right: max(2rem, calc((100vw - 1240px)/2));
	bottom: 0;
	display: grid;
	width: min(420px, 38vw);
	padding: 1.5rem 1.8rem;
	color: #172f37;
	background: #e0e320;
}

.REC-hero-note p {
	margin: 0;
}

.REC-hero-note strong {
	font: 800 1.45rem/1 "Barlow Semi Condensed", sans-serif;
	text-transform: uppercase;
}

/* Section 2: Living Principles Area */
.REC-living {
	padding: clamp(3rem, 5vw, 5rem) max(3rem, calc((100vw - 1240px)/2)) 3rem;
}

.REC-living-copy p {
	color: #536a70;
}

.REC-living-copy .REC-lead {
	color: #172f37;
	font-size: clamp(1.35rem, 2.1vw, 1.75rem);
	font-weight: 700;
	line-height: 1.35;
}

/* Section 3: Two Paths Area */
.REC-two-paths {
	position: relative;
	padding: clamp(3rem, 5vw, 5rem) max(1rem, calc((100vw - 1240px)/2));
	overflow: hidden;
	color: #ffffff;
	background: #8e2288;
}

.REC-paths-heading {
	margin-bottom: 3.5rem;
}

.REC-paths-heading .REC-eyebrow,
.REC-paths-heading h2 em {
	color: #e0e320;
	font-style: normal;
}

.REC-paths-heading h2 {
	color: #ffffff !important;
	font-size: clamp(3.5rem, 8.3vw, 8.3rem) !important;
	line-height: 0.9 !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: -0.02em !important;
	margin-bottom: 2rem !important;
}

.REC-pathway {
	position: relative;
	z-index: 2;
	padding: 2.5rem !important;
	border: 1px solid rgba(255,255,255,.3);
	margin-bottom: 1.3rem;
	box-sizing: border-box !important;
	min-height: 180px !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
}

.REC-pathway h3 {
	color: #ffffff !important;
	font: 900 clamp(2.0rem, 3.5vw, 3.5rem)/1 "Barlow Semi Condensed", sans-serif !important;
	text-transform: uppercase !important;
	width: 82% !important;
	word-wrap: break-word !important;
	white-space: normal !important;
	margin: 0;
}

.REC-pathway-one {
	background-color: #172f37 !important;
}

.REC-pathway-two {
	background-color: #f15922 !important;
}

.REC-paths-copy p {
	color: rgba(255,255,255,.8);
}

.REC-paths-copy p:first-child {
	color: #ffffff;
	font-size: 1.2rem;
	font-weight: 700;
}

.REC-paths-copy a {
	color: #ffffff;
	font-weight: 800;
	text-decoration: none;
	border-bottom: 2px solid #e0e320;
}

/* Section 4: Action Framework Area */
.REC-action-framework {
	padding: clamp(3rem, 5vw, 5rem) max(1rem, calc((100vw - 1240px)/2));
	background: #eceee7;
}

.REC-action-heading {
	position: sticky;
	top: 140px;
	align-self: start;
}

.REC-action-heading .REC-eyebrow,
.REC-action-heading h2 em {
	color: #187575;
	font-style: normal;
}

.REC-action-heading h2 {
	font-size: clamp(3.5rem, 6vw, 6.5rem) !important;
	line-height: 1.0 !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	margin-bottom: 1.5rem !important;
}

.REC-action-heading p:last-child {
	max-width: 490px;
	margin-top: 2rem;
	color: #536a70;
}

.REC-commitment-item {
	--REC-accent: #8e2288;
	min-height: 150px;
	display: flex;
	align-items: center;
	padding: 2rem 1.2rem 2rem 2rem;
	border-bottom: 1px solid rgba(23,47,55,.25);
	border-left: 7px solid var(--REC-accent);
	transition: color 220ms ease, background 220ms ease, padding 220ms ease;
}

.REC-commitment-item:first-child {
	border-top: 1px solid rgba(23,47,55,.25);
}

.REC-commitment-item:nth-child(even) {
	--REC-accent: #f15922;
}

.REC-commitment-item:nth-child(3) {
	--REC-accent: #187575;
}

.REC-commitment-item:hover {
	padding-left: 2.6rem;
	color: #ffffff;
	background: var(--REC-accent);
}

.REC-commitment-item p {
	margin: 0;
}

.REC-commitment-item strong {
	font: 800 clamp(1.8rem, 3vw, 3rem)/1 "Barlow Semi Condensed", sans-serif;
	text-transform: uppercase;
}

/* Section 5: Transformation Area */
.REC-transformation {
	position: relative;
	padding: clamp(2rem, 3vw, 3rem) max(1rem, calc((100vw - 1240px)/2));
	overflow: hidden;
	color: #ffffff;
	background: #172f37;
}

.REC-transformation-heading {
	position: relative;
	z-index: 2;
}

.REC-transformation-heading .REC-eyebrow {
	color: #e0e320;
}

.REC-transformation-heading h2 {
	color: #ffffff !important;
	font-size: clamp(5rem, 6.5vw, 6.5rem) !important;
	line-height: 0.9 !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: -0.02em !important;
	margin-bottom: 0 !important;
}

.REC-transformation-heading h2 em {
	color: #f15922 !important;
	font-style: normal !important;
	display: block !important;
	position: relative !important;
	margin-top: 4rem !important;
}

.REC-transformation-heading h2 em::before {
	content: "" !important;
	position: absolute !important;
	top: -1.2rem !important;
	left: 0 !important;
	width: 80px !important;
	height: 10px !important;
	background-color: #ffffff !important;
}

.REC-transformation-copy {
	position: relative;
	z-index: 2;
	align-self: end;
}

.REC-transformation-copy p {
	color: rgba(255,255,255,.73);
}

.REC-transformation-copy .REC-lead {
	color: #ffffff;
	font-size: clamp(1.3rem, 2vw, 1.7rem);
	font-weight: 700;
	line-height: 1.35;
}

/* Section 6: Right Relationship Area */
.REC-right-relationship {
	padding: clamp(2rem, 3vw, 3rem) max(1rem, calc((100vw - 1240px)/2));
	color: #172f37;
	background: #e0e320;
}

.REC-right-relationship .REC-eyebrow {
	color: #8e2288;
}

.REC-right-relationship h2 {
	font-size: clamp(2rem, 4vw, 4.5rem) !important;
	line-height: 0.85 !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: -0.02em !important;
	color: #172f37 !important;
	margin-bottom: 0 !important;
	width: 100% !important;
}

.REC-right-relationship h3 {
	font-size: clamp(1.5rem, 2vw, 2.5rem) !important;
	line-height: 0.85 !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: -0.02em !important;
	color: #1c4452 !important;
	margin-bottom: 0 !important;
	width: 100% !important;
}

.REC-right-relationship h2 em {
	color: #8e2288 !important;
	font-style: normal !important;
	display: block !important;
	margin-top: 0.1em !important;
}

.REC-relationship-links {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: 3.5rem;
}

.REC-relationship-links p {
	margin: 0;
}

.REC-relationship-links a {
	display: inline-flex;
	gap: 1rem;
	align-items: center;
	padding: .9rem 1.2rem;
	border: 2px solid #172f37;
	border-radius: 999px;
	font-weight: 800;
	text-decoration: none;
	color: #172f37;
}

.REC-relationship-links .REC-relationship-primary {
	color: #ffffff;
	background: #172f37;
}

.REC-relationship-links a:hover {
	color: #ffffff;
	background: #8e2288;
	border-color: #8e2288;
}

/* Responsive Utilities */
@media (max-width: 900px) {
	.REC-action-heading {
		position: relative !important;
		top: 0 !important;
	}

	.REC-two-paths .wp-block-columns,
	.REC-action-framework .wp-block-columns,
	.REC-transformation .wp-block-columns {
		flex-direction: column !important;
	}

	.REC-right-relationship h2 {
		font-size: clamp(3rem, 10vw, 4.5rem) !important;
	}
}

@media (max-width: 680px) {
	.REC-reconciliation-hero {
		min-height: 690px;
	}

	.REC-hero-copy h1 {
		font-size: clamp(4.1rem, 18vw, 6.7rem);
	}

	.REC-hero-note {
		width: auto;
		right: 1.25rem;
		left: 1.25rem;
	}
}
/* ==========================================================================
   RAR_ Stylesheet (Rooted & Rising Page)
   ========================================================================== */

/* Max-width container alignment */
.RAR-anniversary-hero .wp-block-group__inner-container,
.RAR-story-section .wp-block-group__inner-container,
.RAR-directions-section .wp-block-group__inner-container,
.RAR-giving-section .wp-block-group__inner-container,
.RAR-stories-section .wp-block-group__inner-container,
.RAR-stories-section .memory-form .wp-block-group__inner-container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}

/* Hero Section Controls */
.RAR-anniversary-hero {
    position: relative;
    min-height: 760px;
    overflow: hidden;
    background: radial-gradient(circle at 8% 12%, rgba(224, 227, 32, .24), transparent 25%), linear-gradient(110deg, #fff 0 61%, #e5f2ee 61% 100%);
}

.RAR-anniversary-hero::before {
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    width: 34%;
    height: 12px;
    content: "";
    background: linear-gradient(90deg, var(--orange, #f15922), var(--purple, #8e2288));
}

.RAR-anniversary-hero .RAR-anniversary-hero-copy {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: clamp(5rem, 8vw, 8rem) clamp(2rem, 7vw, 7.5rem);
}

.RAR-anniversary-hero .eyebrow {
    color: var(--moss, #6a712d);
}

.RAR-anniversary-hero h1 {
    margin: 0;
    color: var(--teal, #1c4552);
    font-family: "Barlow Semi Condensed", Impact, sans-serif;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .88;
    text-transform: uppercase;
    font-size: clamp(5rem, 9.5vw, 9.6rem);
}

.RAR-anniversary-hero h1 em {
    color: var(--purple, #8e2288);
    font-style: normal;
}

.RAR-anniversary-hero .hero-deck {
    max-width: 660px;
    margin: 2rem 0;
    color: #435b62;
    font-size: clamp(1.1rem, 1.5vw, 1.32rem);
}

.RAR-anniversary-hero .hero-link {
    display: inline-flex;
    width: max-content;
    align-items: center;
    gap: .8rem;
    padding: .85rem 1.2rem;
    color: var(--white, #ffffff);
    background: var(--teal, #1c4552);
    border-radius: 999px;
    font-weight: 800;
    text-decoration: none;
    transition: transform 180ms ease, background 180ms ease;
}

.RAR-anniversary-hero .hero-link span {
    color: var(--lime, #e0e320);
}

.RAR-anniversary-hero .hero-link:hover,
.RAR-anniversary-hero .hero-link:focus-visible {
    background: var(--purple, #8e2288);
    transform: translateY(-2px);
}

.RAR-anniversary-hero .RAR-anniversary-tree {
    position: relative;
    display: grid;
    place-items: center;
    padding: clamp(3rem, 6vw, 6rem);
    isolation: isolate;
}

.RAR-anniversary-hero .RAR-anniversary-tree::before,
.RAR-anniversary-hero .RAR-anniversary-tree::after {
    position: absolute;
    z-index: -1;
    content: "";
    border: 2px solid rgba(241, 89, 34, .32);
    border-radius: 50%;
}

.RAR-anniversary-hero .RAR-anniversary-tree::before {
    width: min(78%, 580px);
    aspect-ratio: 1;
}

.RAR-anniversary-hero .RAR-anniversary-tree::after {
    width: min(92%, 700px);
    aspect-ratio: 1;
    border-color: rgba(142, 34, 136, .24);
}

.RAR-anniversary-hero .RAR-anniversary-tree img {
    width: min(92%, 650px);
    filter: drop-shadow(0 25px 35px rgba(23, 47, 55, .08));
}

.RAR-anniversary-hero .year-mark {
    position: absolute;
    z-index: -1;
    top: 4%;
    right: 3%;
    color: rgba(241, 89, 34, .18);
    font: 800 clamp(11rem, 23vw, 23rem)/.8 "Barlow Semi Condensed", sans-serif;
    letter-spacing: -.08em;
}

.RAR-anniversary-hero .tree-caption {
    position: absolute;
    right: clamp(1.5rem, 4vw, 4rem);
    bottom: clamp(1.5rem, 4vw, 3.5rem);
    margin: 0;
    color: var(--moss, #6a712d);
    font-weight: 800;
    line-height: 1.35;
    text-align: right;
}

/* Story Section Controls */
.RAR-story-section {
    padding: clamp(6rem, 10vw, 10rem) 0;
    background: #fff;
}

.RAR-story-section .RAR-story-heading {
    position: sticky;
    top: 170px;
    align-self: start;
}

.RAR-story-section .RAR-story-heading .eyebrow {
    color: var(--moss, #6a712d);
}

.RAR-story-section .RAR-story-heading h2 {
    margin: 0;
    color: var(--teal, #1c4552);
    font-family: "Barlow Semi Condensed", Impact, sans-serif;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .88;
    text-transform: uppercase;
    font-size: clamp(3.6rem, 6vw, 6rem);
}

.RAR-story-section .RAR-story-heading h2 em {
    color: var(--orange, #f15922);
    font-style: normal;
}

.RAR-story-section .RAR-story-copy p {
    margin: 0 0 1.45rem;
    color: #445b62;
    font-size: clamp(1.05rem, 1.3vw, 1.16rem);
}

.RAR-story-section .story-emphasis {
    margin-top: 2.4rem !important;
    padding: 2rem;
    color: var(--ink, #172f37) !important;
    background: var(--lime, #e0e320);
    border-left: 8px solid var(--orange, #f15922);
    font: 700 clamp(1.7rem, 2.8vw, 2.8rem)/1.12 "Barlow Semi Condensed", sans-serif !important;
    box-shadow: 18px 18px 0 rgba(142, 34, 136, .1);
}

/* Directions Section Controls */
.RAR-directions-section {
    padding: clamp(6rem, 10vw, 10rem) 0;
    background: linear-gradient(145deg, #e3f3ef, #f7f8df);
    border-top: 12px solid var(--orange, #f15922);
}

.RAR-directions-section .RAR-directions-heading {
    margin-bottom: 4rem;
}

.RAR-directions-section .RAR-directions-heading .eyebrow {
    color: var(--moss, #6a712d);
}

.RAR-directions-section .RAR-directions-heading h2 {
    margin: 0;
    color: var(--teal, #1c4552);
    font-family: "Barlow Semi Condensed", Impact, sans-serif;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .88;
    text-transform: uppercase;
    max-width: 900px;
    font-size: clamp(3.6rem, 6.5vw, 6.5rem);
}

.RAR-directions-section .direction-card {
    --accent: var(--teal-bright, #187575);
    display: flex;
    min-height: 470px;
    flex-direction: column;
    padding: clamp(2rem, 3vw, 3rem);
    background: #dff2ef;
    border-top: 8px solid var(--accent);
    box-shadow: 0 16px 50px rgba(23, 47, 55, .1);
    box-sizing: border-box;
}

.RAR-directions-section .direction-orange {
    background: #fff0e7;
    --accent: var(--orange, #f15922);
}

.RAR-directions-section .direction-purple {
    background: #f4e7f4;
    --accent: var(--purple, #8e2288);
}

.RAR-directions-section .direction-label {
    margin: 0 0 2.5rem;
    color: var(--accent);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.RAR-directions-section .direction-orange .direction-label {
    color: #b83b10;
}

.RAR-directions-section .direction-card h3 {
    margin: 0 0 1.2rem;
    font: 800 clamp(2.2rem, 3.4vw, 3.6rem)/.95 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}

.RAR-directions-section .direction-card p:not(.direction-label) {
    color: #50666c;
}

.RAR-directions-section .direction-card a {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: auto;
    padding-top: 1.2rem;
    color: var(--teal, #1c4552);
    border-top: 1px solid var(--line, rgba(28, 69, 82, .18));
    font-weight: 800;
    text-decoration: none;
}

.RAR-directions-section .direction-card a span {
    color: var(--accent);
    font-size: 1.4rem;
    transition: transform 180ms ease;
}

.RAR-directions-section .direction-card a:hover span,
.RAR-directions-section .direction-card a:focus-visible span {
    transform: rotate(45deg);
}

/* Giving Section Controls */
.RAR-giving-section {
    padding: clamp(7rem, 11vw, 11rem) 0;
    color: var(--white, #ffffff);
    background: linear-gradient(135deg, var(--teal, #1c4552) 0 68%, #681765 100%);
    border-top: 12px solid var(--lime, #e0e320);
}

.RAR-giving-section .RAR-giving-heading {
    margin-bottom: 4.5rem;
}

.RAR-giving-section .RAR-giving-heading .eyebrow {
    color: var(--lime, #e0e320);
}

.RAR-giving-section .RAR-giving-heading h2 {
    color: var(--white, #ffffff);
    font-family: "Barlow Semi Condensed", Impact, sans-serif;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .88;
    text-transform: uppercase;
    font-size: clamp(3.7rem, 6.5vw, 6.5rem);
    margin: 0;
}

.RAR-giving-section .RAR-giving-heading h2 em {
    color: var(--lime, #e0e320);
    font-style: normal;
}

.RAR-giving-section .RAR-giving-heading p {
    margin: 0 0 .6rem;
    color: rgba(255, 255, 255, .75);
    font-size: 1.08rem;
}

.RAR-giving-section .giving-card {
    --card-accent: var(--lime, #e0e320);
    display: flex;
    min-height: 430px;
    flex-direction: column;
    padding: clamp(2rem, 3vw, 3rem);
    color: var(--ink, #172f37);
    background: #f5f7ce;
    border-radius: 0 0 1.5rem 1.5rem;
    text-decoration: none;
    transition: transform 200ms ease, box-shadow 200ms ease;
    box-sizing: border-box;
}

.RAR-giving-section .monthly-card {
    --card-accent: var(--orange, #f15922);
    background: #fff0e7;
}

.RAR-giving-section .legacy-card {
    --card-accent: var(--purple, #8e2288);
    background: #f4e7f4;
}

.RAR-giving-section .giving-card:hover,
.RAR-giving-section .giving-card:focus-visible {
    transform: translateY(-7px);
    box-shadow: 0 24px 55px rgba(8, 26, 32, .28);
}

.RAR-giving-section .giving-type {
    margin: 0 0 2rem;
    color: var(--card-accent);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.RAR-giving-section .match-card .giving-type {
    color: var(--moss, #6a712d);
}

.RAR-giving-section .monthly-card .giving-type {
    color: #b83b10;
}

.RAR-giving-section .giving-card h3 {
    margin: 0 0 1rem;
    font: 800 clamp(2.2rem, 3.3vw, 3.4rem)/.95 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}

.RAR-giving-section .giving-card p:not(.giving-type) {
    color: #50656b;
}

.RAR-giving-section .giving-card a {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: auto;
    padding-top: 1.2rem;
    border-top: 4px solid var(--card-accent);
    font-weight: 800;
    text-decoration: none;
    color: var(--ink, #172f37);
}

.RAR-giving-section .giving-card b {
    color: var(--card-accent);
    font-size: 1.4rem;
}

/* Stories Section Controls */
.RAR-stories-section {
    padding: clamp(7rem, 11vw, 11rem) 0;
    background: #fff;
}

.RAR-stories-section .stories-intro {
    align-self: center;
}

.RAR-stories-section .stories-intro .eyebrow {
    color: var(--purple, #8e2288);
}

.RAR-stories-section .stories-intro h2 {
    margin: 0;
    color: var(--teal, #1c4552);
    font-family: "Barlow Semi Condensed", Impact, sans-serif;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .88;
    text-transform: uppercase;
    font-size: clamp(3.6rem, 6vw, 6rem);
}

.RAR-stories-section .stories-intro p:not(.eyebrow) {
    max-width: 560px;
    margin: 1.6rem 0;
    color: #496067;
    font-size: 1.08rem;
}

.RAR-stories-section .stories-link {
    display: inline-flex;
    gap: .65rem;
    padding-bottom: .25rem;
    color: var(--teal, #1c4552);
    border-bottom: 2px solid var(--purple, #8e2288);
    font-weight: 800;
    text-decoration: none;
}

.RAR-stories-section .stories-link span {
    color: var(--purple, #8e2288);
}

.RAR-stories-section .story-video {
    align-self: center;
    overflow: hidden;
    background: var(--teal, #1c4552);
    border-radius: 1.5rem;
    box-shadow: 0 24px 70px rgba(23, 47, 55, 0.13);
}

.RAR-stories-section .story-video iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}

.RAR-stories-section .memory-form {
    margin-top: 4rem;
    padding: clamp(2rem, 5vw, 5rem);
    background: linear-gradient(135deg, #edf6d5, #f5e8f5);
    border-top: 8px solid var(--purple, #8e2288);
    box-sizing: border-box;
}

.RAR-stories-section .memory-form .form-heading .eyebrow {
    color: var(--moss, #6a712d);
}

.RAR-stories-section .memory-form .form-heading h3 {
    margin: 0 0 1rem;
    color: var(--teal, #1c4552);
    font: 800 clamp(2.8rem, 4.5vw, 4.5rem)/.92 "Barlow Semi Condensed", sans-serif;
    text-transform: uppercase;
}

.RAR-stories-section .memory-form .form-heading p:last-child {
    color: #50666c;
}

.RAR-stories-section .memory-form iframe {
    width: 100%;
    min-height: 720px;
    background: var(--white, #ffffff);
    border: 0;
}

.RAR-stories-section .memory-form .form-fallback {
    margin: -.8rem 0 0;
    color: #52676d;
    font-size: .88rem;
}

.RAR-stories-section .memory-form .form-fallback a {
    font-weight: 800;
}

/* Responsiveness Media Queries */
@media (max-width: 1050px) {
    .RAR-anniversary-hero .wp-block-columns,
    .RAR-story-section .wp-block-columns,
    .RAR-stories-section .wp-block-columns,
    .RAR-stories-section .memory-form .wp-block-columns {
        flex-direction: column !important;
    }

    .RAR-anniversary-hero {
        background: radial-gradient(circle at 8% 12%, rgba(224, 227, 32, .24), transparent 25%), #fff;
    }

    .RAR-anniversary-hero .RAR-anniversary-tree {
        min-height: 650px;
        background: #e5f2ee;
    }

    .RAR-story-section .RAR-story-heading {
        position: static;
    }

    .RAR-directions-section .RAR-direction-grid,
    .RAR-giving-section .RAR-giving-grid {
        flex-direction: column !important;
    }

    .RAR-directions-section .direction-card,
    .RAR-giving-section .giving-card {
        min-height: 0;
    }

    .RAR-directions-section .direction-orange {
        transform: none;
    }
}

@media (max-width: 720px) {
    .RAR-anniversary-hero .RAR-anniversary-hero-copy {
        padding: 4rem 1.5rem 5rem;
    }

    .RAR-anniversary-hero h1 {
        font-size: clamp(4.8rem, 24vw, 7rem);
    }

    .RAR-anniversary-hero .RAR-anniversary-tree {
        min-height: 500px;
        padding: 3rem 1.5rem 5rem;
    }

    .RAR-anniversary-hero .year-mark {
        right: 1rem;
        font-size: 12rem;
    }

    .RAR-anniversary-hero .tree-caption {
        right: 1.5rem;
        bottom: 1.5rem;
    }

    .RAR-stories-section .memory-form {
        padding: 2rem 1.25rem;
    }

    .RAR-stories-section .memory-form iframe {
        min-height: 780px;
    }
}