/* ==========================================================================
   ARCUSERVES FOUNDATION - DESIGN SYSTEM
   Built from the Brand Guidelines. Five approved colours, two typefaces,
   an 8px spacing scale, three radii, and borders in place of shadows.

   Fonts are loaded with <link rel="preload"> in the document head, not with
   an @import here - an @import blocks the stylesheet from rendering until the
   font CSS has downloaded.

   Colour roles:
     Deep Sage  #3F4D48  anchor - headings, nav, footer, primary buttons
     Sage       #6D847C  supporting - borders, icons, secondary UI, hover
     Clay       #D1ACA8  ACCENT ONLY - rules, markers, active states, overlays
     Cream      #FCF9CE  warm editorial backgrounds, callouts
     White      #FFFFFF  primary surface; whitespace carries the design

   Accessibility: Clay on white is 2.06:1, Sage on white is 4.01:1. Neither is
   ever small text on a light surface - they appear as rules, borders,
   backgrounds and markers. The usage context was adjusted, not the palette.
   ========================================================================== */

:root{
  /* ---- colour ---- */
  --color-deep-sage:#3F4D48;
  --color-sage:#6D847C;
  --color-clay:#F0A3AC;
  --color-cream:#FCF9CE;
  --color-white:#FFFFFF;

  /* neutrals mixed from Deep Sage + White; no new hue enters the system */
  --color-text:#3F4D48;          /* Deep Sage             8.87:1 on white */
  --color-text-body:#55635E;     /* Deep Sage + 14% white 6.30:1 on white */
  --color-text-muted:#63716B;    /* Deep Sage + 26% white 5.12:1 on white */
  --color-text-on-dark:#DDE2E0;  /* White 82%             6.77:1 on sage  */
  --color-border:#E3E8E5;        /* Deep Sage + 88% white */
  --color-border-strong:#CBD4D0; /* Deep Sage + 76% white */
  --color-mist:#EEF3F0;          /* Deep Sage + 92% white - a calm, non-yellow section tint */
  --color-green-light:#DCE8DF;   /* light sage-green for alternating home sheets */

  /* channel values, for the rgba() stops in scrims and fades */
  --deep-sage-rgb:63,77,72;
  --sage-rgb:109,132,124;

  /* ---- type ---- */
  --font-heading:'Montserrat',system-ui,-apple-system,sans-serif;
  --font-body:'Poppins',system-ui,-apple-system,sans-serif;

  /* ---- spacing: an 8px scale, used everywhere instead of loose numbers ---- */
  --space-2xs:4px;
  --space-xs:8px;
  --space-sm:12px;
  --space-md:20px;
  --space-lg:32px;
  --space-xl:48px;
  --space-2xl:72px;
  --space-3xl:104px;

  /* section rhythm scales with the viewport, so most breakpoint overrides
     for vertical spacing are no longer needed */
  --section-y:clamp(52px,5.5vw,84px);
  --section-y-tight:clamp(40px,4.5vw,60px);

  /* ---- layout ---- */
  --container-width:1200px;
  --container-pad:clamp(20px,4vw,28px);
  --hd-h:84px;

  /* ---- radius: three values, used consistently ---- */
  --radius-sm:4px;    /* controls, tags, inputs */
  --radius-md:10px;   /* cards */
  --radius-lg:16px;   /* large editorial imagery */

  /* ---- one subtle shadow, for elements that genuinely float ---- */
  --shadow-sm:0 12px 32px -20px rgba(var(--deep-sage-rgb),.4);

  /* ---- motion ---- */
  --transition-fast:150ms;
  --transition-base:250ms;
  --transition-slow:400ms;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ==========================================================================
   BASE
   ========================================================================== */
.asf-page{
  font-family:var(--font-body);
  font-weight:400;
  font-size:16.5px;
  line-height:1.78;
  color:var(--color-text-body);
  background:var(--color-white);
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
.asf-page *,.asf-page *::before,.asf-page *::after{box-sizing:border-box;}
.asf-page img{max-width:100%;display:block;}
.asf-page a{text-decoration:none;}
.asf-page a:not([class]){color:inherit;}
.asf-page p{margin:0 0 1.15em;}
.asf-page p:last-child{margin-bottom:0;}
.asf-page ul{margin:0;padding:0;list-style:none;}
.asf-page :focus-visible{outline:2px solid var(--color-deep-sage);outline-offset:3px;border-radius:var(--radius-sm);}

.asf-page h1,.asf-page h2,.asf-page h3,.asf-page h4{
  font-family:var(--font-heading);
  color:var(--color-text);
  margin:0;
  line-height:1.2;
  letter-spacing:-.01em;
}

/* ---------- layout ---------- */
.asf-wrap{max-width:var(--container-width);margin:0 auto;padding:0 var(--container-pad);}
.asf-sec{padding:var(--section-y) 0;position:relative;scroll-margin-top:calc(var(--hd-h) + var(--space-md));}
.asf-sec--tight{padding:var(--section-y-tight) 0;}
.asf-sec--fill{padding:clamp(36px,6vh,60px) 0;}
.asf-sec--divider{border-top:1px solid var(--color-border);}

/* Background rhythm: white is the default, cream marks warm editorial
   passages, deep sage marks the one statement moment. Never mechanical. */
.asf-sec--cream{background:var(--color-cream);}
.asf-sec--mist{background:var(--color-mist);}
.asf-sec--sage{background:var(--color-deep-sage);color:var(--color-text-on-dark);}
.asf-sec--sage h1,.asf-sec--sage h2,.asf-sec--sage h3,.asf-sec--sage h4{color:var(--color-white);}
.asf-sec--sage .asf-lede{color:var(--color-text-on-dark);}

/* ==========================================================================
   TYPOGRAPHY
   Montserrat sets structure; Poppins carries reading.
   Weights loaded: Montserrat 500/600/700, Poppins 300/400/500.
   ========================================================================== */
.asf-h1{font-size:clamp(34px,4.6vw,58px);font-weight:700;line-height:1.1;letter-spacing:-.02em;}
.asf-h2{font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.014em;}
.asf-h3{font-size:clamp(19px,1.9vw,24px);font-weight:600;}

.asf-lede{
  font-family:var(--font-body);font-weight:400;
  font-size:clamp(17px,1.35vw,18.5px);line-height:1.8;
  color:var(--color-text-body);max-width:62ch;
}

/* Section marker: Deep Sage type (readable) with a Clay rule (decorative) */
.asf-eyebrow{
  display:inline-flex;align-items:center;gap:var(--space-sm);
  font-family:var(--font-heading);font-weight:600;font-size:11.5px;
  letter-spacing:1.3px;text-transform:uppercase;
  color:var(--color-deep-sage);margin-bottom:var(--space-md);
}
.asf-eyebrow::before{content:"";width:28px;height:2px;background:var(--color-clay);flex:none;}
.asf-sec--sage .asf-eyebrow{color:var(--color-cream);}
.asf-head{max-width:760px;margin-bottom:var(--space-lg);}

/* ==========================================================================
   BUTTONS - primary / secondary / on-dark, with full state coverage
   ========================================================================== */
.asf-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:var(--space-sm) var(--space-lg);
  border-radius:var(--radius-sm);
  font-family:var(--font-heading);font-weight:600;font-size:14px;letter-spacing:.2px;
  background:var(--color-deep-sage);color:var(--color-white);
  border:1.5px solid var(--color-deep-sage);cursor:pointer;
  transition:background var(--transition-base) var(--ease),
             color var(--transition-base) var(--ease),
             border-color var(--transition-base) var(--ease);
}
.asf-btn:hover{background:var(--color-sage);border-color:var(--color-sage);}
.asf-btn:active{background:var(--color-deep-sage);border-color:var(--color-deep-sage);}
.asf-btn[disabled],.asf-btn[aria-disabled="true"]{
  background:var(--color-border);border-color:var(--color-border);
  color:var(--color-text-muted);cursor:not-allowed;
}
.asf-btn--secondary{background:transparent;color:var(--color-deep-sage);border-color:var(--color-border-strong);}
.asf-btn--secondary:hover{background:var(--color-deep-sage);border-color:var(--color-deep-sage);color:var(--color-white);}
.asf-btn--on-dark{background:var(--color-white);color:var(--color-deep-sage);border-color:var(--color-white);}
.asf-btn--on-dark:hover{background:var(--color-cream);border-color:var(--color-cream);}
/* A transparent button disappears over bright grass. A translucent Deep
   Sage fill keeps it legible on any part of the photograph while staying
   clearly secondary to the solid white primary. */
/* Off-white text on a Deep Sage fill. The fill is .84 rather than lighter
   because at .68 the off-white only reached 3.72:1 over the brightest
   part of the photograph; .84 gives 4.96:1 everywhere. */
.asf-btn--outline-dark{background:rgba(var(--deep-sage-rgb),.84);color:var(--color-text-on-dark);border-color:rgba(221,226,224,.55);}
.asf-btn--outline-dark:hover{background:var(--color-text-on-dark);border-color:var(--color-text-on-dark);color:var(--color-deep-sage);}
.asf-btn .ar{transition:transform var(--transition-base) var(--ease);}
.asf-btn:hover .ar{transform:translateX(3px);}

/* text link - underline carries the affordance, not colour alone.
   .asf-btn--secondary and .asf-link are system components: this page uses one
   of each, other pages will use them more. */
.asf-link{
  color:var(--color-deep-sage);font-weight:500;
  border-bottom:1px solid var(--color-clay);
  transition:border-color var(--transition-base) var(--ease),color var(--transition-base) var(--ease);
}
.asf-link:hover{color:var(--color-sage);border-bottom-color:var(--color-sage);}

/* a second, smaller frame set into the corner of a large image - the same
   composition as the Our Story collage, so the page reads as one system */
.asf-inset{
  position:absolute;z-index:2;width:44%;aspect-ratio:1/1;overflow:hidden;
  border-radius:var(--radius-md);border:6px solid var(--color-white);
}
.asf-inset img{width:100%;height:100%;object-fit:cover;}
.asf-inset--br{right:calc(var(--space-md) * -1);bottom:calc(var(--space-lg) * -1);}
.asf-inset--bl{left:calc(var(--space-md) * -1);bottom:calc(var(--space-lg) * -1);}
.asf-sec--cream .asf-inset{border-color:var(--color-cream);}

/* image frame - no filters, natural photographs */
.asf-img{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--color-border);}
.asf-img img{width:100%;height:100%;object-fit:cover;}

/* ==========================================================================
   1 . HERO
   ========================================================================== */
.asf-hero{
  position:relative;display:flex;align-items:flex-end;overflow:hidden;
  min-height:100vh;
  min-height:100svh;

  /* Behind the photograph sits a ramp that runs Deep Sage -> pale Sage -> white.
     The photo is masked out over the same range, so as it dissolves it hands
     over to a tint close to its own value rather than dropping onto #FFF.
     Fading a dark image straight to white is a ~180-level luminance jump and
     reads as a hard edge; this halves each step. Every stop is Sage over
     White - no new hue enters the palette. */
  background-color:var(--color-white);
  background-image:linear-gradient(180deg,
      var(--color-deep-sage) 0%,
      var(--color-deep-sage) 58%,
      rgba(var(--sage-rgb),.92) 70%,
      rgba(var(--sage-rgb),.70) 78%,
      rgba(var(--sage-rgb),.46) 84%,
      rgba(var(--sage-rgb),.28) 88%,
      rgba(var(--sage-rgb),.14) 92%,
      rgba(var(--sage-rgb),.05) 95%,
      rgba(var(--sage-rgb),0) 97%,
      rgba(var(--sage-rgb),0) 100%);
}
.asf-hero__media{position:absolute;inset:0;z-index:0;}
.asf-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 55%;
  transform:scale(1.06);animation:asfHeroPan 24s var(--ease) forwards;
}
@keyframes asfHeroPan{to{transform:scale(1);}}
/* targeted scrims only - headline left, nav top, stat strip bottom;
   the photograph itself stays bright */
.asf-hero__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(var(--deep-sage-rgb),.60) 0%,rgba(var(--deep-sage-rgb),.30) 38%,rgba(var(--deep-sage-rgb),0) 62%),
    linear-gradient(180deg,rgba(var(--deep-sage-rgb),.34) 0%,rgba(var(--deep-sage-rgb),0) 22%),
    linear-gradient(0deg,rgba(var(--deep-sage-rgb),.58) 0%,rgba(var(--deep-sage-rgb),.26) 24%,rgba(var(--deep-sage-rgb),0) 46%);
}
.asf-hero__inner{
  position:relative;z-index:2;width:100%;
  padding:calc(var(--hd-h) + clamp(24px,6vh,60px)) 0 clamp(150px,27vh,280px);
}
.asf-hero h1{color:var(--color-white);max-width:17ch;}
.asf-hero h1 em{font-style:normal;color:var(--color-clay);}
.asf-hero .asf-eyebrow{color:var(--color-cream);}
.asf-hero__lede{
  margin-top:var(--space-md);max-width:56ch;color:rgba(255,255,255,.92);
  font-size:clamp(16px,1.3vw,18.5px);line-height:1.8;font-weight:400;
}
.asf-hero__cta{margin-top:var(--space-lg);display:flex;flex-wrap:wrap;gap:var(--space-sm);}

.asf-hero__strip{
  margin-top:clamp(28px,5vh,60px);padding-top:var(--space-md);
  border-top:1px solid rgba(255,255,255,.28);
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);
}
.asf-hero__stat{padding-right:var(--space-md);border-right:1px solid rgba(255,255,255,.18);}
.asf-hero__stat:last-child{border-right:none;padding-right:0;}
.asf-hero__stat b{
  display:block;font-family:var(--font-heading);font-weight:600;color:var(--color-white);
  font-size:clamp(20px,2.6vw,34px);line-height:1.1;letter-spacing:-.015em;
}
.asf-word{display:inline-block;overflow:hidden;vertical-align:top;line-height:1.1;}
.asf-word > span{display:block;transform:translateY(105%);transition:transform 900ms var(--ease-out) 200ms;}
.asf-rv.is-in .asf-word > span{transform:none;}
.asf-hero__stat > span{display:block;margin-top:var(--space-xs);font-size:clamp(11.5px,1vw,13.5px);color:rgba(255,255,255,.86);line-height:1.5;}

/* short screens: the hero still has to hold inside one page */
@media(max-height:860px){
  .asf-hero h1{font-size:clamp(30px,3.6vw,44px);}
  .asf-hero__lede{margin-top:var(--space-sm);font-size:16px;line-height:1.7;}
  .asf-hero__cta{margin-top:var(--space-md);}
}
@media(max-height:700px){
  .asf-hero h1{font-size:clamp(26px,3vw,34px);}
  .asf-hero__lede{display:none;}   /* the H1 and the strip carry the message */
}

/* ==========================================================================
   2 . OUR STORY
   ========================================================================== */
.asf-story{display:grid;grid-template-columns:.88fr 1.12fr;gap:var(--space-2xl);align-items:stretch;}
.asf-story__text{display:flex;flex-direction:column;justify-content:flex-start;}
.asf-story__collage{position:relative;display:flex;min-height:520px;}
.asf-story__collage .a{flex:1;border-radius:var(--radius-lg);overflow:hidden;position:relative;}
.asf-story__collage .a img{width:100%;height:100%;object-fit:cover;}
.asf-story__collage .b{
  position:absolute;right:calc(var(--space-md) * -1);bottom:calc(var(--space-lg) * -1);width:46%;aspect-ratio:1/1;z-index:2;
  border-radius:var(--radius-md);overflow:hidden;border:6px solid var(--color-white);
}
.asf-story__collage .b img{width:100%;height:100%;object-fit:cover;}
/* the collage may sit proud of its column, so the row needs the headroom */
.asf-story{padding-bottom:var(--space-lg);}
.asf-story__badge{
  position:absolute;left:var(--space-md);top:var(--space-md);z-index:3;max-width:178px;
  background:var(--color-cream);color:var(--color-deep-sage);
  padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);
}
.asf-story__badge b{display:block;font-family:var(--font-heading);font-weight:600;font-size:15px;line-height:1.3;}
.asf-story__badge span{display:block;margin-top:var(--space-2xs);font-size:12px;color:var(--color-text-muted);line-height:1.5;}

