
@import url("https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@75..125,400..800&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500&display=swap");

:root{
  --bark:#1C1408;
  --olive:#3D4A2A;
  --sage:#7A8F52;
  --terracotta:#8B4A2A;
  --ochre:#C4A040;
  --linen:#F4EED8;
  --paper:#FBF7E9;
  --line:rgba(28,20,8,.18);
  --line-light:rgba(244,238,216,.26);

  /*
    BRAND BOOK:
    Sinteca is the primary structural/display face.
    Archivo is the approved production fallback when Sinteca is not installed.
  */
  --structural:"Sinteca","Archivo","Helvetica Neue",Arial,sans-serif;
  --editorial:"Source Serif 4",Georgia,"Times New Roman",serif;

  --outer:clamp(20px,5vw,76px);
  --section-y:clamp(78px,8vw,128px);
  --gutter:24px;
  --header-h:82px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--linen);
  color:var(--bark);
  font-family:var(--structural);
  font-size:17px;
  line-height:1.48;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
main{overflow:hidden}
section[id]{scroll-margin-top:calc(var(--header-h) + 18px)}

.wrap{width:min(1440px,100%);margin:0 auto;padding-inline:var(--outer)}
.grid-12{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gutter);
}
.eyebrow{
  display:block;
  font-family:var(--structural);
  font-size:11px;
  line-height:1.2;
  font-weight:700;
  letter-spacing:.20em;
  text-transform:uppercase;
}
.serif{font-family:var(--editorial)}
.ochre{color:var(--ochre)}
.terracotta{color:var(--terracotta)}
.muted{opacity:.70}

/* ---------- Typography: Big thought. Small proof. ---------- */
h1,h2,h3,p{margin-top:0}
.display{
  font-family:var(--structural);
  font-size:clamp(54px,6.6vw,96px);
  font-weight:700;
  line-height:.91;
  letter-spacing:-.048em;
  max-width:12ch;
  margin:20px 0 30px;
}
h2{
  font-family:var(--structural);
  font-size:clamp(40px,4.2vw,56px);
  font-weight:700;
  line-height:.98;
  letter-spacing:-.038em;
  margin:18px 0 28px;
}
h3{
  font-family:var(--structural);
  font-size:clamp(24px,2vw,32px);
  line-height:1.05;
  letter-spacing:-.025em;
}
.editorial{
  font-family:var(--editorial);
  font-size:clamp(27px,3vw,44px);
  font-weight:400;
  line-height:1.12;
}
.body-large{
  font-size:clamp(18px,1.55vw,21px);
  line-height:1.5;
  max-width:62ch;
}
.small-proof{
  font-size:14px;
  line-height:1.52;
  max-width:60ch;
}
.data-number{
  font-size:clamp(54px,6vw,92px);
  line-height:.9;
  font-weight:700;
  letter-spacing:-.05em;
}

/* ---------- Header ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  min-height:var(--header-h);
  background:rgba(244,238,216,.97);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(10px);
}
.header-inner{
  height:var(--header-h);
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:30px;
  padding-inline:var(--outer);
}
.brand-logo img{
  width:170px;
  height:auto;
}
.desktop-nav{
  justify-self:center;
  display:flex;
  gap:clamp(18px,2.2vw,34px);
  align-items:center;
}
.desktop-nav a,.header-cta,.menu-btn{
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.desktop-nav a{
  position:relative;
  padding-block:30px;
}
.desktop-nav a::after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:21px;
  height:1px;
  background:var(--bark);
  transition:right .18s ease;
}
.desktop-nav a:hover::after{right:0}
.header-cta{
  background:var(--bark);
  color:var(--linen);
  min-height:46px;
  display:inline-flex;
  align-items:center;
  padding:0 18px;
}
.menu-btn{
  display:none;
  border:0;
  background:transparent;
  color:var(--bark);
}
.mobile-nav{display:none}

/* ---------- Surfaces ---------- */
.bark-section{background:var(--bark);color:var(--linen)}
.linen-section{background:var(--linen);color:var(--bark)}
.olive-section{background:var(--olive);color:var(--linen)}
.terracotta-section{background:var(--terracotta);color:var(--linen)}
.section-rule{border-top:1px solid var(--line)}
.section-pad{padding-block:var(--section-y)}

