/* ========================================
   NMCSN Design Tokens
   Colors: New Mexico earth tones + turquoise
   ======================================== */

:root {
  /* Type Scale */
  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);
  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);
  --text-xl:   clamp(1.5rem,   1.2rem  + 1.25vw, 2.25rem);
  --text-2xl:  clamp(2rem,     1.2rem  + 2.5vw,  3.5rem);
  --text-3xl:  clamp(2.5rem,   1rem    + 4vw,    5rem);

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* NMCSN Brand Colors */
  --color-turquoise:     #00d4bd;
  --color-turquoise-dim: #00a899;
  --color-brown:         #BC6C25;
  --color-brown-light:   #d99a59;
  --color-earth-dark:    #823933;
  --color-earth-warm:    #A05751;
  --color-amber:         #DF8F48;

  /* Surface & Text */
  --color-bg:            #faf9f6;
  --color-surface:       #f5f3ee;
  --color-surface-dark:  #1a1714;
  --color-text:          #2b2520;
  --color-text-muted:    #7a7268;
  --color-text-faint:    #b0a89e;
  --color-text-inverse:  #faf9f6;

  /* Radius */
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;

  /* Transitions */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-interactive: 180ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(43, 37, 32, 0.06);
  --shadow-md: 0 4px 12px rgba(43, 37, 32, 0.08);
  --shadow-lg: 0 12px 32px rgba(43, 37, 32, 0.12);

  /* Content widths */
  --content-narrow: 640px;
  --content-default: 960px;
  --content-wide: 1200px;

  /* Fonts */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'Source Sans 3', 'Helvetica Neue', sans-serif;
}

/* ========================================
   Reset Basics (Added for CodePen to simulate your base.css)
   ======================================== */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body {
    font-family: var(--font-body);
    background-color: var(--color-bg);
    color: var(--color-text);
    line-height: 1.5;
}

/* ========================================
   Layout
   ======================================== */

.container {
  max-width: var(--content-wide);
  margin-inline: auto;
  padding-inline: var(--space-6);
}

.section {
  padding-block: clamp(var(--space-12), 8vw, var(--space-24));
}

.section-light {
  background: var(--color-bg);
}

/* ========================================
   Typography
   ======================================== */

.section-eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-turquoise);
  margin-bottom: var(--space-3);
}

.section-heading {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  color: var(--color-text);
  margin-bottom: var(--space-6);
  max-width: 20ch;
}

.body-text {
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.7;
  max-width: 65ch;
}

/* ========================================
   Header / Navigation
   ======================================== */

.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: rgba(250, 249, 246, 0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(43, 37, 32, 0.08);
}

.header-inner {
  max-width: var(--content-wide);
  margin-inline: auto;
  padding: var(--space-3) var(--space-6);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo-link {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  text-decoration: none;
}

.logo-text {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-brown);
  letter-spacing: 0.02em;
}

.nav-desktop {
  display: none;
  align-items: center;
  gap: var(--space-6);
}

@media (min-width: 900px) {
  .nav-desktop { display: flex; }
  .mobile-menu-btn { display: none; }
}

.nav-link {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted);
  text-decoration: none;
  padding: var(--space-1) 0;
}

.cta-link {
  color: var(--color-text-inverse) !important;
  background: var(--color-turquoise-dim);
  padding: var(--space-2) var(--space-5) !important;
  border-radius: var(--radius-md);
  font-weight: 600;
}

.nav-mobile {
  display: none;
}

/* ========================================
   Buttons
   ======================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  text-decoration: none;
  padding: var(--space-3) var(--space-6);
  border-radius: var(--radius-md);
  cursor: pointer;
  border: none;
  transition: all var(--transition-interactive);
}

.btn-primary {
  background: var(--color-turquoise);
  color: #1a1714;
}

.btn-ghost {
  background: transparent;
  color: var(--color-text);
  border: 1px solid rgba(43, 37, 32, 0.3);
}

.btn-ghost:hover {
  background: rgba(43, 37, 32, 0.05);
}

/* ========================================
   Footer
   ======================================== */

.footer {
  background: var(--color-surface-dark);
  padding: var(--space-6) 0;
  border-top: 1px solid rgba(250, 249, 246, 0.06);
}

.footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-4);
  padding: 0 var(--space-6);
}

.footer-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.footer-brand {
  font-family: var(--font-display);
  font-size: var(--text-base);
  color: var(--color-brown-light);
}

.footer-tagline {
  font-size: var(--text-xs);
  color: rgba(250, 249, 246, 0.4);
}

.footer-copy {
  font-size: var(--text-xs);
  color: rgba(250, 249, 246, 0.35);
}


/* ========================================
   404 Page (Destination Not Found)
   ======================================== */

.not-found-wrapper {
  /* Ensure it fills the screen vertically, minus the fixed header */
  min-height: 75vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-20) var(--space-6) var(--space-12);
  margin-top: var(--space-16); /* Clear the fixed navigation */
}

/* Override the standard max-width so the 404 heading doesn't wrap awkwardly */
.not-found-wrapper .section-heading {
  font-size: var(--text-3xl); 
  margin-bottom: var(--space-4);
  max-width: 100%; 
}

/* Keep the explanation paragraph tight and readable */
.not-found-wrapper .body-text {
  margin-bottom: var(--space-8);
  max-width: 50ch; 
}

/* Button layout */
.btn-group {
  display: flex;
  gap: var(--space-4);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: var(--space-2);
}

/* EKG Line Graphic & Animation */
.ekg-line {
  margin-top: var(--space-16);
  width: 100%;
  max-width: 320px;
}

/* Pulses the EKG line to give the error page a subtle sign of life */
.ekg-line polyline, 
.ekg-line path {
  stroke: var(--color-turquoise);
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  animation: draw-ekg 3.5s var(--ease-out) infinite;
}

@keyframes draw-ekg {
  0% { 
    stroke-dashoffset: 400; 
    opacity: 0; 
  }
  15% { 
    opacity: 1; 
  }
  70% { 
    stroke-dashoffset: 0; 
    opacity: 1; 
  }
  100% { 
    stroke-dashoffset: 0; 
    opacity: 0; 
  }
}

