/* B. Mello Ag Services — site styles
   Palette sampled from the logo: gold ECC200 / black / warm neutrals. */

:root {
  --ground:#FBF9F3; --surface:#FFFFFF; --ink:#16150F; --ink-soft:#6B6459;
  --gold:#A8860A; --gold-lit:#ECC200; --gold-wash:#FDF8E3; --hairline:#DFD6BC;
  --band:#0B0B08; --band-ink:#F6F2E5; --band-soft:#9C9481; --plate:#FFFDF6;
  --shadow:0 1px 2px rgba(22,21,15,.05), 0 10px 26px -14px rgba(22,21,15,.22);
  --measure:66ch;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground:#131209; --surface:#1C1A11; --ink:#F2EEE1; --ink-soft:#A69D86;
    --gold:#ECC200; --gold-lit:#ECC200; --gold-wash:#221F12; --hairline:#35311E;
    --band:#000000; --band-ink:#F6F2E5; --band-soft:#948C79; --plate:#FFFDF6;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 10px 26px -14px rgba(0,0,0,.85);
  }
}
:root[data-theme="dark"] {
  --ground:#131209; --surface:#1C1A11; --ink:#F2EEE1; --ink-soft:#A69D86;
  --gold:#ECC200; --gold-lit:#ECC200; --gold-wash:#221F12; --hairline:#35311E;
  --band:#000000; --band-ink:#F6F2E5; --band-soft:#948C79; --plate:#FFFDF6;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 10px 26px -14px rgba(0,0,0,.85);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

body {
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
  font-size:17px; line-height:1.62; -webkit-font-smoothing:antialiased;
}
img { max-width:100%; height:auto; }
h1,h2,h3,h4,.ui,nav,button,.btn,.eyebrow,.label { font-family:Archivo,"Helvetica Neue",Arial,sans-serif; }
a { color:var(--ink); text-decoration-color:var(--gold-lit); text-underline-offset:3px; text-decoration-thickness:2px; }
a:hover { color:var(--gold); }
a:focus-visible { outline:2px solid var(--gold-lit); outline-offset:3px; border-radius:2px; }

.wrap { max-width:1080px; margin:0 auto; padding:0 26px; }
.wrap-narrow { max-width:760px; margin:0 auto; padding:0 26px; }
.eyebrow { font-size:11.5px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; color:var(--gold); }

/* ---------- masthead ----------
   The brand block stays light in both themes: the logo is black type with a
   white keyline, so it needs a light ground to read at all. */
.masthead { background:#FFFDF6; }
.masthead .wrap { display:flex; align-items:center; gap:22px;
  padding-top:20px; padding-bottom:20px; flex-wrap:wrap; }
.brand { display:inline-block; line-height:0; flex:none; text-decoration:none; }
.brand img { width:clamp(196px,25vw,272px); display:block; }
.mast-right { margin-left:auto; display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  justify-content:flex-end; }
.mast-tag { font-family:Archivo,"Helvetica Neue",Arial,sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; color:#8C7C2F; text-align:right; line-height:1.8;
  white-space:nowrap; }
.callbtn { background:var(--gold-lit); color:#000; font-family:Archivo,sans-serif; font-weight:700;
  font-size:13.5px; letter-spacing:.04em; padding:12px 17px; text-decoration:none; white-space:nowrap;
  border:2px solid var(--gold-lit); }
.callbtn:hover { background:#0B0B08; color:var(--gold-lit); border-color:#0B0B08; }
.callbtn:focus-visible { outline:2px solid #0B0B08; outline-offset:2px; }

.navbar { background:#0B0B08; border-top:3px solid var(--gold-lit); }
.navbar .wrap { display:flex; gap:24px; flex-wrap:wrap; padding-top:0; padding-bottom:0;
  align-items:stretch; }
.navbar a { font-family:Archivo,"Helvetica Neue",Arial,sans-serif; font-size:12px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; color:#B2A98F; text-decoration:none;
  padding:14px 0; border-bottom:3px solid transparent; }
.navbar a:hover { color:#F6F2E5; border-bottom-color:#4A452C; }
.navbar a[aria-current="page"] { color:var(--gold-lit); border-bottom-color:var(--gold-lit); }
.navbar a:focus-visible { outline:2px solid var(--gold-lit); outline-offset:-2px; }

/* ---------- hero ---------- */
.hero { position:relative; background:var(--band); color:var(--band-ink); overflow:hidden; }
.hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.62; }
.hero::after { content:""; position:absolute; inset:0;
  background:linear-gradient(78deg, rgba(11,11,8,.93) 26%, rgba(11,11,8,.38) 100%); }
.hero .wrap { position:relative; z-index:1; padding-top:64px; padding-bottom:58px; }
.hero .eyebrow { color:var(--gold-lit); }
.hero h1 { font-size:clamp(34px,6vw,58px); font-weight:800; letter-spacing:-.028em;
  line-height:1.03; margin:14px 0 0; max-width:17ch; text-wrap:balance; }
.hero p { font-size:18px; color:#CFC7B2; margin:16px 0 0; max-width:50ch; line-height:1.55; }
.hero .actions { display:flex; gap:11px; margin-top:26px; flex-wrap:wrap; }

.btn { display:inline-block; font-size:12px; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; padding:12px 20px; text-decoration:none; border:1px solid transparent; cursor:pointer; }
.btn-gold { background:var(--gold-lit); color:#000; }
.btn-gold:hover { background:#FFD617; color:#000; }
.btn-ghost { border-color:#4A452C; color:var(--band-ink); }
.btn-ghost:hover { border-color:var(--gold-lit); color:var(--gold-lit); }

/* ---------- page header (interior pages) ---------- */
.pagehead { border-bottom:1px solid var(--hairline); }
.pagehead .wrap { padding-top:44px; padding-bottom:34px; }
.pagehead h1 { font-size:clamp(32px,5.4vw,48px); font-weight:800; letter-spacing:-.026em;
  line-height:1.04; margin:12px 0 0; text-wrap:balance; }
.pagehead .tag { font-size:19px; color:var(--ink-soft); margin:14px 0 0; max-width:var(--measure); }

/* ---------- band ---------- */
.band { background:var(--band); color:var(--band-ink); }
.band a { color:var(--band-ink); }
.band .eyebrow { color:var(--gold-lit); }

/* ---------- services ---------- */
.svc { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1px;
  background:var(--hairline); border:1px solid var(--hairline); margin:0; }
.svc > a { background:var(--surface); padding:26px 24px 28px; text-decoration:none; display:block; }
.svc > a:hover { background:var(--gold-wash); }
.svc h3 { font-size:21px; font-weight:700; margin:0; letter-spacing:-.014em; }
.svc p { margin:9px 0 0; color:var(--ink-soft); font-size:16px; line-height:1.55; }
.svc .more { display:inline-block; margin-top:14px; font-family:Archivo,sans-serif; font-size:11.5px;
  font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); }

/* ---------- section scaffolding ---------- */
section { padding:56px 0; }
section.tight { padding:38px 0; }
.sechead { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.sechead h2 { font-size:26px; font-weight:800; letter-spacing:-.02em; margin:0; }
.sechead .more { margin-left:auto; font-family:Archivo,sans-serif; font-size:11.5px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gold); text-decoration:none; }
.prose p { max-width:var(--measure); }
.prose h2 { font-size:24px; font-weight:800; letter-spacing:-.018em; margin:34px 0 0;
  padding-bottom:7px; border-bottom:2px solid var(--gold-lit); display:inline-block; }
.prose h2 + p { margin-top:14px; }
.prose ul { max-width:var(--measure); padding-left:22px; }
.prose li { margin:8px 0; }
.prose li::marker { color:var(--gold); }

.strip { width:100%; height:clamp(150px,26vw,290px); object-fit:cover; display:block; }

/* ---------- latest reports (home) ---------- */
.rcards { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px; }
.rcard { background:#14130C; border:1px solid #2A2718; padding:16px; text-decoration:none; display:block; }
.rcard:hover { border-color:var(--gold-lit); }
.rcard .t { font-family:Archivo,sans-serif; font-size:9.5px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--gold-lit); }
.rcard .h { font-family:Archivo,sans-serif; font-size:15px; font-weight:600; margin-top:7px;
  line-height:1.3; color:var(--band-ink); }
.rcard .d { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px; color:#7E7767;
  margin-top:9px; font-variant-numeric:tabular-nums; }

/* ---------- reports archive ---------- */
.controls { position:sticky; top:0; z-index:5; background:var(--ground);
  border-bottom:1px solid var(--hairline); padding-top:16px; }
.searchrow { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
#q { flex:1 1 240px; min-width:0; background:var(--surface); border:1px solid var(--hairline);
  color:var(--ink); padding:10px 13px; font-family:Archivo,sans-serif; font-size:14px; }
#q::placeholder { color:var(--ink-soft); }
#q:focus { outline:2px solid var(--gold-lit); outline-offset:1px; }
.tally { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12px; color:var(--ink-soft);
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.chips { display:flex; gap:7px; flex-wrap:wrap; padding:12px 0 14px; }
.chip { background:transparent; border:1px solid var(--hairline); color:var(--ink-soft);
  font-size:12px; font-weight:600; letter-spacing:.04em; padding:6px 11px; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; line-height:1.3; }
.chip:hover { border-color:var(--gold); color:var(--ink); }
.chip:focus-visible { outline:2px solid var(--gold-lit); outline-offset:2px; }
.chip.on { background:var(--gold-lit); border-color:var(--gold-lit); color:#000; }
.ct { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px; opacity:.62;
  font-variant-numeric:tabular-nums; }

.monthbreak { display:flex; align-items:center; gap:14px; padding:26px 0 10px; }
.monthbreak span { font-family:Archivo,sans-serif; font-size:11.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.monthbreak i { flex:1; height:1px; background:var(--hairline); }
.issue { display:flex; gap:18px; align-items:flex-start; padding:17px 0; border-top:1px solid var(--hairline); }
.issue:first-of-type { border-top:0; }
.idate { flex:none; width:82px; text-align:right; padding-top:2px;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-variant-numeric:tabular-nums; }
.idate .d { display:block; font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; }
.idate .y { display:block; font-size:10.5px; color:var(--ink-soft); margin-top:1px; }
.ibody { flex:1; min-width:0; }
.ilabel { font-family:Archivo,sans-serif; font-size:10px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--gold); }
.issue h3 { font-size:19px; font-weight:700; letter-spacing:-.012em; line-height:1.25; margin:5px 0 0; text-wrap:balance; }
.issue h3 a { text-decoration:none; }
.issue h3 a:hover { text-decoration:underline; }
.issue p { margin:7px 0 0; color:var(--ink-soft); font-size:15.5px; line-height:1.55; max-width:64ch; }
.imeta { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px; color:var(--ink-soft);
  margin-top:9px; opacity:.85; }
.iact { flex:none; align-self:center; font-family:Archivo,sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gold); border:1px solid var(--hairline);
  padding:7px 12px; text-decoration:none; }
.iact:hover { border-color:var(--gold-lit); background:var(--gold-wash); }
.issue.hide, .monthbreak.hide { display:none; }
.empty { padding:44px 0 60px; text-align:center; color:var(--ink-soft); display:none; }
.empty.show { display:block; }

/* ---------- signup ---------- */
.signup .wrap { padding:22px 26px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.signup .txt { flex:1 1 260px; min-width:0; }
.signup .h { font-family:Archivo,sans-serif; font-weight:700; font-size:15px; }
.signup .p { font-size:14px; color:var(--band-soft); margin-top:3px; line-height:1.45; }
.signupform { display:flex; gap:8px; flex:0 1 340px; min-width:240px; }
.signupform input { flex:1; min-width:0; background:#17160E; border:1px solid #3A361F;
  color:var(--band-ink); padding:10px 12px; font-family:Archivo,sans-serif; font-size:13px; }
.signupform input::placeholder { color:#6E6853; }
.signupform input:focus { outline:2px solid var(--gold-lit); outline-offset:1px; }
.signupform button { background:var(--gold-lit); border:0; color:#000; font-family:Archivo,sans-serif;
  font-weight:700; font-size:12px; letter-spacing:.08em; text-transform:uppercase; padding:10px 15px; cursor:pointer; }

/* ---------- newsletter issue page ---------- */
.issuehead .wrap { padding-top:34px; padding-bottom:26px; }
.issuehead h1 { font-size:clamp(28px,4.8vw,42px); font-weight:800; letter-spacing:-.024em;
  line-height:1.06; margin:12px 0 0; max-width:22ch; text-wrap:balance; }
.issuehead .dek { font-size:18px; color:var(--ink-soft); margin:14px 0 0; max-width:var(--measure); }
.issuehead .meta { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12px;
  color:var(--ink-soft); margin-top:16px; }
.emailbody { background:var(--surface); border-top:1px solid var(--hairline); padding:0 0 40px; }
.emailbody .inner { max-width:640px; margin:0 auto; padding:0 12px; }
.emailbody table { max-width:100% !important; }
.emailbody img { max-width:100% !important; height:auto !important; }
.issuenav { display:flex; gap:12px; justify-content:space-between; padding:26px 0; flex-wrap:wrap; }
.issuenav a { font-family:Archivo,sans-serif; font-size:12px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; text-decoration:none; color:var(--gold); }

/* ---------- contact ---------- */
.contactgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:28px; }
.factlist { list-style:none; padding:0; margin:0; }
.factlist li { padding:13px 0; border-top:1px solid var(--hairline); }
.factlist li:first-child { border-top:0; }
.factlist .k { font-family:Archivo,sans-serif; font-size:10.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold); display:block; }
.factlist .v { font-size:17px; margin-top:3px; display:block; }
.cform { display:grid; gap:11px; }
.cform label { font-family:Archivo,sans-serif; font-size:11px; font-weight:700; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-soft); }
.cform input, .cform textarea { background:var(--surface); border:1px solid var(--hairline);
  color:var(--ink); padding:11px 13px; font-family:Archivo,sans-serif; font-size:15px; width:100%; }
.cform input:focus, .cform textarea:focus { outline:2px solid var(--gold-lit); outline-offset:1px; }
.cform textarea { min-height:130px; resize:vertical; }
.cform .btn-gold { border:0; justify-self:start; }

/* ---------- footer ---------- */
.sitefoot { background:var(--band); color:var(--band-soft); border-top:1px solid var(--hairline); }
.sitefoot .wrap { padding:34px 26px 40px; display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.sitefoot h4 { font-size:10.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:var(--gold-lit); margin:0 0 10px; }
.sitefoot a { color:var(--band-soft); text-decoration:none; display:block; padding:3px 0; font-size:15px; }
.sitefoot a:hover { color:var(--band-ink); }
/* "Proudly American" sits on its own line above the fine print, set the way it
   appears on the newsletter banners: cream, then gold italic. */
.sitefoot .theme { grid-column:1/-1; border-top:1px solid #2A2718; padding-top:22px;
  font-family:Archivo,"Helvetica Neue",Arial,sans-serif; font-size:15px; font-weight:600;
  font-style:italic; color:var(--band-ink); letter-spacing:.01em; }
.sitefoot .theme span { color:var(--gold-lit); }
.sitefoot .fine { grid-column:1/-1; padding-top:2px;
  font-family:Archivo,sans-serif; font-size:12px; line-height:1.6; }

@media (max-width:620px) {
  .idate { width:auto; text-align:left; display:flex; gap:6px; align-items:baseline; }
  .idate .y { margin-top:0; }
  .issue { flex-wrap:wrap; gap:8px; }
  .ibody { flex:1 1 100%; order:2; }
  .iact { display:none; }
  .mast-tag { display:none; }
  .navbar .wrap { gap:14px; }
  .navbar a { font-size:11px; padding:11px 0; }
}
@media (prefers-reduced-motion:no-preference) {
  a, .btn, .chip, .rcard, .svc > a { transition:background .15s ease, color .15s ease, border-color .15s ease; }
}

/* the signup band brings its own padding; don't stack section padding on top */
section.signup { padding:0; }

/* ---------- the program: a real three-step sequence, so it is numbered ---------- */
.program { list-style:none; padding:0; margin:22px 0 0; counter-reset:pstep;
  display:grid; gap:1px; background:var(--hairline); border:1px solid var(--hairline); }
.program li { counter-increment:pstep; background:var(--surface); padding:22px 24px 24px;
  display:flex; gap:18px; align-items:flex-start; margin:0; }
.program li::before { content:counter(pstep,decimal-leading-zero);
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:13px; font-weight:600;
  background:var(--gold-lit); color:#000; padding:4px 8px; flex:none; letter-spacing:.02em; }
.program li::marker { content:none; }
.program h3 { font-family:Archivo,sans-serif; font-size:19px; font-weight:700; margin:0;
  letter-spacing:-.012em; }
.program p { margin:7px 0 0; color:var(--ink-soft); font-size:16px; line-height:1.55; max-width:60ch; }
.program .body { flex:1; min-width:0; }
@media (min-width:760px) { .program { grid-template-columns:repeat(3,1fr); } }

/* crop / capability chips */
.taglist { display:flex; flex-wrap:wrap; gap:7px; margin:16px 0 0; padding:0; list-style:none;
  max-width:var(--measure); }
.taglist li { margin:0; font-family:Archivo,sans-serif; font-size:13px; font-weight:600;
  background:var(--gold-wash); border:1px solid var(--hairline); padding:6px 12px; color:var(--ink); }
.taglist li::marker { content:none; }

/* ---------- report title cards ---------- */
.titlegrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(268px,1fr)); gap:14px; }
.titlecard { display:block; text-decoration:none; background:var(--surface);
  border:1px solid var(--hairline); overflow:hidden; }
.titlecard:hover { border-color:var(--gold-lit); }
.titlecard img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block;
  border-bottom:1px solid var(--hairline); }
.tc-body { padding:14px 16px 16px; }
.tc-name { font-family:Archivo,sans-serif; font-weight:700; font-size:16.5px; color:var(--ink);
  letter-spacing:-.01em; }
.tc-blurb { font-size:15px; color:var(--ink-soft); margin-top:5px; line-height:1.45; }
.tc-meta { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px; color:var(--gold);
  margin-top:10px; }

.series-banner { width:100%; max-width:740px; height:auto; display:block;
  margin:26px auto 30px; border:1px solid var(--hairline); }
.pagehead .meta-line { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12px;
  color:var(--ink-soft); margin:10px 0 0; }