/* ---------- Hero ---------- */
.hero{
  min-height:calc(100vh - var(--header-h));
  padding-block:clamp(64px,7vw,110px);
}
.hero-copy{grid-column:1/7;align-self:center}
.hero-media{
  grid-column:8/13;
  align-self:center;
  margin:0;
  position:relative;
  min-height:min(64vh,650px);
  overflow:hidden;
}
.hero-media img{
  width:100%;
  height:100%;
  min-height:min(64vh,650px);
  object-fit:cover;
  filter:saturate(.82) contrast(1.05);
}
.hero-intro{
  font-size:clamp(18px,1.6vw,22px);
  line-height:1.4;
  max-width:58ch;
}
.hero-doctrine{
  font-family:var(--editorial);
  font-size:clamp(24px,2.5vw,38px);
  line-height:1.12;
  max-width:21ch;
  margin:54px 0 0;
}
.image-caption{
  position:absolute;
  left:0;right:0;bottom:0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:16px 18px;
  background:rgba(28,20,8,.93);
  color:var(--linen);
  font-size:10px;
  line-height:1.2;
  letter-spacing:.16em;
  font-weight:700;
}
.primary-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  margin-top:38px;
  padding:0 22px;
  background:var(--ochre);
  color:var(--bark);
  font-size:11px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.text-action{
  display:inline-block;
  width:max-content;
  margin-top:30px;
  padding-bottom:5px;
  border-bottom:1px solid currentColor;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

/* ---------- Proof strip ---------- */
.proof-strip{
  background:var(--linen);
  border-bottom:1px solid var(--line);
}
.proof-grid{
  display:grid;
  grid-template-columns:1.35fr repeat(4,1fr);
}
.proof-cell{
  padding:30px 24px;
  border-right:1px solid var(--line);
}
.proof-cell:first-child{padding-left:var(--outer)}
.proof-cell:last-child{
  border-right:0;
  padding-right:var(--outer);
}
.proof-cell .data-number{font-size:clamp(42px,4.2vw,64px)}
.proof-cell p{
  font-size:12px;
  color:rgba(28,20,8,.68);
  margin:8px 0 0;
}

/* ---------- Editorial chapter ---------- */
.chapter{
  padding-block:var(--section-y);
  border-top:1px solid var(--line);
}
.chapter-index{
  grid-column:1/2;
  font-size:11px;
  font-weight:700;
  letter-spacing:.2em;
}
.chapter-title{grid-column:2/7}
.chapter-copy{
  grid-column:8/13;
  padding-top:31px;
}
.chapter-copy p:last-child{margin-bottom:0}
.chapter-media{
  grid-column:2/13;
  margin:56px 0 0;
  height:min(48vw,610px);
  position:relative;
  overflow:hidden;
}
.chapter-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.84) contrast(1.04);
}
.chapter-media figcaption{
  position:absolute;
  left:18px;bottom:16px;
  background:var(--bark);
  color:var(--linen);
  padding:10px 12px;
  font-size:10px;
  letter-spacing:.16em;
  font-weight:700;
}

/* ---------- Mission bridge ---------- */
.mission{
  padding-block:clamp(72px,7vw,100px);
}
.mission .eyebrow{grid-column:1/4;color:var(--ochre)}
.mission-copy{
  grid-column:5/13;
  font-family:var(--editorial);
  font-size:clamp(29px,3.4vw,48px);
  line-height:1.12;
  max-width:26ch;
}
.mission-copy strong{color:var(--ochre);font-weight:400}

/* ---------- Farm flow ---------- */
.flow{
  display:grid;
  grid-template-columns:1fr 44px 1fr 44px 1fr;
  align-items:stretch;
  margin-top:44px;
}
.flow-card{
  min-height:238px;
  padding:26px;
  border:1px solid var(--line);
  display:flex;
  flex-direction:column;
}
.flow-card strong{
  display:block;
  margin:auto 0 8px;
  font-size:24px;
  line-height:1.08;
}
.flow-card p{font-size:14px;margin-bottom:0}
.flow-card.emphasis{
  background:var(--olive);
  border-color:var(--olive);
  color:var(--linen);
}
.flow-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
}

/* ---------- Standard ---------- */
.standard{padding-block:var(--section-y)}
.standard .chapter-index{color:var(--ochre)}
.standard .chapter-title h2{max-width:9ch}
.standard-copy{grid-column:8/13;padding-top:31px}
.standard-cards{
  grid-column:2/13;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:54px;
  border:1px solid var(--line-light);
}
.standard-card{
  min-height:220px;
  padding:26px;
  border-right:1px solid var(--line-light);
}
.standard-card:last-child{border-right:0}
.standard-card span{color:var(--ochre)}
.standard-card h3{margin:55px 0 9px}
.standard-card p{
  font-size:14px;
  color:rgba(244,238,216,.74);
  margin:0;
}

/* ---------- People ---------- */
.people-quote{
  font-family:var(--editorial);
  font-size:clamp(31px,3.7vw,50px);
  line-height:1.09;
  max-width:21ch;
}
.people-copy{grid-column:8/13;padding-top:31px}

/* ---------- Explore ---------- */
.explore{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  min-height:760px;
}
.explore-copy{
  grid-column:1/7;
  padding:var(--section-y) var(--outer);
  align-self:center;
}
.explore-copy h2{max-width:9ch}
.explore-copy p{max-width:52ch}
.explore-soul{
  font-family:var(--editorial);
  font-size:clamp(28px,3vw,42px);
  line-height:1.12;
  margin:42px 0 0;
  max-width:18ch;
}
.explore-media{
  grid-column:7/13;
  margin:0;
  min-height:760px;
  position:relative;
  overflow:hidden;
}
.explore-media img{
  width:100%;
  height:100%;
  min-height:760px;
  object-fit:cover;
  filter:saturate(.82) contrast(1.05);
}