/* === Restored section styles (rebuilt 2026-08-01) === */
.logo-icon{width:44px;height:44px;border-radius:var(--radius-sm);object-fit:cover}
.mobile-menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:var(--space-2)}
.mobile-menu-btn span{display:block;width:24px;height:2px;background:var(--color-text)}
.center-text{text-align:center;margin-inline:auto;max-width:var(--content-narrow)}
.hero{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:92vh;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,23,20,.55) 0%,rgba(26,23,20,.35) 45%,rgba(26,23,20,.78) 100%)}
.hero-content{position:relative;z-index:1;width:min(var(--content-wide),92%);margin:0 auto;padding:var(--space-24) 0 var(--space-16);color:var(--color-text-inverse)}
.hero-eyebrow{font-size:var(--text-sm);letter-spacing:.18em;text-transform:uppercase;color:var(--color-turquoise);font-weight:600;margin-bottom:var(--space-4)}
.hero-headline{font-family:var(--font-display);font-size:var(--text-3xl);line-height:1.05;color:var(--color-text-inverse);max-width:14ch;margin-bottom:var(--space-6)}
.hero-sub{font-size:var(--text-lg);max-width:56ch;color:rgba(250,249,246,.88);margin-bottom:var(--space-8)}
.hero-actions{display:flex;gap:var(--space-4);flex-wrap:wrap}
.hero-actions .btn-ghost{color:var(--color-text-inverse);border:1px solid rgba(250,249,246,.65)}
.hero-actions .btn-ghost:hover{background:rgba(250,249,246,.12);color:var(--color-text-inverse)}
.hero-stats{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:var(--space-10);padding:var(--space-6) var(--space-4);background:rgba(26,23,20,.5);backdrop-filter:blur(6px);border-top:1px solid rgba(250,249,246,.15)}
.stat-item{text-align:center;color:var(--color-text-inverse)}
.stat-number{display:block;font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-turquoise)}
.stat-label{font-size:var(--text-sm);color:rgba(250,249,246,.75)}
.stat-divider{width:1px;height:40px;background:rgba(250,249,246,.25)}
.mission-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--space-16);align-items:start}
.mission-pillars{display:grid;gap:var(--space-6)}
.pillar-card{background:var(--color-surface);padding:var(--space-8);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border-left:3px solid var(--color-turquoise)}
.pillar-icon{width:44px;height:44px;border-radius:50%;background:rgba(0,212,189,.14);color:var(--color-turquoise-dim);display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-4)}
.pillar-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-2)}
.pillar-desc{color:var(--color-text-muted);font-size:var(--text-base)}
.paradigm-visual{margin-top:var(--space-16);text-align:center}
.paradigm-visual img{max-width:min(880px,100%);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.section-dark{background:var(--color-surface-dark);color:var(--color-text-inverse)}
.section-eyebrow.light,.section-heading.light,.body-text.light{color:var(--color-text-inverse)}
.section-eyebrow.light{color:var(--color-turquoise)}
.problem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);margin-top:var(--space-12)}
.problem-card{padding:var(--space-8);border:1px solid rgba(250,249,246,.14);border-radius:var(--radius-lg)}
.problem-stat{display:block;font-family:var(--font-display);font-size:var(--text-2xl);color:var(--color-amber);margin-bottom:var(--space-3)}
.problem-text{color:rgba(250,249,246,.8);font-size:var(--text-base)}
.problem-card.accent{background:rgba(0,212,189,.1);border-color:var(--color-turquoise)}
.problem-stat-accent{display:block;font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-turquoise);margin-bottom:var(--space-3)}
.problem-text-accent{color:rgba(250,249,246,.92)}
.outcomes-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);margin-top:var(--space-12)}
.outcome-card{background:var(--color-surface);padding:var(--space-8);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.outcome-number{display:block;font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-brown);margin-bottom:var(--space-2)}
.outcome-label{display:block;font-weight:700;margin-bottom:var(--space-2)}
.outcome-desc{color:var(--color-text-muted);font-size:var(--text-sm)}
.outcome-card-highlight{border:2px solid var(--color-turquoise)}
.network-visual{margin:var(--space-12) auto 0;max-width:880px}
.hub-spoke-diagram{width:100%}
.network-svg,.hub-spoke-diagram svg,.hub-spoke-diagram img{width:100%;height:auto}
.network-capabilities{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);margin-top:var(--space-16)}
.capability{border-left:3px solid var(--color-turquoise);padding-left:var(--space-5)}
.capability-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-2)}
.capability-desc{color:var(--color-text-muted)}
.section-accent{background:linear-gradient(160deg,#1a1714 0%,#2d221c 60%,#3a2a20 100%);color:var(--color-text-inverse)}
.ai-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);margin-top:var(--space-12)}
.ai-card{background:rgba(250,249,246,.06);border:1px solid rgba(250,249,246,.12);border-radius:var(--radius-lg);padding:var(--space-8)}
.ai-card-large{grid-column:1/-1;background:rgba(0,212,189,.08);border-color:rgba(0,212,189,.4)}
.ai-card-tag{display:inline-block;font-size:var(--text-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--color-turquoise);border:1px solid rgba(0,212,189,.5);border-radius:999px;padding:2px 10px;margin-bottom:var(--space-4)}
.ai-card-title{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-text-inverse);margin-bottom:var(--space-3)}
.ai-card-text{color:rgba(250,249,246,.78)}
.ai-cta-block{margin-top:var(--space-12);text-align:center}
.ai-cta-text{max-width:60ch;margin:0 auto var(--space-6);color:rgba(250,249,246,.85);font-size:var(--text-lg)}
.vision-boards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);margin-top:var(--space-12)}
.vb-card{background:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.vb-image-wrap img{width:100%;aspect-ratio:4/3;object-fit:cover}
.vb-info{padding:var(--space-6)}
.leader-role{font-size:var(--text-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--color-turquoise-dim);margin-bottom:var(--space-2)}
.leader-name{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-1)}
.leader-title{color:var(--color-text-muted);font-size:var(--text-sm)}
.leadership-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);margin-top:var(--space-16);align-items:start}
.board-title{font-size:var(--text-sm);letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-muted);border-bottom:1px solid rgba(43,37,32,.15);padding-bottom:var(--space-3);margin-bottom:var(--space-5)}
.leader-cards{display:grid;gap:var(--space-4)}
.leader-card{background:var(--color-surface);padding:var(--space-5);border-radius:var(--radius-md)}
.section-cta{background:var(--color-surface-dark);color:var(--color-text-inverse)}
.section-cta .section-eyebrow{color:var(--color-turquoise)}
.section-cta .section-heading{color:var(--color-text-inverse)}
.section-cta .body-text{color:rgba(250,249,246,.82)}
.cta-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--space-16);align-items:start}
.partner-types{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);margin-top:var(--space-8)}
.partner-type{border-left:3px solid var(--color-turquoise);padding-left:var(--space-5)}
.partner-type-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-2);color:var(--color-text-inverse)}
.partner-type-desc{color:rgba(250,249,246,.72)}
.contact-card{background:#fff;padding:var(--space-10);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);color:var(--color-text)}
.contact-card-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-5)}
.contact-info{display:grid;gap:var(--space-3)}
.contact-row{color:var(--color-text)}
.contact-divider{height:1px;background:rgba(43,37,32,.12);margin:var(--space-4) 0}
.contact-note{color:var(--color-text-muted);font-size:var(--text-sm)}
.footer-right{text-align:right}
.footer-copy{font-size:var(--text-sm);color:var(--color-text-muted)}
@media (max-width:960px){
.mission-grid,.cta-layout{grid-template-columns:1fr}
.problem-grid,.outcomes-grid{grid-template-columns:repeat(2,1fr)}
.ai-grid,.network-capabilities,.vision-boards,.leadership-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
.problem-grid,.outcomes-grid,.ai-grid,.network-capabilities,.vision-boards,.leadership-grid,.partner-types{grid-template-columns:1fr}
.hero-stats{flex-wrap:wrap;gap:var(--space-5)}
.stat-divider{display:none}
.nav-desktop{display:none}
.mobile-menu-btn{display:flex}
.footer-right{text-align:left}
}

