/* Digital Farmer Mission — mobile-first, framework-free front-end */
:root {
  --green-950: #072e20;
  --green-900: #093d29;
  --green-800: #075536;
  --green-700: #0c6b3f;
  --green-600: #14834d;
  --green-500: #22a461;
  --green-400: #49bc73;
  --leaf-300: #b9e66a;
  --leaf-200: #d8f29a;
  --mint-100: #eaf9ef;
  --mint-50: #f4fcf7;
  --cream: #fbfbf4;
  --sand: #f1efe2;
  --ink: #143126;
  --ink-2: #486157;
  --ink-3: #74877f;
  --line: rgba(14, 74, 48, .12);
  --white: #ffffff;
  --shadow-sm: 0 10px 30px rgba(13, 63, 42, .08);
  --shadow-md: 0 24px 70px rgba(10, 58, 39, .12);
  --shadow-lg: 0 34px 100px rgba(5, 47, 31, .18);
  --radius-sm: 14px;
  --radius-md: 22px;
  --radius-lg: 34px;
  --radius-xl: 44px;
  --container: 1180px;
  --header-h: 76px;
  --ease: cubic-bezier(.2,.7,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 20px); }
body {
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.menu-open { overflow: hidden; }
img, svg { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }

.skip-link {
  position: fixed;
  left: 12px;
  top: 12px;
  z-index: 9999;
  transform: translateY(-160%);
  background: var(--green-950);
  color: white;
  padding: 10px 14px;
  border-radius: 10px;
  transition: .2s;
}
.skip-link:focus { transform: translateY(0); }

.container { width: min(100% - 32px, var(--container)); margin-inline: auto; }
.section-pad { padding: 78px 0; position: relative; }

.announcement {
  background: var(--green-950);
  color: rgba(255,255,255,.86);
  font-size: 12px;
}
.announcement__inner {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}
.announcement__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--leaf-300); box-shadow: 0 0 0 4px rgba(185,230,106,.12); flex: 0 0 auto; }
.announcement__inner > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.announcement a { margin-left: auto; font-weight: 700; color: var(--leaf-200); white-space: nowrap; display: none; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(251, 251, 244, .9);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid transparent;
  transition: .25s var(--ease);
}
.site-header.scrolled { border-color: var(--line); box-shadow: 0 8px 30px rgba(19,54,42,.06); }
.nav-shell { height: var(--header-h); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--green-800); min-width: 0; }
.brand__mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: var(--mint-100); flex: 0 0 auto; }
.brand__mark svg { width: 31px; height: 31px; }
.brand__text { display: flex; flex-direction: column; line-height: 1.08; }
.brand__text strong { font-size: 14px; letter-spacing: -.02em; }
.brand__text small { font-size: 10px; color: var(--ink-3); margin-top: 4px; text-transform: uppercase; letter-spacing: .09em; }

.menu-toggle { width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.7); padding: 12px; display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.menu-toggle span { display: block; width: 100%; height: 2px; border-radius: 99px; background: var(--green-900); transition: .25s; transform-origin: center; }
.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; transform: scaleX(.3); }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.primary-nav {
  position: fixed;
  inset: calc(40px + var(--header-h)) 16px auto 16px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow-lg);
  padding: 12px;
  display: grid;
  gap: 2px;
  opacity: 0;
  transform: translateY(-10px) scale(.98);
  visibility: hidden;
  transition: .2s var(--ease);
}
.primary-nav.open { opacity: 1; transform: none; visibility: visible; }
.primary-nav a { padding: 13px 14px; border-radius: 12px; font-size: 14px; font-weight: 650; color: var(--ink-2); }
.primary-nav a:hover, .primary-nav a.active { background: var(--mint-50); color: var(--green-700); }
.primary-nav .nav-cta { background: var(--green-800); color: white; text-align: center; margin-top: 6px; }
.primary-nav .nav-cta:hover { background: var(--green-700); color: white; }