/* ---------- Founder ---------- */
.founder{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  min-height:720px;
}
.founder-media{
  grid-column:1/6;
  min-height:720px;
  overflow:hidden;
}
.founder-media img{
  width:100%;
  height:100%;
  min-height:720px;
  object-fit:cover;
  object-position:center 31%;
  filter:grayscale(100%) contrast(1.04);
}
.founder-copy{
  grid-column:6/13;
  padding:var(--section-y) var(--outer);
  align-self:center;
}
.founder-copy h2{max-width:12ch}
.founder-copy .editorial{max-width:19ch}
.founder-line{
  font-size:22px;
  margin-top:34px;
}

/* ---------- Start here ---------- */
.start{
  padding-block:var(--section-y);
}
.start-heading{grid-column:1/7}
.start-note{
  grid-column:8/13;
  padding-top:31px;
}
.start-grid{
  grid-column:1/13;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:50px;
  border:1px solid var(--line);
}
.start-card{
  min-height:295px;
  padding:28px;
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  transition:background .18s ease,color .18s ease;
}
.start-card:last-child{border-right:0}
.start-card span{font-size:10px;letter-spacing:.18em;font-weight:700}
.start-card strong{
  font-size:clamp(22px,2vw,28px);
  line-height:1.12;
  margin:auto 0 18px;
}
.start-card em{
  font-style:normal;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}
.start-card:hover{
  background:var(--bark);
  color:var(--linen);
}
.start-card.explore-card:hover{
  background:var(--terracotta);
}
.external-note{
  grid-column:1/13;
  border-top:1px solid var(--line);
  margin-top:28px;
  padding-top:18px;
  font-size:12px;
  color:rgba(28,20,8,.66);
}

/* ---------- Notice ---------- */
.notice{
  padding:30px var(--outer);
  background:var(--paper);
  border-top:1px solid var(--line);
}
.notice-inner{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:36px;
}
.notice p{
  margin:0;
  font-size:13px;
  max-width:95ch;
}
.notice a{
  border-bottom:1px solid currentColor;
}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--bark);
  color:var(--linen);
  padding:62px var(--outer) 28px;
}
.footer-top{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:70px;
}
.footer-brand img{
  width:min(360px,86%);
  height:auto;
}
.footer-brand p{
  margin:22px 0 0;
  max-width:42ch;
  font-size:13px;
  color:rgba(244,238,216,.70);
}
.footer-group h3{
  margin:0 0 18px;
  color:var(--ochre);
  font-size:10px;
  letter-spacing:.17em;
  font-weight:700;
}
.footer-links{
  display:grid;
  gap:10px;
  font-size:13px;
  color:rgba(244,238,216,.88);
}
.footer-rule{
  height:1px;
  background:var(--line-light);
  margin:48px 0 20px;
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:24px;
  font-size:10px;
  line-height:1.5;
  letter-spacing:.08em;
  color:rgba(244,238,216,.66);
}
.footer-legal{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}
.footer-risk{
  margin-top:15px;
  max-width:100ch;
  font-size:10px;
  line-height:1.55;
  color:rgba(244,238,216,.55);
}

/* ---------- Legal pages ---------- */
.legal-hero{
  padding:clamp(70px,7vw,105px) 0;
}
.legal-hero .display{max-width:13ch}
.legal-hero p{
  font-size:19px;
  max-width:60ch;
}
.legal-content{
  padding-block:var(--section-y);
  border-top:1px solid var(--line);
}
.legal-toc{
  grid-column:1/4;
  align-self:start;
  position:sticky;
  top:calc(var(--header-h) + 30px);
}
.legal-toc a{
  display:block;
  padding:6px 0;
  font-size:12px;
  color:rgba(28,20,8,.67);
}
.legal-body{
  grid-column:5/12;
  max-width:780px;
}
.legal-body section{
  margin-bottom:54px;
  scroll-margin-top:calc(var(--header-h) + 28px);
}
.legal-body h2{
  font-size:clamp(30px,3vw,42px);
  margin-bottom:18px;
}
.legal-body h3{
  font-size:19px;
  margin:25px 0 8px;
}
.legal-body p,.legal-body li{
  font-size:16px;
  line-height:1.62;
}
.legal-body ul{padding-left:22px}
.legal-callout{
  border-left:4px solid var(--terracotta);
  padding:18px 20px;
  background:var(--paper);
  margin:24px 0;
}
.last-updated{
  margin-top:30px;
  font-size:11px;
  letter-spacing:.08em;
  color:rgba(244,238,216,.65);
}

/* ---------- Interaction / accessibility ---------- */
a:focus-visible,button:focus-visible{
  outline:3px solid var(--ochre);
  outline-offset:4px;
}