.asf-quote{
  margin-top:var(--space-lg);padding:var(--space-2xs) 0 var(--space-2xs) var(--space-lg);
  border-left:2px solid var(--color-clay);
  font-family:var(--font-heading);font-weight:500;font-size:clamp(18px,1.8vw,22px);
  line-height:1.55;color:var(--color-deep-sage);letter-spacing:-.008em;
}
.asf-quote cite{display:block;margin-top:var(--space-sm);font-family:var(--font-body);font-weight:400;font-size:13.5px;font-style:normal;color:var(--color-text-muted);letter-spacing:0;}

.asf-cycle{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-lg);align-items:stretch;margin-top:var(--space-xl);}
.asf-cycle__card{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg) var(--space-lg);}
.asf-sec--cream .asf-cycle__card{border-color:var(--color-border-strong);}
.asf-cycle__card h3{font-size:16px;font-weight:600;margin-bottom:var(--space-xs);}
.asf-cycle__card p{font-size:14.5px;line-height:1.7;color:var(--color-text-muted);margin:0;}
.asf-cycle__link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-xs);color:var(--color-sage);}
.asf-cycle__link svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.5;}
.asf-cycle__link span{font-family:var(--font-heading);font-size:10.5px;letter-spacing:1.3px;text-transform:uppercase;font-weight:600;color:var(--color-text-muted);}

/* ==========================================================================
   3 . VISION / MISSION / THE GAP
   ========================================================================== */
.asf-gap{
  margin-top:var(--space-lg);border-radius:var(--radius-md);padding:var(--space-xl) var(--space-xl);
  background:var(--color-white);border:1px solid var(--color-border-strong);
}
.asf-gap__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg);margin-top:var(--space-lg);}
.asf-gap__item{padding-top:var(--space-md);border-top:2px solid var(--color-clay);}
.asf-gap__item b{display:block;font-family:var(--font-heading);font-size:12px;color:var(--color-sage);letter-spacing:1.2px;margin-bottom:var(--space-xs);font-weight:600;}
.asf-gap__item p{font-size:15px;line-height:1.68;color:var(--color-text-body);margin:0;}

/* ==========================================================================
   4 . OUR COMMUNITY - the one Deep Sage statement section
   ========================================================================== */
.asf-impact__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg);margin-top:var(--space-xl);}
.asf-impact__item{border-top:2px solid var(--color-clay);padding-top:var(--space-md);}
.asf-impact__num{
  font-family:var(--font-heading);font-weight:600;color:var(--color-white);
  font-size:clamp(34px,4vw,50px);line-height:1.1;letter-spacing:-.025em;
  display:flex;align-items:flex-start;
}
.asf-impact__num sup{font-size:.5em;line-height:1;color:var(--color-clay);margin-left:2px;margin-top:.1em;}
.asf-impact__lab{margin-top:var(--space-sm);font-size:14.5px;color:var(--color-text-on-dark);line-height:1.6;}
.asf-impact__note{margin-top:var(--space-lg);font-size:12.5px;color:rgba(255,255,255,.74);}

/* odometer reels - markup is generated by js/main.js at runtime */
.asf-odo{display:inline-flex;align-items:flex-start;}
.asf-odo__sep{display:inline-block;}
.asf-odo__col{display:inline-block;height:1.1em;overflow:hidden;vertical-align:top;}
.asf-odo__reel{display:flex;flex-direction:column;transform:translateY(0);will-change:transform;}
.asf-odo__d{display:block;height:1.1em;line-height:1.1em;}

/* ==========================================================================
   5 . FOUR PILLARS
   ========================================================================== */
.asf-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg);}
.asf-pillar{
  position:relative;background:var(--color-white);border:1px solid var(--color-border);
  border-radius:var(--radius-md);overflow:hidden;display:flex;flex-direction:column;
  transition:border-color var(--transition-base) var(--ease),transform var(--transition-slow) var(--ease-out);
}
.asf-pillar:hover{border-color:var(--color-sage);transform:translateY(-4px);}
.asf-pillar__media{position:relative;aspect-ratio:4/3;overflow:hidden;}
.asf-pillar__media img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--ease-out);}
.asf-pillar:hover .asf-pillar__media img{transform:scale(1.05);}
.asf-pillar__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--deep-sage-rgb),0) 46%,rgba(var(--deep-sage-rgb),.62) 100%);}
.asf-pillar__no{
  position:absolute;left:var(--space-md);bottom:var(--space-sm);z-index:2;
  font-family:var(--font-heading);font-weight:600;font-size:26px;color:var(--color-white);
  line-height:1;letter-spacing:-.01em;
}
.asf-pillar__body{padding:var(--space-lg) var(--space-md) var(--space-lg);display:flex;flex-direction:column;flex:1;}
.asf-pillar__body h3{font-size:17.5px;font-weight:600;line-height:1.35;margin-bottom:var(--space-sm);}
.asf-pillar__body p{font-size:14.5px;line-height:1.72;color:var(--color-text-muted);margin:0;}
.asf-pillar__tag{
  align-self:flex-start;margin-top:var(--space-md);background:var(--color-clay);color:var(--color-deep-sage);
  font-family:var(--font-heading);font-size:11px;font-weight:600;letter-spacing:.8px;
  text-transform:uppercase;padding:6px 11px;border-radius:var(--radius-sm);
}
/* the one highlighted card uses Cream - not a fifth colour */
.asf-pillar--lead{background:var(--color-cream);border-color:var(--color-clay);}

/* enabler - Deep Sage anchor block */
.asf-enabler{
  margin-top:var(--space-lg);position:relative;border-radius:var(--radius-md);overflow:hidden;
  background:var(--color-deep-sage);display:grid;grid-template-columns:1.3fr .7fr;align-items:stretch;
}
.asf-enabler__body{padding:var(--space-xl) var(--space-xl);position:relative;z-index:2;}
.asf-enabler__ico{
  width:46px;height:46px;border-radius:var(--radius-sm);background:var(--color-cream);color:var(--color-deep-sage);
  display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-md);
}
.asf-enabler__ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5;}
.asf-enabler__body span.k{display:block;font-family:var(--font-heading);font-size:11px;letter-spacing:1.3px;text-transform:uppercase;color:var(--color-cream);font-weight:600;margin-bottom:var(--space-xs);}
.asf-enabler__body h3{color:var(--color-white);font-size:clamp(21px,2.2vw,27px);font-weight:600;margin-bottom:var(--space-sm);}
.asf-enabler__body p{color:var(--color-text-on-dark);font-size:15.5px;line-height:1.8;max-width:56ch;margin:0;}
.asf-enabler__media{position:relative;min-height:250px;}
.asf-enabler__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.asf-enabler__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--color-deep-sage) 0%,rgba(var(--deep-sage-rgb),.34) 62%,rgba(var(--deep-sage-rgb),0) 100%);}

/* ==========================================================================
   6 . HOW WE WORK
   ========================================================================== */
.asf-how{display:grid;grid-template-columns:1.06fr .94fr;gap:var(--space-2xl);align-items:stretch;}
.asf-how__media{position:relative;display:flex;min-height:520px;}
.asf-how__media .asf-img{flex:1;}
.asf-how__text{display:flex;flex-direction:column;justify-content:flex-start;}
.asf-principles{display:grid;border-top:1px solid var(--color-border);}
.asf-principle{
  padding:var(--space-lg) var(--space-2xs);display:grid;grid-template-columns:52px 1fr;
  gap:var(--space-md);align-items:start;border-bottom:1px solid var(--color-border);
  transition:padding-left var(--transition-base) var(--ease);
}
.asf-principle:hover{padding-left:var(--space-sm);}
.asf-principle__n{font-family:var(--font-heading);font-weight:600;font-size:13px;color:var(--color-sage);letter-spacing:.8px;padding-top:3px;}
.asf-principle h3{font-size:16.5px;font-weight:600;margin-bottom:var(--space-2xs);}
.asf-principle p{font-size:14.5px;line-height:1.72;color:var(--color-text-muted);margin:0;}

/* ==========================================================================
   7 . LEADERSHIP
   Pointer devices get a restrained flip on hover and keyboard focus. Touch
   devices have no hover, so both faces stack into one readable card - no
   JavaScript, and nothing is hidden from anyone.
   ========================================================================== */
.asf-leaders{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1020px;}
.asf-leader{perspective:1600px;height:370px;}
.asf-leader__inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform var(--transition-slow) var(--ease-out);}
.asf-leader:hover .asf-leader__inner,
.asf-leader:focus-visible .asf-leader__inner{transform:rotateY(180deg);}
.asf-leader:focus-visible{outline:2px solid var(--color-deep-sage);outline-offset:4px;border-radius:var(--radius-md);}
.asf-leader__face{
  position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;
  border-radius:var(--radius-md);display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:var(--space-lg) var(--space-lg);overflow:hidden;
}
.asf-leader__face--front{background:var(--color-white);border:1px solid var(--color-border-strong);}
.asf-leader__face--back{
  transform:rotateY(180deg);background:var(--color-deep-sage);color:var(--color-text-on-dark);
  justify-content:center;text-align:left;align-items:flex-start;
}
.asf-leader__ph{
  width:92px;height:92px;border-radius:50%;margin-bottom:var(--space-md);flex:none;
  display:flex;align-items:center;justify-content:center;
  color:var(--color-deep-sage);background:var(--color-cream);border:1px solid var(--color-clay);
}
.asf-leader__ph svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.5;}
.asf-leader__face--front h3{font-size:17.5px;font-weight:600;margin-bottom:var(--space-2xs);}
.asf-leader__role{display:block;font-size:13px;color:var(--color-sage);font-family:var(--font-heading);font-weight:500;letter-spacing:.3px;}
.asf-leader__hint{
  position:absolute;bottom:var(--space-md);left:0;right:0;font-size:10.5px;letter-spacing:1.2px;
  text-transform:uppercase;font-family:var(--font-heading);font-weight:500;color:var(--color-text-muted);
}
.asf-leader__face--back p{font-size:14px;line-height:1.75;color:var(--color-text-on-dark);margin:0;}
.asf-leader__face--back .rule{width:30px;height:2px;background:var(--color-clay);margin:0 0 var(--space-sm);}

@media(hover:none){
  .asf-leader{height:auto;perspective:none;}
  .asf-leader__inner{transform:none;transform-style:flat;transition:none;}
  .asf-leader__face{position:static;-webkit-backface-visibility:visible;backface-visibility:visible;transform:none;}
  .asf-leader__face--front{border-radius:var(--radius-md) var(--radius-md) 0 0;border-bottom:0;}
  .asf-leader__face--back{
    background:var(--color-cream);color:var(--color-text-body);
    border:1px solid var(--color-border-strong);border-top:0;
    border-radius:0 0 var(--radius-md) var(--radius-md);
    padding-top:var(--space-md);
  }
  .asf-leader__face--back p{color:var(--color-text-body);}
  .asf-leader__hint{display:none;}
}

.asf-note{
  margin-top:var(--space-lg);display:inline-flex;align-items:center;gap:var(--space-xs);
  background:var(--color-white);border:1px solid var(--color-border-strong);
  color:var(--color-text-body);padding:var(--space-sm) var(--space-md);
  border-radius:var(--radius-sm);font-size:13.4px;
}
.asf-note b{font-family:var(--font-heading);font-weight:600;color:var(--color-deep-sage);}

/* ==========================================================================
   8 . CAREERS
   ========================================================================== */
.asf-careers{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:stretch;}
.asf-careers__media{position:relative;display:flex;min-height:480px;}
.asf-careers__media .asf-img{flex:1;}
.asf-values{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);margin-top:var(--space-lg);}
.asf-value{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);transition:border-color var(--transition-base) var(--ease);}
.asf-value:hover{border-color:var(--color-sage);}
.asf-sec--cream .asf-value{border-color:var(--color-border-strong);}
.asf-value b{display:block;font-family:var(--font-heading);font-size:14.5px;color:var(--color-deep-sage);margin-bottom:var(--space-2xs);font-weight:600;}
.asf-value p{font-size:13.8px;line-height:1.7;color:var(--color-text-muted);margin:0;}
.asf-roles{margin-top:var(--space-xl);border-top:1px solid var(--color-border);}
.asf-role{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-md) var(--space-2xs);border-bottom:1px solid var(--color-border);}
.asf-role b{font-family:var(--font-heading);font-size:15.5px;color:var(--color-deep-sage);font-weight:600;}
.asf-role span{display:block;font-size:13px;color:var(--color-text-muted);margin-top:2px;}
.asf-role em{font-style:normal;font-size:11px;font-family:var(--font-heading);font-weight:500;letter-spacing:.8px;text-transform:uppercase;color:var(--color-sage);border:1px solid var(--color-border-strong);padding:6px 11px;border-radius:var(--radius-sm);white-space:nowrap;}
.asf-cta-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-lg);flex-wrap:wrap;}
.asf-cta-row small{font-size:13px;color:var(--color-text-muted);max-width:46ch;line-height:1.7;}

/* ==========================================================================
   9 . FAQ
   ========================================================================== */
.asf-faq{max-width:880px;margin:0 auto;border-top:1px solid var(--color-border);}
.asf-faq__item{border-bottom:1px solid var(--color-border);}
.asf-faq__q{
  width:100%;background:none;border:0;cursor:pointer;text-align:left;
  min-height:48px;padding:var(--space-lg) var(--space-xl) var(--space-lg) 0;
  position:relative;display:block;
  font-family:var(--font-heading);font-weight:600;font-size:clamp(16px,1.5vw,17.5px);
  color:var(--color-deep-sage);line-height:1.5;transition:color var(--transition-base) var(--ease);
}
.asf-faq__q:hover{color:var(--color-sage);}
.asf-faq__q::before,.asf-faq__q::after{
  content:"";position:absolute;right:6px;top:50%;background:var(--color-sage);
  transition:transform var(--transition-base) var(--ease),opacity var(--transition-base) var(--ease);
}
.asf-faq__q::before{width:14px;height:2px;transform:translateY(-50%);}
.asf-faq__q::after{width:2px;height:14px;right:12px;transform:translateY(-50%);}
.asf-faq__item.is-open .asf-faq__q::after{transform:translateY(-50%) rotate(90deg);opacity:0;}
.asf-faq__a{overflow:hidden;height:0;transition:height var(--transition-slow) var(--ease-out);}
.asf-faq__a > div{padding:0 var(--space-2xl) var(--space-lg) 0;font-size:15.5px;line-height:1.85;color:var(--color-text-body);}

/* ==========================================================================
   10 . CONTACT FORM
   ========================================================================== */
.asf-contact-head{max-width:620px;margin:0 auto var(--space-xl);text-align:center;}
.asf-contact-head .asf-eyebrow::before{display:none;}
.asf-contact-head .asf-lede{margin:var(--space-sm) auto 0;}
.asf-form{
  max-width:840px;margin:0 auto;background:var(--color-white);
  border:1px solid var(--color-border-strong);border-radius:var(--radius-md);
  padding:var(--space-xl) var(--space-xl) var(--space-lg);
}
.asf-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);}
.asf-field{display:flex;flex-direction:column;gap:var(--space-xs);}
.asf-field--full{grid-column:1/-1;}
.asf-field label{font-family:var(--font-heading);font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--color-sage);font-weight:600;}
.asf-field label .req{color:var(--color-text-muted);font-weight:500;letter-spacing:0;text-transform:none;}
.asf-field input,.asf-field select,.asf-field textarea{
  font-family:var(--font-body);font-size:15px;font-weight:400;color:var(--color-deep-sage);
  background:var(--color-white);border:1px solid var(--color-border-strong);
  border-radius:var(--radius-sm);padding:13px 15px;width:100%;min-height:48px;
  transition:border-color var(--transition-base) var(--ease);
}
.asf-field input::placeholder,.asf-field textarea::placeholder{color:var(--color-text-muted);opacity:.75;}
.asf-field textarea{min-height:148px;resize:vertical;}
.asf-field input:focus,.asf-field select:focus,.asf-field textarea:focus{outline:none;border-color:var(--color-deep-sage);box-shadow:0 0 0 3px rgba(var(--deep-sage-rgb),.12);}
.asf-field [aria-invalid="true"]{border-color:var(--color-deep-sage);border-width:2px;}
.asf-field__error{
  display:none;font-size:13px;line-height:1.5;color:var(--color-deep-sage);
  font-weight:500;padding-left:var(--space-md);position:relative;
}
.asf-field__error::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:50%;background:var(--color-clay);}
.asf-field__error.is-on{display:block;}
.asf-form__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-lg);flex-wrap:wrap;}
.asf-form__foot small{font-size:13px;color:var(--color-text-muted);max-width:42ch;line-height:1.7;}
.asf-form__msg{
  display:none;margin-top:var(--space-md);padding:var(--space-sm) var(--space-md);
  border-radius:var(--radius-sm);font-size:14.5px;line-height:1.6;
  background:var(--color-cream);border-left:3px solid var(--color-sage);color:var(--color-deep-sage);
}
.asf-form__msg.is-on{display:block;}