.hero { overflow: hidden; padding-top: 60px; background: radial-gradient(circle at 80% 15%, rgba(184,230,106,.2), transparent 24%), linear-gradient(180deg, #fbfbf4 0%, #f6fcf7 100%); }
.hero__glow { position: absolute; border-radius: 50%; filter: blur(6px); pointer-events: none; }
.hero__glow--one { width: 280px; height: 280px; background: rgba(72,190,115,.1); right: -110px; top: 80px; }
.hero__glow--two { width: 220px; height: 220px; background: rgba(185,230,106,.16); left: -90px; bottom: 120px; }
.hero__grid { display: grid; gap: 46px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 11px; border-radius: 999px; background: rgba(255,255,255,.78); border: 1px solid var(--line); color: var(--green-700); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.eyebrow__icon { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--mint-100); }
.hero h1 { font-size: clamp(44px, 12vw, 78px); line-height: .98; letter-spacing: -.055em; margin: 20px 0 22px; max-width: 770px; }
.hero h1 span { color: var(--green-600); position: relative; }
.hero__lead { font-size: 17px; color: var(--ink-2); max-width: 660px; margin: 0; }
.hero__actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; }
.btn { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 15px; padding: 0 18px; font-size: 14px; font-weight: 800; transition: .2s var(--ease); }
.btn:hover { transform: translateY(-2px); }
.btn--primary { color: white; background: var(--green-700); box-shadow: 0 12px 30px rgba(12,107,63,.22); }
.btn--primary:hover { background: var(--green-800); }
.btn--ghost { border: 1px solid var(--line); background: rgba(255,255,255,.72); color: var(--ink); }
.btn--ghost:hover { background: white; border-color: rgba(12,107,63,.25); }
.btn--dark { background: var(--green-950); color: white; width: 100%; margin-top: 4px; }
.hero__trust { margin-top: 26px; display: grid; gap: 8px; color: var(--ink-2); font-size: 12px; }
.hero__trust > div { display: flex; align-items: center; gap: 8px; }
.check { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; background: var(--mint-100); color: var(--green-700); font-weight: 900; }

.hero__visual { position: relative; }
.visual-card { position: relative; border-radius: 34px; border: 1px solid rgba(12,107,63,.1); box-shadow: var(--shadow-md); background: white; padding: 8px; }
.farm-illustration { display: block; width: 100%; height: auto; border-radius: 28px; overflow: hidden; }
.visual-card__badge { position: absolute; display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,.94); border: 1px solid rgba(12,107,63,.12); box-shadow: var(--shadow-sm); backdrop-filter: blur(10px); padding: 10px 12px; border-radius: 16px; max-width: 230px; }
.visual-card__badge strong, .visual-card__badge small { display: block; line-height: 1.3; }
.visual-card__badge strong { font-size: 11px; }
.visual-card__badge small { font-size: 9px; color: var(--ink-3); margin-top: 2px; }
.visual-card__badge--top { top: 20px; left: -8px; }
.visual-card__badge--bottom { bottom: 22px; right: -8px; }
.status-dot { width: 10px; height: 10px; border-radius: 50%; background: #38b76e; box-shadow: 0 0 0 5px rgba(56,183,110,.14); flex: 0 0 auto; }
.mini-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; color: var(--green-700); background: var(--mint-100); font-weight: 900; }

.hero-stats { margin-top: 58px; display: grid; grid-template-columns: 1fr 1fr; background: rgba(255,255,255,.66); border: 1px solid var(--line); border-radius: 24px; overflow: hidden; box-shadow: var(--shadow-sm); backdrop-filter: blur(14px); }
.stat-card { padding: 19px 15px; min-height: 116px; display: flex; flex-direction: column; justify-content: center; }
.stat-card:nth-child(odd) { border-right: 1px solid var(--line); }
.stat-card:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
.stat-card__number { font-size: 25px; line-height: 1; font-weight: 850; letter-spacing: -.04em; color: var(--green-800); }
.stat-card__label { margin-top: 8px; font-size: 10px; line-height: 1.45; color: var(--ink-3); }

.section-kicker { display: inline-block; color: var(--green-600); font-weight: 850; font-size: 12px; text-transform: uppercase; letter-spacing: .11em; margin-bottom: 12px; }
.section-kicker--light { color: var(--leaf-200); }
.section-heading { margin-bottom: 34px; max-width: 760px; }
.section-heading h2, .pillars h2, .platform h2, .fund h2, .governance h2, .faq h2, .contact h2 { font-size: clamp(32px, 8vw, 52px); line-height: 1.04; letter-spacing: -.045em; margin: 0 0 17px; }
.section-heading p, .pillars__copy > p, .platform__copy > p, .fund__copy > p, .governance__copy > p, .faq__intro > p, .contact__copy > p { color: var(--ink-2); margin: 0; font-size: 15px; }
.section-heading--center { text-align: center; margin-inline: auto; }