/* ---------- Responsive ---------- */
@media(max-width:1050px){
  .desktop-nav{display:none}
  .menu-btn{display:block}
  .header-inner{grid-template-columns:1fr auto auto}
  .mobile-nav{
    display:none;
    background:var(--linen);
    border-top:1px solid var(--line);
    padding:18px var(--outer) 24px;
  }
  .mobile-nav.is-open{display:grid;gap:16px}
  .mobile-nav a{
    font-size:12px;
    font-weight:700;
    letter-spacing:.14em;
  }

  .hero-copy{grid-column:1/8}
  .hero-media{grid-column:8/13}
  .chapter-title{grid-column:2/7}
  .chapter-copy,.people-copy,.standard-copy{grid-column:7/13}
  .standard-cards{grid-template-columns:repeat(2,1fr)}
  .standard-card:nth-child(2){border-right:0}
  .standard-card:nth-child(-n+2){border-bottom:1px solid var(--line-light)}
  .start-grid{grid-template-columns:repeat(2,1fr)}
  .start-card:nth-child(2){border-right:0}
  .start-card:nth-child(-n+2){border-bottom:1px solid var(--line)}
}

@media(max-width:760px){
  :root{--header-h:68px;--outer:20px;--gutter:16px}
  body{font-size:16px}
  .header-inner{height:var(--header-h);gap:14px}
  .brand-logo img{width:138px}
  .header-cta{display:none}

  .grid-12{display:block}
  .hero{
    min-height:auto;
    padding-block:72px 42px;
  }
  .hero-copy{display:block}
  .hero-media{
    display:block;
    min-height:430px;
    margin-top:50px;
  }
  .hero-media img{min-height:430px}
  .display{font-size:clamp(51px,15vw,68px);max-width:11ch}
  .hero-doctrine{font-size:29px}
  .proof-grid{grid-template-columns:1fr 1fr}
  .proof-cell{
    padding:22px 20px;
    border-bottom:1px solid var(--line);
  }
  .proof-cell:first-child{
    grid-column:1/-1;
    padding-left:20px;
  }
  .proof-cell:nth-child(3),.proof-cell:nth-child(5){border-right:0}
  .proof-cell:last-child{padding-right:20px}

  .chapter,.standard{padding-block:78px}
  .chapter-index{margin-bottom:28px}
  .chapter-copy,.people-copy,.standard-copy{padding-top:6px}
  .chapter-media{
    margin-top:42px;
    height:420px;
  }
  .flow{grid-template-columns:1fr}
  .flow-arrow{height:38px;transform:rotate(90deg)}
  .standard-cards{
    grid-template-columns:1fr;
    margin-top:38px;
  }
  .standard-card{
    border-right:0;
    border-bottom:1px solid var(--line-light);
  }
  .standard-card:last-child{border-bottom:0}

  .mission{padding-block:70px}
  .mission-copy{margin-top:26px;font-size:31px}

  .explore{display:block;min-height:0}
  .explore-copy{padding:78px 20px}
  .explore-media{min-height:480px}
  .explore-media img{min-height:480px}

  .founder{display:block;min-height:0}
  .founder-media{min-height:520px}
  .founder-media img{min-height:520px}
  .founder-copy{padding:78px 20px}

  .start{padding-block:78px}
  .start-note{padding-top:0}
  .start-grid{grid-template-columns:1fr}
  .start-card{
    min-height:225px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .start-card:last-child{border-bottom:0}

  .notice{padding:26px 20px}
  .notice-inner{grid-template-columns:1fr;gap:12px}

  .footer-top{grid-template-columns:1fr;gap:40px}
  .footer-brand img{width:270px}
  .footer-bottom{flex-direction:column}
  .legal-toc{display:none}
  .legal-body{max-width:none}
}


/* ================================================================
   V5 — Functionality + V3 proof/community strengths
   ================================================================ */
.skip-link{
  position:fixed;left:16px;top:-80px;z-index:999;
  background:var(--ochre);color:var(--bark);
  padding:12px 16px;font-size:12px;font-weight:800;letter-spacing:.08em
}
.skip-link:focus{top:12px}

/* Make proof a major brand moment, not a footnote */
.proof-strip{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.proof-grid{
  grid-template-columns:1.2fr repeat(5,1fr);
}
.proof-cell{
  min-height:170px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.proof-cell .data-number{
  font-size:clamp(52px,5.4vw,82px);
}
.proof-cell p{font-size:13px}
.proof-kicker{
  font-family:var(--editorial);
  font-size:22px!important;
  color:var(--bark)!important;
  line-height:1.15;
  max-width:12ch;
}
.proof-disclaimer{
  margin-top:12px!important;
  font-size:10px!important;
  line-height:1.35;
}

/* V3 idea brought back in a brand-book editorial way */
.system-section{
  padding-block:clamp(76px,7.5vw,112px);
  border-bottom:1px solid var(--line);
}
.system-head{grid-column:1/6}
.system-copy{grid-column:8/13;padding-top:30px}
.system-grid{
  grid-column:1/13;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:50px;
}
.system-card{
  min-height:350px;
  padding:30px;
  border:1px solid var(--line);
  border-right:0;
  display:flex;
  flex-direction:column;
}
.system-card:last-child{border-right:1px solid var(--line)}
.system-card h3{
  font-size:clamp(31px,3vw,44px);
  margin:12px 0 18px;
}
.system-card p{font-size:16px;max-width:33ch}
.system-card a{
  width:max-content;
  margin-top:auto;
  padding-bottom:4px;
  border-bottom:1px solid currentColor;
  font-size:10px;
  font-weight:800;
  letter-spacing:.13em;
}
.system-card.farm{
  background:var(--olive);color:var(--linen);border-color:var(--olive)
}
.system-card.explore{
  background:var(--terracotta);color:var(--linen);border-color:var(--terracotta)
}

/* Community proof */
.community-proof{
  padding-block:clamp(72px,7vw,104px);
  background:var(--paper);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.community-title{grid-column:1/6}
.community-copy{grid-column:8/13;padding-top:31px}
.community-list{
  grid-column:1/13;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:46px;
  border-top:1px solid var(--bark);
}
.community-item{
  padding:24px 22px 24px 0;
  margin-right:24px;
  border-bottom:1px solid var(--line);
}
.community-item:last-child{margin-right:0}
.community-item strong{
  display:block;
  font-size:23px;
  line-height:1.08;
  margin-bottom:10px;
}
.community-item p{
  font-size:13px;
  line-height:1.48;
  color:rgba(28,20,8,.70);
  margin:0;
}

/* EXPLORE needs enough information to understand the product */
.explore-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.explore-detail{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:0;
  margin-top:38px;
  border-top:1px solid rgba(244,238,216,.45);
}
.explore-detail article{
  min-height:125px;
  padding:18px 18px 18px 0;
  margin-right:18px;
  border-bottom:1px solid rgba(244,238,216,.22);
}
.explore-detail article:nth-child(even){margin-right:0}
.explore-detail h3{
  font-size:17px;margin:9px 0 7px;letter-spacing:-.01em
}
.explore-detail p{
  font-size:13px;line-height:1.45;margin:0;color:rgba(244,238,216,.80)
}
.explore-format{
  margin-top:25px;
  padding-top:18px;
  border-top:1px solid rgba(244,238,216,.45);
  font-size:13px;
  line-height:1.5;
  color:rgba(244,238,216,.86);
  max-width:66ch;
}
.explore-format strong{color:var(--linen)}
.explore-action-row{
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:8px
}

/* Founder: a story, not just a quote */
.founder-copy{padding-top:72px;padding-bottom:72px}
.founder-story{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:38px;
  border-top:1px solid rgba(244,238,216,.30);
}
.founder-story article{
  padding:21px 20px 0 0;
  margin-right:20px;
}
.founder-story article:last-child{margin-right:0}
.founder-story h3{
  margin:0 0 10px;
  color:var(--ochre);
  font-size:10px;
  letter-spacing:.16em;
  font-weight:700;
}
.founder-story p{
  margin:0;
  font-size:13px;
  line-height:1.48;
  color:rgba(244,238,216,.75);
}
.founder-philosophy{
  margin-top:30px;
  padding-top:19px;
  border-top:1px solid rgba(244,238,216,.30);
  font-family:var(--editorial);
  font-size:clamp(21px,2vw,28px);
  line-height:1.15;
}

/* Start routes should explain what happens */
.route-context{
  grid-column:1/13;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:22px;
}
.route-context div{
  min-height:90px;
  padding:14px 16px 0 0;
  margin-right:18px;
  border-top:1px solid var(--line);
  font-size:11px;
  line-height:1.45;
  color:rgba(28,20,8,.65);
}
.route-context strong{
  display:block;color:var(--bark);margin-bottom:5px
}

/* More robust hover/focus feedback */
.start-card,.primary-action,.text-action,.header-cta{
  transition:background .16s ease,color .16s ease,transform .16s ease,opacity .16s ease
}
.primary-action:hover,.header-cta:hover{transform:translateY(-1px)}
.text-action:hover{opacity:.62}
.start-card:hover{transform:translateY(-2px)}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

@media(max-width:1160px){
  .proof-grid{grid-template-columns:1.2fr repeat(3,1fr)}
  .proof-cell:first-child{grid-row:span 2}
  .proof-cell:nth-child(4){border-right:0}
  .proof-cell:nth-child(n+5){border-top:1px solid var(--line)}
  .community-list{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:1050px){
  .system-head{grid-column:1/6}
  .system-copy{grid-column:6/13}
  .community-title{grid-column:1/6}
  .community-copy{grid-column:6/13}
  .founder-story{grid-template-columns:1fr}
  .founder-story article{
    margin-right:0;padding:16px 0;border-bottom:1px solid rgba(244,238,216,.22)
  }
  .route-context{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:760px){
  .proof-grid{grid-template-columns:1fr 1fr}
  .proof-cell:first-child{
    grid-column:1/-1;grid-row:auto;min-height:145px;padding-left:20px
  }
  .proof-cell:nth-child(n){border-top:0}
  .proof-cell:nth-child(even){border-right:1px solid var(--line)}
  .proof-cell:nth-child(odd):not(:first-child){border-right:0}
  .proof-cell:last-child{grid-column:1/-1;border-top:1px solid var(--line)}
  .proof-cell .data-number{font-size:48px}
  .proof-kicker{max-width:20ch}

  .system-head,.system-copy,.community-title,.community-copy{display:block;padding-top:0}
  .system-copy,.community-copy{margin-top:8px}
  .system-grid{grid-template-columns:1fr}
  .system-card{border-right:1px solid var(--line);min-height:270px}
  .system-card + .system-card{border-top:0}

  .community-list{grid-template-columns:1fr}
  .community-item{margin-right:0}

  .explore-detail{grid-template-columns:1fr}
  .explore-detail article{margin-right:0}

  .route-context{grid-template-columns:1fr}
  .route-context div{margin-right:0}
}


/* V5.1 — Primary horizontal SOKAN AFRICA lockup */
.brand-logo img{
  width:clamp(210px,18vw,286px);
  max-height:46px;
  object-fit:contain;
  object-position:left center;
}
@media(max-width:760px){
  .brand-logo img{
    width:190px;
    max-height:38px;
  }
}


/* ================================================================
   V5.2 — Readability + FARM section breathing room
   ================================================================ */

/* Slightly larger functional micro-type across the site */
.eyebrow{
  font-size:12px;
  line-height:1.25;
}
.small-proof,
.proof-cell p,
.system-card p,
.community-item p,
.standard-card p,
.explore-detail p,
.founder-story p,
.notice p,
.footer-brand p,
.footer-links{
  font-size:15px;
}
.text-action,
.start-card em,
.desktop-nav a,
.header-cta,
.menu-btn{
  font-size:12px;
}

/* FARM / Agriculture: stop squeezing the operating flow into the right rail */
#agriculture .chapter-title{
  grid-column:2/7;
}

#agriculture .chapter-copy{
  grid-column:8/13;
  padding-top:31px;
}

/* The operating flow now spans the editorial width below the intro */
#agriculture .flow{
  grid-column:2/13;
  display:grid;
  grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr) 56px minmax(0,1fr);
  gap:0;
  align-items:stretch;
  margin-top:56px;
}

#agriculture .flow-card{
  min-height:300px;
  padding:34px;
}

#agriculture .flow-card .eyebrow{
  font-size:12px;
}