/* ==========================================================================
   11 . MOTION - subtle, purposeful
   ========================================================================== */
.asf-rv{opacity:0;transform:translate3d(0,22px,0);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out);}
.asf-rv--l{transform:translate3d(-44px,0,0);}
.asf-rv--r{transform:translate3d(44px,0,0);}
.asf-rv.is-in{opacity:1;transform:none;}

.asf-rv--l .asf-img img,.asf-rv--r .asf-img img,
.asf-rv--l .a img,.asf-rv--r .a img,
.asf-rv--l .b img,.asf-rv--r .b img{transform:scale(1.1);transition:transform 1200ms var(--ease-out);}
.asf-rv--l.is-in .asf-img img,.asf-rv--r.is-in .asf-img img,
.asf-rv--l.is-in .a img,.asf-rv--r.is-in .a img,
.asf-rv--l.is-in .b img,.asf-rv--r.is-in .b img{transform:scale(1);}

.asf-rv[data-d="1"]{transition-delay:80ms;}
.asf-rv[data-d="2"]{transition-delay:160ms;}
.asf-rv[data-d="3"]{transition-delay:240ms;}
.asf-rv[data-d="4"]{transition-delay:320ms;}


/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media(max-width:1080px){
  .asf-pillars{grid-template-columns:repeat(2,1fr);}
  .asf-leaders{grid-template-columns:repeat(2,1fr);max-width:none;}
  .asf-gap__grid{grid-template-columns:repeat(2,1fr);}
  .asf-impact__grid{grid-template-columns:repeat(2,1fr);}
  .asf-story{grid-template-columns:1fr;gap:var(--space-xl);}
  .asf-story__collage{order:-1;max-width:620px;min-height:0;aspect-ratio:4/5;}
  .asf-story__collage .b{right:var(--space-sm);bottom:var(--space-sm);width:42%;}
  .asf-story{padding-bottom:0;}
  .asf-how,.asf-careers{grid-template-columns:1fr;gap:var(--space-xl);}
  .asf-how__media,.asf-careers__media{max-width:560px;min-height:0;aspect-ratio:4/5;}
  .asf-inset{width:40%;}
  .asf-inset--br{right:var(--space-sm);bottom:var(--space-sm);}
  .asf-inset--bl{left:var(--space-sm);bottom:var(--space-sm);}
  .asf-careers__media{aspect-ratio:5/4;}
  .asf-enabler{grid-template-columns:1fr;}
  .asf-enabler__media{min-height:230px;order:-1;}
  .asf-enabler__media::after{background:linear-gradient(0deg,var(--color-deep-sage) 0%,rgba(var(--deep-sage-rgb),.24) 100%);}
  .asf-rv--l,.asf-rv--r{transform:translate3d(0,26px,0);}
}
@media(max-width:900px){
  :root{--hd-h:68px;}
}
@media(max-width:820px){
  .asf-cycle{grid-template-columns:1fr;}
  .asf-cycle__link{flex-direction:row;padding:var(--space-2xs) 0;}
  .asf-cycle__link svg{transform:rotate(90deg);}
  .asf-story__collage .b{right:var(--space-sm);bottom:var(--space-sm);width:46%;border-width:5px;}
  .asf-story__badge{left:var(--space-sm);top:var(--space-sm);}
  .asf-gap,.asf-enabler__body,.asf-form{padding:var(--space-lg) var(--space-md);}
}
@media(max-width:560px){
  .asf-pillars,.asf-leaders,.asf-gap__grid,.asf-impact__grid,.asf-values,.asf-form__grid{grid-template-columns:1fr;}
  .asf-principle{grid-template-columns:1fr;gap:var(--space-2xs);}
  .asf-role{flex-direction:column;align-items:flex-start;gap:var(--space-sm);}
  .asf-quote{padding-left:var(--space-md);}
  .asf-faq__a > div{padding-right:var(--space-xs);}
  .asf-faq__q{padding-right:var(--space-lg);}
  .asf-leader{height:auto;}
  /* the hero strip stays a single row - stacking it pushes the hero past one screen */
  .asf-hero__strip{gap:var(--space-sm);}
  .asf-hero__stat{padding-right:var(--space-sm);}
  .asf-btn{width:100%;}
}
@media(prefers-reduced-motion:reduce){
  .asf-page *,.asf-page *::before,.asf-page *::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
  .asf-rv{opacity:1;transform:none;}
  .asf-leader:hover .asf-leader__inner,.asf-leader:focus-visible .asf-leader__inner{transform:none;}
  .asf-leader__face--back{position:static;transform:none;-webkit-backface-visibility:visible;backface-visibility:visible;}
  .asf-leader{height:auto;perspective:none;}
  .asf-leader__inner{transform-style:flat;}
  .asf-leader__face{position:static;transform:none;-webkit-backface-visibility:visible;backface-visibility:visible;}
}

/* ==========================================================================
   ROUND 5 ADDITIONS
   ========================================================================== */

/* ---- soft clay tint, derived from Clay + White (a warm blush background) ---- */
:root{ --tint-clay:#F6EAE7; }   /* Clay #D1ACA8 at ~28% over white */

/* ---- header dropdown: close on select, reopen on next hover ----
   Pure-CSS :hover keeps a mega panel open while the pointer is still over it,
   so after you click a link it lingers. A click adds .is-collapsed to force it
   shut; mouseleave clears the flag so the next hover behaves normally. */
.asf-nav-item.is-collapsed .asf-mega{opacity:0 !important;visibility:hidden !important;transform:translateY(6px) !important;}

/* ---- section background: warm blush for a highlighted editorial band ---- */
.asf-sec--blush{background:var(--tint-clay);}
.asf-sec--blush .asf-cycle__card,
.asf-sec--blush .asf-value{border-color:var(--color-border-strong);}
.asf-sec--blush .asf-leader__face--front{border-color:var(--color-border-strong);}

/* ---- Leadership: centre the heading and the grid ---- */
.asf-leaders--center{margin-left:auto;margin-right:auto;justify-content:center;}
.asf-head--center{margin-left:auto;margin-right:auto;text-align:center;}
.asf-head--center .asf-eyebrow{justify-content:center;}
.asf-head--center .asf-lede{margin-left:auto;margin-right:auto;}

/* ==========================================================================
   OUR VISION - statement + principles, image-led
   ========================================================================== */
.asf-vision{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--space-2xl);align-items:center;}
.asf-vision__statement{font-family:var(--font-body);font-weight:400;font-size:clamp(17px,1.5vw,20px);line-height:1.7;color:var(--color-text-body);}
.asf-vision__statement strong{color:var(--color-deep-sage);font-weight:500;}
.asf-vision__list{margin-top:var(--space-lg);display:grid;gap:2px;border-top:1px solid var(--color-border);}
.asf-vision__list li{
  display:grid;grid-template-columns:auto 1fr;gap:var(--space-md);align-items:baseline;
  padding:var(--space-md) 0;border-bottom:1px solid var(--color-border);
  font-family:var(--font-heading);font-weight:600;font-size:clamp(16px,1.5vw,18px);color:var(--color-deep-sage);
  transition:padding-left var(--transition-base) var(--ease);
}
.asf-vision__list li:hover{padding-left:var(--space-sm);}
.asf-vision__list .n{font-family:var(--font-heading);font-weight:600;font-size:12px;color:var(--color-sage);letter-spacing:1px;}
.asf-vision__media{position:relative;display:flex;}
.asf-vision__media .asf-img{flex:1;}

/* ==========================================================================
   OUR WORK - hero variant + goal blocks + checklist
   ========================================================================== */
/* a shorter hero than the full-screen About one - this is a section landing */
.asf-hero--short{min-height:auto;}
.asf-hero--short{min-height:100vh;min-height:100svh;}
/* the photo carries these heroes: no full-cover wash. Only a left gradient
   under the headline and a whisper at the top for the nav - the rest of the
   image stays clean and bright */
.asf-hero--short .asf-hero__media::after{
  background:
    linear-gradient(90deg,rgba(var(--deep-sage-rgb),.62) 0%,rgba(var(--deep-sage-rgb),.32) 38%,rgba(var(--deep-sage-rgb),0) 62%),
    linear-gradient(180deg,rgba(var(--deep-sage-rgb),.35) 0%,rgba(var(--deep-sage-rgb),0) 22%);
}
/* text block sits vertically centred in the hero, clear of the fixed header */
.asf-hero--short{align-items:center;}
.asf-hero--short .asf-hero__inner{padding:calc(var(--hd-h) + var(--space-md)) 0 var(--space-lg);}
.asf-hero--short .asf-hero__inner{padding:calc(var(--hd-h) + clamp(40px,9vh,86px)) 0 clamp(84px,14vh,150px);}

/* Sona Ugao feature: large image + a cream highlight panel that overlaps it */
.asf-feature{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--space-2xl);align-items:center;}
.asf-feature__media{position:relative;display:flex;min-height:540px;}
.asf-feature__media .asf-img{flex:1;}
.asf-feature__tag{
  position:absolute;left:calc(var(--space-lg) * -1);bottom:var(--space-lg);z-index:2;
  background:var(--color-clay);color:var(--color-deep-sage);
  font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;
  padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);
}
.asf-feature__points{margin-top:var(--space-lg);display:grid;gap:var(--space-md);}
.asf-feature__point{display:grid;grid-template-columns:auto 1fr;gap:var(--space-md);align-items:start;}
.asf-feature__point .ic{
  width:38px;height:38px;flex:none;border-radius:var(--radius-sm);background:var(--color-cream);
  display:flex;align-items:center;justify-content:center;color:var(--color-deep-sage);
}
.asf-feature__point .ic svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6;}
.asf-feature__point b{display:block;font-family:var(--font-heading);font-size:15.5px;font-weight:600;color:var(--color-deep-sage);margin-bottom:2px;}
.asf-feature__point p{font-size:14px;line-height:1.6;color:var(--color-text-muted);margin:0;}

/* goal block: alternating editorial rows, image collage + numbered checklist */
.asf-goal{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:center;}
.asf-goal + .asf-goal{margin-top:var(--space-3xl);}
.asf-goal__media{position:relative;display:flex;min-height:460px;}
.asf-goal__media .asf-img{flex:1;}
.asf-goal--flip .asf-goal__media{order:2;}
.asf-goal__num{
  font-family:var(--font-heading);font-weight:700;font-size:clamp(40px,5vw,64px);line-height:1;
  color:var(--color-clay);letter-spacing:-.02em;margin-bottom:var(--space-sm);
}
.asf-goal__tagline{
  font-family:var(--font-heading);font-weight:500;font-style:italic;
  font-size:clamp(15px,1.5vw,17px);color:var(--color-sage);margin:var(--space-sm) 0 var(--space-lg);
}
.asf-checklist{display:grid;gap:0;border-top:1px solid var(--color-border);}
.asf-checklist li{
  display:grid;grid-template-columns:auto 1fr;gap:var(--space-md);align-items:center;
  padding:var(--space-md) 0;border-bottom:1px solid var(--color-border);
  font-family:var(--font-heading);font-weight:500;font-size:clamp(15px,1.4vw,16.5px);color:var(--color-deep-sage);
  transition:padding-left var(--transition-base) var(--ease),color var(--transition-base) var(--ease);
}
.asf-checklist li:hover{padding-left:var(--space-sm);color:var(--color-sage);}
.asf-checklist .tick{
  width:26px;height:26px;flex:none;border-radius:50%;border:1.5px solid var(--color-clay);
  display:flex;align-items:center;justify-content:center;color:var(--color-sage);
  transition:background var(--transition-base) var(--ease),border-color var(--transition-base) var(--ease),color var(--transition-base) var(--ease);
}
.asf-checklist li:hover .tick{background:var(--color-clay);border-color:var(--color-clay);color:var(--color-deep-sage);}
.asf-checklist .tick svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;}

/* closing call-to-action band */
.asf-cta{text-align:center;max-width:640px;margin:0 auto;}
.asf-cta .asf-hero__cta{justify-content:center;margin-top:var(--space-lg);}

@media(max-width:1080px){
  .asf-vision,.asf-feature,.asf-goal{grid-template-columns:1fr;gap:var(--space-xl);}
  .asf-vision__media,.asf-feature__media,.asf-goal__media{order:-1;min-height:0;aspect-ratio:4/3;}
  .asf-goal--flip .asf-goal__media{order:-1;}
  .asf-feature__tag{left:var(--space-md);}
}
@media(max-width:560px){
  .asf-feature__point,.asf-vision__list li{grid-template-columns:1fr;gap:var(--space-2xs);}
  .asf-vision__list .n{display:none;}
}

/* ==========================================================================
   SONA UGAO PAGE
   ========================================================================== */

/* ---- problem / solution: fact list beside a photo ---- */
.su-split{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:center;}
.su-split--flip .su-split__media{order:2;}
.su-split__media{position:relative;display:flex;min-height:440px;}
.su-split__media .asf-img{flex:1;}
.su-split__badge{position:absolute;left:calc(var(--space-lg) * -1);bottom:var(--space-lg);z-index:2;background:var(--color-deep-sage);color:var(--color-white);font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);}
.su-split--flip .su-split__badge{left:auto;right:calc(var(--space-lg) * -1);}
.su-facts{display:grid;gap:var(--space-sm);margin-top:var(--space-lg);}
.su-fact{display:grid;grid-template-columns:auto 1fr;gap:var(--space-md);align-items:start;padding:var(--space-md) 0;border-bottom:1px solid var(--color-border);}
.su-fact:first-child{border-top:1px solid var(--color-border);}
.su-fact .n{font-family:var(--font-heading);font-weight:700;font-size:15px;color:var(--color-clay);}
.su-fact b{display:block;font-family:var(--font-heading);font-size:16.5px;font-weight:600;color:var(--color-deep-sage);margin-bottom:2px;}
.su-fact p{margin:0;font-size:14.5px;line-height:1.6;color:var(--color-text-muted);}

/* ---- gains grid (win-win) + cleaner air ---- */
.su-gains{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);}
.su-gain{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);transition:border-color var(--transition-base) var(--ease),transform var(--transition-base) var(--ease);}
.su-gain:hover{border-color:var(--color-sage);transform:translateY(-4px);}
.su-gain .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--color-cream);display:flex;align-items:center;justify-content:center;color:var(--color-deep-sage);margin-bottom:var(--space-sm);}
.su-gain .ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;}
.su-gain b{font-family:var(--font-heading);font-size:14.5px;font-weight:600;color:var(--color-deep-sage);line-height:1.35;}
.su-air{margin-top:var(--space-lg);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);}
.su-air__item{padding:var(--space-md) var(--space-lg);border-left:3px solid var(--color-clay);background:var(--color-white);border-radius:0 var(--radius-md) var(--radius-md) 0;}
.su-air__item b{display:block;font-family:var(--font-heading);font-size:15.5px;font-weight:600;color:var(--color-deep-sage);}
.su-air__item p{margin:2px 0 0;font-size:13.5px;color:var(--color-text-muted);line-height:1.55;}

/* ==========================================================================
   CARBON VILLAGE MODEL - interactive 3D diagram
   ========================================================================== */
.cv{position:relative;}
.cv__pills{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-sm);margin-bottom:var(--space-xl);}
.cv__pill{display:inline-flex;align-items:center;gap:8px;background:var(--color-white);border:1px solid var(--color-border-strong);border-radius:100px;padding:10px 20px;font-family:var(--font-heading);font-weight:600;font-size:13.5px;color:var(--color-deep-sage);}
.cv__pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--color-clay);}

.cv__grid{display:grid;grid-template-columns:minmax(0,208px) minmax(0,1fr) minmax(0,208px);gap:var(--space-md);align-items:stretch;}