.mission { background: #fff; }
.mission-grid { display: grid; gap: 14px; }
.mission-card { padding: 24px; border-radius: 24px; border: 1px solid var(--line); background: #fff; box-shadow: 0 10px 30px rgba(16,70,48,.04); transition: .25s var(--ease); }
.mission-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); }
.mission-card--vision { background: linear-gradient(140deg, var(--green-900), var(--green-700)); color: white; border: 0; }
.mission-card__icon { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; color: var(--green-700); background: var(--mint-100); margin-bottom: 26px; }
.mission-card__icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mission-card--vision .mission-card__icon { color: white; background: rgba(255,255,255,.14); }
.card-label { font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; color: var(--green-600); }
.mission-card--vision .card-label { color: var(--leaf-200); }
.mission-card h3 { font-size: 21px; line-height: 1.15; letter-spacing: -.025em; margin: 9px 0 10px; }
.mission-card p { font-size: 13px; color: var(--ink-2); margin: 0; }
.mission-card--vision p { color: rgba(255,255,255,.73); }

.pillars { background: linear-gradient(180deg, var(--cream), #f5faef); }
.pillars__grid { display: grid; gap: 46px; align-items: center; }
.stacked-visual { padding: 24px 0 0; max-width: 480px; margin: 0 auto; }
.stacked-visual__item { position: relative; min-height: 120px; padding: 22px 28px; display: flex; align-items: flex-start; gap: 16px; border-radius: 24px; color: var(--green-950); box-shadow: 0 24px 45px rgba(18,79,48,.12); transform: perspective(800px) rotateX(55deg) rotateZ(-8deg); transform-origin: center; margin-top: -24px; border: 1px solid rgba(255,255,255,.7); }
.stacked-visual__item span { font-size: 11px; font-weight: 900; letter-spacing: .1em; opacity: .7; }
.stacked-visual__item strong { font-size: 16px; line-height: 1.25; }
.stacked-visual__item--one { background: #bff296; margin-top: 0; z-index: 3; }
.stacked-visual__item--two { background: #6dd786; z-index: 2; }
.stacked-visual__item--three { background: #1e9b63; color: white; z-index: 1; }
.step-list { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 10px; }
.step-list li { display: flex; gap: 14px; padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.62); }
.step-list li > span { width: 35px; height: 35px; border-radius: 10px; display: grid; place-items: center; background: var(--mint-100); color: var(--green-700); font-weight: 900; font-size: 11px; flex: 0 0 auto; }
.step-list strong, .step-list small { display: block; }
.step-list strong { font-size: 13px; }
.step-list small { color: var(--ink-3); font-size: 11px; margin-top: 2px; }

.ecosystem { background: var(--green-950); color: white; overflow: hidden; }
.ecosystem::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 13% 10%, rgba(185,230,106,.1), transparent 26%), radial-gradient(circle at 90% 75%, rgba(73,188,115,.12), transparent 25%); pointer-events: none; }
.ecosystem .section-heading p { color: rgba(255,255,255,.65); }
.service-grid { position: relative; display: grid; gap: 12px; }
.service-card { min-height: 250px; padding: 22px; border-radius: 24px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); display: flex; flex-direction: column; transition: .25s var(--ease); backdrop-filter: blur(10px); }
.service-card:hover { transform: translateY(-5px); background: rgba(255,255,255,.1); border-color: rgba(185,230,106,.22); }
.service-card--featured { background: linear-gradient(145deg, var(--green-600), #0f7a47); }
.service-card--fund { background: linear-gradient(145deg, rgba(185,230,106,.14), rgba(255,255,255,.07)); }
.service-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.service-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.12); color: var(--leaf-200); font-size: 20px; font-weight: 900; }
.service-card--featured .service-icon { color: white; background: rgba(255,255,255,.15); }
.service-tag { font-size: 9px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; color: rgba(255,255,255,.52); }
.service-card h3 { font-size: 24px; letter-spacing: -.03em; margin: 26px 0 8px; }
.service-card p { font-size: 12px; color: rgba(255,255,255,.68); margin: 0; }
.service-card a { margin-top: auto; padding-top: 20px; font-size: 11px; font-weight: 800; color: var(--leaf-200); }
.service-card a span { margin-left: 4px; }
.service-meta { margin-top: auto; padding-top: 22px; display: flex; flex-wrap: wrap; gap: 6px; }
.service-meta span { padding: 6px 8px; border-radius: 999px; background: rgba(255,255,255,.12); font-size: 9px; font-weight: 800; }

.platform { background: white; overflow: hidden; }
.platform__grid { display: grid; gap: 50px; align-items: center; }
.feature-list { margin-top: 28px; display: grid; gap: 10px; }
.feature-list > div { display: flex; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.feature-list__icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--mint-100); color: var(--green-700); font-size: 10px; font-weight: 900; flex: 0 0 auto; }
.feature-list strong, .feature-list small { display: block; }
.feature-list strong { font-size: 13px; }
.feature-list small { font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.platform__mockup { position: relative; display: grid; place-items: center; min-height: 570px; border-radius: 36px; background: radial-gradient(circle at 30% 20%, #dff8e8, transparent 30%), linear-gradient(140deg,#eff9ee,#f9fbf5); border: 1px solid var(--line); overflow: hidden; }
.platform__mockup::before, .platform__mockup::after { content: ""; position: absolute; border: 1px solid rgba(12,107,63,.08); border-radius: 50%; }
.platform__mockup::before { width: 420px; height: 420px; }
.platform__mockup::after { width: 560px; height: 560px; }
.phone { position: relative; z-index: 2; width: 250px; padding: 9px; border-radius: 38px; background: #10261d; box-shadow: 0 32px 65px rgba(10,59,39,.22); }
.phone__notch { position: absolute; z-index: 4; top: 13px; left: 50%; width: 84px; height: 17px; transform: translateX(-50%); border-radius: 0 0 13px 13px; background: #10261d; }
.phone__screen { min-height: 500px; overflow: hidden; border-radius: 31px; background: #f9fbf6; padding: 25px 14px 13px; }
.app-topbar { display: flex; justify-content: space-between; align-items: center; }
.app-topbar small, .app-topbar strong { display: block; }
.app-topbar small { font-size: 8px; color: var(--ink-3); }
.app-topbar strong { font-size: 13px; }
.app-avatar { width: 29px; height: 29px; border-radius: 10px; display: grid; place-items: center; background: var(--green-700); color: white; font-size: 8px; font-weight: 900; }
.app-weather { margin-top: 14px; padding: 14px; border-radius: 18px; background: linear-gradient(140deg, var(--green-800), var(--green-600)); color: white; display: flex; justify-content: space-between; align-items: center; }
.app-weather span, .app-weather strong, .app-weather small { display: block; }
.app-weather span { font-size: 8px; opacity: .65; }
.app-weather strong { font-size: 23px; line-height: 1.1; }
.app-weather small { font-size: 8px; opacity: .8; }
.sun { font-size: 31px; }
.app-search { margin-top: 12px; padding: 10px 12px; border-radius: 13px; background: white; border: 1px solid var(--line); font-size: 9px; color: var(--ink-3); }
.app-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 11px; }
.app-grid div { padding: 9px 4px; display: grid; place-items: center; gap: 4px; border-radius: 12px; background: white; border: 1px solid var(--line); }
.app-grid span { font-size: 17px; line-height: 1; }
.app-grid small { font-size: 7px; color: var(--ink-2); }
.app-card { margin-top: 11px; padding: 9px; display: grid; grid-template-columns: 72px 1fr; gap: 9px; border-radius: 15px; background: white; border: 1px solid var(--line); }
.app-card__art { position: relative; min-height: 80px; border-radius: 10px; overflow: hidden; background: linear-gradient(#cff0dd 40%,#70b95c 41%); }
.app-card__art span { position: absolute; bottom: 0; width: 24px; height: 52px; background: #2f8049; clip-path: polygon(50% 0,100% 100%,0 100%); }
.app-card__art span:nth-child(1){ left:5px}.app-card__art span:nth-child(2){left:25px;height:65px}.app-card__art span:nth-child(3){left:47px;height:45px}
.app-card small, .app-card strong, .app-card a { display: block; }
.app-card small { color: var(--green-600); font-size: 7px; font-weight: 900; }
.app-card strong { margin-top: 3px; font-size: 9px; line-height: 1.25; }
.app-card a { font-size: 7px; color: var(--green-700); font-weight: 900; margin-top: 7px; }
.app-nav { margin-top: 13px; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); padding-top: 9px; }
.app-nav span { display: grid; place-items: center; color: var(--ink-3); font-size: 11px; }
.app-nav small { display: block; font-size: 6px; margin-top: 2px; }
.platform-float { position: absolute; z-index: 3; display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 14px; background: white; box-shadow: var(--shadow-sm); border: 1px solid var(--line); }
.platform-float > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 9px; background: var(--mint-100); color: var(--green-700); font-weight: 900; }
.platform-float strong, .platform-float small { display: block; line-height: 1.2; }
.platform-float strong { font-size: 9px; }
.platform-float small { font-size: 7px; color: var(--ink-3); margin-top: 2px; }
.platform-float--one { left: 12px; bottom: 70px; }
.platform-float--two { right: 12px; top: 90px; }

.impact { background: linear-gradient(180deg, #f4faef, var(--cream)); }
.impact-grid { display: grid; gap: 12px; }
.impact-card { padding: 20px; border-radius: 22px; background: white; border: 1px solid var(--line); display: flex; gap: 15px; align-items: center; box-shadow: 0 10px 28px rgba(11,75,46,.04); }
.impact-card__chart { width: 68px; height: 68px; border-radius: 50%; flex: 0 0 auto; display: grid; place-items: center; background: conic-gradient(var(--green-500) 0 72%, var(--mint-100) 72% 100%); position: relative; }
.impact-card__chart::after { content: ""; position: absolute; inset: 7px; border-radius: inherit; background: white; }
.impact-card__chart span { position: relative; z-index: 2; font-size: 14px; font-weight: 900; color: var(--green-800); }
.impact-card__chart--income { background: conic-gradient(var(--leaf-300) 0 82%, var(--mint-100) 82% 100%); }
.impact-card__chart--wallet { background: conic-gradient(var(--green-700) 0 40%, var(--mint-100) 40% 100%); }
.impact-card strong { font-size: 14px; }
.impact-card p { font-size: 11px; color: var(--ink-3); margin: 4px 0 0; }

.fund { background: linear-gradient(150deg, var(--green-950), #0a5537); color: white; overflow: hidden; }
.fund::before { content: ""; position: absolute; width: 450px; height: 450px; border-radius: 50%; right: -160px; top: -180px; border: 1px solid rgba(255,255,255,.08); box-shadow: 0 0 0 70px rgba(255,255,255,.02), 0 0 0 140px rgba(255,255,255,.015); }
.fund__grid { display: grid; gap: 50px; align-items: center; }
.fund__copy > p { color: rgba(255,255,255,.66); }
.fund-points { margin-top: 28px; display: grid; gap: 13px; }
.fund-points > div { display: flex; gap: 11px; align-items: flex-start; }
.fund-points span { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: rgba(185,230,106,.12); color: var(--leaf-200); font-size: 10px; flex: 0 0 auto; }
.fund-points p { margin: 0; font-size: 11px; color: rgba(255,255,255,.63); }
.fund-points strong { color: white; font-size: 12px; }
.fund-loop { position: relative; width: min(100%, 570px); aspect-ratio: 1; margin: 0 auto; }
.loop-lines { position: absolute; inset: 0; color: var(--leaf-200); }
.loop-center { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 128px; height: 128px; border-radius: 50%; display: grid; place-items: center; align-content: center; background: var(--leaf-300); color: var(--green-950); text-align: center; box-shadow: 0 20px 50px rgba(0,0,0,.25); z-index: 3; }
.loop-center span { font-size: 24px; line-height: 1; }
.loop-center strong { font-size: 12px; line-height: 1.2; margin-top: 4px; }
.loop-node { position: absolute; z-index: 3; width: 145px; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(10px); }
.loop-node span, .loop-node strong, .loop-node small { display: block; }
.loop-node span { color: var(--leaf-200); font-weight: 900; font-size: 8px; letter-spacing: .12em; }
.loop-node strong { font-size: 10px; margin-top: 3px; }
.loop-node small { font-size: 7px; color: rgba(255,255,255,.58); margin-top: 2px; line-height: 1.35; }
.loop-node--one { top: 3%; left: 50%; transform: translateX(-50%); }
.loop-node--two { right: 0; top: 50%; transform: translateY(-50%); }
.loop-node--three { bottom: 3%; left: 50%; transform: translateX(-50%); }
.loop-node--four { left: 0; top: 50%; transform: translateY(-50%); }

.roadmap { background: white; }
.timeline { position: relative; display: grid; gap: 18px; }
.timeline::before { content: ""; position: absolute; left: 31px; top: 16px; bottom: 16px; width: 1px; background: linear-gradient(var(--green-500), rgba(34,164,97,.1)); }
.timeline-item { position: relative; display: grid; grid-template-columns: 64px 1fr; gap: 14px; align-items: start; }
.timeline-marker { position: relative; z-index: 2; width: 64px; height: 64px; display: grid; place-items: center; text-align: center; border-radius: 50%; background: var(--mint-100); border: 7px solid white; box-shadow: 0 0 0 1px var(--line); }
.timeline-marker span { font-size: 8px; font-weight: 900; color: var(--green-700); line-height: 1.1; }
.timeline-card { padding: 20px; border-radius: 22px; border: 1px solid var(--line); background: var(--cream); }
.timeline-card--future { background: linear-gradient(145deg, var(--green-800), var(--green-600)); color: white; border: 0; }
.timeline-tag { font-size: 8px; letter-spacing: .12em; text-transform: uppercase; font-weight: 900; color: var(--green-600); }
.timeline-card--future .timeline-tag { color: var(--leaf-200); }
.timeline-card h3 { font-size: 18px; line-height: 1.15; margin: 7px 0 8px; }
.timeline-card p { font-size: 11px; color: var(--ink-3); margin: 0; }
.timeline-card--future p { color: rgba(255,255,255,.68); }
.timeline-chips { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 6px; }
.timeline-chips span { font-size: 8px; font-weight: 800; padding: 6px 8px; border-radius: 999px; background: white; border: 1px solid var(--line); color: var(--ink-2); }
.timeline-card--future .timeline-chips span { background: rgba(255,255,255,.11); border-color: rgba(255,255,255,.15); color: white; }

.governance { background: linear-gradient(180deg, var(--cream), #f3f9f4); }
.governance__grid { display: grid; gap: 42px; align-items: center; }
.text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--green-700); font-size: 12px; font-weight: 900; }
.governance-map { padding: 18px; border-radius: 28px; background: white; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.gov-card { padding: 17px; border-radius: 18px; border: 1px solid var(--line); background: var(--cream); }
.gov-card--main { background: var(--green-800); color: white; border: 0; }
.gov-card span, .gov-card strong, .gov-card small { display: block; }
.gov-card span { font-size: 8px; text-transform: uppercase; letter-spacing: .12em; font-weight: 900; color: var(--green-600); }
.gov-card--main span { color: var(--leaf-200); }
.gov-card strong { font-size: 14px; margin-top: 4px; }
.gov-card small { font-size: 9px; color: var(--ink-3); margin-top: 5px; line-height: 1.4; }
.gov-card--main small { color: rgba(255,255,255,.65); }
.gov-connector { height: 47px; display: flex; justify-content: space-around; align-items: center; position: relative; }
.gov-connector::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: var(--line); }
.gov-connector span { font-size: 7px; color: var(--ink-3); background: white; position: relative; z-index: 2; padding: 2px 4px; }
.gov-row { display: grid; gap: 10px; }

.partners { background: white; }
.partner-grid { display: grid; gap: 10px; }
.partner-grid > div { padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: var(--cream); }
.partner-grid span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: var(--mint-100); color: var(--green-700); font-weight: 900; margin-bottom: 18px; }
.partner-grid strong, .partner-grid small { display: block; }
.partner-grid strong { font-size: 13px; }
.partner-grid small { font-size: 10px; color: var(--ink-3); margin-top: 4px; }

.faq { background: var(--cream); }
.faq__grid { display: grid; gap: 30px; }
.faq__items { display: grid; gap: 8px; }
details { border: 1px solid var(--line); background: white; border-radius: 17px; overflow: hidden; }
summary { list-style: none; padding: 16px; display: flex; align-items: center; justify-content: space-between; gap: 15px; font-size: 12px; font-weight: 800; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
summary span { width: 25px; height: 25px; border-radius: 8px; background: var(--mint-100); color: var(--green-700); display: grid; place-items: center; transition: .2s; flex: 0 0 auto; }
details[open] summary span { transform: rotate(45deg); }
details p { margin: 0; padding: 0 16px 16px; color: var(--ink-2); font-size: 11px; }

.contact { background: linear-gradient(145deg, #0a3f2b, #0b6a42); color: white; overflow: hidden; }
.contact::after { content: ""; position: absolute; width: 360px; height: 360px; border-radius: 50%; right: -100px; bottom: -200px; background: rgba(185,230,106,.08); box-shadow: 0 0 0 70px rgba(185,230,106,.035); }
.contact__grid { display: grid; gap: 36px; position: relative; z-index: 2; }
.contact__copy > p { color: rgba(255,255,255,.68); }
.contact-highlights { margin-top: 26px; display: grid; gap: 11px; }
.contact-highlights > div { display: flex; gap: 11px; }
.contact-highlights span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.1); color: var(--leaf-200); font-size: 8px; font-weight: 900; flex: 0 0 auto; }
.contact-highlights p { margin: 0; color: rgba(255,255,255,.63); font-size: 10px; }
.contact-highlights strong { color: white; font-size: 11px; }
.contact-form { padding: 18px; border-radius: 24px; background: white; color: var(--ink); box-shadow: var(--shadow-lg); display: grid; gap: 12px; }
.form-row { display: grid; gap: 12px; }
.contact-form label { display: grid; gap: 6px; font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-2); }
.contact-form input, .contact-form textarea, .contact-form select { width: 100%; border: 1px solid var(--line); background: #fbfcf9; border-radius: 12px; padding: 11px 12px; outline: 0; color: var(--ink); font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; transition: .2s; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { border-color: var(--green-500); box-shadow: 0 0 0 4px rgba(34,164,97,.09); background: white; }
.contact-form [aria-invalid="true"] { border-color: #be4b49; box-shadow: 0 0 0 4px rgba(190,75,73,.08); }
.form-note { font-size: 9px; color: var(--ink-3); margin: 0; text-align: center; }
.form-note.success { color: var(--green-700); font-weight: 750; }
.form-note.error { color: #a43e3b; font-weight: 750; }

.site-footer { background: #061f16; color: white; padding-top: 48px; }
.brand--footer { color: var(--leaf-200); }
.brand--footer .brand__mark { background: rgba(255,255,255,.08); }
.brand--footer .brand__text small { color: rgba(255,255,255,.45); }
.footer-top { display: grid; gap: 18px; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.09); }
.footer-top > p { color: rgba(255,255,255,.56); font-size: 11px; margin: 0; max-width: 520px; }
.footer-cta { display: inline-flex; align-items: center; gap: 8px; color: var(--leaf-200); font-size: 11px; font-weight: 900; }
.footer-links { padding: 32px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 28px 20px; }
.footer-links > div { display: grid; align-content: start; gap: 7px; }
.footer-links strong { font-size: 10px; color: rgba(255,255,255,.9); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.footer-links a, .footer-note p { color: rgba(255,255,255,.48); font-size: 9px; }
.footer-links a:hover { color: var(--leaf-200); }
.footer-note { grid-column: 1 / -1; }
.footer-note p { margin: 0; line-height: 1.6; }
.footer-bottom { padding: 18px 0 24px; border-top: 1px solid rgba(255,255,255,.08); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; color: rgba(255,255,255,.35); font-size: 8px; }

.back-to-top { position: fixed; right: 16px; bottom: 16px; z-index: 900; width: 44px; height: 44px; border: 0; border-radius: 14px; background: var(--green-800); color: white; box-shadow: var(--shadow-sm); opacity: 0; transform: translateY(10px); pointer-events: none; transition: .2s var(--ease); }
.back-to-top.visible { opacity: 1; transform: none; pointer-events: auto; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal--delay { transition-delay: .08s; }

@media (min-width: 560px) {
  .container { width: min(100% - 48px, var(--container)); }
  .announcement a { display: inline; }
  .brand__text strong { font-size: 15px; }
  .hero__trust { grid-template-columns: repeat(3, max-content); gap: 18px; }
  .hero-stats { grid-template-columns: repeat(4,1fr); }
  .stat-card { min-height: 128px; padding: 22px; }
  .stat-card:nth-child(n) { border-bottom: 0; }
  .stat-card:not(:last-child) { border-right: 1px solid var(--line); }
  .stat-card__number { font-size: 31px; }
  .stat-card__label { font-size: 11px; }
  .mission-grid { grid-template-columns: 1fr 1fr; }
  .service-grid { grid-template-columns: 1fr 1fr; }
  .impact-grid { grid-template-columns: 1fr 1fr; }
  .partner-grid { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr 1fr; }
  .gov-row { grid-template-columns: 1fr 1fr; }
  .footer-links { grid-template-columns: repeat(3,1fr); }
  .footer-note { grid-column: 1 / -1; }
  .platform-float--one { left: 24px; }
  .platform-float--two { right: 24px; }
}

@media (min-width: 820px) {
  :root { --header-h: 82px; }
  .section-pad { padding: 108px 0; }
  .menu-toggle { display: none; }
  .primary-nav { position: static; inset: auto; display: flex; align-items: center; gap: 3px; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; }
  .primary-nav a { padding: 10px 9px; font-size: 12px; }
  .primary-nav a:not(.nav-cta).active { background: transparent; color: var(--green-700); }
  .primary-nav .nav-cta { margin: 0 0 0 6px; padding: 11px 14px; border-radius: 12px; }
  .hero { padding-top: 84px; }
  .hero__grid { grid-template-columns: 1.04fr .96fr; gap: 52px; }
  .visual-card__badge--top { left: -26px; top: 32px; }
  .visual-card__badge--bottom { right: -25px; bottom: 36px; }
  .hero-stats { margin-top: 78px; }
  .section-heading--split { max-width: none; display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: end; }
  .section-heading--split > p { padding-bottom: 5px; }
  .mission-grid { grid-template-columns: repeat(4,1fr); }
  .mission-card { padding: 25px; min-height: 330px; display: flex; flex-direction: column; }
  .mission-card__icon { margin-bottom: auto; }
  .pillars__grid, .platform__grid, .fund__grid, .governance__grid, .faq__grid, .contact__grid { grid-template-columns: 1fr 1fr; gap: 70px; }
  .pillars__grid { grid-template-columns: .92fr 1.08fr; }
  .service-grid { grid-template-columns: repeat(4,1fr); }
  .service-card { min-height: 275px; }
  .service-card--featured { grid-column: span 2; }
  .service-card--fund { grid-column: span 2; }
  .platform__grid { grid-template-columns: .95fr 1.05fr; }
  .platform__mockup { min-height: 680px; }
  .phone { width: 280px; }
  .phone__screen { min-height: 560px; }
  .platform-float--one { left: 40px; bottom: 110px; }
  .platform-float--two { right: 38px; top: 120px; }
  .impact-grid { grid-template-columns: repeat(4,1fr); }
  .impact-card { display: block; padding: 24px; }
  .impact-card__chart { width: 82px; height: 82px; margin-bottom: 24px; }
  .impact-card strong { font-size: 16px; }
  .impact-card p { font-size: 12px; }
  .timeline { gap: 22px; }
  .timeline::before { left: 97px; }
  .timeline-item { grid-template-columns: 195px 1fr; gap: 28px; }
  .timeline-marker { width: 88px; height: 88px; margin-left: 53px; }
  .timeline-marker span { font-size: 10px; }
  .timeline-card { padding: 25px 28px; max-width: 790px; }
  .timeline-card h3 { font-size: 22px; }
  .timeline-card p { font-size: 12px; }
  .partner-grid { grid-template-columns: repeat(4,1fr); }
  .contact-form { padding: 26px; }
  .footer-top { grid-template-columns: 1fr 1.4fr auto; align-items: center; }
  .footer-links { grid-template-columns: .8fr .8fr .8fr 2fr; }
  .footer-note { grid-column: auto; }
}

@media (min-width: 1080px) {
  .primary-nav a { padding: 10px 12px; font-size: 13px; }
  .hero h1 { font-size: 78px; }
  .hero__lead { font-size: 18px; }
  .service-card { padding: 25px; }
  .mission-card h3 { font-size: 23px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}