#agriculture .flow-card strong{
  font-size:clamp(30px,2.6vw,40px);
  line-height:1.02;
  letter-spacing:-.025em;
  margin:auto 0 18px;
  max-width:9ch;
}

#agriculture .flow-card p{
  font-size:16px;
  line-height:1.55;
  max-width:24ch;
}

#agriculture .flow-arrow{
  font-size:30px;
}

#agriculture .farm-cta{
  grid-column:2/13;
  margin-top:26px;
}

/* Keep the image full-width below the process */
#agriculture .chapter-media{
  grid-column:2/13;
  margin-top:62px;
}

/* More readable core body copy */
.body-large{
  font-size:clamp(19px,1.65vw,23px);
  line-height:1.52;
}
.hero-intro{
  font-size:clamp(19px,1.7vw,23px);
}
.start-card strong{
  font-size:clamp(24px,2.15vw,31px);
}
.route-context div{
  font-size:13px;
}

/* A little more room in the chapter grid overall */
.chapter{
  padding-block:clamp(88px,8vw,132px);
}

/* Tablet */
@media(max-width:1050px){
  #agriculture .flow{
    grid-column:1/13;
    grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr) 42px minmax(0,1fr);
  }

  #agriculture .flow-card{
    padding:26px;
    min-height:280px;
  }

  #agriculture .flow-card strong{
    font-size:30px;
  }

  #agriculture .farm-cta,
  #agriculture .chapter-media{
    grid-column:1/13;
  }
}