.cv-rail{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);min-width:0;}
.cv-rail__head{display:flex;align-items:center;gap:8px;margin-bottom:var(--space-sm);}
.cv-rail__tag{font-family:var(--font-heading);font-weight:700;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--color-white);background:var(--color-clay);padding:4px 9px;border-radius:100px;}
.cv-rail--learn .cv-rail__tag{background:var(--color-deep-sage);}
.cv-rail__head h4{font-family:var(--font-heading);font-size:13px;font-weight:600;color:var(--color-deep-sage);line-height:1.3;}
.cv-rail__item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);font-size:13.5px;color:var(--color-text-body);transition:background var(--transition-base) var(--ease),transform var(--transition-base) var(--ease);}
.cv-rail__item::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--color-clay);flex:none;}
.cv-rail--learn .cv-rail__item::before{background:var(--color-sage);}
.cv-rail__item:hover{background:var(--color-cream);transform:translateX(3px);}
.cv-rail__item--lead{background:var(--color-deep-sage);color:var(--color-white);font-family:var(--font-heading);font-weight:600;}
.cv-rail__item--lead::before{background:var(--color-clay);}

/* ---- isometric 3D stage: elements arranged on a green diamond platform,
   connected by dotted arrows (matches the Carbon Village reference) ---- */
.cv-stage{position:relative;width:100%;max-width:860px;margin:0 auto;aspect-ratio:100/66;min-width:0;}
.cv-iso{position:absolute;left:50%;top:58%;width:80%;aspect-ratio:1;
  transform:translate(-50%,-50%) rotateX(55deg) rotateZ(-45deg);transform-style:preserve-3d;
  border-radius:9%;background:linear-gradient(150deg,#7f978a 0%,#5f7469 55%,#4c5e56 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.05);}
.cv-iso::before{content:"";position:absolute;inset:0;border-radius:inherit;background:#3a4842;transform:translateZ(-32px);}
.cv-iso::after{content:"";position:absolute;inset:0;border-radius:inherit;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0 1px,transparent 1px 46px),
             repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 46px);}
.cv-stagelabel{position:absolute;left:4%;top:3%;transform:none;z-index:4;
  background:rgba(58,72,66,.92);color:var(--color-cream);font-family:var(--font-heading);font-weight:600;
  font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;padding:6px 14px;border-radius:100px;}

/* dotted connector arrows */
.cv-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none;}
.cv-svg path.flow{fill:none;stroke:var(--color-clay);stroke-width:3;stroke-dasharray:2 9;stroke-linecap:round;animation:cvDash 20s linear infinite;}
@keyframes cvDash{to{stroke-dashoffset:-220;}}

/* a stage element standing on the platform */
.cv-node{position:absolute;transform:translate(-50%,-100%);z-index:2;width:clamp(66px,9vw,98px);cursor:default;}
.cv-node::after{content:"";position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:66%;height:15px;border-radius:50%;background:radial-gradient(closest-side,rgba(20,28,25,.4),transparent);z-index:-1;}
.cv-node__lift{display:flex;flex-direction:column;align-items:center;transition:transform var(--transition-slow) var(--ease-out);}
.cv-node__badge{width:26px;height:26px;border-radius:50%;background:var(--color-white);color:var(--color-deep-sage);font-family:var(--font-heading);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(20,28,25,.35);margin-bottom:-13px;position:relative;z-index:2;}
.cv-node__img{height:clamp(46px,6.4vw,70px);display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(0 12px 10px rgba(20,28,25,.4));transition:transform var(--transition-slow) var(--ease-out),filter var(--transition-slow) var(--ease);}
.cv-node__img img{max-height:100%;width:auto;}
.cv-node__label{margin-top:10px;font-family:var(--font-heading);font-weight:600;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--color-deep-sage);background:var(--color-white);border:1px solid var(--color-border-strong);padding:5px 11px;border-radius:100px;white-space:nowrap;transition:background var(--transition-base) var(--ease),color var(--transition-base) var(--ease),border-color var(--transition-base) var(--ease);}
.cv-node:hover .cv-node__lift,.cv-node:focus-visible .cv-node__lift{transform:translateY(-18px);}
.cv-node:hover .cv-node__img,.cv-node:focus-visible .cv-node__img{transform:scale(1.09);filter:drop-shadow(0 20px 14px rgba(20,28,25,.45));}
.cv-node:hover .cv-node__label,.cv-node:focus-visible .cv-node__label{background:var(--color-clay);border-color:var(--color-clay);color:var(--color-deep-sage);}
.cv-node:focus-visible{outline:none;}
.cv-node__cap{position:absolute;top:0;left:50%;transform:translate(-50%,-14px);z-index:5;width:160px;background:var(--color-white);color:var(--color-text-body);border-radius:var(--radius-sm);padding:10px 12px;font-size:12px;line-height:1.5;text-align:center;font-family:var(--font-body);box-shadow:var(--shadow-sm);opacity:0;visibility:hidden;transition:opacity var(--transition-base) var(--ease),transform var(--transition-base) var(--ease);pointer-events:none;}
.cv-node:hover .cv-node__cap,.cv-node:focus-visible .cv-node__cap{opacity:1;visibility:visible;transform:translate(-50%,-48px);}

/* node positions on the platform (base/ground point) */
.cv-node--01{left:19%;top:78%;}
.cv-node--02{left:34.5%;top:55%;}
.cv-node--03{left:50%;top:76%;}
.cv-node--04{left:65.5%;top:55%;}
.cv-node--05{left:81%;top:78%;}

/* floating value nodes */
.cv-float{position:absolute;z-index:3;transform:translate(-50%,-50%);transition:transform var(--transition-slow) var(--ease-out);}
.cv-float:hover{transform:translate(-50%,calc(-50% - 6px));}
.cv-float__chip{background:var(--color-deep-sage);color:var(--color-cream);border-radius:var(--radius-sm);padding:9px 13px;font-family:var(--font-heading);font-weight:600;font-size:11px;letter-spacing:.5px;text-transform:uppercase;box-shadow:0 12px 22px rgba(20,28,25,.32);display:flex;align-items:center;gap:7px;white-space:nowrap;}
.cv-float__chip svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7;}
.cv-float--co2{left:64%;top:9%;}
.cv-float--income{left:90%;top:40%;}

.cv-stake{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-top:var(--space-lg);}
.cv-stake__item{text-align:center;background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);transition:border-color var(--transition-base) var(--ease),transform var(--transition-base) var(--ease);}
.cv-stake__item:hover{border-color:var(--color-sage);transform:translateY(-4px);}
.cv-stake__ic{width:44px;height:44px;margin:0 auto var(--space-xs);border-radius:50%;background:var(--color-cream);display:flex;align-items:center;justify-content:center;color:var(--color-deep-sage);}
.cv-stake__ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6;}
.cv-stake__item b{font-family:var(--font-heading);font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--color-deep-sage);}
.cv-opbar{margin-top:var(--space-md);background:var(--color-deep-sage);border-radius:var(--radius-md);display:grid;grid-template-columns:repeat(3,1fr);}
.cv-opbar__item{padding:var(--space-md) var(--space-lg);border-right:1px solid rgba(255,255,255,.12);}
.cv-opbar__item:last-child{border-right:none;}
.cv-opbar__item span{display:block;font-family:var(--font-heading);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--color-clay);margin-bottom:4px;}
.cv-opbar__item b{font-family:var(--font-heading);font-size:15px;font-weight:600;color:var(--color-white);}

/* ==========================================================================
   BUILD - OPERATE - TRANSFER + 7-step
   ========================================================================== */
.su-bot{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);}
.su-phase{position:relative;background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);overflow:hidden;}
.su-phase::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--color-clay);}
.su-phase:nth-child(2)::before{background:var(--color-sage);}
.su-phase:nth-child(3)::before{background:var(--color-deep-sage);}
.su-phase__k{font-family:var(--font-heading);font-weight:700;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--color-sage);}
.su-phase h3{font-family:var(--font-heading);font-size:20px;font-weight:600;color:var(--color-deep-sage);margin:6px 0 4px;}
.su-phase__by{font-size:12.5px;color:var(--color-text-muted);margin-bottom:var(--space-md);}
.su-phase ul{display:grid;gap:10px;}
.su-phase li{position:relative;padding-left:22px;font-size:14px;line-height:1.55;color:var(--color-text-body);}
.su-phase li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:50%;background:var(--color-clay);}

.su-steps{margin-top:var(--space-2xl);display:grid;grid-template-columns:repeat(7,1fr);gap:var(--space-sm);counter-reset:step;}
.su-step{position:relative;text-align:center;padding-top:var(--space-lg);}
.su-step::before{counter-increment:step;content:"0" counter(step);position:absolute;top:0;left:50%;transform:translateX(-50%);font-family:var(--font-heading);font-weight:700;font-size:13px;color:var(--color-white);background:var(--color-deep-sage);width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:1;}
.su-step::after{content:"";position:absolute;top:15px;left:50%;width:100%;height:2px;background:repeating-linear-gradient(90deg,var(--color-border-strong) 0 5px,transparent 5px 10px);z-index:0;}
.su-step:last-child::after{display:none;}
.su-step b{display:block;font-family:var(--font-heading);font-size:13.5px;font-weight:600;color:var(--color-deep-sage);margin-top:var(--space-sm);line-height:1.35;}

/* ==========================================================================
   THE JOURNEY - vertical serpentine, scroll-animated
   ========================================================================== */
.su-journey{position:relative;max-width:880px;margin:0 auto;}
.su-journey__line{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:var(--color-border);z-index:0;}
.su-journey__fill{position:absolute;left:50%;top:0;width:2px;transform:translateX(-50%);background:var(--color-clay);z-index:1;height:0;transition:height 120ms linear;}
.su-jstep{position:relative;z-index:2;display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;margin-bottom:var(--space-xl);}
.su-jstep:last-child{margin-bottom:0;}
.su-jstep__dot{grid-column:2;justify-self:center;width:44px;height:44px;border-radius:50%;background:var(--color-white);border:2px solid var(--color-border-strong);color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:700;font-size:14px;transition:background var(--transition-base) var(--ease),border-color var(--transition-base) var(--ease),color var(--transition-base) var(--ease),transform var(--transition-base) var(--ease);}
.su-jstep.is-on .su-jstep__dot{background:var(--color-deep-sage);border-color:var(--color-deep-sage);color:var(--color-white);transform:scale(1.12);}
.su-jstep__card{grid-column:1;grid-row:1;background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);text-align:right;opacity:0;transform:translateX(-30px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);}
.su-jstep:nth-child(even) .su-jstep__card{grid-column:3;grid-row:1;text-align:left;transform:translateX(30px);}
.su-jstep.is-in .su-jstep__card{opacity:1;transform:none;}
.su-jstep__card .k{font-family:var(--font-heading);font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--color-clay);}
.su-jstep__card b{display:block;font-family:var(--font-heading);font-size:17px;font-weight:600;color:var(--color-deep-sage);margin:4px 0 6px;}
.su-jstep__card p{margin:0;font-size:14px;line-height:1.6;color:var(--color-text-muted);}

/* ==========================================================================
   FROM THE FIELD
   ========================================================================== */
.su-fieldstats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);margin-bottom:var(--space-2xl);}
.su-fieldstat{text-align:center;padding:var(--space-lg);background:var(--color-white);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);}
.su-fieldstat .v{font-family:var(--font-heading);font-weight:700;font-size:clamp(30px,4vw,44px);color:var(--color-deep-sage);line-height:1;display:flex;align-items:baseline;justify-content:center;gap:4px;}
.su-fieldstat .v .u{font-size:.4em;font-weight:600;color:var(--color-sage);}
.su-fieldstat .l{margin-top:var(--space-sm);font-size:13.5px;color:var(--color-text-muted);}
.su-field{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:center;}
.su-field__media{position:relative;display:flex;min-height:460px;}
.su-field__media .asf-img{flex:1;}
.su-setup{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md);margin-bottom:var(--space-lg);}
.su-setup__item{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);}
.su-setup__item .v{font-family:var(--font-heading);font-weight:700;font-size:20px;color:var(--color-deep-sage);}
.su-setup__item .l{font-size:12px;color:var(--color-text-muted);letter-spacing:.4px;text-transform:uppercase;margin-top:2px;}
.su-signs{margin-top:var(--space-md);}
.su-signs li{display:grid;grid-template-columns:auto 1fr;gap:var(--space-sm);align-items:center;padding:10px 0;border-bottom:1px solid var(--color-border);font-family:var(--font-heading);font-weight:500;font-size:15px;color:var(--color-deep-sage);}
.su-signs .tick{width:24px;height:24px;flex:none;border-radius:50%;background:var(--color-cream);color:var(--color-deep-sage);display:flex;align-items:center;justify-content:center;}
.su-signs .tick svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;}

/* ==========================================================================
   SONA UGAO - RESPONSIVE
   ========================================================================== */
@media(max-width:1080px){
  .su-split,.su-field{grid-template-columns:1fr;gap:var(--space-xl);}
  .su-split--flip .su-split__media,.su-split__media,.su-field__media{order:-1;min-height:0;aspect-ratio:4/3;}
  .su-split__badge,.su-split--flip .su-split__badge{left:var(--space-md);right:auto;}
  .su-gains{grid-template-columns:repeat(2,1fr);}
  .su-air{grid-template-columns:1fr;}
  .cv__grid{grid-template-columns:1fr;}
  .cv__grid .cv-rail--give{order:2;}
  .cv__grid .cv-stage{order:1;}
  .cv__grid .cv-rail--learn{order:3;}
  .cv-stage{aspect-ratio:100/66;}
  .su-steps{grid-template-columns:repeat(4,1fr);gap:var(--space-md);}
  .su-step::after{display:none;}
}
@media(max-width:820px){
  .su-bot{grid-template-columns:1fr;}
  .cv-stake{grid-template-columns:repeat(2,1fr);}
  .cv-opbar{grid-template-columns:1fr;}
  .cv-opbar__item{border-right:none;border-bottom:1px solid rgba(255,255,255,.12);}
  .cv-opbar__item:last-child{border-bottom:none;}
  .cv-node{width:clamp(64px,17vw,110px);}
  .cv-node__cap{display:none;}
  .su-journey__line,.su-journey__fill{left:22px;}
  .su-jstep{grid-template-columns:44px 1fr;gap:var(--space-md);}
  .su-jstep__dot{grid-column:1;}
  .su-jstep__card,.su-jstep:nth-child(even) .su-jstep__card{grid-column:2;grid-row:auto;text-align:left;transform:translateY(24px);}
  .su-field{gap:var(--space-lg);}
  .su-fieldstats{grid-template-columns:1fr;gap:var(--space-md);}
}
@media(max-width:560px){
  .su-gains{grid-template-columns:1fr;}
  .su-steps{grid-template-columns:repeat(2,1fr);}
  .cv-stake{grid-template-columns:1fr;}
  .su-setup{grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce){
  .cv-node__lift,.cv-float,.cv-node__img{transition:none;}
  .cv-svg path.flow{animation:none;}
}

/* ==========================================================================
   HOME HERO - animated photo collage
   An 8x4 mosaic of 23 field photographs behind the headline. Every tile has
   its own Deep Sage overlay; tiles take turns lighting up on a 41s cycle,
   and hovering any tile lights it immediately.
   ========================================================================== */
.hcol{position:absolute;inset:0;display:grid;
  grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(4,1fr);
  gap:5px;background:var(--color-deep-sage);grid-auto-flow:dense;}
.hcol__t{position:relative;overflow:hidden;}
.hcol__t img{width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.001);animation:hcolImg 41.4s linear infinite;animation-delay:var(--d);}
.hcol__t::after{content:"";position:absolute;inset:0;background:rgba(var(--deep-sage-rgb),.58);
  animation:hcolLite 41.4s linear infinite;animation-delay:var(--d);}
