:root{
  --bg:#6f6d45;
  --paper:#fff;
  --ink:#0b0b0b;
  --muted:rgba(255,255,255,.78);
  --muted2:rgba(255,255,255,.58);
  --cta:#c6c768;
  --max:1180px;
  --pad:28px;
}


*{box-sizing:border-box}
html{overflow-y:scroll}
html,body{min-height:100vh;display:flex;flex-direction:column;height:100%}

/* =========================
   Page Preloader
========================= */
#pagePreloader{
  position:fixed;
  inset:0;
  z-index:10000;
  background:var(--bg);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:1;
  visibility:visible;
  transition:opacity .45s ease, visibility .45s ease;
}
#pagePreloader img{
  width:auto;
  height:auto;
  display:block;
}
#pagePreloader.is-hidden{
  opacity:0;
  visibility:hidden;
}
body{min-height:100vh;display:flex;flex-direction:column;
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Space Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

/* Sticky header */
.topbar{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid rgba(0,0,0,.18)}
.topbar__inner{max-width:var(--max);margin:0 auto;padding:14px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{text-decoration:none;display:inline-flex;align-items:center}
.brand__logo{width:120px;height:auto;display:block}

.nav{display:flex;align-items:center;gap:34px}
.nav__link{color:rgba(0,0,0,.75);text-decoration:none;letter-spacing:.12em;font-size:12px;font-weight:700;padding:8px 0;border-bottom:2px solid transparent}
.nav__link:hover{color:rgba(0,0,0,.95)}
.nav__link.is-active{border-bottom-color:var(--cta);color:rgba(0,0,0,.95)}

/* Burger (hidden on desktop) */
.burger{display:none;border:0;background:transparent;padding:10px;border-radius:10px;cursor:pointer}
.burger:hover{background:rgba(0,0,0,.06)}
.burger__icon{width:24px;height:24px;display:block;background:center/24px 24px no-repeat url('assets/burger.svg')}

/* Mobile panel */
.mobileOverlay{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:80}
.mobilePanel{position:fixed;top:0;right:0;height:100%;width:min(320px,86vw);background:#fff;z-index:90;box-shadow:-18px 0 40px rgba(0,0,0,.25);transform:translateX(102%);transition:transform .25s ease;display:flex;flex-direction:column}
.mobilePanel.is-open{transform:translateX(0)}
.mobilePanel__top{display:flex;justify-content:flex-end;padding:14px 16px;border-bottom:1px solid rgba(0,0,0,.1)}
.mobileClose{border:0;background:transparent;font-size:20px;cursor:pointer;padding:8px 10px;border-radius:10px}
.mobileClose:hover{background:rgba(0,0,0,.06)}
.mobileNav{display:grid;padding:14px 16px;gap:10px}
.mobileNav__link{text-decoration:none;color:rgba(0,0,0,.85);letter-spacing:.12em;font-size:12px;font-weight:700;padding:12px 10px;border-radius:12px}
.mobileNav__link:hover{background:rgba(0,0,0,.06)}

/* Headline */
.headline{margin:0;font-family:"Anton",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;letter-spacing:.03em;line-height:.92}
.headline__line{display:inline-block;font-size:clamp(40px,5vw,70px);position:relative;padding-bottom:10px}
.headline__line::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:rgba(0,0,0,.35)}
.headline__line + .headline__line{display:block;margin-top:10px}
.headline--compact .headline__line{font-size:clamp(44px,5.2vw,72px)}

/* Buttons */
.cta,.heroDonate{border:0;background:var(--cta);color:rgba(255,255,255,.92);letter-spacing:.16em;font-weight:700;font-size:12px;padding:14px 28px;border-radius:999px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
.cta:active,.heroDonate:active{transform:translateY(1px)}

/* Home hero */
.hero{padding:58px 0 60px}
.hero__wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;min-height:520px}
.heroDonate{position:absolute;right:var(--pad);top:6px}
.heroDonate--static{position:static}

/* Copy */
.copy{max-width:560px;margin-top:26px}
.copy__lead{margin:0;text-transform:uppercase;letter-spacing:.10em;color:var(--muted);font-weight:700;font-size:16px;line-height:1.6}
.copy__rule{height:1px;background:rgba(255,255,255,.35);margin:16px 0 18px;width:min(560px,100%)}
.copy__small{margin-top:18px;color:var(--muted2);letter-spacing:.08em;text-transform:uppercase;font-size:12px;line-height:1.7}
.copy__small p{margin:0 0 14px}

/* Drop */
.drop{position:relative;width:min(520px,100%);margin-left:auto;overflow: visible}
.drop__img{width:100%;height:auto;display:block}
.drop__overlay{
  position:absolute;
  right: 18px;
  bottom: 18px;
  display:flex;
  align-items:flex-end;
  gap: 10px;
  color: rgba(245,245,245,.90);
  text-transform: uppercase;
  z-index: 2;
  pointer-events: none;
}
.drop__pct{
  font-family: "Rock Salt", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 88px;
  line-height: 0.9;
  font-weight: 400;
  letter-spacing: -0.02em;
  opacity: .92;
  transform: rotate(-8deg);
}
.drop__label{
  font-family: "Space Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 18px;
  letter-spacing: .10em;
  font-weight: 700;
  line-height: 1.05;
  opacity: .92;
}

/* Inner pages */
.sectionTop{padding:58px 0 22px}
.sectionTop__wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.sectionTitle{margin:26px 0 0;text-transform:uppercase;color:var(--muted);letter-spacing:.12em;font-size:18px;font-weight:700}

.content{padding:18px 0 60px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:56px;max-width:980px}
.col p{margin:0;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:12px;line-height:1.75}

/* Farmers */
.farmers{padding:28px 0 60px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}
.card__media img{width:100%;height:auto;display:block;border-radius:22px}
.card__title{margin:18px 0 10px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;font-size:16px}
.card__text{margin:0;color:var(--muted2);letter-spacing:.08em;text-transform:uppercase;font-size:10px;line-height:1.7}

/* Farmers video thumbnails + modal */
.videoThumb{border:0;padding:0;background:transparent;width:100%;display:block;cursor:pointer;position:relative}
.videoThumb:focus-visible{outline:2px solid rgba(198,199,104,.95);outline-offset:4px;border-radius:22px}
.videoThumb__play{position:absolute;inset:0;display:grid;place-items:center;font-size:44px;line-height:1;color:#fff;text-shadow:0 6px 18px rgba(0,0,0,.45);pointer-events:none}

.videoModal[hidden]{display:none}
.videoModal{position:fixed;inset:0;z-index:9999}
.videoModal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.75)}
.videoModal__dialog{position:relative;width:min(980px,calc(100vw - 32px));margin:6vh auto 0;background:#000;border-radius:12px;overflow:hidden;box-shadow:0 20px 70px rgba(0,0,0,.5)}
.videoModal__close{position:absolute;right:10px;top:10px;z-index:2;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:18px;width:36px;height:36px;cursor:pointer;border-radius:10px}
.videoModal__close:hover{background:rgba(0,0,0,.72)}
.videoModal__frame{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.videoModal__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Footer */
.footer{background:rgba(0,0,0,.25)}
.footer__inner{max-width:var(--max);margin:0 auto;padding:18px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:18px}
.footer__left{color:rgba(255,255,255,.8);letter-spacing:.10em;text-transform:uppercase;font-size:10px;font-weight:700}
.footer__right{display:inline-flex;align-items:center;gap:12px}
.footer__icon{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);text-decoration:none}
.footer__icon svg{width:16px;height:16px;fill:rgba(255,255,255,.85)}

/* Responsive */
@media (max-width:980px){
  :root{--pad:22px}

  /* switch to flex so we can reorder: headline -> drop -> copy */
  .hero__wrap{
    display:flex;
    flex-direction:column;
    min-height:unset;
    gap:18px;
  }

  /* flatten left wrapper so its children can be ordered */
  .hero__left{ display: contents; }

  .heroDonate{ position:static; margin-left:auto; order:0; }
  .headline{ order:1; }
  .hero__right{ order:2; }
  .copy{ order:3; max-width:720px; }

  .drop{ margin:6px auto 0; width:min(520px,92vw); }
  .drop__overlay{ right:4px; bottom:10px; }
  .drop__pct{ font-size:76px; }

  .cols{ grid-template-columns:1fr; gap:22px; }
  .cards{ grid-template-columns:1fr; gap:28px; }
}
@media (max-width:640px){
  .nav{display:none}
  .burger{display:inline-flex;align-items:center;justify-content:center}
}

/* Video thumbs + modal */
.videoThumb{border:0;padding:0;background:transparent;width:100%;display:block;cursor:pointer;position:relative}
.videoThumb:focus{outline:2px solid rgba(255,255,255,.6);outline-offset:4px;border-radius:22px}
.videoThumb__play{position:absolute;inset:0;display:grid;place-items:center;font-size:44px;line-height:1;color:#fff;text-shadow:0 6px 18px rgba(0,0,0,.45);pointer-events:none}

.videoModal[hidden]{display:none}
.videoModal{position:fixed;inset:0;z-index:9999}
.videoModal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.75)}
.videoModal__dialog{position:relative;width:min(980px,calc(100vw - 32px));margin:6vh auto 0;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 20px 70px rgba(0,0,0,.5)}
.videoModal__close{position:absolute;right:10px;top:10px;z-index:2;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:18px;width:36px;height:36px;cursor:pointer;border-radius:10px}
.videoModal__close:hover{background:rgba(0,0,0,.75)}
.videoModal__frame{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.videoModal__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.page{flex:1 0 auto}
.footer{margin-top:auto}


/* Sticky footer */
body{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main.page{
  flex: 1 0 auto;
}
.footer{
  margin-top: auto;
}


/* drop overlay responsive */
@media (max-width: 520px){
  .drop__overlay{ right: 10px; bottom: 10px; }
  .drop__pct{ font-size: 72px; }
  .drop__label{ font-size: 16px; }
}


/* mobile hero reorder */
@media (max-width: 980px){
  .hero__wrap{
    display: flex;
    flex-direction: column;
  }
  .hero__left{
    order: 1;
  }
  .hero__right{
    order: 2;
    margin-top: 18px;
  }
  .copy{
    order: 3;
  }
}


/* Headline image placeholder */
.headline-img{
  display:block;
  width:100%;
  max-width:360px;
  margin-bottom:24px;
}
@media (max-width:980px){
  .headline-img{
    max-width:300px;
    margin-bottom:18px;
  }
}

@media (max-width:980px){
  .headline-img{
  display:block;
  width:100%;
  max-width:360px;
  margin-bottom:24px;
}
@media (max-width:980px){
  .headline-img{
    max-width:300px;
    margin-bottom:18px;
  }
}

}

.headline-image {
  max-width: 520px;
}

.headline-image img {
  width: 100%;
  height: auto;
  display: block;
}