/* Mobile: stack the process with large readable cards */
@media(max-width:760px){
  .eyebrow{
    font-size:11px;
  }

  #agriculture .chapter-title,
  #agriculture .chapter-copy{
    display:block;
  }

  #agriculture .chapter-copy{
    padding-top:4px;
    margin-top:12px;
  }

  #agriculture .flow{
    display:grid;
    grid-template-columns:1fr;
    margin-top:38px;
  }

  #agriculture .flow-card{
    min-height:245px;
    padding:28px;
  }

  #agriculture .flow-card strong{
    font-size:34px;
    max-width:10ch;
  }

  #agriculture .flow-card p{
    font-size:16px;
    max-width:30ch;
  }

  #agriculture .flow-arrow{
    height:48px;
    transform:rotate(90deg);
    font-size:26px;
  }

  #agriculture .farm-cta{
    margin-top:22px;
  }

  #agriculture .chapter-media{
    margin-top:44px;
    height:390px;
  }

  .body-large{
    font-size:18px;
  }

  .small-proof,
  .proof-cell p,
  .system-card p,
  .community-item p,
  .standard-card p,
  .explore-detail p,
  .founder-story p,
  .notice p,
  .footer-brand p,
  .footer-links{
    font-size:14px;
  }
}


/* ================================================================
   V5.4 — ABOUT replaces FOUNDER; founder image becomes section background
   ================================================================ */