.hcol__t--big{grid-column:span 2;grid-row:span 2;}
.hcol__t--tall{grid-row:span 2;}
.hcol__t--wide{grid-column:span 2;}
.hcol__t:nth-child(1){--d:0.0s;}
.hcol__t:nth-child(2){--d:1.8s;}
.hcol__t:nth-child(3){--d:3.6s;}
.hcol__t:nth-child(4){--d:5.4s;}
.hcol__t:nth-child(5){--d:7.2s;}
.hcol__t:nth-child(6){--d:9.0s;}
.hcol__t:nth-child(7){--d:10.8s;}
.hcol__t:nth-child(8){--d:12.6s;}
.hcol__t:nth-child(9){--d:14.4s;}
.hcol__t:nth-child(10){--d:16.2s;}
.hcol__t:nth-child(11){--d:18.0s;}
.hcol__t:nth-child(12){--d:19.8s;}
.hcol__t:nth-child(13){--d:21.6s;}
.hcol__t:nth-child(14){--d:23.4s;}
.hcol__t:nth-child(15){--d:25.2s;}
.hcol__t:nth-child(16){--d:27.0s;}
.hcol__t:nth-child(17){--d:28.8s;}
.hcol__t:nth-child(18){--d:30.6s;}
.hcol__t:nth-child(19){--d:32.4s;}
.hcol__t:nth-child(20){--d:34.2s;}
.hcol__t:nth-child(21){--d:36.0s;}
.hcol__t:nth-child(22){--d:37.8s;}
.hcol__t:nth-child(23){--d:39.6s;}
@keyframes hcolLite{
  0%,.7%{background:rgba(63,77,72,.58);}
  1.6%,3.1%{background:rgba(63,77,72,.06);}
  4.4%,100%{background:rgba(63,77,72,.58);}
}
@keyframes hcolImg{
  0%,.7%{transform:scale(1.001);}
  1.6%,3.1%{transform:scale(1.07);}
  4.4%,100%{transform:scale(1.001);}
}
.hcol__t:hover::after{animation:none;background:rgba(63,77,72,.05);}
.hcol__t:hover img{animation:none;transform:scale(1.07);}
@media(max-width:820px){
  .hcol{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:4px;}
  .hcol__t--big,.hcol__t--tall,.hcol__t--wide{grid-column:auto;grid-row:auto;}
  .hcol__t:nth-child(n+13){display:none;}
}
@media(prefers-reduced-motion:reduce){
  .hcol__t img,.hcol__t::after{animation:none;}
  .hcol__t::after{background:rgba(63,77,72,.5);}
}

/* ==========================================================================
   HOME PAGE - round additions
   ========================================================================== */

/* hero headline, larger and on two lines */
.asf-hero--home h1{font-size:clamp(46px,6.8vw,88px);line-height:1.04;max-width:none;}

/* full off-screen slide-ins: the observed element stays put (so the
   IntersectionObserver can see it) and only fades; the inner .offx wrapper
   carries the big slide from outside the screen. */
.asf-rv--offl,.asf-rv--offr{opacity:0;transform:none;transition:opacity .7s var(--ease-out);}
.asf-rv--offl.is-in,.asf-rv--offr.is-in{opacity:1;}
.asf-rv--offl .offx{transform:translate3d(calc(-1 * min(46vw,540px)),0,0);transition:transform .95s var(--ease-out);}
.asf-rv--offr .offx{transform:translate3d(min(46vw,540px),0,0);transition:transform .95s var(--ease-out);}
.asf-rv--offl.is-in .offx,.asf-rv--offr.is-in .offx{transform:none;}
.asf-vision__media .offx,.hdo__media .offx{display:flex;flex:1;position:relative;}
/* the photo fills the column and crops to it - its intrinsic (portrait)
   height must never set the row height and push the section past one screen */
.asf-vision__media .offx .asf-img,.hdo__media .offx .asf-img{position:absolute;inset:0;}

/* stat row that holds four metrics */
.su-fieldstats--4{grid-template-columns:repeat(4,1fr);}
@media(max-width:1080px){.su-fieldstats--4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.su-fieldstats--4{grid-template-columns:1fr;}}

/* vision media matches the text column edge-to-edge */
.asf-vision{align-items:stretch;}
.asf-vision__media{min-height:0;}

/* ==========================================================================
   WHAT WE DO - Sona Ugao focus block
   ========================================================================== */
.hdo{display:grid;grid-template-columns:.95fr 1.05fr;gap:var(--space-2xl);align-items:stretch;}
.hdo__media{order:-1;}
.hdo__media{position:relative;display:flex;}
.hdo__media .asf-img{flex:1;}
.hdo__media .asf-img img{object-position:center center;}
.hdo__text{display:flex;flex-direction:column;justify-content:flex-start;}
/* the compact residue-to-crops flow */
.hflow{display:flex;align-items:center;gap:var(--space-2xs);margin:var(--space-lg) 0;flex-wrap:wrap;}
.hflow__s{flex:1;min-width:74px;display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:var(--space-2xs) 0;border:0;background:transparent;
  transition:transform var(--transition-base) var(--ease);}
.hflow__s:hover{transform:translateY(-6px);}
.hflow__s img{height:56px;width:auto;filter:drop-shadow(0 9px 7px rgba(20,28,25,.38));transition:transform var(--transition-base) var(--ease-out);}
.hflow__s:hover img{transform:translateY(-4px) scale(1.1);}
.hflow__s b{font-family:var(--font-heading);font-size:10.5px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--color-deep-sage);text-align:center;}
.hflow__a{flex:none;color:var(--color-clay);display:flex;align-items:center;}
.hflow__a svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
/* two facts under the flow */
.hdo__facts{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);margin-bottom:var(--space-lg);}
.hdo__fact{border:1px solid var(--color-border);border-left:3px solid var(--color-clay);border-radius:0 var(--radius-md) var(--radius-md) 0;padding:var(--space-sm) var(--space-md);background:var(--color-white);}
.hdo__fact b{display:block;font-family:var(--font-heading);font-size:14px;font-weight:600;color:var(--color-deep-sage);}
.hdo__fact p{margin:2px 0 0;font-size:13px;line-height:1.55;color:var(--color-text-muted);}
.hdo__cta{display:flex;flex-wrap:wrap;gap:var(--space-sm);}
.hdo__media .asf-inset{border-color:var(--color-white);}
.hdo__media .asf-inset img{object-position:center center;}
@media(max-width:1080px){
  .hdo{grid-template-columns:1fr;gap:var(--space-xl);}
  .hdo__media{order:-1;min-height:0;aspect-ratio:4/3;}
}
@media(max-width:560px){.hdo__facts{grid-template-columns:1fr;}}

/* ==========================================================================
   WORK-WITH-US BANNER - warm blush, decorative mark, inviting
   ========================================================================== */
.asf-banner{position:relative;overflow:hidden;background:var(--tint-clay);}
.asf-banner::before{content:"";position:absolute;right:clamp(12px,4vw,60px);top:50%;transform:translateY(-50%);
  height:82%;aspect-ratio:539/412;opacity:.15;pointer-events:none;
  background:url('../assets/images/asf-mark.png') center/contain no-repeat;}
.asf-banner__row{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr auto;gap:var(--space-xl);align-items:center;}
.asf-banner h2{font-size:clamp(28px,3.4vw,44px);}
.asf-banner .asf-lede{margin-top:var(--space-sm);}
.asf-banner__btns{display:flex;flex-direction:column;gap:var(--space-sm);align-items:stretch;}
.asf-banner__btns .asf-btn{justify-content:space-between;min-width:260px;}
.asf-btn--big{font-size:15.5px;padding:var(--space-md) var(--space-lg);}
@media(max-width:820px){
  .asf-banner__row{grid-template-columns:1fr;}
  .asf-banner__btns{flex-direction:row;flex-wrap:wrap;}
  .asf-banner::before{right:8px;opacity:.08;}
}

/* collage video tile */
.hcol__t video{width:100%;height:100%;object-fit:contain;background:#333F3A;display:block;}

/* ==========================================================================
   ONE-SCREEN SECTIONS - every home section fits inside a single viewport
   ========================================================================== */
/* on laptop-height screens, compress the vertical rhythm so a --fill
   section's content never exceeds 100svh */
@media (min-width:1081px) and (max-height:880px){
  .asf-sec--fill .asf-head{margin-bottom:var(--space-md);}
  .asf-sec--fill .asf-h2{font-size:clamp(24px,2.6vw,32px);}
  .asf-sec--fill .asf-lede{font-size:16px;}
  .asf-sec--fill .su-fieldstat{padding:var(--space-md);}
  .asf-sec--fill .su-fieldstat .v{font-size:clamp(28px,3.4vw,38px);}
  .asf-sec--fill .asf-vision__statement{font-size:clamp(16px,1.3vw,18px);line-height:1.6;}
  .asf-sec--fill .asf-vision__list{margin-top:var(--space-md);}
  .asf-sec--fill .asf-vision__list li{padding-block:var(--space-xs);}
  .asf-sec--fill .hflow{margin:var(--space-md) 0;}
  .asf-sec--fill .hdo__facts{margin-bottom:var(--space-md);}
  .asf-sec--fill .hdo__fact p{font-size:12.5px;}
}

@media (min-width:1081px) and (max-height:700px){
  .asf-sec--fill .asf-h2{font-size:clamp(22px,2.2vw,28px);}
  .asf-sec--fill .asf-vision__statement{font-size:15.5px;}
  .asf-sec--fill .asf-vision__list li{padding-block:var(--space-2xs);}
  .asf-sec--fill .su-fieldstat{padding:var(--space-sm);}
  .asf-sec--fill .hflow__s img{height:38px;}
}

@media (min-width:1081px) and (max-height:700px){
  .asf-banner.asf-sec--tight{padding:30px 0;}
  footer.asf-footer{padding-top:26px;padding-bottom:14px;font-size:14px;line-height:1.5;}
  footer.asf-footer .asf-inner{gap:40px;}
  footer.asf-footer .asf-bottom{margin-top:18px;padding-top:12px;}
}

/* ==========================================================================
   HOME - overlapping sheets (one background; sections slide over each other)
   ========================================================================== */
.home .sheet{position:relative;}
.home .sheet--dark{background:var(--color-deep-sage);}
.home .sheet--dark .asf-h2{color:var(--color-white);}
.home .sheet--dark .asf-lede{color:var(--color-text-on-dark);}
.home .sheet--dark .asf-vision__statement{color:var(--color-text-on-dark);}
.home .sheet--dark .asf-vision__statement strong{color:var(--color-white);}
.home .sheet--dark .asf-vision__list{border-top-color:rgba(255,255,255,.16);}
.home .sheet--dark .asf-vision__list li{border-bottom-color:rgba(255,255,255,.16);color:var(--color-text-on-dark);}
.home .sheet--dark .asf-vision__list li span:last-child{color:var(--color-text-on-dark);}
.home .sheet--dark .asf-vision__list .n{color:var(--color-clay);}
.home .sheet--dark .asf-link{color:var(--color-cream);border-bottom-color:var(--color-clay);}
.home .sheet--dark .asf-link:hover{color:var(--color-white);border-bottom-color:var(--color-white);}
.home .sheet--dark .hflow__s b{color:var(--color-white);}
.home .sheet--dark .asf-inset{border-color:var(--color-deep-sage);}
/* light-green sheet: default dark text on a pale-green ground */
.home .sheet--light{background:var(--color-green-light);}
.home .sheet--light .asf-h2{color:var(--color-deep-sage);}
.home .sheet--light .asf-vision__statement{color:var(--color-text-body);}
.home .sheet--light .asf-vision__statement strong{color:var(--color-deep-sage);}
.home .sheet--light .asf-inset{border-color:var(--color-green-light);}
.home.home .asf-banner.sheet--light{background:var(--color-green-light);}
.home .sheet--last{padding:0;background:transparent;}

/* who we are - text and photo left, 2x2 KPI cards right */
.wwa{display:grid;grid-template-columns:1.06fr .94fr;gap:var(--space-2xl);align-items:stretch;}
.wwa__photo{margin-top:var(--space-lg);aspect-ratio:16/7;}
.wwa__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.wwa__kpis{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:var(--space-md);align-self:stretch;}
.wwa__kpis .su-fieldstat{display:flex;flex-direction:column;justify-content:center;min-height:170px;
  padding:var(--space-lg) var(--space-md);
  box-shadow:0 2px 8px rgba(var(--deep-sage-rgb),.06);
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out);}
.wwa__kpis .su-fieldstat:hover{transform:translateY(-5px);box-shadow:0 18px 32px rgba(var(--deep-sage-rgb),.16);}
@media (max-width:1080px){
  .wwa{grid-template-columns:1fr;gap:var(--space-xl);}
  .wwa__kpis{grid-auto-rows:auto;}
}
@media (max-width:560px){.wwa__kpis{grid-template-columns:1fr;}}

/* quieter, more professional type scale on the home page */
.home .asf-hero--home h1{font-size:clamp(40px,4.6vw,66px);}
.home .asf-h2{font-size:clamp(22px,2.3vw,30px);}
.home .asf-lede{font-size:15.5px;line-height:1.7;}
.home .asf-vision__statement{font-size:clamp(15.5px,1.2vw,17px);line-height:1.65;}
.home .asf-eyebrow{font-size:11px;}
.home .su-fieldstat .v{font-size:clamp(26px,2.8vw,36px);}
.home .asf-banner h2{font-size:clamp(24px,2.8vw,36px);}

/* ==========================================================================
   HOME HERO - curtain reveal: two cream panels slide apart to uncover the
   collage. Pure transform animation (GPU-composited) - no repaints, no jank.
   The collage and headline never move.
   ========================================================================== */
.home .asf-hero--home .hcur{position:absolute;top:0;bottom:0;width:53%;
  background:var(--color-cream);z-index:5;pointer-events:none;will-change:transform;}
.home .asf-hero--home .hcur--l{left:0;border-radius:0 26px 26px 0;
  animation:hcurL 1.6s cubic-bezier(.72,0,.16,1) .6s both;}
.home .asf-hero--home .hcur--r{right:0;border-radius:26px 0 0 26px;
  animation:hcurR 1.6s cubic-bezier(.72,0,.16,1) .6s both;}
@keyframes hcurL{to{transform:translate3d(-102%,0,0);}}
@keyframes hcurR{to{transform:translate3d(102%,0,0);}}
@media(prefers-reduced-motion:reduce){
  .home .asf-hero--home .hcur{display:none;}
}

/* hcol explicit map - deterministic 9x4 placement on desktop */
@media(min-width:821px){
  .hcol__t:nth-child(1){grid-area:1/1/2/2;}
  .hcol__t:nth-child(2){grid-area:1/2/2/3;}
  .hcol__t:nth-child(3){grid-area:1/3/2/5;}
  .hcol__t:nth-child(4){grid-area:1/5/2/6;}
  .hcol__t:nth-child(5){grid-area:1/6/2/8;}
  .hcol__t:nth-child(6){grid-area:1/8/2/9;}
  .hcol__t:nth-child(7){grid-area:1/9/2/10;}
  .hcol__t:nth-child(8){grid-area:2/1/3/2;}
  .hcol__t:nth-child(9){grid-area:2/2/3/4;}
  .hcol__t:nth-child(10){grid-area:2/4/3/5;}
  .hcol__t:nth-child(11){grid-area:2/5/3/6;}
  .hcol__t:nth-child(12){grid-area:2/6/3/7;}
  .hcol__t:nth-child(13){grid-area:2/7/3/9;}
  .hcol__t:nth-child(14){grid-area:2/9/3/10;}
  .hcol__t:nth-child(15){grid-area:3/1/4/2;}
  .hcol__t:nth-child(16){grid-area:3/2/4/3;}
  .hcol__t:nth-child(17){grid-area:3/3/4/5;}
  .hcol__t:nth-child(18){grid-area:3/5/4/6;}
  .hcol__t:nth-child(19){grid-area:3/6/4/8;}
  .hcol__t:nth-child(20){grid-area:3/8/4/9;}
  .hcol__t:nth-child(21){grid-area:3/9/4/10;}
  .hcol__t:nth-child(22){grid-area:4/1/5/2;}
  .hcol__t:nth-child(23){grid-area:4/2/5/3;}
  .hcol__t:nth-child(24){grid-area:4/3/5/4;}
  .hcol__t:nth-child(25){grid-area:4/4/5/6;}
  .hcol__t:nth-child(26){grid-area:4/6/5/7;}
  .hcol__t:nth-child(27){grid-area:4/7/5/8;}
  .hcol__t:nth-child(28){grid-area:4/8/5/9;}
  .hcol__t:nth-child(29){grid-area:4/9/5/10;}
}
/* hero CTA buttons sit a touch lower */
.home .asf-hero--home .asf-hero__cta{margin-top:var(--space-xl);}

/* stagger for the extra collage tiles */
.hcol__t:nth-child(24){--d:.9s;}  .hcol__t:nth-child(25){--d:4.5s;}
.hcol__t:nth-child(26){--d:8.1s;} .hcol__t:nth-child(27){--d:11.7s;}
.hcol__t:nth-child(28){--d:15.3s;}.hcol__t:nth-child(29){--d:18.9s;}

/* ==========================================================================
   WHAT WE DO - full-width step model with hover explanations
   ========================================================================== */
