:root{
  --navy:#081D2D;
  --navy-soft:#12314A;
  --teal:#00A6A6;
  --teal-dark:#00807F;
  --charcoal:#33383F;
  --paper:#FBFBF9;
  --mist:#EEF2F1;
  --tint:#E1F1F0;
  --line:#D9DFDD;
  --max:1120px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',Arial,sans-serif;
  color:var(--charcoal);
  background:var(--paper);
  line-height:1.6;
  font-size:17px;
}
h1,h2,h3,.brandtype{font-family:'Poppins',Arial,sans-serif;}
h1,h2,h3{color:var(--navy);margin:0;font-weight:600;}
p{margin:0;}
a{color:inherit;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}
header .wrap{max-width:1360px;}
section{padding:84px 0;}

/* background rhythm utilities - every section gets one, so no two
   adjacent sections ever share a background with nothing to divide them */
.bg-paper{background:var(--paper);}
.bg-mist{background:var(--mist);}
.bg-tint{background:var(--tint);}
.bg-paper + .bg-paper,
.bg-mist + .bg-mist,
.bg-tint + .bg-tint{border-top:1px solid var(--line);}
@media (max-width:720px){
  section{padding:52px 0;}
  .wrap{padding:0 22px;}
  body{font-size:16px;}
}

/* logo mark */
.mark svg{display:block;}
.on-dark .mark-fig{fill:#fff;}

/* header */
header{
  position:sticky;top:0;z-index:40;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;
}
.logo-lockup{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-lockup .brandtype{font-weight:700;font-size:18px;color:var(--navy);letter-spacing:0.2px;white-space:nowrap;}
.logo-lockup .brandtype span{color:var(--teal);}
.navlinks{display:flex;align-items:center;gap:18px;flex:1;justify-content:center;}
.navlinks > a{
  text-decoration:none;color:var(--charcoal);font-size:14px;font-weight:500;
  padding-bottom:4px;border-bottom:2px solid transparent;white-space:nowrap;
}
.navlinks > a:hover{color:var(--teal-dark);}
.navlinks > a.active{color:var(--navy);border-bottom-color:var(--teal);}

/* nav dropdown, desktop only */
.navdrop{position:relative;display:flex;align-items:center;}
.navdrop > a{
  text-decoration:none;color:var(--charcoal);font-size:14px;font-weight:500;
  padding-bottom:4px;border-bottom:2px solid transparent;white-space:nowrap;
}
.navdrop > a:hover{color:var(--teal-dark);}
.navdrop > a.active{color:var(--navy);border-bottom-color:var(--teal);}
.navdrop-label{
  color:var(--charcoal);font-size:14px;font-weight:500;cursor:pointer;
  padding-bottom:4px;border-bottom:2px solid transparent;white-space:nowrap;
  user-select:none;
}
.navdrop-label:hover{color:var(--teal-dark);}
.navdrop-label.active{color:var(--navy);border-bottom-color:var(--teal);}
.navdrop-toggle{
  background:none;border:none;cursor:pointer;padding:4px 2px 4px 4px;
  color:var(--charcoal);display:inline-flex;align-items:center;
}
.navdrop-toggle:hover{color:var(--teal-dark);}
.navdrop-toggle svg{transition:transform 0.15s ease;}
.navdrop.open .navdrop-toggle svg{transform:rotate(180deg);}
.navdrop-menu{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:14px;
  min-width:260px;display:none;z-index:60;
}
.navdrop.open .navdrop-menu{display:block;}
.navdrop-menu-inner{
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 14px 32px rgba(8,29,45,0.14);padding:8px;
}
.navdrop-menu a{
  display:block;padding:11px 13px;border-radius:6px;font-size:14px;
  color:var(--charcoal);text-decoration:none;white-space:nowrap;
}
.navdrop-menu a:hover{background:var(--mist);color:var(--navy);}
.navctas{display:flex;gap:10px;align-items:center;flex:0 0 auto;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 18px;border-radius:7px;font-weight:600;font-size:14px;
  text-decoration:none;border:1.5px solid transparent;cursor:pointer;
  font-family:'Inter',Arial,sans-serif;white-space:nowrap;
}
.btn-teal{background:var(--teal);color:#fff;}
.btn-teal:hover{background:var(--teal-dark);}
.btn-outline{border-color:var(--navy);color:var(--navy);background:transparent;}
.btn-outline:hover{background:var(--navy);color:#fff;}
.btn-outline-light{border-color:#fff;color:#fff;background:transparent;}
.btn-outline-light:hover{background:#fff;color:var(--navy);}
.menubtn{display:none;background:none;border:none;cursor:pointer;padding:6px;}
.menubtn span{display:block;width:22px;height:2px;background:var(--navy);margin:5px 0;}
@media (max-width:1400px){
  .navlinks{display:none;}
  .navctas .btn-outline{display:none;}
  .menubtn{display:block;}
}
@media (max-width:520px){
  .navctas .btn-teal{display:none;}
  .logo-lockup .brandtype{font-size:15px;}
}
.drawer{
  display:none;flex-direction:column;gap:4px;
  padding:8px 0 20px;border-top:1px solid var(--line);
}
.drawer.open{display:flex;}
.drawer a{padding:10px 0;text-decoration:none;color:var(--navy);font-weight:500;font-size:15px;border-bottom:1px solid var(--line);}
.drawer a.drawer-sub{
  padding-left:16px;font-weight:400;font-size:13.5px;color:var(--charcoal);
  border-bottom:1px dashed var(--line);
}
.drawer-group-label{
  padding:10px 0 4px;font-weight:700;font-size:12px;letter-spacing:0.4px;text-transform:uppercase;
  color:#8a8f94;
}

/* ============ UNIFIED HERO - same layout on every page ============ */
.hero{padding:64px 0 60px;}
.hero .wrap{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:center;}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr;}}
.hero .crumb{color:var(--teal-dark);font-size:13.5px;font-weight:500;margin-bottom:16px;}
.hero .crumb a{text-decoration:none;color:#6b7278;}
.hero .crumb a:hover{color:var(--navy);}
.hero h1{font-size:42px;line-height:1.18;letter-spacing:-0.4px;max-width:19ch;}
@media (max-width:560px){.hero h1{font-size:30px;}}
.hero .sub{margin-top:20px;font-size:17.5px;color:var(--charcoal);max-width:52ch;line-height:1.65;}
.hero .ctarow{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap;}
.hero .btn{padding:13px 22px;font-size:14.5px;}
.trustline{margin-top:20px;font-size:13.5px;color:#6b7278;}

/* shared circular image ring, used in heroes AND split-feature sections */
.imgring{
  border-radius:50%;background:var(--mist);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 8px 30px rgba(8,29,45,0.06);
}
.imgring.size-lg{width:320px;height:320px;}
.imgring.size-md{width:250px;height:250px;}
@media (max-width:900px){.imgring.size-lg{width:220px;height:220px;}}
@media (max-width:600px){.imgring{width:180px !important;height:180px !important;}}
.hero-visual{display:flex;justify-content:center;order:2;}
@media (max-width:900px){.hero-visual{order:-1;}}

/* ============ pull statement ============ */
.statement{background:var(--navy-soft);padding:76px 0;}
.statement .inner{max-width:820px;}
.statement.centered .inner{margin-left:auto;margin-right:auto;text-align:center;}
.statement.centered .body{margin-left:auto;margin-right:auto;}
.statement p.eyebrow{color:#8fb9c2;font-size:14.5px;margin-bottom:16px;font-weight:500;}
.statement .line{
  font-family:'Poppins',Arial,sans-serif;font-weight:600;color:#fff;
  font-size:32px;line-height:1.35;
}
@media (max-width:600px){.statement .line{font-size:24px;}}
.statement .line em{color:var(--teal);font-style:normal;}
.statement .body{margin-top:24px;color:#c9d3d8;font-size:16px;max-width:64ch;line-height:1.7;}
.statement.with-image .wrap{display:grid;grid-template-columns:1.2fr 0.8fr;gap:48px;align-items:center;}
.statement.with-image .inner{max-width:none;text-align:left;margin:0;}
.statement.with-image .visual{display:flex;justify-content:center;}
@media (max-width:860px){.statement.with-image .wrap{grid-template-columns:1fr;}.statement.with-image .visual{order:-1;}}

/* ============ split feature: image one side, text the other, alternating ============ */
.splitfeature .wrap{display:grid;grid-template-columns:0.8fr 1.2fr;gap:56px;align-items:center;}
.splitfeature.reverse .wrap{grid-template-columns:1.2fr 0.8fr;}
.splitfeature .feature-visual{display:flex;justify-content:center;order:1;}
.splitfeature .feature-content{order:2;}
.splitfeature.reverse .feature-visual{order:2;}
.splitfeature.reverse .feature-content{order:1;}
@media (max-width:860px){
  .splitfeature .wrap, .splitfeature.reverse .wrap{grid-template-columns:1fr;gap:30px;}
  .splitfeature .feature-visual,
  .splitfeature.reverse .feature-visual{order:-1;}
  .splitfeature .feature-content,
  .splitfeature.reverse .feature-content{order:2;}
}
.feature-content .eyebrow{color:var(--teal-dark);font-size:13.5px;font-weight:600;margin-bottom:12px;}
.pillar-num{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--teal);
  font-family:'Poppins',sans-serif;font-weight:700;font-size:16px;margin-bottom:22px;
}
.pillar-num::after{
  content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  width:2px;height:14px;background:linear-gradient(to bottom, var(--teal), transparent);
}
.feature-content h2{font-size:27px;margin-bottom:16px;}

/* dark variant for a splitfeature segment, used sparingly for real visual punctuation */
.splitfeature.on-dark{background:var(--navy-soft);}
.splitfeature.on-dark .feature-content h2{color:#fff;}
.splitfeature.on-dark .feature-content p{color:#c9d3d8;}
.splitfeature.on-dark .feature-content .eyebrow{color:#8fb9c2;}
.splitfeature.on-dark .pillar-num{background:var(--teal);color:var(--navy);}
.feature-content p{font-size:16px;color:var(--charcoal);margin-bottom:14px;line-height:1.65;max-width:56ch;}
.feature-content p:last-child{margin-bottom:0;}

/* ============ generic left-aligned section heading ============ */
.sectionhead h2{font-size:27px;}
.sectionhead .lede{font-size:16.5px;color:var(--charcoal);max-width:68ch;margin-top:14px;}

/* two-column prose block: short label left, paragraphs right */
.twocol .wrap{display:grid;grid-template-columns:0.8fr 1.2fr;gap:56px;}
@media (max-width:820px){.twocol .wrap{grid-template-columns:1fr;gap:20px;}}
.twocol .col-right p{margin-bottom:18px;font-size:16.5px;color:var(--charcoal);max-width:66ch;}
.twocol .col-right p:last-child{margin-bottom:0;}

/* prevent / build */
.balance.centered > .wrap > h2{text-align:center;}
.balance-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:40px;}
@media (max-width:760px){.balance-grid{grid-template-columns:1fr;}}
.balance-col{background:#fff;padding:34px 32px;}
.balance-col h3{font-size:19px;margin-bottom:18px;}
.balance-col.prevent h3{color:#8a4b2f;}
.balance-col.build h3{color:var(--teal-dark);}
.balance-col ul{margin:0;padding:0;list-style:none;}
.balance-col li{
  padding:12px 0;border-top:1px solid var(--line);
  font-size:15.5px;color:var(--charcoal);line-height:1.55;
  display:flex;gap:12px;
}
.balance-col li:first-of-type{border-top:none;}
.balance-col li:before{content:"";flex:0 0 6px;width:6px;height:6px;border-radius:50%;margin-top:8px;}
.balance-col.prevent li:before{background:#c46a41;}
.balance-col.build li:before{background:var(--teal);}

/* framework pillars */
.pillars{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin-top:46px;}
.pillars.cols-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:960px){.pillars, .pillars.cols-3{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.pillars, .pillars.cols-3{grid-template-columns:1fr;}}
.pillar .icon{
  width:52px;height:52px;border-radius:50%;border:1.5px solid var(--teal);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.pillar h3{font-size:16px;line-height:1.35;margin-bottom:8px;}
.pillar p{font-size:14.5px;color:#5b6167;line-height:1.55;}

/* audience role chips */
.rolelist{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 6px;}
.rolelist span{
  font-size:13.5px;color:var(--navy);background:var(--mist);
  border:1px solid var(--line);padding:7px 13px;border-radius:20px;
}
.audience-note{
  margin-top:30px;padding:22px 24px;border-radius:10px;background:var(--mist);
  border:1px solid var(--line);font-size:14.5px;color:var(--charcoal);line-height:1.6;
}
.audience-note.on-white{background:#fff;}

/* confident membership journey — a visual connected step sequence, not a plain numbered list */
.journey{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:36px;margin-top:30px;box-shadow:0 2px 14px rgba(8,29,45,0.05);
}
.journey h3{font-size:19px;margin-bottom:8px;}
.journey .journey-lede{font-size:15px;color:#5b6167;margin-bottom:24px;max-width:64ch;}
.journey-steps{display:flex;flex-direction:column;margin-top:4px;}
.journey-step{display:flex;gap:18px;position:relative;padding-bottom:26px;}
.journey-step:last-child{padding-bottom:0;}
.journey-step::before{
  content:"";position:absolute;left:19px;top:40px;bottom:2px;width:2px;
  background:linear-gradient(to bottom, var(--teal), var(--line));
}
.journey-step:last-child::before{display:none;}
.journey-step .step-num{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--navy);color:var(--teal);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;
  font-family:'Poppins',sans-serif;z-index:1;box-shadow:0 3px 10px rgba(8,29,45,0.18);
}
.journey-step p{font-size:15.5px;color:var(--charcoal);line-height:1.6;padding-top:8px;margin:0;}
html.js .journey-step{opacity:0;transform:translateX(-18px);transition:opacity 0.5s ease, transform 0.5s ease;}
html.js .journey-step.is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  html.js .journey-step{opacity:1;transform:none;transition:none;}
}
.journey .badge-preview{display:flex;align-items:center;gap:18px;margin-top:24px;padding-top:24px;border-top:1px solid var(--line);}
.journey .badge-preview svg{flex:0 0 auto;}
.journey .badge-preview .cap{font-size:13px;color:#6b7278;line-height:1.5;}

/* vision chips */
.vision-chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px;}
.vision-chips span{
  background:#fff;border:1px solid var(--line);padding:9px 16px;border-radius:8px;
  font-size:14.5px;color:var(--navy);font-weight:500;
  animation:floatChip 4s ease-in-out infinite;
}
.vision-chips span:nth-child(2){animation-delay:.35s;}
.vision-chips span:nth-child(3){animation-delay:.7s;}
.vision-chips span:nth-child(4){animation-delay:1.05s;}
.vision-chips span:nth-child(5){animation-delay:1.4s;}
.vision-chips span:nth-child(6){animation-delay:1.75s;}
@keyframes floatChip{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}

/* ============ scroll reveal: text settles first, image follows a beat after ============
   Scoped to html.js (added by script.js the instant it runs) so a visitor whose JS
   fails to load or errors out still sees full content immediately, never a blank section. */
html.js .hero .wrap > div:first-child,
html.js .splitfeature .feature-content{
  opacity:0;transform:translateY(26px);
  transition:opacity 0.65s ease, transform 0.65s ease;
}
html.js .hero .wrap > div:first-child.is-visible,
html.js .splitfeature .feature-content.is-visible{opacity:1;transform:none;}
html.js .hero-visual,
html.js .splitfeature .feature-visual{
  opacity:0;transform:translateY(26px);
  transition:opacity 0.65s ease 0.18s, transform 0.65s ease 0.18s;
}
html.js .hero-visual.is-visible,
html.js .splitfeature .feature-visual.is-visible{opacity:1;transform:none;}
html.js section:not(.hero):not(.splitfeature) > .wrap{
  opacity:0;transform:translateY(22px);
  transition:opacity 0.6s ease, transform 0.6s ease;
}
html.js section:not(.hero):not(.splitfeature) > .wrap.is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .vision-chips span{animation:none;}
  html.js .hero .wrap > div:first-child, html.js .splitfeature .feature-content, html.js .hero-visual,
  html.js .splitfeature .feature-visual, html.js section:not(.hero):not(.splitfeature) > .wrap{
    opacity:1;transform:none;transition:none;
  }
}

/* home teaser cards */
.teasergrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px;}
.teasergrid.cols-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:1060px){.teasergrid.cols-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:860px){.teasergrid, .teasergrid.cols-4{grid-template-columns:1fr;}}
.teaser{border:1px solid var(--line);border-radius:12px;padding:28px;background:#fff;text-decoration:none;display:block;box-shadow:0 2px 10px rgba(8,29,45,0.04);transition:box-shadow 0.15s ease, border-color 0.15s ease;}
.teaser:hover{border-color:var(--teal);box-shadow:0 6px 20px rgba(8,29,45,0.08);}
.teaser h3{font-size:17px;margin-bottom:8px;color:var(--navy);}
.teaser p{font-size:14.5px;color:#5b6167;margin-bottom:14px;line-height:1.55;}
.teaser .arrow{font-size:13.5px;color:var(--teal-dark);font-weight:600;}

/* "beyond finance" floating chips around the illustration, rather than a plain row under text */
.orbit{position:relative;width:380px;height:380px;display:flex;align-items:center;justify-content:center;}
.orbit-chip{
  position:absolute;background:#fff;border:1px solid var(--line);padding:7px 14px;border-radius:20px;
  font-size:13px;color:var(--navy);font-weight:500;box-shadow:0 4px 14px rgba(8,29,45,0.08);
  animation:floatChip 4s ease-in-out infinite;white-space:nowrap;
}
.orbit-chip.c1{top:0; left:10px;}
.orbit-chip.c2{top:14px; right:-10px;animation-delay:.3s;}
.orbit-chip.c3{top:100px; left:-56px;animation-delay:.6s;}
.orbit-chip.c4{top:110px; right:-64px;animation-delay:.9s;}
.orbit-chip.c5{top:190px; left:-70px;animation-delay:1.2s;}
.orbit-chip.c6{top:190px; right:-70px;animation-delay:1.5s;}
.orbit-chip.c7{bottom:70px; left:-40px;animation-delay:1.8s;}
.orbit-chip.c8{bottom:70px; right:-46px;animation-delay:2.1s;}
.orbit-chip.c9{bottom:0; left:20px;animation-delay:2.4s;}
.orbit-chip.c10{bottom:-6px; right:6px;animation-delay:2.7s;}
@media (max-width:900px){
  .orbit{width:auto;height:auto;display:flex;flex-direction:column;align-items:center;gap:14px;}
  .orbit-chip{position:static !important;animation:none;}
  .orbit .chiprow{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;}
}

/* ============ contact page: drop-in entrance animation ============ */
@keyframes dropIn{
  0%{opacity:0;transform:translateY(-70px);}
  60%{opacity:1;transform:translateY(12px);}
  80%{transform:translateY(-4px);}
  100%{opacity:1;transform:translateY(0);}
}
.drop-in{animation:dropIn 0.75s cubic-bezier(0.34,1.56,0.64,1) both;}
.drop-in.delay-1{animation-delay:0.12s;}
.drop-in.delay-2{animation-delay:0.24s;}
@media (prefers-reduced-motion: reduce){
  .drop-in{animation:none;}
}
.field.conditional{display:none;}
.field.conditional.show{display:block;}
.phone-row{display:flex;gap:10px;}
.phone-row .dial{width:90px;flex:0 0 auto;}
.phone-row .number{flex:1;}

/* role grid, icon-card pattern for "who this is for" */
.rolegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px;text-align:left;}
@media (max-width:860px){.rolegrid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.rolegrid{grid-template-columns:1fr;}}
.rolecard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px;box-shadow:0 2px 10px rgba(8,29,45,0.04);}
.rolecard-icon{
  width:42px;height:42px;border-radius:50%;background:var(--mist);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.rolecard h3{font-size:16px;margin-bottom:6px;color:var(--navy);}
.rolecard p{font-size:13.5px;color:#5b6167;line-height:1.5;}

/* redesigned "why joining" benefit cards, bigger and bolder than the plain outline-icon pillars */
.benefitgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px;text-align:left;}
@media (max-width:760px){.benefitgrid{grid-template-columns:1fr;}}
.benefitcard{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:30px;
  box-shadow:0 4px 18px rgba(8,29,45,0.05);transition:box-shadow 0.2s ease, transform 0.2s ease;
}
.benefitcard:hover{box-shadow:0 10px 28px rgba(8,29,45,0.1);transform:translateY(-2px);}
.benefitcard-icon{
  width:52px;height:52px;border-radius:12px;background:var(--teal);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.benefitcard h3{font-size:18px;margin-bottom:10px;color:var(--navy);}
.benefitcard p{font-size:14.5px;color:#5b6167;line-height:1.6;}

/* member testimonial */
.testimonial{display:flex;gap:28px;align-items:flex-start;}
@media (max-width:700px){.testimonial{flex-direction:column;align-items:center;text-align:center;}}
.testimonial-photo{
  flex:0 0 auto;width:96px;height:96px;border-radius:50%;background:var(--mist);
  display:flex;align-items:center;justify-content:center;overflow:hidden;border:3px solid #fff;
  box-shadow:0 4px 16px rgba(8,29,45,0.08);
}
.testimonial-content .eyebrow{color:var(--teal-dark);font-size:13.5px;font-weight:600;margin-bottom:12px;}
.testimonial-content .quote{font-size:16.5px;font-style:italic;color:var(--navy);line-height:1.65;max-width:70ch;}
.testimonial-content .attribution{font-size:13.5px;color:#5b6167;margin-top:14px;}
.testimonial-content .attribution strong{color:var(--navy);}

/* certification page: each step as its own visual segment, not a flowing list */
.stepblocks{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:36px;}
@media (max-width:760px){.stepblocks{grid-template-columns:1fr;}}
.stepblock{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:0 2px 10px rgba(8,29,45,0.04);}
.stepblock .stepblock-top{display:flex;align-items:center;gap:14px;margin-bottom:14px;}
.stepblock .stepblock-icon{
  flex:0 0 auto;width:48px;height:48px;border-radius:50%;background:var(--mist);
  display:flex;align-items:center;justify-content:center;
}
.stepblock .stepblock-num{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:13px;color:var(--teal-dark);
  letter-spacing:0.4px;
}
.stepblock p.step-text{font-size:15px;color:var(--charcoal);line-height:1.6;margin:0;}

.hook{background:var(--navy);color:#fff;position:relative;overflow:hidden;}
.hook .netbg-holder{position:absolute;inset:0;overflow:hidden;opacity:0.5;}
.hook .netbg-holder svg{width:100%;height:100%;display:block;}
.hook .wrap{position:relative;z-index:2;text-align:center;}
.hook-inner{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:36px;}
.hook-stat{padding:0 10px;}
.hook-stat .num{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:84px;color:var(--teal);line-height:1;
  animation:pulseGlow 3.2s ease-in-out infinite;
}
@keyframes pulseGlow{
  0%,100%{text-shadow:0 0 26px rgba(0,166,166,0.35);}
  50%{text-shadow:0 0 50px rgba(0,166,166,0.7);}
}
.hook-stat .hook-label{font-size:16px;color:#c9d3d8;max-width:26ch;margin:10px auto 0;}
.hook-stat .hook-src{font-size:12px;color:#7d96a3;margin-top:8px;}
.hook-divider{width:1px;height:130px;background:linear-gradient(180deg,transparent,rgba(255,255,255,0.22),transparent);}
@media (max-width:760px){.hook-divider{display:none;}}
.hook-quote{
  max-width:340px;text-align:left;background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.14);border-radius:12px;padding:22px 24px;
}
.hook-quote .q{font-size:15px;font-style:italic;color:#fff;line-height:1.6;margin-bottom:10px;}
.hook-quote .a{font-size:12.5px;color:#9fb0b9;}
.hook-cta{margin-top:34px;font-size:13.5px;color:var(--teal);font-weight:600;}
.hook-cta .arrow{display:inline-block;animation:bounceArrow 1.6s ease-in-out infinite;}
@keyframes bounceArrow{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}
@media (prefers-reduced-motion: reduce){
  .hook-stat .num{animation:none;}
  .hook-cta .arrow{animation:none;}
}

/* home audience split, dark cards */
.whofor{background:var(--navy);}
.whofor h2{color:#fff;}
.whofor .lede{color:#c9d3d8;}
.whofor.centered .wrap > h2, .whofor.centered .wrap > p.lede{text-align:center;margin-left:auto;margin-right:auto;}
.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:44px;}
@media (max-width:860px){.audience-grid{grid-template-columns:1fr;}}
.audience-grid.cols-3{grid-template-columns:1fr 1fr 1fr;}
@media (max-width:980px){.audience-grid.cols-3{grid-template-columns:1fr;}}
.audience-card{
  background:var(--navy-soft);border:1px solid #274158;border-radius:14px;
  padding:32px 30px;display:flex;flex-direction:column;
}
.audience-card .tag{
  display:inline-block;font-size:12.5px;font-weight:600;letter-spacing:0.3px;
  color:var(--teal);background:rgba(0,166,166,0.12);
  padding:5px 12px;border-radius:20px;margin-bottom:16px;align-self:flex-start;
}
.audience-card h3{color:#fff;font-size:21px;margin-bottom:10px;}
.audience-card .desc{color:#c9d3d8;font-size:15px;margin-bottom:20px;line-height:1.6;}
.audience-card .btn{margin-top:auto;align-self:flex-start;}
.audience-card .card-badge{margin-top:16px;padding-top:16px;border-top:1px solid #274158;display:flex;align-items:center;gap:10px;}
.audience-card .card-badge span{font-size:12px;color:#9fb0b9;}
.whofor.centered .audience-card{align-items:center;text-align:center;}
.whofor.centered .audience-card .tag{align-self:center;}
.whofor.centered .audience-card .btn{align-self:center;}
.whofor.centered .audience-card .card-badge{flex-direction:column;text-align:center;}

/* join forms */
/* join forms */
.join-grid{display:grid;grid-template-columns:0.95fr 1.05fr;gap:56px;align-items:start;margin-top:34px;}
@media (max-width:900px){.join-grid{grid-template-columns:1fr;gap:32px;}}
.join-side h3{font-size:19px;margin-bottom:16px;}
.join-side ul{margin:0;padding:0;list-style:none;}
.join-side li{
  display:flex;gap:12px;padding:13px 0;border-top:1px solid var(--line);
  font-size:15px;color:var(--charcoal);line-height:1.55;
}
.join-side li:first-child{border-top:none;}
.join-side li svg{flex:0 0 auto;margin-top:2px;color:var(--teal-dark);}
.joincard{border:1px solid var(--line);border-radius:14px;padding:32px;background:#fff;box-shadow:0 4px 20px rgba(8,29,45,0.06);}
.joincard h3{font-size:19px;margin-bottom:6px;}
.joincard .sub{font-size:14.5px;color:#6b7278;margin-bottom:22px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:13.5px;font-weight:500;color:var(--navy);margin-bottom:6px;}
.field input,.field select{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:7px;
  font-size:15px;font-family:'Inter',Arial,sans-serif;color:var(--charcoal);background:#fdfdfc;
}
.field input:focus,.field select:focus{outline:2px solid var(--teal);outline-offset:1px;}
.joincard .btn{width:100%;margin-top:6px;padding:13px;font-size:15px;}
.formnote{font-size:12.5px;color:#8a8f94;margin-top:12px;line-height:1.5;}
.confirm{display:none;text-align:center;padding:20px 6px;}
.confirm.show{display:block;}
.confirm .mark{margin:0 auto 14px;}
.confirm h4{font-size:18px;color:var(--navy);margin-bottom:8px;}
.confirm p{font-size:14.5px;color:#5b6167;}
.err{color:#a13b2b;font-size:12.5px;margin-top:4px;display:none;}
.err.show{display:block;}

/* bottom cta band */
.ctaband{background:var(--teal);}
.ctaband .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.ctaband h2{color:#fff;font-size:24px;}
.ctaband p{color:#e6f5f5;font-size:15px;margin-top:6px;}
.ctaband .ctarow{display:flex;gap:12px;flex-wrap:wrap;}
.ctaband .btn-teal{background:var(--navy);}
.ctaband .btn-teal:hover{background:#0d2a40;}

/* footer */
footer{background:var(--navy);padding:60px 0 32px;}

/* ============ evidence / stats section, shared web + brochure language ============ */
.evidence{background:var(--navy);position:relative;overflow:hidden;}
.evidence .netbg{position:absolute;inset:0;opacity:0.35;pointer-events:none;}
.evidence .netbg-holder{position:absolute;inset:0;overflow:hidden;}
.evidence .netbg-holder svg{width:100%;height:100%;display:block;}
.evidence .wrap{position:relative;z-index:2;}
.evidence h2{color:#fff;}
.evidence .lede{color:#c9d3d8;}
.evidence.centered .wrap > h2, .evidence.centered .wrap > p.lede{text-align:center;margin-left:auto;margin-right:auto;}
.evidence.centered .statcard{text-align:center;}
.evidence.centered .statcard.wide{justify-content:center;text-align:left;}
.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;}
@media (max-width:860px){.statgrid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.statgrid{grid-template-columns:1fr;}}
.statcard{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);border-radius:12px;padding:22px;}
.statcard.wide{grid-column:span 3;display:flex;align-items:center;gap:22px;background:rgba(0,166,166,0.14);border-color:rgba(0,166,166,0.3);flex-wrap:wrap;}
@media (max-width:860px){.statcard.wide{grid-column:span 2;}}
@media (max-width:560px){.statcard.wide{grid-column:span 1;}}
.statcard .num{font-family:'Poppins',sans-serif;font-size:38px;font-weight:700;color:var(--teal);line-height:1;}
.statcard.wide .num{flex:0 0 auto;}
.statcard .lbl{font-size:14.5px;color:#fff;margin-top:12px;line-height:1.55;font-weight:500;}
.statcard.wide .lbl{margin-top:0;}
.statcard .src{font-size:12px;color:#8fa0ab;margin-top:12px;line-height:1.5;}

/* quotes */
.quotes{background:var(--mist);}
.quotegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px;}
@media (max-width:900px){.quotegrid{grid-template-columns:1fr;}}
.quotecard{
  background:#fff;border-radius:14px;padding:28px 24px;border-top:3px solid var(--teal);
  box-shadow:0 4px 20px rgba(8,29,45,0.05);display:flex;flex-direction:column;
}
.quotecard .quote-mark{font-family:Georgia,serif;font-size:52px;color:var(--teal);opacity:0.3;line-height:1;margin-bottom:-6px;}
.quotecard p.q{font-size:15px;font-style:italic;color:var(--navy);line-height:1.6;margin-bottom:18px;flex:1;}
.quote-person{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.quote-person .avatar{
  width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex:0 0 auto;
}
.quote-person .name{font-size:13.5px;font-weight:700;color:var(--navy);}
.quote-person .role{font-size:12px;color:#8a8f94;}
.quotecard .context{font-size:12.5px;color:#5b6167;line-height:1.55;}
.editorial{background:var(--navy-soft);color:#fff;border-radius:12px;padding:26px 28px;margin-top:26px;}
.editorial p{font-size:14.5px;color:#dbe4e7;line-height:1.7;}
.editorial p strong{color:#fff;}
.foot-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;padding-bottom:40px;border-bottom:1px solid #1c3a52;}
@media (max-width:760px){.foot-top{grid-template-columns:1fr 1fr;}}
.foot-brand p{color:#9fb0b9;font-size:14.5px;margin-top:16px;max-width:34ch;line-height:1.6;}
.foot-col h4{color:#fff;font-size:14px;margin-bottom:14px;font-weight:600;}
.foot-col a{display:block;color:#a9bac2;text-decoration:none;font-size:14.5px;margin-bottom:10px;}
.foot-col a:hover{color:#fff;}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;flex-wrap:wrap;gap:12px;}
.foot-bottom p{color:#7c8f99;font-size:13px;}

/* ==========================================================================
   Human Led Finance platform pages (check inbox, pledge, member, next steps)
   ========================================================================== */
.hlf-check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.5;color:var(--charcoal);margin:6px 0 14px;cursor:pointer;}
.hlf-check input{width:18px;height:18px;margin-top:2px;accent-color:var(--teal);flex:0 0 auto;}
.hlf-narrow{max-width:760px;margin:0 auto;}
.hlf-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:40px;box-shadow:0 4px 20px rgba(8,29,45,0.06);}
@media (max-width:560px){.hlf-card{padding:26px 20px;}}
.hlf-center{text-align:center;}
.hlf-icon{width:64px;height:64px;border-radius:50%;background:var(--tint);color:var(--teal-dark);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.hlf-lead{font-size:18px;line-height:1.65;color:var(--charcoal);max-width:60ch;margin:0 auto;}
.hlf-tips{list-style:none;padding:0;margin:26px 0 0;border-top:1px solid var(--line);}
.hlf-tips li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;display:flex;gap:10px;}
.hlf-tips li svg{flex:0 0 auto;color:var(--teal);margin-top:3px;}
.hlf-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px;}
.hlf-actions .btn{padding:13px 22px;font-size:15px;}
.hlf-notice{background:var(--mist);border-radius:10px;padding:14px 16px;font-size:14.5px;margin-top:18px;text-align:center;}
.hlf-error{background:#FBEEE9;color:#A13B2B;border-radius:10px;padding:14px 16px;font-size:14.5px;margin:0 0 16px;}
.hlf-hidden{display:none !important;}
.hlf-kicker{font-size:12.5px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--teal-dark);margin-bottom:10px;}
/* pledge */
.hlf-panel{border-radius:16px;padding:30px 32px;margin:0 0 18px;}
.hlf-panel h2{font-size:22px;text-align:center;margin-bottom:6px;}
.hlf-panel .hlf-panel-sub{text-align:center;font-size:15px;margin-bottom:16px;}
.hlf-promise{background:#F3FAFA;border:1px solid #CFE9E8;}
.hlf-promise .hlf-panel-sub{color:#5b6167;}
.hlf-mine{background:var(--navy);color:#E6EEF3;}
.hlf-mine h2{color:#fff;}
.hlf-mine .hlf-panel-sub{color:#A9BCCB;}
.hlf-list{list-style:none;padding:0;margin:0;}
.hlf-list li{display:flex;gap:14px;align-items:flex-start;padding:11px 0;font-size:16px;line-height:1.55;}
.hlf-list li + li{border-top:1px solid rgba(0,166,166,.18);}
.hlf-mine .hlf-list li + li{border-top:1px solid rgba(255,255,255,.1);}
.hlf-li-icon{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:1px;}
.hlf-promise .hlf-li-icon{background:var(--teal);color:#fff;}
.hlf-mine .hlf-li-icon{background:rgba(0,166,166,.2);color:var(--teal);font-family:'Poppins',sans-serif;font-weight:700;font-size:14px;}
.hlf-sign{border:2px dashed var(--line);border-radius:16px;padding:26px 24px;margin-top:24px;}
.hlf-sign .hlf-motto{font-family:'Poppins',sans-serif;font-weight:700;font-size:24px;color:var(--navy);text-align:center;margin-bottom:18px;}
.hlf-sign .hlf-motto span{color:var(--teal);}
.hlf-sign .hlf-check{font-size:15px;}
.hlf-sign .btn{width:100%;padding:14px;font-size:15.5px;margin-top:6px;}
@media (max-width:560px){.hlf-panel{padding:24px 18px;}}
/* member badge */
.hlf-badge{max-width:340px;width:100%;display:block;margin:22px auto;border-radius:14px;box-shadow:0 8px 30px rgba(8,29,45,.15);}
/* next steps */
.hlf-steps-card .journey{margin-top:0;}
.journey-step.hlf-done .step-num{background:var(--teal);color:#fff;}
.hlf-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;}
@media (max-width:820px){.hlf-grid3{grid-template-columns:1fr;}}
.hlf-mini{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;}
.hlf-mini h3{font-size:16.5px;margin:10px 0 6px;}
.hlf-mini p{font-size:14.5px;color:#5b6167;line-height:1.6;}
.hlf-mini .hlf-mini-icon{width:40px;height:40px;border-radius:10px;background:var(--tint);color:var(--teal-dark);display:flex;align-items:center;justify-content:center;}

/* Latest insights cards (fed by insights/posts.js) */
.hl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.hl-card{background:#fff;border:1px solid #DDE3E2;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s;}
.hl-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(8,29,45,.08);}
.hl-card .img{aspect-ratio:16/9;background:#081D2D center/cover no-repeat;}
.hl-card .b{padding:20px 22px 24px;flex:1;display:flex;flex-direction:column;}
.hl-card .cat{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#00807F;}
.hl-card h3{font-size:19px;line-height:1.3;margin:8px 0;color:#081D2D;}
.hl-card p{font-size:14.5px;color:#6b7278;flex:1;margin:0;}
.hl-card .d{font-size:13px;color:#8a939b;margin-top:14px;}
@media (max-width:860px){.hl-grid{grid-template-columns:1fr;}}