.about-photo-section{
  position:relative;
  min-height:820px;
  background-image:url("assets/founder-bw.jpg");
  background-size:cover;
  background-position:center 30%;
  color:var(--linen);
  overflow:hidden;
}

.about-photo-overlay{
  position:absolute;
  inset:0;
  background:rgba(28,20,8,.78);
  pointer-events:none;
}

.about-photo-grid{
  position:relative;
  z-index:1;
  min-height:820px;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gutter);
  align-items:center;
  padding-block:var(--section-y);
}

.about-photo-copy{
  grid-column:7/13;
  max-width:760px;
}

.about-photo-copy h2{
  max-width:11ch;
  color:var(--linen);
}

.about-photo-copy .editorial{
  max-width:20ch;
  color:var(--linen);
}

.about-photo-copy .body-large{
  max-width:56ch;
  color:rgba(244,238,216,.92);
}

.about-story{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:38px;
  border-top:1px solid rgba(244,238,216,.30);
}

.about-story article{
  padding:22px 20px 0 0;
  margin-right:20px;
}

.about-story article:last-child{
  margin-right:0;
}

.about-story h3{
  margin:0 0 10px;
  color:var(--ochre);
  font-size:11px;
  letter-spacing:.16em;
  font-weight:700;
}

.about-story p{
  margin:0;
  font-size:14px;
  line-height:1.52;
  color:rgba(244,238,216,.78);
}

.about-line{
  font-size:21px;
  line-height:1.35;
  margin-top:34px;
  max-width:58ch;
}

.about-philosophy{
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid rgba(244,238,216,.30);
  font-family:var(--editorial);
  font-size:clamp(22px,2.2vw,30px);
  line-height:1.15;
}

@media(max-width:1050px){
  .about-photo-copy{
    grid-column:6/13;
  }

  .about-story{
    grid-template-columns:1fr;
  }

  .about-story article{
    margin-right:0;
    padding:16px 0;
    border-bottom:1px solid rgba(244,238,216,.18);
  }
}

@media(max-width:760px){
  .about-photo-section{
    min-height:760px;
    background-position:42% center;
  }

  .about-photo-grid{
    display:block;
    min-height:760px;
    padding-block:78px;
  }

  .about-photo-copy{
    max-width:none;
  }

  .about-photo-overlay{
    background:rgba(28,20,8,.84);
  }

  .about-photo-copy .body-large{
    font-size:17px;
  }

  .about-story p{
    font-size:14px;
  }
}


/* ================================================================
   V5.5 — Agriculture documentary image becomes the HOME HERO background
   ABOUT returns to a split founder-image layout
   ================================================================ */

/* HERO BACKGROUND */
.hero-photo{
  position:relative;
  min-height:calc(100vh - var(--header-h));
  background-image:url("assets/hero-agriculture.png");
  background-size:cover;
  background-position:center 45%;
  color:var(--linen);
  overflow:hidden;
}

.hero-photo-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      rgba(28,20,8,.94) 0%,
      rgba(28,20,8,.90) 36%,
      rgba(28,20,8,.62) 62%,
      rgba(28,20,8,.25) 100%
    );
  pointer-events:none;
}

.hero-photo-grid{
  position:relative;
  z-index:1;
  min-height:calc(100vh - var(--header-h));
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gutter);
  align-items:center;
  padding-block:clamp(72px,8vw,120px);
}

.hero-photo-copy{
  grid-column:1/7;
  max-width:780px;
}

.hero-photo-copy .display{
  color:var(--linen);
  max-width:10ch;
}

.hero-photo-copy .hero-intro{
  max-width:54ch;
  color:rgba(244,238,216,.94);
}

.hero-photo-copy .hero-doctrine{
  color:var(--linen);
  max-width:18ch;
}

.hero-photo-caption{
  position:absolute;
  right:var(--outer);
  bottom:24px;
  display:flex;
  gap:28px;
  padding:10px 12px;
  background:rgba(28,20,8,.76);
  color:var(--linen);
  font-size:10px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.15em;
}

/* ABOUT SPLIT */
.about-split{
  display:grid;
  grid-template-columns:5fr 7fr;
  min-height:760px;
}

.about-split-media{
  min-height:760px;
  overflow:hidden;
}

.about-split-media img{
  width:100%;
  height:100%;
  min-height:760px;
  object-fit:cover;
  object-position:center 30%;
  filter:grayscale(100%) contrast(1.04);
}

.about-split-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:var(--section-y) var(--outer);
}