.hflow--xl{justify-content:space-between;gap:var(--space-xs);margin:var(--space-md) 0 var(--space-lg);flex-wrap:nowrap;position:relative;z-index:7;}
.hflow--xl .hflow__s{min-width:0;padding:var(--space-xs) var(--space-2xs);position:relative;cursor:default;}
.hflow--xl .hflow__s img{height:clamp(56px,7.5vh,84px);}
.hflow--xl .hflow__s b{font-size:12px;letter-spacing:.6px;}
.hflow--xl .hflow__a svg{width:20px;height:20px;}
.hflow--xl .hflow__s .tip{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%,6px);
  width:200px;background:var(--color-white);color:var(--color-text-body);font-size:12.5px;line-height:1.5;
  padding:10px 12px;border-radius:var(--radius-md);box-shadow:0 14px 30px rgba(16,24,21,.35);
  opacity:0;visibility:hidden;pointer-events:none;z-index:6;text-align:center;
  transition:opacity .25s var(--ease-out),transform .25s var(--ease-out),visibility .25s;}
.hflow--xl .hflow__s:hover .tip,.hflow--xl .hflow__s:focus-visible .tip{opacity:1;visibility:visible;transform:translate(-50%,0);}
.hflow--xl .hflow__s--btn{background:transparent;border-radius:var(--radius-md);
  padding:var(--space-xs) var(--space-sm);text-decoration:none;
  transition:transform var(--transition-base) var(--ease),background var(--transition-base) var(--ease);}

.hflow--xl .hflow__s--btn:hover{transform:translateY(-6px);}
@media(max-width:1080px){.hflow--xl{flex-wrap:wrap;justify-content:center;}}

/* compact split under the model */
.hdo__media{min-height:min(300px,38vh);}
@media (min-width:1081px) and (max-height:880px){
  .asf-sec--fill .hflow--xl{margin:var(--space-sm) 0 var(--space-md);}
  .asf-sec--fill .hflow--xl .hflow__s img{height:clamp(48px,6.5vh,64px);}
}

/* ==========================================================================
   HOME PILLARS - four cards with a 3D highlight lift
   ========================================================================== */
.hpills{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg);perspective:1200px;}
.hpill{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:#33403A;
  border:1px solid rgba(255,255,255,.10);cursor:default;transform-style:preserve-3d;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out),border-color .4s var(--ease-out);}
.hpill:hover,.hpill:focus-visible{transform:translateY(-10px) rotateX(4deg) scale(1.02);
  box-shadow:0 30px 50px -18px rgba(0,0,0,.6);border-color:var(--color-clay);outline:none;}
.hpill__media{position:relative;aspect-ratio:4/3;overflow:hidden;}
.hpill__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out);}
.hpill:hover .hpill__media img{transform:scale(1.08);}
.hpill__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--deep-sage-rgb),0) 40%,rgba(var(--deep-sage-rgb),.85) 100%);}
.hpill__no{position:absolute;top:12px;left:12px;z-index:2;font-family:var(--font-heading);font-weight:700;
  font-size:13px;letter-spacing:1px;color:var(--color-cream);background:rgba(var(--deep-sage-rgb),.7);
  border-radius:20px;padding:4px 12px;}
.hpill__body{padding:var(--space-md);}
.hpill__body h3{font-family:var(--font-heading);font-weight:600;font-size:16px;color:var(--color-white);margin:0;line-height:1.25;}
.hpill__body p{margin:8px 0 0;font-size:13px;line-height:1.55;color:var(--color-text-on-dark);}
@media(max-width:1080px){.hpills{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.hpills{grid-template-columns:1fr;}}
@media (min-width:1081px) and (max-height:880px){
  .asf-sec--fill .hpill__media{aspect-ratio:16/10;}
  .asf-sec--fill .hpill__body{padding:var(--space-sm) var(--space-md);}
  .asf-sec--fill .hpill__body p{font-size:12.5px;}
}

/* ==========================================================================
   SONA MODEL - grass bed with larger, uniform standing elements
   ========================================================================== */
.hflow--grass{margin:var(--space-md) 0 var(--space-xl);padding:var(--space-md) 0;background:transparent;}
.hflow--grass .hflow__s img{height:clamp(128px,18vh,210px);filter:drop-shadow(0 16px 13px rgba(10,20,12,.45));}
.hflow--grass .hflow__s b,.hflow--grass .hflow__s--btn b{color:var(--color-white);text-shadow:0 1px 4px rgba(0,0,0,.5);}
.hflow--grass .hflow__a svg{width:22px;height:22px;stroke:var(--color-cream);}
.hdo__cta--center{justify-content:center;}
@media (min-width:1081px) and (max-height:880px){
  .asf-sec--fill .hflow--grass{padding:var(--space-md) var(--space-md) var(--space-sm);margin:var(--space-xs) 0 var(--space-md);}
  .asf-sec--fill .hflow--grass .hflow__s img{height:clamp(104px,14vh,150px);}
}

/* pillars section fills the viewport; cards grow to fill the height */
#pillars{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;}
#pillars .asf-wrap{width:100%;}
#pillars .hpills{margin-top:var(--space-xl);}
#pillars .hpill{display:flex;flex-direction:column;}
#pillars .hpill__media{aspect-ratio:auto;flex:1;min-height:clamp(220px,42vh,460px);position:relative;}
#pillars .hpill__media img{position:absolute;inset:0;}
@media(max-width:1080px){#pillars{min-height:0;display:block;}#pillars .hpill__media{min-height:200px;}}

/* single fact box with the CTA beside it */
.hdo__facts--row{display:flex;align-items:stretch;gap:var(--space-lg);grid-template-columns:none;}
.hdo__facts--row .hdo__fact{flex:1;}
.hdo__facts--row .hdo__cta-btn{align-self:center;white-space:nowrap;}
@media(max-width:640px){.hdo__facts--row{flex-direction:column;align-items:flex-start;}}

/* single full-width fact box, CTA below */
.hdo__facts--full{display:block;margin-bottom:var(--space-md);}
.hdo__facts--full .hdo__fact{width:100%;}

/* ==========================================================================
   ABOUT - dropdown 3-column grid, dark model band, community dashboard
   ========================================================================== */
.asf-mega-col--grid{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:0 48px;min-width:520px;}
.asf-mega-col--grid h4{grid-column:1/-1;}
.asf-mega-col--grid a.link{margin-bottom:14px;}

.about-model{background:var(--color-deep-sage);}
.about-model .asf-eyebrow{color:var(--color-clay);}
.about-model .asf-h2{color:var(--color-white);}
.about-model .asf-lede{color:var(--color-text-on-dark);}
.about-model .hflow--grass{margin-top:var(--space-xl);}

/* community dashboard */
.comm-live{display:inline-flex;align-items:center;gap:8px;background:var(--color-white);border:1px solid var(--color-border);
  border-radius:24px;padding:6px 14px;font-family:var(--font-heading);font-weight:600;font-size:11px;letter-spacing:1.4px;color:var(--color-deep-sage);}
.comm-live::before{content:"";width:8px;height:8px;border-radius:50%;background:#3FAE5A;box-shadow:0 0 0 4px rgba(63,174,90,.18);}
.comm-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:var(--space-xl);align-items:stretch;margin-top:var(--space-xl);}
.comm-map{position:relative;min-height:360px;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border-strong);}
.comm-map img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.comm-kpis{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);}
.comm-kpi{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);
  padding:var(--space-lg);display:flex;flex-direction:column;justify-content:center;
  transition:transform var(--transition-base) var(--ease),box-shadow var(--transition-base) var(--ease);}
.comm-kpi:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(var(--deep-sage-rgb),.12);}
.comm-kpi b{font-family:var(--font-heading);font-weight:700;font-size:clamp(26px,3vw,38px);color:var(--color-deep-sage);
  line-height:1;display:flex;align-items:baseline;gap:5px;}
.comm-kpi b i{font-style:normal;font-size:.42em;font-weight:600;color:var(--color-sage);}
.comm-kpi span{margin-top:10px;font-size:13px;line-height:1.4;color:var(--color-text-muted);}
.comm-status{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-top:var(--space-lg);}
.comm-stat{background:var(--color-deep-sage);color:var(--color-white);border-radius:var(--radius-md);padding:var(--space-md) var(--space-sm);text-align:center;}
.comm-stat b{display:block;font-family:var(--font-heading);font-weight:700;font-size:clamp(22px,2.4vw,32px);line-height:1;}
.comm-stat b i{font-style:normal;font-size:.5em;color:var(--color-clay);}
.comm-stat span{display:block;margin-top:8px;font-size:12px;color:var(--color-text-on-dark);}
@media(max-width:900px){.comm-grid{grid-template-columns:1fr;}.comm-status{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.comm-kpis{grid-template-columns:1fr;}.comm-status{grid-template-columns:1fr;}.asf-mega-col--grid{grid-template-columns:1fr 1fr;min-width:0;}}

/* About vision - compressed to fit one screen */
#our-vision{padding-top:clamp(36px,4.5vh,60px);padding-bottom:clamp(36px,4.5vh,60px);}
#our-vision .asf-head{margin-bottom:var(--space-md);}
#our-vision .asf-h2{font-size:clamp(24px,2.6vw,32px);}
#our-vision .asf-vision{align-items:center;}
#our-vision .asf-vision__statement{font-size:clamp(14.5px,1.15vw,16px);line-height:1.55;}
#our-vision .asf-vision__list{margin-top:var(--space-md);}
#our-vision .asf-vision__list li{padding-block:var(--space-xs);}
#our-vision .asf-vision__media{max-height:74vh;}
@media(min-width:821px) and (max-height:820px){
  #our-vision .asf-vision__statement{font-size:14px;line-height:1.5;}
  #our-vision .asf-vision__list li{padding-block:6px;font-size:14px;}
}

/* ABOUT v2 - alternating dark/white sections, community, leadership, contact */
.sec-light{background:var(--color-white);}
.sec-dark{background:var(--color-deep-sage);}
.sec-dark .asf-h2,.sec-dark .asf-h3,.sec-dark h2,.sec-dark h3,.sec-dark h4{color:var(--color-white);}
.sec-dark .asf-eyebrow{color:var(--color-clay);}
.sec-dark .asf-lede,.sec-dark p,.sec-dark li{color:var(--color-text-on-dark);}
.sec-dark .asf-link{color:var(--color-cream);border-bottom-color:var(--color-clay);}
.sec-dark .asf-principle{border-color:rgba(255,255,255,.16);}
.sec-dark .asf-principle__n{color:var(--color-clay);}
.sec-dark .asf-faq__item{border-color:rgba(255,255,255,.16);}
.sec-dark .asf-faq__q{color:var(--color-white);}
.sec-dark .asf-faq__q::after{color:var(--color-clay);}
.sec-dark .asf-faq__a{color:var(--color-text-on-dark);}
.sec-dark .asf-odo,.sec-dark .asf-stat b{color:var(--color-white);}

/* community - field-book hero + kpis */
.comm-hero{position:relative;margin-top:var(--space-xl);border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--color-border-strong);box-shadow:0 24px 44px -28px rgba(16,24,21,.5);}
.comm-hero img{display:block;width:100%;height:auto;}
.comm-hero__tag{position:absolute;left:0;bottom:0;background:rgba(var(--deep-sage-rgb),.92);color:#fff;
  padding:var(--space-sm) var(--space-lg);border-radius:0 var(--radius-md) 0 0;}
.comm-hero__tag b{display:block;font-family:var(--font-heading);font-weight:600;font-size:15px;}
.comm-hero__tag span{font-size:12.5px;color:var(--color-text-on-dark);}
.comm-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-md);margin-top:var(--space-lg);}
.comm-kpi{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);
  padding:var(--space-md);display:flex;flex-direction:column;justify-content:center;
  transition:transform var(--transition-base) var(--ease),box-shadow var(--transition-base) var(--ease);}
.comm-kpi:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(var(--deep-sage-rgb),.12);}
.comm-kpi b{font-family:var(--font-heading);font-weight:700;font-size:clamp(22px,2.2vw,30px);color:var(--color-deep-sage);line-height:1;display:flex;align-items:baseline;gap:4px;}
.comm-kpi b i{font-style:normal;font-size:.42em;font-weight:600;color:var(--color-sage);}
.comm-kpi span{margin-top:8px;font-size:12px;line-height:1.35;color:var(--color-text-muted);}
.comm-status{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-top:var(--space-md);}
.comm-stat{background:var(--color-deep-sage);color:#fff;border-radius:var(--radius-md);padding:var(--space-md) var(--space-sm);text-align:center;}
.comm-stat b{display:block;font-family:var(--font-heading);font-weight:700;font-size:clamp(22px,2.2vw,30px);line-height:1;}
.comm-stat b i{font-style:normal;font-size:.5em;color:var(--color-clay);}
.comm-stat span{display:block;margin-top:6px;font-size:11.5px;color:var(--color-text-on-dark);}
@media(max-width:1000px){.comm-kpis{grid-template-columns:repeat(3,1fr);}.comm-status{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.comm-kpis{grid-template-columns:1fr 1fr;}}

/* leadership - green board-style cards */
.lead-cards{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-2xl);margin-top:var(--space-xl);}
.lead-card{position:relative;width:340px;max-width:100%;aspect-ratio:3/4;border-radius:20px;overflow:hidden;
  background:var(--color-deep-sage);cursor:default;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out);}
.lead-card:hover,.lead-card:focus-visible{transform:translateY(-8px);box-shadow:0 30px 50px -22px rgba(16,24,21,.55);outline:none;}
.lead-card__wm{position:absolute;top:0;right:12px;writing-mode:vertical-rl;font-family:var(--font-heading);font-weight:800;
  font-size:52px;letter-spacing:2px;color:rgba(255,255,255,.08);text-transform:lowercase;line-height:1;user-select:none;z-index:1;}
.lead-card__photo{position:absolute;inset:14px 14px 0 14px;border-radius:14px 14px 0 0;overflow:hidden;z-index:2;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%);}
.lead-card__photo img{width:100%;height:100%;object-fit:cover;object-position:center top;
  transition:transform .5s var(--ease-out);}
.lead-card:hover .lead-card__photo img{transform:scale(1.05);}
.lead-card__name{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:var(--space-md) var(--space-lg) var(--space-lg);
  background:linear-gradient(0deg,var(--color-deep-sage) 55%,rgba(var(--deep-sage-rgb),0));}
.lead-card__name h3{margin:0;font-family:var(--font-heading);font-weight:700;font-size:22px;color:#fff;}
.lead-card__name span{display:block;margin-top:3px;font-size:13px;letter-spacing:.5px;color:var(--color-clay);}
.lead-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:var(--color-clay);z-index:4;}

/* contact - compact, one screen */
.contact-compact .asf-form{max-width:680px;margin:var(--space-lg) auto 0;}
.contact-compact .asf-form__grid{grid-template-columns:1fr 1fr;}
.contact-compact .asf-field--full{grid-column:1/-1;}
.contact-compact textarea{min-height:110px;}

/* ==========================================================================
   SONA UGAO - framed-panel hero (layout replicated from reference design)
   Ground + rounded image panel, left scrim, headline/sub, right dot rail.
   Accent kept on the ASF palette (clay) rather than the reference pink.
   ========================================================================== */
.su-fp-stage{position:relative;z-index:1;min-height:100vh;min-height:100svh;display:flex;
  background:var(--color-white);
  padding:clamp(14px,1.8vw,20px) clamp(16px,3vw,40px) clamp(18px,3vw,40px);}
.su-fp-stage::before{content:"";position:absolute;top:-160px;right:-160px;width:660px;height:660px;
  border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(230,175,120,.16) 0%,rgba(230,175,120,0) 68%);}
.su-fp-frame{flex:1;position:relative;z-index:1;}
.su-fp-panel{position:absolute;inset:0;border-radius:var(--radius-lg);overflow:hidden;background:#ECE7DF;
  box-shadow:0 30px 60px -30px rgba(16,24,21,.5);}
.su-fp-media{position:absolute;inset:0;}
.su-fp-media img{width:100%;height:100%;object-fit:cover;display:block;}
.su-fp-scrim{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(100deg,rgba(22,15,10,.82) 0%,rgba(22,15,10,.44) 30%,rgba(22,15,10,0) 60%),
             linear-gradient(to top,rgba(22,15,10,.55) 0%,rgba(22,15,10,0) 42%);}
.su-fp-overlay{position:absolute;z-index:5;left:clamp(20px,6%,74px);top:50%;transform:translateY(-34%);
  max-width:min(680px,54%);}
.su-fp-eyebrow{color:var(--color-clay);}
.su-fp-headline{margin:.4em 0 .48em;font-family:var(--font-heading);font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;line-height:1.03;
  font-size:clamp(28px,4vw,58px);color:var(--color-white);text-shadow:0 2px 22px rgba(0,0,0,.35);}
