:root {
  --paper: #e9ddc2;
  --paper-2: #dac59d;
  --paper-3: #c8aa75;
  --card: #f2ead6;
  --ink: #211a14;
  --ink-2: #35291e;
  --ink-soft: #615243;
  --blue: #176c68;
  --blue-2: #258b7d;
  --clay-deep: #7b351e;
  --charcoal-4: #241a15;
  --rule: rgba(48, 35, 24, .25);
  --ease: cubic-bezier(.2, .72, .22, 1);
  --font-display: "Space Grotesk", "Inter", sans-serif;
  --font-body: "Inter", sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  color-scheme: light;
}

html { background: #e9ddc2; }
body, button, input, textarea { font-family: var(--font-body); }
body { background: var(--paper); color: var(--ink); }
h1, h2, h3, .hero-title, .page-hero h1, .section-heading h2, .content-copy h2, .closing-band h2, .contact-intro h2 {
  font-family: var(--font-display);
}
.eyebrow, .mono-note, .hero-bottom, .footer-bottom, .footer-links b,
.signal-header, .signal-stages, .map-legend, .map-card-footer,
.photo-frame figcaption, .circle-index, .circle-tags { font-family: var(--font-mono); }

.site-header {
  background: rgba(233, 221, 194, .94);
  border-bottom-color: rgba(43, 31, 20, .18);
  backdrop-filter: blur(18px) saturate(1.1);
}
.site-header.is-scrolled { box-shadow: 0 10px 26px rgba(52, 32, 15, .14); }
.brand { color: var(--ink); }
.button { border-radius: 2px; }
.button-dark { background: #2a2019; color: #f5ecd9; }
.button-dark:hover { background: #59402d; }
.button-blue { background: #176c68; color: #f7f0df; }
.button-blue:hover { background: #0e514e; }
.text-blue, .page-hero h1 span { color: var(--blue); }
.eyebrow { color: #65503b; }

/* The opening landscape: warm exposed earth over a cutaway of charcoal seams. */
.home-hero {
  isolation: isolate;
  align-items: flex-start;
  min-height: max(740px, 100svh);
  background:
    radial-gradient(ellipse at 78% 17%, rgba(246, 196, 107, .8), transparent 25%),
    radial-gradient(ellipse at 13% 78%, rgba(155, 68, 37, .22), transparent 34%),
    linear-gradient(180deg, #dd9b5f 0%, #d78b4e 80%, #9d512f 80.15%, #743c2b 85%, #30241d 85.2%, #241a15 90%, #493023 90.2%, #302019 95%, #201914 95.2%);
}
.home-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: .46;
  background:
    repeating-linear-gradient(176deg, transparent 0 32px, rgba(255, 216, 150, .17) 33px 34px, transparent 35px 76px),
    repeating-linear-gradient(2deg, transparent 0 110px, rgba(16, 12, 10, .28) 111px 115px, transparent 116px 164px);
  mask-image: linear-gradient(180deg, transparent 0%, #000 37%, #000 100%);
}
.home-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -6vw;
  bottom: 8%;
  width: min(45vw, 590px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(239, 197, 132, .32);
  box-shadow: 0 0 0 24px rgba(239, 197, 132, .04), 0 0 0 72px rgba(239, 197, 132, .035), 0 0 0 132px rgba(239, 197, 132, .025);
  pointer-events: none;
}
.hero-grid {
  opacity: .12;
  background-image: linear-gradient(rgba(53, 35, 20, .48) 1px, transparent 1px), linear-gradient(90deg, rgba(53, 35, 20, .48) 1px, transparent 1px);
  mask-image: linear-gradient(90deg, #000 0%, transparent 72%);
}
.hero-inner { z-index: 2; }
.hero-inner > .eyebrow { color: #3f2c1d; }
.hero-title {
  max-width: 1120px;
  color: #261c14;
  font-size: clamp(50px, 7vw, 96px);
  font-weight: 600;
  letter-spacing: -.075em;
  line-height: .94;
  text-wrap: balance;
}
.hero-title .text-blue { color: #0d5149; }
.hero-lead { max-width: 540px; color: #3c2d20; font-size: clamp(17px, 1.7vw, 20px); }
.hero-actions { gap: 22px; }
.hero-actions .button-blue { background: #246d58; }
.hero-actions .button-blue:hover { background: #154d40; }
.hero-actions .text-link { color: #2d2118; border-bottom-color: rgba(45, 33, 24, .5); }
.hero-bottom { color: rgba(255, 230, 189, .76); }
.field-motes { opacity: .5; }

.section { position: relative; }
.system-section {
  overflow: hidden;
  background:
    radial-gradient(ellipse at 97% 24%, rgba(190, 137, 71, .22), transparent 30%),
    linear-gradient(180deg, #eadfc7, #dfd0af 69%, #d4bd91);
}
.system-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  height: 34%;
  opacity: .28;
  pointer-events: none;
  background: repeating-linear-gradient(174deg, transparent 0 33px, rgba(119, 75, 38, .23) 34px 35px, transparent 36px 76px);
  mask-image: linear-gradient(#000, transparent);
}
.system-section > .shell { position: relative; z-index: 1; }
.section-heading h2 { font-size: clamp(42px, 6vw, 78px); }
.section-heading h2 .text-blue { color: #176c68; }
.ticker { border-color: rgba(62, 44, 26, .24); color: #38291d; }
.ticker-track { animation-duration: 52s; }
.ticker-track i { color: #bb542f; }
.system-circle {
  background: #f2e8d2;
  border-color: rgba(71, 48, 27, .22);
  box-shadow: 0 18px 40px rgba(58, 37, 20, .09);
}
.system-circle:hover, .system-circle:focus-visible { box-shadow: 0 24px 48px rgba(58, 37, 20, .2); }
.circle-icon, .circle-count { color: var(--blue); }
.network-wire { stroke: rgba(62, 43, 26, .34); }
.network-dot { fill: #b74f2d; }
.chain-breadcrumb { border-color: rgba(62, 44, 26, .24); color: #5d4a36; }
.chain-breadcrumb b { color: #a74429; }
.topic-page { background: #e9ddc2; }
.page-hero {
  position: relative;
  isolation: isolate;
  max-width: none;
  padding-top: clamp(54px, 7vw, 88px);
  padding-bottom: clamp(64px, 8vw, 104px);
}
.page-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 calc(var(--pad) * -1);
  pointer-events: none;
  background:
    radial-gradient(ellipse at 92% 22%, rgba(209, 143, 73, .28), transparent 24%),
    repeating-linear-gradient(176deg, transparent 0 46px, rgba(117, 72, 38, .09) 47px 48px, transparent 49px 94px),
    linear-gradient(180deg, #eadfc8 0%, #e4d4b4 76%, #d7c298 100%);
}
.back-link { color: #61503c; }
.back-link:hover { color: #176c68; }
.page-kicker, .content-copy .eyebrow, .closing-band .eyebrow, .contact-intro .eyebrow, .map-copy .eyebrow { color: #176c68; }
.page-hero h1 { font-size: clamp(48px, 6.4vw, 82px); }
.page-figure { color: var(--page-figure, #176c68); }
.word-figure { border-color: rgba(76, 53, 30, .2); }
.count-figure { border-color: rgba(76, 53, 30, .2); }
.page-process { --page-figure: #a9482d; }
.page-biochar { --page-figure: #246d58; }
.page-traceability { --page-figure: #8b552e; }
.page-iot { --page-figure: #176c68; }
.page-impact { --page-figure: #a9482d; }
.page-farmers { --page-figure: #59703b; }

/* Topic pages carry the homepage's colorful system forward with their own
   restrained, soil-toned accent rather than repeating the same green on each. */
.page-process {
  --page-accent: #bd4e32;
  --page-wash: rgba(214, 90, 58, .2);
}
.page-biochar {
  --page-accent: #34764a;
  --page-wash: rgba(62, 142, 91, .19);
}
.page-traceability {
  --page-accent: #75437d;
  --page-wash: rgba(122, 53, 128, .17);
}
.page-iot {
  --page-accent: #176e9b;
  --page-wash: rgba(40, 120, 240, .18);
}
.page-impact {
  --page-accent: #a65b19;
  --page-wash: rgba(229, 169, 40, .22);
}
.page-farmers {
  --page-accent: #3d714d;
  --page-wash: rgba(44, 127, 90, .18);
}
.page-contact {
  --page-accent: #aa4667;
  --page-wash: rgba(228, 92, 104, .18);
}
.topic-page .page-hero::before {
  background:
    radial-gradient(ellipse at 87% 17%, var(--page-wash), transparent 30%),
    radial-gradient(ellipse at 8% 88%, rgba(185, 91, 48, .11), transparent 29%),
    repeating-linear-gradient(176deg, transparent 0 46px, rgba(117, 72, 38, .09) 47px 48px, transparent 49px 94px),
    linear-gradient(180deg, #eadfc8 0%, #e4d4b4 76%, #d7c298 100%);
}
.topic-page .page-hero h1 span,
.topic-page .page-kicker,
.topic-page .content-copy .eyebrow,
.topic-page .contact-intro .eyebrow {
  color: var(--page-accent);
}
.topic-page .back-link:hover,
.topic-page .text-link:hover {
  color: var(--page-accent);
}
.topic-page .page-figure {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-width: 0;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--page-accent) 28%, transparent);
  background:
    radial-gradient(circle at 85% 22%, var(--page-wash), transparent 34%),
    repeating-linear-gradient(180deg, transparent 0 60%, rgba(88, 56, 32, .035) 60.2% 61%, transparent 61.2% 69%),
    linear-gradient(180deg, rgba(248, 240, 220, .72), rgba(224, 205, 168, .64));
}
.topic-page .page-figure::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 138px;
  aspect-ratio: 1;
  right: 7%;
  top: 50%;
  border: 1px solid color-mix(in srgb, var(--page-accent) 24%, transparent);
  border-radius: 50%;
  box-shadow:
    0 0 0 15px color-mix(in srgb, var(--page-accent) 5%, transparent),
    0 0 0 38px color-mix(in srgb, var(--page-accent) 4%, transparent);
  transform: translateY(-50%);
  pointer-events: none;
}
.topic-page .page-figure > * {
  position: relative;
  z-index: 1;
}
.topic-page .word-figure i {
  color: var(--page-accent);
}
.page-contact .word-figure {
  flex-wrap: wrap;
  gap: 7px;
  font-size: clamp(12px, 1.15vw, 16px);
  line-height: 1.3;
  overflow-wrap: anywhere;
  text-align: center;
}
.topic-page .count-figure > span:last-child {
  color: var(--ink-soft);
}
.topic-page .content-band.band-paper {
  border-top: 1px solid rgba(72, 50, 30, .08);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--page-accent) 8%, transparent), transparent 34%),
    #eee4ce;
}
.topic-page .content-band.band-paper-2 {
  background:
    radial-gradient(ellipse at 97% 12%, var(--page-wash), transparent 32%),
    repeating-linear-gradient(173deg, transparent 0 64px, rgba(126, 76, 40, .08) 65px 66px, transparent 67px 126px),
    #d9c69e;
}
.topic-page .photo-frame {
  border: 1px solid rgba(62, 44, 27, .15);
  box-shadow: 0 18px 40px rgba(58, 37, 20, .13);
}
.topic-page .side-card,
.topic-page .contact-card {
  border-top: 3px solid var(--page-accent);
}
.topic-page .form-tabs button[aria-selected="true"] {
  border-bottom-color: var(--page-accent);
  color: var(--page-accent);
}
.topic-page .field input:focus,
.topic-page .field textarea:focus {
  border-color: var(--page-accent);
  outline-color: var(--page-accent);
}

.content-band { position: relative; }
.band-paper { background: #eee4ce; }
.band-paper-2, .section-paper-2 { background: #d9c69e; }
.content-band.band-paper-2 {
  background:
    repeating-linear-gradient(173deg, transparent 0 64px, rgba(126, 76, 40, .08) 65px 66px, transparent 67px 126px),
    #d9c69e;
}
.content-copy h2 { color: #2a2118; }
.content-copy p:not(.eyebrow), .page-lead, .closing-band > p:not(.eyebrow), .contact-intro > p:not(.eyebrow), .map-copy > p:not(.eyebrow) { color: #5a4b39; }
.photo-frame { background: linear-gradient(145deg, #d9b77e, #96603b 54%, #39281e); }
.photo-frame::before { background: radial-gradient(ellipse at 72% 22%, rgba(255, 226, 169, .3), transparent 33%), linear-gradient(150deg, transparent 45%, rgba(24, 17, 13, .3)); }
.side-card, .contact-card {
  background: #f3ead7;
  box-shadow: 0 20px 50px rgba(71, 47, 24, .12);
}
.definition-list > div { border-color: rgba(76, 53, 30, .2); }
.tick-list li::before { color: #176c68; }
.closing-band { position: relative; }
.closing-band h2 { color: #2a2118; }
.signal-card { background: #e5d9bd; }
.signal-dot { background: #b75530; box-shadow: 0 0 0 5px rgba(183, 85, 48, .14); }
.signal-line { stroke: #176c68; }
.about-card { border-left-color: #176c68; }
.about-mark { color: #176c68; }
.contact-area {
  background:
    radial-gradient(ellipse at 4% 93%, rgba(160, 76, 42, .2), transparent 34%),
    #d9c69e;
}
.form-tabs button[aria-selected="true"] { border-bottom-color: #176c68; color: #176c68; }
.field input, .field textarea { background: #fbf5e8; border-color: rgba(67, 48, 29, .27); }
.field input:focus, .field textarea:focus { border-color: #176c68; outline-color: #176c68; }
.map-legend i { background: #b75530; }
.india-map-card {
  border-color: rgba(73, 53, 32, .22);
  background-color: #dfcfad;
  background-image: linear-gradient(rgba(67, 48, 29, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(67, 48, 29, .08) 1px, transparent 1px);
}
.india-shape { fill: #bc9970; stroke: #176c68; }
.map-detail { stroke: rgba(23, 108, 104, .38); }
.map-card-footer { background: rgba(36, 26, 21, .94); }
.site-footer { background: #241a15; color: #f1e6cf; }
.footer-lockup .brand { color: #f1e6cf; }
.footer-links a:focus-visible, .footer-lockup .brand:focus-visible { outline-color: #f2ead6; }
.footer-lockup > p span { color: #d78a50; }
.footer-links b { color: #d8ab63; }
.footer-bottom { border-color: rgba(241, 230, 207, .17); color: rgba(241, 230, 207, .62); }

.js-ready [data-reveal]:not(.is-revealed) {
  opacity: 1;
  transform: none;
}
[data-reveal].is-revealed { animation: strata-reveal .55s var(--ease); }
@keyframes strata-reveal {
  from { opacity: .75; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
[data-reveal] { transition: opacity .72s var(--ease), transform .72s var(--ease); }
.button, .system-circle, .photo-frame, .side-card, .contact-card { transition-timing-function: var(--ease); }
.photo-frame { transition: transform .5s var(--ease); }
.content-grid .photo-frame:hover { transform: scale(1.012); }
.footer-links a:hover { color: #e4b96e; }

/* 404 is intentionally part of the same earth-toned system. */
body:not(.home-page):not(.topic-page) { min-height: 100dvh; background: #e9ddc2; }
body:not(.home-page):not(.topic-page) .closing-band {
  position: relative;
  isolation: isolate;
}
body:not(.home-page):not(.topic-page) .closing-band::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 calc(var(--pad) * -1);
  background:
    repeating-linear-gradient(176deg, transparent 0 46px, rgba(117, 72, 38, .1) 47px 48px, transparent 49px 94px),
    linear-gradient(180deg, #e6d4b2, #d5b98b);
  pointer-events: none;
}

@media (max-width: 820px) {
  .page-hero::before { inset-inline: calc(var(--pad) * -1); }
}
@media (max-width: 560px) {
  .home-hero {
    min-height: max(790px, 100svh);
    background:
      radial-gradient(ellipse at 78% 17%, rgba(246, 196, 107, .8), transparent 25%),
      radial-gradient(ellipse at 13% 78%, rgba(155, 68, 37, .22), transparent 34%),
      linear-gradient(180deg, #dd9b5f 0%, #d78b4e 75%, #9d512f 75.15%, #743c2b 82%, #30241d 82.2%, #241a15 90%, #493023 90.2%, #302019 96%, #201914 96.2%);
  }
  .hero-title { max-width: 100%; font-size: clamp(34px, 9.1vw, 45px); line-height: .99; letter-spacing: -.065em; }
  .hero-lead { max-width: 34ch; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 13px; margin-top: 25px; }
  .hero-bottom { z-index: 2; }
  .hero-bottom span:first-child { max-width: 50%; }
  .hero-bottom span:nth-child(2) { display: none; }
  .page-hero h1 { font-size: clamp(42px, 11.5vw, 56px); overflow-wrap: anywhere; }
  .page-figure { min-width: 0; }
  .word-figure { flex-wrap: wrap; overflow-wrap: anywhere; font-size: clamp(13px, 4vw, 20px); }
  .topic-page .page-figure {
    min-height: 112px;
    justify-content: center;
    border-radius: 2px;
  }
  .topic-page .page-figure::before { width: 108px; right: 4%; }
  .footer-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-links > div:last-child { grid-column: 1 / -1; }
  .footer-links a { font-size: 11px; }
  .definition-list > div { grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr); gap: 10px; }
  .form-tabs button { padding-inline: 6px; }
  .map-card-footer { flex-wrap: wrap; font-size: 9px; }
}
@media (max-width: 375px) {
  :root { --pad: 17px; }
  .brand { gap: 5px; font-size: 9px; }
  .brand-logo { width: 43px; height: 43px; flex-basis: 43px; }
  .header-cta { padding-inline: 8px; font-size: 9px; }
  .hero-title { font-size: 33px; }
  .system-circle { width: 100%; padding-inline: 15px; }
  .topic-page .page-figure { padding-inline: 12px; }
  .topic-page .word-figure { gap: 7px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .photo-frame:hover { transform: none; }
}