.about-split-copy h2{
  max-width:11ch;
}

.about-split-copy .editorial{
  max-width:20ch;
}

.about-split-copy .body-large{
  max-width:58ch;
  color:rgba(244,238,216,.90);
}

/* Remove old full-background About behaviour if it remains in cascade */
.about-photo-section,
.about-photo-grid,
.about-photo-copy,
.about-photo-overlay{
  /* kept harmless for older legal/static references */
}

/* Responsive */
@media(max-width:1050px){
  .hero-photo-copy{
    grid-column:1/8;
  }

  .about-split{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:760px){
  .hero-photo{
    min-height:780px;
    background-position:63% center;
  }

  .hero-photo-overlay{
    background:rgba(28,20,8,.78);
  }

  .hero-photo-grid{
    display:block;
    min-height:780px;
    padding-block:72px 92px;
  }

  .hero-photo-copy{
    max-width:none;
  }

  .hero-photo-copy .display{
    max-width:9ch;
  }

  .hero-photo-caption{
    left:20px;
    right:20px;
    bottom:20px;
    justify-content:space-between;
    gap:12px;
  }

  .about-split{
    display:block;
    min-height:0;
  }

  .about-split-media{
    min-height:520px;
  }

  .about-split-media img{
    min-height:520px;
  }

  .about-split-copy{
    padding:78px 20px;
  }
}


/* V5.6 update: remove hero caption */
.hero-photo-caption{display:none !important;}

/* V5.7 — avoid iOS emoji rendering on CTA arrows */
.start-card em,
.footer-links a {
  font-variant-emoji: text;
}


/* ================================================================
   V5.8 — Mobile polish
   Compress Start Here cards and improve small-screen readability
   ================================================================ */
@media(max-width:760px){

  /* Header */
  .site-header .wrap{
    padding-inline:20px;
  }

  .brand img,
  .brand-logo{
    max-width:230px;
    height:auto;
  }

  /* Start Here section */
  #start{
    padding-block:0;
  }

  .start-grid{
    display:block;
  }

  .start-card{
    min-height:0;
    padding:34px 28px 32px;
  }

  .start-card + .start-card{
    border-top:1px solid rgba(28,20,8,.18);
  }

  .start-card .eyebrow{
    margin-bottom:30px;
    font-size:12px;
    letter-spacing:.18em;
  }

  .start-card strong{
    display:block;
    font-size:clamp(31px,8.2vw,38px);
    line-height:1.06;
    letter-spacing:-.025em;
    max-width:12ch;
    margin:0 0 28px;
  }

  .start-card em{
    display:block;
    margin-top:0;
    font-size:14px;
    line-height:1.25;
    letter-spacing:.14em;
  }

  /* Keep the Explore card compact too */
  .start-card.explore-card{
    min-height:0;
  }

  /* Reduce excessive vertical chapter spacing on phones */
  .chapter{
    padding-block:72px;
  }

  /* Hero remains cinematic but avoids feeling overlong on short phones */
  .hero-photo,
  .hero-photo-grid{
    min-height:720px;
  }

  .hero-photo-grid{
    padding-block:64px 88px;
  }

  .hero-photo-copy .display{
    font-size:clamp(52px,14vw,72px);
    line-height:.98;
  }

  .hero-photo-copy .hero-intro{
    font-size:18px;
    line-height:1.48;
    max-width:31ch;
  }

  .hero-photo-copy .hero-doctrine{
    font-size:clamp(25px,7vw,34px);
    line-height:1.08;
    margin-top:40px;
  }

  /* FARM process */
  #agriculture .flow-card{
    min-height:0;
    padding:28px 26px;
  }

  #agriculture .flow-card strong{
    font-size:31px;
  }

  /* About copy */
  .about-split-copy{
    padding:68px 24px;
  }

  /* General mobile text readability */
  .body-large,
  .hero-intro{
    font-size:18px;
  }

  /* Prevent CTA text getting too close to browser overlays */
  #start .start-card:last-child{
    padding-bottom:54px;
  }
}


/* ================================================================
   V5.9 — Permanent iOS-safe CTA arrows
   Drawn entirely with CSS: no Unicode/emoji glyph is used.
   ================================================================ */
.css-arrow{
  display:inline-block;
  position:relative;
  width:1.05em;
  height:.72em;
  margin-left:.22em;
  vertical-align:-.04em;
  flex:0 0 auto;
}

.css-arrow::before{
  content:"";
  position:absolute;
  left:0;
  right:.08em;
  top:50%;
  height:1.5px;
  background:currentColor;
  transform:translateY(-50%);
}

.css-arrow::after{
  content:"";
  position:absolute;
  right:.08em;
  top:50%;
  width:.38em;
  height:.38em;
  border-top:1.5px solid currentColor;
  border-right:1.5px solid currentColor;
  transform:translateY(-50%) rotate(45deg);
  transform-origin:center;
}

/* Old emoji/text-arrow guard can remain, but CSS arrows are now the source of truth. */