.su-fp-headline em{font-style:normal;color:var(--color-cream);}
.su-fp-sub{margin:0 0 1.5em;font-family:var(--font-body);font-weight:400;
  font-size:clamp(15px,1.3vw,20px);line-height:1.5;color:rgba(255,255,255,.86);
  max-width:38ch;text-shadow:0 1px 12px rgba(0,0,0,.3);}
.su-fp-cta{display:flex;flex-wrap:wrap;gap:var(--space-sm);}
.su-fp-rail{position:absolute;z-index:6;right:clamp(18px,2vw,34px);top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;align-items:center;gap:16px;pointer-events:none;}
.su-fp-dots{display:flex;flex-direction:column;gap:12px;}
.su-fp-dot{width:13px;height:13px;border-radius:50%;background:transparent;border:1.6px solid rgba(255,255,255,.6);}
.su-fp-dot.is-on{background:var(--color-clay);border-color:var(--color-clay);}
.su-fp-arrows{display:flex;flex-direction:column;gap:4px;margin-top:6px;}
.su-fp-arrow{width:30px;height:26px;display:grid;place-items:center;color:#fff;opacity:.85;}
.su-fp-arrow svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;}
@media(max-width:820px){
  .su-fp-stage{min-height:78vh;padding:calc(var(--hd-h) + 10px) 14px 18px;}
  .su-fp-overlay{max-width:88%;transform:translateY(-20%);}
  .su-fp-sub{max-width:92%;}
  .su-fp-rail{right:12px;}
}

/* framed hero - top-left notch that merges the logo, and header made to sit
   over the panel (transparent at top, dark logo on the cream notch) */
.su-fp-notch{position:absolute;top:0;left:0;z-index:4;
  width:clamp(210px,20%,300px);height:calc(var(--hd-h) + 12px);
  background:var(--color-white);border-radius:var(--radius-lg) 0 var(--radius-lg) 0;}
/* SONA framed page - header merge (only while at the top, not stuck) */
.sona-fp .asf-header:not(.is-stuck)::before{opacity:0;}
.sona-fp .asf-header:not(.is-stuck) .asf-logo .wm .n1{color:var(--color-deep-sage);}
.sona-fp .asf-header:not(.is-stuck) .asf-logo .wm .n2{color:rgba(63,77,72,.6);}
.sona-fp .asf-header:not(.is-stuck) .asf-nav-link{text-shadow:0 1px 6px rgba(0,0,0,.55);}
@media(max-width:820px){
  .su-fp-notch{width:clamp(180px,54%,260px);height:calc(var(--hd-h) + 8px);}
}

/* logo card (compact, darker clay) - replaces the wide panel notch */
.su-fp-notch{display:none;}
.sona-fp .asf-header:not(.is-stuck) .asf-logo{
  background:#A97C78;padding:8px 20px 9px 16px;border-radius:14px 14px 26px 14px;
  box-shadow:0 12px 26px -12px rgba(16,24,21,.55);}
.sona-fp .asf-header:not(.is-stuck) .asf-logo .wm .n1{color:#fff;}
.sona-fp .asf-header:not(.is-stuck) .asf-logo .wm .n2{color:rgba(255,255,255,.72);}
/* lift the hero copy so both CTAs sit clear of the panel's bottom edge */
.su-fp-overlay{transform:translateY(-40%);}
.su-fp-cta{margin-top:var(--space-lg);}

/* ABOUT one-screen sections + vision stack + community slider + FAQ grid */
.about-fit{min-height:100vh;min-height:100svh;display:flex;align-items:center;}
.about-fit > .asf-wrap{width:100%;}

#our-vision .asf-vision{align-items:stretch;}
.asf-vision__media--stack{display:grid;grid-template-rows:1fr 1fr;gap:var(--space-md);min-height:0;}
.asf-vision__media--stack .asf-img{position:relative;overflow:hidden;border-radius:var(--radius-lg);min-height:0;}
.asf-vision__media--stack .asf-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

.comm-wall{margin-top:var(--space-lg);border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--color-border-strong);height:clamp(220px,34vh,340px);}
.comm-wall img{width:100%;height:100%;object-fit:cover;object-position:center;}
.comm-slider{overflow:hidden;margin-top:var(--space-lg);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);}
.comm-track{display:flex;gap:var(--space-md);width:max-content;animation:commslide 40s linear infinite;}
.comm-slider:hover .comm-track{animation-play-state:paused;}
@keyframes commslide{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.comm-card{flex:0 0 auto;min-width:180px;background:var(--color-white);border:1px solid var(--color-border);
  border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);}
.comm-card b{display:block;font-family:var(--font-heading);font-weight:700;font-size:clamp(24px,2.3vw,32px);
  color:var(--color-deep-sage);line-height:1;}
.comm-card b i{font-style:normal;font-size:.5em;color:var(--color-sage);}
.comm-card span{display:block;margin-top:8px;font-size:12.5px;color:var(--color-text-muted);}
@media(prefers-reduced-motion:reduce){.comm-track{animation:none;}}

#faqs .asf-faq{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm) var(--space-xl);}

@media(min-width:821px) and (max-height:840px){
  .about-fit .asf-h2{font-size:clamp(26px,2.3vw,33px);}
  #our-vision .asf-vision__statement{font-size:14.5px;line-height:1.5;}
  #our-vision .asf-vision__list li{padding-block:6px;font-size:14px;}
  .comm-wall{height:clamp(180px,26vh,280px);}
  .comm-card{padding:var(--space-sm) var(--space-md);min-width:158px;}
  #faqs .asf-faq__q{font-size:14px;}
}
@media(max-width:760px){#faqs .asf-faq{grid-template-columns:1fr;}}

/* ABOUT short-screen fit tweaks (hero + leadership one-screen) */
@media(min-width:821px) and (max-height:860px){
  .asf-hero__inner{padding-top:calc(var(--hd-h) + 14px);padding-bottom:var(--space-lg);}
  .asf-hero .asf-h1{font-size:clamp(32px,4.2vw,50px);}
  .asf-hero__lede{font-size:15px;line-height:1.5;}
  .asf-hero__strip{margin-top:var(--space-md);}
  .asf-hero__strip b{font-size:clamp(24px,2.8vw,36px);}
  #leadership .lead-card{width:300px;}
  #leadership .asf-head{margin-bottom:var(--space-md);}
}

/* about hero: keep within one screen up to 1080h */
@media(min-width:821px) and (max-height:1080px){
  #top .asf-hero__inner,.asf-page .asf-hero__inner{padding-top:calc(var(--hd-h) + 16px);padding-bottom:clamp(28px,4vh,56px);}
}

/* ABOUT v3 - community two-col (picture full + kpis), impact on light */
.comm-two{display:grid;grid-template-columns:1.12fr .88fr;gap:var(--space-2xl);align-items:center;margin-top:var(--space-lg);}
.comm-two__media{border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,.15);}
.comm-two__media .offx{display:block;}
.comm-two__media img{width:100%;height:auto;display:block;}
.comm-two__text .offx{display:block;}
.comm-two__text .asf-eyebrow{color:var(--color-clay);}
.comm-kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);margin-top:var(--space-lg);}
.comm-kpi{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);}
.comm-kpi b{display:block;font-family:var(--font-heading);font-weight:700;font-size:clamp(22px,2vw,30px);color:var(--color-deep-sage);line-height:1;}
.comm-kpi b i{font-style:normal;font-size:.42em;font-weight:600;color:var(--color-sage);}
.comm-kpi span{display:block;margin-top:6px;font-size:12px;color:var(--color-text-muted);}
.sec-dark .asf-vision__statement strong{color:var(--color-white);}
.sec-dark .asf-vision__list li span:last-child{color:var(--color-text-on-dark);}
.sec-dark .asf-vision__list .n{color:var(--color-clay);}
.sec-light .asf-impact__num,.sec-light .asf-impact__num .asf-odo{color:var(--color-deep-sage);}
.sec-light .asf-impact__lab,.sec-light .asf-impact__note{color:var(--color-text-muted);}
@media(max-width:900px){.comm-two{grid-template-columns:1fr;}.comm-kpi-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:821px) and (max-height:860px){
  .comm-two{gap:var(--space-xl);}
  .comm-kpi{padding:var(--space-sm) var(--space-md);}
  .comm-kpi-grid{margin-top:var(--space-md);gap:var(--space-sm);}
}

/* ABOUT v4 - vision no divider lines; community image lined up top/bottom */
#our-vision .asf-vision__list,#our-vision .asf-vision__list li{border:none;}
#our-vision .asf-vision__list li{padding-block:8px;}
.comm-two{align-items:stretch;}
.comm-two__media{position:relative;}
.comm-two__media .offx{position:absolute;inset:0;}
.comm-two__media .offx img{width:100%;height:100%;object-fit:cover;object-position:center top;}
.comm-kpi-grid{grid-template-columns:1fr 1fr;}

/* ABOUT v5 - vision image not cropped; community enlarged + animated cards */
#our-vision .asf-vision__media .asf-img{background:var(--color-mist);}
#our-vision .asf-vision__media .asf-img img{object-fit:contain;object-position:center;}

#community .comm-two{grid-template-columns:1.12fr .88fr;gap:var(--space-2xl);}
#community .comm-two__media{min-height:min(62vh,560px);}
#community .comm-two__text .asf-h2{font-size:clamp(30px,3.2vw,44px);}
#community .comm-two__text .asf-lede{font-size:clamp(15px,1.15vw,16.5px);max-width:44ch;}
#community .comm-kpi-grid{gap:var(--space-lg);margin-top:var(--space-xl);}
#community .comm-kpi{padding:var(--space-lg) var(--space-xl);position:relative;overflow:hidden;
  border-left:3px solid var(--color-clay);
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s var(--ease-out);}
#community .comm-kpi:hover{transform:translateY(-7px) scale(1.02);
  box-shadow:0 22px 44px -18px rgba(0,0,0,.5);border-left-color:var(--color-sage);}
#community .comm-kpi::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease-out);}
#community .comm-kpi:hover::after{transform:translateX(120%);}
#community .comm-kpi b{font-size:clamp(30px,3vw,44px);}
#community .comm-kpi span{font-size:13.5px;margin-top:8px;}
@media(min-width:821px) and (max-height:860px){
  #community .comm-two__media{min-height:min(52vh,440px);}
  #community .comm-kpi{padding:var(--space-md) var(--space-lg);}
  #community .comm-kpi b{font-size:clamp(26px,2.6vw,36px);}
}

/* ABOUT v6 - vision full banner + minimal inset overlap; community full dashboard; contact two-col */
#our-vision .asf-vision{align-items:center;}
#our-vision .asf-vision__media{display:block;}
#our-vision .asf-vision__media .offx{position:relative;display:block;flex:none;width:100%;inset:auto;}
#our-vision .asf-vision__media .asf-img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;background:none;}
#our-vision .asf-vision__media .asf-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
#our-vision .asf-inset{width:31%;aspect-ratio:1/1;bottom:auto;}
#our-vision .asf-inset--bl{left:calc(var(--space-sm) * -1);bottom:calc(var(--space-sm) * -1);}

/* community: show the whole farmer-card dashboard, no crop, no letterbox */
#community .comm-two{align-items:center;}
#community .comm-two__media{min-height:0;aspect-ratio:1836/856;border:1px solid rgba(255,255,255,.15);}
#community .comm-two__media .offx{position:absolute;inset:0;}
#community .comm-two__media .offx img{width:100%;height:100%;object-fit:cover;object-position:center;}

/* contact: heading on the left, form box on the right */
.contact-compact .contact-two{display:grid;grid-template-columns:.82fr 1.18fr;gap:var(--space-2xl);align-items:center;margin-top:var(--space-lg);}
.contact-compact .contact-two .asf-contact-head{max-width:none;margin:0;text-align:left;}
.contact-compact .contact-two .asf-contact-head .asf-eyebrow::before{display:block;}
.contact-compact .contact-two .asf-contact-head .asf-lede{margin-left:0;margin-right:0;}
.contact-compact .contact-two .asf-form{max-width:none;margin:0;}
.contact-compact .contact-two .asf-form__foot{justify-content:flex-end;}
@media(max-width:820px){
  .contact-compact .contact-two{grid-template-columns:1fr;gap:var(--space-lg);}
  .contact-compact .contact-two .asf-form__foot{justify-content:flex-start;}
}

/* HOME v2 - hero less dull; pillars light + flip cards; sona no white box */

/* 1) HERO: lighter collage wash, crisper white text, brighter pink accent */
.home .hcol__t::after{background:rgba(var(--deep-sage-rgb),.40);}
@keyframes hcolLite{
  0%,.7%{background:rgba(63,77,72,.40);}
  1.6%,3.1%{background:rgba(63,77,72,.04);}
  4.4%,100%{background:rgba(63,77,72,.40);}
}
.home .asf-hero--home .asf-hero__media::after{
  background:
    linear-gradient(90deg,rgba(var(--deep-sage-rgb),.72) 0%,rgba(var(--deep-sage-rgb),.34) 40%,rgba(var(--deep-sage-rgb),0) 66%),
    linear-gradient(180deg,rgba(var(--deep-sage-rgb),.30) 0%,rgba(var(--deep-sage-rgb),0) 20%);
}
.home .asf-hero--home h1{color:#fff;text-transform:uppercase;text-shadow:0 2px 16px rgba(10,16,14,.45);}
.home .asf-hero--home h1 em{color:#F0A3AC;}   /* dark pink accent */
.home .asf-hero--home .asf-hero__lede{color:#fff;text-shadow:0 1px 12px rgba(10,16,14,.45);}

/* 2) PILLARS: flip cards - front = pic + name, back (hover) = details */
#pillars .hpill{position:relative;display:block;background:transparent;border:none;
  overflow:visible;box-shadow:none;perspective:1200px;min-height:clamp(320px,54vh,540px);}
#pillars .hpill:hover,#pillars .hpill:focus-visible,#pillars .hpill:focus-within{
  transform:none;box-shadow:none;border-color:transparent;outline:none;}
#pillars .hpill__inner{position:absolute;inset:0;transform-style:preserve-3d;
  transition:transform .65s var(--ease-out);}
#pillars .hpill:hover .hpill__inner,
#pillars .hpill:focus-within .hpill__inner{transform:rotateY(180deg);}
#pillars .hpill__face{position:absolute;inset:0;backface-visibility:hidden;
  -webkit-backface-visibility:hidden;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:0 18px 36px -22px rgba(16,24,21,.5);}
#pillars .hpill__face--front{background:#33403A;}
#pillars .hpill__face--front img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;transition:transform .55s var(--ease-out);}
#pillars .hpill:hover .hpill__face--front img{transform:scale(1.06);}
#pillars .hpill__face--front::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(var(--deep-sage-rgb),0) 34%,rgba(var(--deep-sage-rgb),.92) 100%);}
#pillars .hpill__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:var(--space-md) var(--space-md) var(--space-lg);}
#pillars .hpill__cap h3{font-family:var(--font-heading);font-weight:600;font-size:clamp(16px,1.4vw,20px);
  color:#fff;margin:0;line-height:1.25;text-shadow:0 1px 8px rgba(0,0,0,.4);}
#pillars .hpill__face--back{transform:rotateY(180deg);background:var(--color-deep-sage);
  border:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;justify-content:center;
  padding:var(--space-lg);}
#pillars .hpill__face--back h3{font-family:var(--font-heading);font-weight:600;font-size:clamp(16px,1.5vw,21px);
  color:#fff;margin:var(--space-sm) 0 var(--space-sm);line-height:1.25;}
#pillars .hpill__face--back p{margin:0;font-size:14px;line-height:1.6;color:var(--color-text-on-dark);}
#pillars .hpill__face--back .hpill__no{position:static;align-self:flex-start;
  background:var(--color-clay);color:var(--color-deep-sage);}
#pillars .hpill__cap .hpill__no,#pillars .hpill__face--front .hpill__no{}
@media(max-width:1080px){#pillars .hpill{min-height:clamp(260px,42vh,420px);}}

/* 3) SONA UGAO on light green: dark flow labels, no white box, spaced out */
.home #what-we-do .hflow--grass .hflow__s b,
.home #what-we-do .hflow--grass .hflow__s--btn b{color:var(--color-deep-sage);text-shadow:none;}
.home #what-we-do .hflow--grass .hflow__a svg{stroke:var(--color-deep-sage);}
.home #what-we-do .hdo__fact{background:transparent;border:none;border-left:3px solid var(--color-clay);
  border-radius:0;padding:var(--space-xs) 0 var(--space-xs) var(--space-md);box-shadow:none;}