/* ============================================================
   Consolidated from index.html inline <style> blocks, 2026-08-18.
   All homepage-scoped via .page-home so sub-pages are unaffected.
   Originally dated 2026-08-16 (contrast, mobile nav, nav density)
   and 2026-08-17 (router reveal, wide diagrams).
   ============================================================ */

/* --- contrast fixes, 2026-08-16 --- */
/* Section eyebrows on cream were #00D4BD at 1.8:1. Darkened to 6:1. */
/* .light variants sit on dark backgrounds and are left alone. */
.page-home .section-eyebrow:not(.light){color:#0A6C60!important}
.page-home .leader-role{color:#0A6C60!important}
/* Reference superscripts sit on the dark problem cards — gold, not browser blue */
.page-home .problem-text sup a,.page-home .problem-text-accent sup a{color:#F0C860!important;font-weight:700;text-decoration:none;border-bottom:1px dotted rgba(240,200,96,.55)}
.page-home .problem-text sup a:hover,.page-home .problem-text-accent sup a:hover{color:#fff!important}
/* Links in the references and contact blocks — brand teal, not default blue */
.page-home #refs a{color:#0A6C60;font-weight:600}
.page-home #contact a[href^="mailto"]{color:#0A6C60}

/* --- mobile nav fix, 2026-08-16 --- */
/* .nav-mobile had display:none and NO .open rule — menu never opened. */
/* Also 641–899px showed neither nav; mobile button now covers to 899px. */
/* Scoped with :has(.mobile-menu-btn) so pages without a mobile menu keep theirs. */
@media (max-width:899px){
  .page-home:has(.mobile-menu-btn) .nav-desktop{display:none!important}
  .page-home .mobile-menu-btn{display:flex!important}
}
.page-home .nav-mobile.open{
  display:flex!important;flex-direction:column;
  position:fixed;top:69px;left:0;right:0;
  background:#fff;border-top:1px solid rgba(0,0,0,.08);
  box-shadow:0 14px 30px rgba(0,0,0,.16);
  padding:8px 22px 20px;z-index:999;
  max-height:calc(100vh - 69px);overflow-y:auto;
}
.page-home .nav-mobile.open .nav-link-mobile{
  display:block;padding:14px 2px;font-size:16.5px;
  color:#1B1A17;text-decoration:none;
  border-bottom:1px solid rgba(0,0,0,.07);
}
.page-home .nav-mobile.open .nav-link-mobile:last-child{
  border-bottom:none;margin-top:10px;background:#5BC4A8;color:#0e3b32;
  font-weight:700;border-radius:8px;text-align:center;padding:13px
}

/* consistent left alignment (Network + AI intros were centred) */
.page-home .body-text.center-text{text-align:left!important}

/* --- audience router: 5-up row + connected step panels, 2026-08-17 --- */
/* 5 role cards used to wrap 4+1, leaving a dead gap that detached step 2. */
.page-home #fd-need:not(:empty),.page-home #fd-links:not(:empty){margin-top:.5rem;padding:1rem 1.15rem;background:#fff;border:1px solid #E3D9CE;border-left:4px solid #0A6C60;border-radius:10px;animation:fdReveal .28s ease-out both}
.page-home #fd-links:not(:empty){margin-top:.6rem}
@keyframes fdReveal{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.page-home #fd-need:not(:empty),.page-home #fd-links:not(:empty){animation:none}}

/* --- mobile: wide algorithm diagrams, 2026-08-17 --- */
/* 2400px flowcharts scaled into a ~350px column render at ~15%: labels become
   ~4px. On phones, swipe horizontally at a legible width instead of shrinking.
   !important is required because the imgs carry an inline width:100%. */
@media (max-width:767px){
  .page-home figure > a:has(> img[src*="protocol-"]){
    display:block;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
    max-height:62vh;border:1px solid #E3D9CE;border-radius:8px;background:#fff;position:relative}
  .page-home figure > a:has(> img[src*="protocol-"]) > img{
    width:900px!important;min-width:900px!important;max-width:none!important;
    height:auto!important;display:block}
  .page-home figure > a:has(> img[src*="protocol-"])::after{
    content:"Swipe to pan \2022 tap to open full size";position:sticky;left:0;display:block;
    font:600 .78rem 'Source Sans 3',sans-serif;color:#5d4a3f;background:#F6F3ED;
    padding:.45rem .7rem;border-top:1px solid #E3D9CE}
  .page-home .mobile-walk{display:block!important}
}

/* --- router step reveal offset, 2026-08-17 --- */
.page-home #fd-roles > *,.page-home #fd-need,.page-home #fd-links{scroll-margin-top:88px}

/* --- nav density fix, 2026-08-16: ten items after adding Patients & Families --- */
.page-home .header-inner .logo,.page-home .header-inner>a:first-child{flex:0 0 auto;width:auto!important;white-space:nowrap;margin-right:1.25rem}
.page-home .nav-desktop{flex-wrap:nowrap}
.page-home .nav-desktop .nav-link{white-space:nowrap;font-size:.875rem;padding-left:.55rem;padding-right:.55rem}
@media (max-width:1240px){.page-home .nav-desktop .nav-link{font-size:.8rem;padding-left:.4rem;padding-right:.4rem}}

.page-home .nmm .state-name{font-family:'Source Sans 3',system-ui,sans-serif;font-size:18px;letter-spacing:4px;font-weight:700;fill:#B3AC9F;text-anchor:middle}
.page-home .nmm .state-name-nm{font-size:26px;fill:#96907F}
.page-home .nmm .dot{stroke:#FFFFFF;stroke-width:2;filter:url(#nmmShadow)}
.page-home .nmm .l1{fill:#C1272D}
.page-home .nmm .l2{fill:#2563EB}
.page-home .nmm .l3{fill:#7C3AED}
.page-home .nmm .call-title{font-family:'Source Sans 3',system-ui,sans-serif;font-size:17px;font-weight:700;fill:#1B1A17}
.page-home .nmm .call-sub{font-family:'Source Sans 3',system-ui,sans-serif;font-size:14px;fill:#6B6558}

/* ===== Our Model: hub-and-spoke tiers + capability map, 2026-08-18 ===== */
.page-home .hs-lede{max-width:52rem;margin:.15rem auto 1.4rem;text-align:center;font-family:'DM Serif Display',Georgia,serif;font-size:clamp(1.15rem,2.1vw,1.5rem);line-height:1.3;color:#0A6C60}
.page-home .tier-cards{display:grid;gap:1rem;grid-template-columns:repeat(4,1fr);margin:0 0 2.2rem}
@media (max-width:1099px){.page-home .tier-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.page-home .tier-cards{grid-template-columns:1fr}}
.page-home .tier-card{position:relative;background:#fff;border:1px solid #E3D9CE;border-top:4px solid var(--tier);border-radius:10px;padding:1.1rem 1.15rem 1.2rem;display:flex;flex-direction:column}
.page-home .tier-badge{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:999px;margin-bottom:.6rem}
.page-home .tier-badge svg{width:15px;height:15px;display:block}
.page-home .tier-name{margin:0 0 .5rem;font-family:'DM Serif Display',Georgia,serif;font-weight:400;font-size:1.16rem;line-height:1.2;color:#1B1A17}
.page-home .tier-body{margin:0 0 .8rem;font-size:.94rem;line-height:1.5;color:#463c34}
.page-home .tier-fn{margin:auto 0 0;font-style:italic;font-size:.9rem;line-height:1.45;color:#6B6558;border-top:1px solid #EFE7DB;padding-top:.7rem}
.page-home .network-map{margin:0;padding:0}
.page-home .network-map-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid #E3D9CE;border-radius:10px;padding:.9rem}
.page-home .nmm{display:block;width:100%;height:auto;margin:0 auto}
@media (max-width:700px){.page-home .nmm{min-width:520px}
.page-home .network-map-scroll{position:relative}
.page-home .network-map-scroll::after{content:"Swipe to pan \2192";position:sticky;left:0;display:block;width:100%;font:600 .78rem 'Source Sans 3',system-ui,sans-serif;color:#5d4a3f;background:#F6F3ED;padding:.45rem .7rem;margin:.6rem -.9rem 0;border-top:1px solid #E3D9CE}}
.page-home .network-map figcaption{margin:.7rem 0 0;font-size:.86rem;line-height:1.5;color:#6B6558;text-align:center}
.page-home .hs-cta{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin-top:2rem}
.page-home .btn-line{background:transparent;border:1px solid rgba(10,108,96,.35);color:#0A6C60;font-weight:700}
.page-home .btn-line:hover{background:rgba(10,108,96,.07);border-color:#0A6C60}
.page-home .hs-cta-note{margin:.75rem 0 0;text-align:center;font-size:.84rem;color:#6B6558}

.page-home .tier-key{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem;list-style:none;margin:.9rem 0 0;padding:0}
.page-home .tier-key li{display:flex;align-items:center;gap:.45rem;font-size:.88rem;font-weight:600;color:#463c34}
.page-home .tier-key .k{width:13px;height:13px;border-radius:999px;box-shadow:0 0 0 1.5px #fff}
.page-home .tier-key .k-hub{background:#C1272D;border-radius:2px;transform:rotate(45deg)}
.page-home .tier-key .k-l1{background:#C1272D}
.page-home .tier-key .k-l2{background:#2563EB}
.page-home .tier-key .k-l3{background:#7C3AED}

/* alignment: the site left-aligns section headings; match it, 2026-08-18 */
.page-home .hs-lede{max-width:640px;margin:.15rem 0 1.4rem;text-align:left}
.page-home #network blockquote{max-width:640px;margin:2.4rem 0 0!important}
.page-home .hs-cta{justify-content:flex-start}
.page-home .hs-cta-note{text-align:left}
/* body-text links in brand teal, not browser default, 2026-08-18 */
.page-home .body-text a{color:#0A6C60;font-weight:600}
.page-home .body-text a:hover{color:#123C4A}
/* map footprint: it was running the full 1152px container and ~840px tall,
   which is a whole screen. Cap it to the content measure. 2026-08-18 */
.page-home .network-map-scroll{max-width:780px}
.page-home .network-map figcaption{max-width:780px;text-align:left}
.page-home .tier-key{justify-content:flex-start;max-width:780px}
/* Mobile horizontal page scroll: the protocol figures are grid items, and a grid
   item's default min-width:auto refuses to shrink below the 900px img inside the
   swipe container — so the figure blew out to 932px and the whole document with
   it. min-width:0 lets the figure shrink and the inner overflow-x:auto work.
   grid item min-width fix, 2026-08-18 */
@media (max-width:767px){
  .page-home figure{min-width:0}
  .page-home .mobile-walk{max-width:100%}
}
/* Nav: the desktop nav needs ~1350px. Below that it clipped, and at 1024 the
   Partner With Us button was off-screen entirely. Hamburger now covers to 1349. */
@media (max-width:1349px){
  .page-home:has(.mobile-menu-btn) .nav-desktop{display:none!important}
  .page-home .mobile-menu-btn{display:flex!important}
}
/* Sticky activation bar: slides up once the in-page strip scrolls away, so the
   transfer number is never more than a glance away. 2026-08-18 */
#actbar{position:fixed;left:0;right:0;bottom:0;z-index:120;background:#B7202E;color:#fff;
  box-shadow:0 -6px 22px rgba(0,0,0,.22);transform:translateY(110%);transition:transform .34s cubic-bezier(.22,.9,.3,1);
  padding:11px 0}
#actbar.show{transform:translateY(0)}
#actbar .inner{max-width:1200px;margin:0 auto;padding:0 22px;display:flex;align-items:center;
  justify-content:center;gap:8px 22px;flex-wrap:wrap;text-align:center}
#actbar .eyebrow{font-size:11.5px;font-weight:800;letter-spacing:2px;text-transform:uppercase;opacity:.9}
#actbar a.num{color:#fff;font-size:clamp(18px,2.4vw,23px);font-weight:800;text-decoration:none;
  border-bottom:2px solid rgba(255,255,255,.55)}
#actbar .note{font-size:12.5px;opacity:.9}
#actbar .x{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;
  color:#fff;opacity:.7;font-size:20px;line-height:1;cursor:pointer;padding:6px 10px}
#actbar .x:hover{opacity:1}
@media (max-width:640px){#actbar .note{display:none}}
@media (prefers-reduced-motion:reduce){#actbar{transition:none}}


/* ============================================================
   2026-08-21 — Partner With Us (#partner) layout + tone fix
   Scoped entirely to #partner. Fixes ~1190x473px of empty right
   column below the Get in Touch card, the orphan 7th card, and
   ~1460px of near-black sitting above a same-colour footer.
   ============================================================ */
@media (min-width: 961px){
  #partner .cta-layout{grid-template-columns:1.3fr 1fr;row-gap:0}
  #partner .cta-text{display:contents}
  #partner .cta-text > .section-eyebrow{grid-column:1;grid-row:1}
  #partner .cta-text > .section-heading{grid-column:1;grid-row:2}
  #partner .cta-text > .body-text{grid-column:1;grid-row:3}
  #partner .cta-contact{grid-column:2;grid-row:1 / span 3}
  #partner .partner-types{grid-column:1 / -1;grid-row:4;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:var(--space-16)}
  #partner .partner-type:first-child{grid-column:1 / -1;display:grid;grid-template-columns:minmax(200px,1fr) 2fr;column-gap:var(--space-10);align-items:start}
  #partner .partner-type:first-child .partner-type-title{margin-bottom:0}
  #partner .partner-type:nth-child(1){order:1}
  #partner .partner-type:nth-child(3){order:2}
  #partner .partner-type:nth-child(4){order:3}
  #partner .partner-type:nth-child(5){order:4}
  #partner .partner-type:nth-child(2){order:5}
  #partner .partner-type:nth-child(6){order:6}
  #partner .partner-type:nth-child(7){order:7}
}
#partner{background:#f5f3ee;color:#2b2520;border-top:1px solid rgba(43,37,32,.10)}
#partner .section-eyebrow.light{color:#00a899}
#partner .section-heading.light{color:#2b2520}
#partner .body-text.light{color:#2b2520}
#partner .contact-card{border:1px solid rgba(43,37,32,.10)}
#partner .partner-type{background:#fff;border:1px solid rgba(43,37,32,.10);border-left:3px solid #00a899;border-radius:10px;padding:24px 26px}
#partner .partner-type-title{color:#2b2520}
#partner .partner-type-desc{color:#7a7268}
#partner .partner-types a{color:#00a899 !important}
#partner .partner-type:first-child{background:rgba(130,57,51,.06);border-left-color:#823933}
#partner .partner-type:first-child a{color:#823933 !important}