.home #what-we-do .hdo__fact b{font-size:clamp(18px,1.9vw,26px);}
.home #what-we-do .hdo__fact p{font-size:14.5px;line-height:1.6;margin-top:6px;color:var(--color-text-muted);}
.home #what-we-do .hdo__text{justify-content:center;gap:var(--space-xl);}
.home #what-we-do .hdo__facts{margin-bottom:0;}

/* HOME v3 - vision fills one screen; sona pics side-by-side; wider/lower CTA */

/* 2) VISION & MISSION fills one screen, vertically centred */
.home #vision-mission{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;}
.home #vision-mission .asf-wrap{width:100%;}
@media (min-width:1081px) and (max-height:820px){
  .home #vision-mission .asf-h2{font-size:clamp(26px,2.3vw,33px);}
  .home #vision-mission .asf-vision__statement{font-size:clamp(15.5px,1.2vw,17px);line-height:1.65;}
  .home #vision-mission .asf-vision__list li{padding-block:8px;}
}

/* 3) SONA UGAO photos: two clean images side by side, nothing cut off */
.home #what-we-do .hdo__media{display:block;min-height:0;}
.home #what-we-do .hdo__pics{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm);
  position:relative;inset:auto;flex:none;width:100%;}
.home #what-we-do .hdo__pics .asf-img{position:relative;inset:auto;flex:none;aspect-ratio:1/1;
  border-radius:var(--radius-lg);overflow:hidden;}
.home #what-we-do .hdo__pics .asf-img img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;}

/* CTA: nudged down and made longer */
.home #what-we-do .hdo__cta{margin-top:var(--space-lg);}
.asf-btn--wide{min-width:320px;justify-content:center;}

/* FOOTER v2 - slim one line on every page: logo, word links divided by |, plain social icons */
.asf-footer{background:var(--color-deep-sage);color:var(--color-white);font-family:var(--font-body);font-size:15px;line-height:1.65;padding:var(--space-md) var(--container-pad);}
.asf-footer *{box-sizing:border-box;}
.asf-footer a{color:inherit;text-decoration:none;transition:color .2s ease;}
.asf-footer a:focus-visible{outline:2px solid var(--color-clay);outline-offset:3px;border-radius:2px;}
.asf-footer .asf-inner{max-width:920px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap;}
.asf-footer .asf-mark{display:flex;align-items:center;gap:11px;flex:none;}
.asf-footer .asf-icon{width:44px;height:auto;flex:none;}
.asf-footer .asf-wordmark{display:inline-flex;flex-direction:column;}
.asf-footer .asf-wordmark .n1{font-family:var(--font-heading);font-weight:700;font-size:17px;color:#fff;line-height:1;letter-spacing:.3px;}
.asf-footer .asf-wordmark .n2{display:flex;justify-content:space-between;margin-top:5px;font-family:var(--font-body);font-weight:300;font-size:8px;line-height:1;color:rgba(255,255,255,.6);}
.asf-footer .asf-wordmark .n2 i{font-style:normal;}
.asf-footer .asf-flinks{display:flex;align-items:center;flex-wrap:wrap;}
.asf-footer .asf-flinks a{font-family:var(--font-heading);font-weight:500;font-size:14px;color:#fff;padding:0 16px;line-height:1;}
.asf-footer .asf-flinks a:not(:last-child){border-right:1px solid rgba(255,255,255,.4);}
.asf-footer .asf-flinks a:hover{color:var(--color-clay);}
.asf-footer .asf-social{display:flex;align-items:center;gap:16px;}
.asf-footer .asf-social a{display:inline-flex;color:rgba(255,255,255,.9);}
.asf-footer .asf-social a:hover{color:var(--color-clay);}
.asf-footer .asf-social svg{width:20px;height:20px;fill:currentColor;display:block;}
@media(max-width:640px){.asf-footer .asf-inner{justify-content:center;gap:var(--space-md);text-align:center;}}

/* HOME v4 - the outline "better farmer income" circle ghosts under the heavy
   drop-shadow used for the solid flow icons; give it only a whisper of shadow */
.home #what-we-do .hflow--grass .hflow__s--btn img{filter:drop-shadow(0 4px 5px rgba(10,20,12,.12));}

/* MOVE v1 - leadership now lives on home (dark sheet); pillars now on about */
.home #leadership{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;}
.home #leadership .asf-wrap{width:100%;}
.home #leadership .lead-card{border:1px solid rgba(255,255,255,.14);box-shadow:0 22px 44px -26px rgba(0,0,0,.65);}

/* MOVE v2 - home alternation dark/light/dark: sona back on dark, leadership on light */
.home #what-we-do .hflow--grass .hflow__s b,
.home #what-we-do .hflow--grass .hflow__s--btn b{color:var(--color-deep-sage);text-shadow:none;}
.home #what-we-do .hflow--grass .hflow__a svg{stroke:var(--color-deep-sage);}
.home #what-we-do .hdo__fact b{color:var(--color-deep-sage);}
.home #what-we-do .hdo__fact p{color:var(--color-text-muted);}
.home #leadership .lead-card{border:none;box-shadow:0 24px 46px -26px rgba(16,24,21,.4);}

/* SET v7 - home white sheet + footer strip; about community 2 images + contact info */
.home .sheet--white{background:var(--color-white);}
.home .sheet--white .asf-h2{color:var(--color-deep-sage);}
.home-foot-strip{height:clamp(44px,7vh,84px);background:var(--color-white);}

/* community: farmer-card dashboard + weather advisory, side by side */
#community .comm-two__media{aspect-ratio:16/10;min-height:0;}
#community .comm-two__media .offx.comm-two__pics{position:absolute;inset:0;display:grid;grid-template-columns:1.5fr 1fr;gap:var(--space-sm);}
#community .comm-two__pics img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-lg);min-height:0;border:1px solid rgba(255,255,255,.15);}

/* contact: address / email / phone under the heading on the left */
.contact-compact .asf-contact-info{margin-top:var(--space-lg);font-size:15px;line-height:1.7;}
.contact-compact .asf-contact-info p{margin:0 0 6px;}
.contact-compact .asf-contact-info a{color:var(--color-deep-sage);font-weight:500;}
.contact-compact .asf-contact-info a:hover{color:var(--color-clay);}
.contact-compact .asf-contact-info__addr{margin-top:12px;color:var(--color-text-muted);}
.contact-compact .asf-contact-info__addr .lbl{display:block;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:4px;}

/* SET v8 - softer "dark white" text on home dark sheets; community advisory inset; contact headings */
.home .sheet--dark .asf-h2,
.home .sheet--dark .asf-vision__statement,
.home .sheet--dark .asf-vision__statement strong,
.home .sheet--dark .asf-vision__list li,
.home .sheet--dark .asf-vision__list li span:last-child{color:#EAEDE7;}
.home-foot-strip{display:none;}

/* community: farmer-card dashboard as the main image, weather advisory as a
   full (uncropped) overlapping card in the flip/inset style */
#community .comm-two__media{aspect-ratio:4/3;min-height:0;}
#community .comm-two__media .offx{position:absolute;inset:0;display:block;}
#community .comm-two__media .asf-img{position:absolute;inset:0;border-radius:var(--radius-lg);overflow:hidden;}
#community .comm-two__media .asf-img img{width:100%;height:100%;object-fit:cover;object-position:center;}
#community .comm-weather{position:absolute;z-index:2;right:calc(var(--space-md) * -1);bottom:calc(var(--space-md) * -1);
  width:clamp(150px,26%,224px);aspect-ratio:960/1324;border-radius:var(--radius-md);overflow:hidden;
  border:5px solid var(--color-deep-sage);box-shadow:0 20px 38px -18px rgba(0,0,0,.65);}
#community .comm-weather img{width:100%;height:100%;object-fit:cover;display:block;}
@media(max-width:900px){#community .comm-weather{width:38%;}}

/* contact info: sub-headings in the brand pink, with space between the blocks */
.contact-compact .asf-contact-info__h{margin:0 0 6px;font-family:var(--font-heading);font-weight:600;
  font-size:11.5px;letter-spacing:1.3px;text-transform:uppercase;color:var(--color-clay);}
.contact-compact .asf-contact-info__block{margin-top:var(--space-lg);}


/* ==== EDITS v9 (2026-09-14) ==== */
/* 3) what-we-do heading sub */
.asf-h2-sub{font-weight:600;font-size:.62em;color:var(--color-sage);}
/* 4) vision statement: one colour throughout */
.home .sheet--light .asf-vision__statement,
.home .sheet--light .asf-vision__statement strong{color:var(--color-deep-sage);}
/* 5) LinkedIn chip on leadership cards */
.lead-card__in{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:inline-flex;
  color:rgba(255,255,255,.88);opacity:1;transition:color .2s ease,opacity .2s ease;}
.lead-card__in svg{width:21px;height:21px;fill:currentColor;display:block;}
.lead-card__in:hover{color:#0A66C2;opacity:1;}
/* 6) Build-Operate-Transfer centred */
.home #what-we-do .hdo__facts--full .hdo__fact{text-align:center;border-left:none;}
.home #what-we-do .hdo__facts--full .hdo__fact b{display:inline-block;padding:14px 32px;background:var(--color-white);
  border:2px solid var(--color-deep-sage);border-radius:14px;
  box-shadow:0 6px 0 var(--color-deep-sage),0 12px 22px rgba(0,0,0,.14);
  transition:transform .15s ease,box-shadow .15s ease;}
.home #what-we-do .hdo__facts--full .hdo__fact b:hover{transform:translateY(3px);
  box-shadow:0 3px 0 var(--color-deep-sage),0 8px 16px rgba(0,0,0,.12);}
.home #what-we-do .hdo__facts--full .hdo__fact p{margin-top:26px;}
.home #what-we-do .hdo__cta{display:flex;justify-content:center;}
/* 7) FOOTER v3: three chunks span the header container - logo left, links centre, social right */
.asf-footer .asf-inner{max-width:var(--container-width);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:left;}
.asf-footer .asf-inner .asf-mark{justify-self:start;}
.asf-footer .asf-inner .asf-flinks{justify-self:center;}
.asf-footer .asf-inner .asf-social{justify-self:end;}
@media(max-width:720px){.asf-footer .asf-inner{display:flex;flex-direction:column;justify-content:center;gap:var(--space-md);}}
/* 9) FAQ answers: stronger text on the dark panel */
.sec-dark .asf-faq__a > div{color:#EDF2EF;}
/* 10) contact-us buttons inside FAQ answers */
.asf-faq__cta{margin-top:14px;padding:9px 18px;font-size:13.5px;background:var(--color-clay);color:#243430;border:none;}
.asf-faq__cta:hover{background:#E68F9A;color:#243430;}
/* 11) file upload field */
.asf-field input[type="file"]{width:100%;padding:10px 12px;border:1px dashed var(--color-border-strong);
  border-radius:var(--radius-md);background:var(--color-white);font-family:var(--font-body);font-size:14px;color:var(--color-text-body);cursor:pointer;}
.asf-field input[type="file"]::file-selector-button{margin-right:12px;padding:7px 14px;border:none;border-radius:6px;
  background:var(--color-deep-sage);color:#fff;font-family:var(--font-heading);font-weight:600;font-size:12.5px;cursor:pointer;}
/* 8) WhatsApp community form */
.wa-cta{display:flex;width:fit-content;margin:var(--space-lg) auto 0;background:var(--color-clay);color:#243430;border:none;}
.wa-cta:hover{background:#E68F9A;color:#243430;}
.wa-panel{margin-top:var(--space-md);background:var(--color-white);border-radius:var(--radius-lg);
  position:relative;padding:var(--space-lg);box-shadow:0 18px 44px rgba(0,0,0,.25);}
.wa-close{position:absolute;top:10px;right:12px;width:30px;height:30px;border:none;background:none;
  font-size:24px;line-height:1;color:var(--color-text-muted);cursor:pointer;border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:color .2s ease,background .2s ease;}
.wa-close:hover{color:var(--color-deep-sage);background:rgba(0,0,0,.06);}
.wa-panel .asf-form__foot{margin-top:var(--space-md);}

/* community: media column matches the text column top to bottom */
#community .comm-two{align-items:stretch;}
#community .comm-two__media{aspect-ratio:auto;min-height:0;height:auto;}
#community .comm-two__media .offx{height:100%;}
#community .comm-two__media .offx .asf-img{height:100%;}
#community .comm-two__media .offx .asf-img img{width:100%;height:100%;object-fit:cover;object-position:top left;}

/* hero collage: denser grid (smaller tiles), 19 unique photos, no repeats */
.hcol{grid-template-columns:repeat(13,1fr);grid-template-rows:repeat(5,1fr);gap:4px;}

/* vision inset: SHG group photo - larger, landscape, people fully in frame */
.asf-inset--group{width:46%;aspect-ratio:16/9;left:calc(var(--space-md) * -1);bottom:calc(var(--space-lg) * -1);top:auto;right:auto;}

/* ==== EDITS v12 ==== */
/* section eyebrows: underlined label instead of the side dash */
.asf-eyebrow{position:relative;padding-bottom:7px;}
.asf-eyebrow::before{display:none;}
.asf-eyebrow::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--color-clay);border-radius:1px;}
/* vision & mission statement: one colour, identical on home and about */
.asf-vision__statement,.asf-vision__statement strong{color:var(--color-deep-sage);}
.sec-dark .asf-vision__statement,.sec-dark .asf-vision__statement strong{color:var(--color-text-on-dark);}

/* vision statement: no bold emphasis anywhere */
.asf-vision__statement strong{font-weight:400;}

/* ==== HARMONY v1: one type scale across every page ==== */
.asf-hero h1{font-size:clamp(40px,4.6vw,66px);font-weight:700;}
.asf-hero__lede{font-size:clamp(15px,1.2vw,17px);font-weight:400;}
.asf-h2{font-size:clamp(26px,2.3vw,33px);font-weight:600;}
.asf-eyebrow{font-size:12px;}
.asf-lede{font-size:clamp(15px,1.15vw,16.5px);font-weight:400;}
/* no stray bold / off-colour text */
.asf-h2-sub{color:inherit;opacity:.72;}
.asf-vision__list li span:last-child{font-weight:500;}
/* about vision: media matches the text column exactly (same as home) */
#our-vision .asf-vision{align-items:stretch;}
#our-vision .asf-vision__media{min-height:0;height:auto;aspect-ratio:auto;}
#our-vision .asf-vision__media .offx{position:relative;height:100%;display:flex;}
#our-vision .asf-vision__media .offx .asf-img{position:absolute;inset:0;}
#our-vision .asf-vision__media .offx .asf-img img{width:100%;height:100%;object-fit:cover;}

/* HARMONY v2: beat page-scoped overrides */
.asf-hero--home h1{font-size:clamp(40px,4.6vw,66px);}
.home .asf-h2{font-size:clamp(26px,2.3vw,33px);}
.home .asf-eyebrow{font-size:12px;}

/* HARMONY v3: vision & mission identical on home and about */
#our-vision .asf-vision__statement{font-size:clamp(15.5px,1.2vw,17px);line-height:1.65;}
#our-vision .asf-vision__list li{font-size:inherit;}
#our-vision .asf-vision__list li span:last-child{font-size:clamp(14.5px,1.1vw,16px);}
.home .asf-vision__list li span:last-child{font-size:clamp(14.5px,1.1vw,16px);}

#our-vision .asf-h2{font-size:clamp(26px,2.3vw,33px);}

#our-vision .asf-inset--group{width:46%;height:auto;aspect-ratio:16/9;inset:auto;left:calc(var(--space-md) * -1);bottom:calc(var(--space-lg) * -1);top:auto;}

/* bulletproof: media column always spans exactly the text column, no browser fallback path */
.home #vision-mission .asf-vision,#our-vision .asf-vision{align-items:stretch !important;}
.asf-vision__media{align-self:stretch !important;min-height:0 !important;height:auto !important;}
.asf-vision__media .offx{position:relative !important;height:100% !important;display:flex !important;}
.asf-vision__media .offx .asf-img{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;aspect-ratio:auto !important;}

/* photo top aligns with the H2 line, not the eyebrow above it */
.home #vision-mission .asf-vision__media,#our-vision .asf-vision__media{padding-top:93px;}