@layer farmfinder-legacy {

:root{--ink:#173f35;--forest:#245847;--cream:#f7f2e8;--paper:#fffdf8;--gold:#d89b36;--line:#d9d4c8;--muted:#65726b;--serif:"Domine",Georgia,serif;--sans:"Source Sans 3","Helvetica Neue",Arial,sans-serif}*{box-sizing:border-box}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.6 var(--sans)}a{color:inherit}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;background:var(--paper);padding:.6rem;z-index:10}.site-header{align-items:center;background:var(--paper);border-bottom:1px solid var(--line);display:flex;gap:1.25rem;justify-content:space-between;padding:1rem clamp(1rem,4vw,4rem);position:sticky;top:0;z-index:4}.brand{align-items:center;display:flex;font-weight:800;gap:.65rem;text-decoration:none}.brand small{font-size:.875rem;letter-spacing:.12em}.brand-logo{height:2.5rem;object-fit:contain;width:2.5rem}.site-nav{align-items:center;display:flex;gap:clamp(.7rem,1.5vw,1.25rem)}.site-nav a{text-decoration:none}.nav-cta,.button{background:var(--ink);border:1px solid var(--ink);border-radius:6px;color:#fff;display:inline-block;font-weight:700;padding:.7rem 1.1rem;text-decoration:none}.button--secondary{background:transparent;color:var(--ink)}.nav-toggle{font-size:.875rem;background:transparent;border:1px solid var(--line);border-radius:6px;display:none;padding:.5rem .8rem}.hero,.section{margin:auto;max-width:1200px;padding:clamp(3rem,8vw,7rem) clamp(1rem,4vw,4rem)}.hero{max-width:1100px}.hero--compact{padding-bottom:3rem;padding-top:4rem}.hero h1{font:clamp(2.7rem,7vw,6.4rem)/.98 var(--serif);font-weight:600;letter-spacing:-.015em;margin:.35rem 0 1.2rem;max-width:850px}.hero p{color:var(--muted);font-size:clamp(1.05rem,2vw,1.35rem);max-width:650px}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}.section{padding-bottom:4rem;padding-top:2rem}.section-head{align-items:end;display:flex;justify-content:space-between;margin-bottom:1.2rem}.section h2,.card h2,.panel h2{font:clamp(1.6rem,3vw,2.4rem)/1.1 var(--serif);font-weight:600;margin:.3rem 0 .7rem}.card-grid,.feature-grid{display:grid;gap:1rem;grid-template-columns:repeat(3,minmax(0,1fr))}.card,.panel,.public-form-card{background:var(--paper);border:1px solid var(--line);border-radius:1.1rem;padding:1.4rem}.card{min-height:200px}.card h2 a{text-decoration:none}.detail-grid{display:grid;gap:1.5rem;grid-template-columns:2fr 1fr;margin:auto;max-width:1100px;padding:1rem clamp(1rem,4vw,4rem) 5rem}.prose{max-width:720px}.tag-row{display:flex;flex-wrap:wrap;gap:.45rem}.tag{border:1px solid var(--line);border-radius:4px;font-size:.875rem;padding:.25rem .7rem}.muted{color:var(--muted);font-size:.9rem}.notice{background:#fff4d9;border:1px solid #e4c477;border-radius:.75rem;padding:1rem}.notice--error{background:#fde9e5;border-color:#d8998d}.form-wrap,.public-form-wrap{margin:auto;max-width:760px;padding:clamp(2rem,6vw,5rem) 1rem}.form,.public-form-card form{display:grid;gap:1rem}.form label,.public-form-card label,.public-form-card fieldset{border:0;display:grid;font-weight:700;gap:.35rem;margin:0;padding:0}.form input,.form textarea,.public-form-card input,.public-form-card textarea,.public-form-card select{background:#fff;border:1px solid #bdb8ad;border-radius:.55rem;color:var(--ink);font:inherit;padding:.75rem;width:100%}.form textarea,.public-form-card textarea{min-height:8rem;resize:vertical}.public-form-card h1{font:clamp(2.4rem,6vw,4.8rem)/1 var(--serif);font-weight:600;letter-spacing:-.015em;margin:.3rem 0 1rem}.public-form-description{color:var(--muted);font-size:1.1rem;margin:0 0 1.5rem}.public-form-back,.public-form-admin-link{display:inline-block;font-weight:700;margin:0 0 1rem;text-decoration:none}.public-form-admin-link{margin:1rem 0 0}.choice-group{display:grid;gap:.5rem}.public-form-card .choice-option{align-items:flex-start;display:flex;font-weight:500}.public-form-card .choice-option input{margin-top:.3rem;width:auto}.public-gotcha{height:1px!important;left:-10000px!important;overflow:hidden!important;position:absolute!important;width:1px!important}.public-form-status{font-weight:700;min-height:1.5rem}.public-form-status.is-error{color:#a83a2b}.form-file-hint{color:var(--muted);font-weight:400}.map-list{display:grid;gap:.65rem;list-style:none;margin:1rem 0 0;padding:0}.map-list li{align-items:center;border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:.7rem 0}.map-list span{color:var(--muted)}.site-footer{background:var(--ink);color:#fff;display:grid;gap:1rem;grid-template-columns:1fr auto;padding:2rem clamp(1rem,4vw,4rem)}.site-footer nav{display:flex;gap:1rem}.site-footer a{color:#fff}.footer-note{font-size:.875rem;grid-column:1/-1;opacity:.75}@media(max-width:920px){.nav-toggle{display:block}.site-nav{background:var(--paper);border-bottom:1px solid var(--line);display:none;flex-direction:column;left:0;padding:1rem;position:absolute;right:0;top:100%}.site-nav.is-open{display:flex}}@media(max-width:760px){.card-grid,.feature-grid,.detail-grid{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column;gap:1rem}.site-footer{grid-template-columns:1fr}.site-footer nav{flex-wrap:wrap}.map-list li{align-items:flex-start;flex-direction:column}}
.brand-logo{height:3rem;width:7rem}

/* ---------------------------------------------------------------------------
   Shape and surface scale.

   Nothing in this interface is a pill. Fully rounded rectangles read as
   generic template UI, so every control, tag, and card uses a measured
   radius instead, the way a working storefront does. Circles are reserved
   for avatars, where roundness carries meaning.
--------------------------------------------------------------------------- */

:root {
  --r-control: 6px;
  --r-surface: 10px;
  --r-tag: 4px;
  --shadow-1: 0 1px 2px rgba(23, 63, 53, .06);
  --shadow-2: 0 2px 4px rgba(23, 63, 53, .07), 0 8px 20px rgba(23, 63, 53, .06);
  --focus: 0 0 0 3px rgba(36, 88, 71, .3);
}

.button,
.nav-cta {
  border-radius: var(--r-control);
  box-shadow: var(--shadow-1);
  font-size: .95rem;
  letter-spacing: -.005em;
  padding: .62rem 1rem;
  transition: background-color .14s ease, border-color .14s ease, color .14s ease;
}

.button:hover,
.nav-cta:hover { background: var(--forest); border-color: var(--forest); }

.button--secondary {
  box-shadow: none;
  border-color: #c3bdb0;
}

.button--secondary:hover { background: rgba(36, 88, 71, .07); border-color: var(--forest); color: var(--ink); }

.nav-toggle { border-radius: var(--r-control); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  border-radius: var(--r-control);
  box-shadow: 0 0 0 3px var(--focus-gap);
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

.card,
.panel,
.public-form-card { border-radius: var(--r-surface); }

.card { box-shadow: var(--shadow-1); }

.form input,
.form textarea,
.public-form-card input,
.public-form-card textarea,
.public-form-card select { border-radius: var(--r-control); }

/* A tag is a small rectangular label, not a lozenge. */
.tag {
  background: rgba(36, 88, 71, .05);
  border-color: rgba(36, 88, 71, .16);
  border-radius: var(--r-tag);
  font-size:.875rem;
  font-weight: 600;
  padding: .22rem .5rem;
}

/* ---------------------------------------------------------------------------
   Shared components consumed by SiteChrome::avatar() and ::badge().
--------------------------------------------------------------------------- */

/* SiteChrome::avatar() emits an inline <svg> holding a rounded rect and a
   monogram, so the colour lives on the shapes rather than the box. Eight
   hues, picked by a stable hash of the name, all carrying white text at
   4.5:1 or better. */
.ff-avatar {
  display: inline-block;
  flex: 0 0 auto;
  height: 2.5rem;
  user-select: none;
  vertical-align: middle;
  width: 2.5rem;
}

.ff-avatar--sm { height: 1.9rem; width: 1.9rem; }
.ff-avatar--lg { height: 4rem; width: 4rem; }

.ff-avatar .ff-avatar-bg { fill: #3c6b4f; }
.ff-avatar .ff-avatar-text {
  fill: #fff;
  font: 700 26px/1 var(--sans);
  letter-spacing: .5px;
}

.ff-avatar--0 .ff-avatar-bg { fill: #2f5d47; }
.ff-avatar--1 .ff-avatar-bg { fill: #7a4c1e; }
.ff-avatar--2 .ff-avatar-bg { fill: #3d5a75; }
.ff-avatar--3 .ff-avatar-bg { fill: #6b3f5e; }
.ff-avatar--4 .ff-avatar-bg { fill: #4a6330; }
.ff-avatar--5 .ff-avatar-bg { fill: #8a5220; }
.ff-avatar--6 .ff-avatar-bg { fill: #2d6360; }
.ff-avatar--7 .ff-avatar-bg { fill: #6a4230; }

.ff-badge {
  align-items: center;
  background: rgba(36, 88, 71, .06);
  border: 1px solid rgba(36, 88, 71, .15);
  border-radius: var(--r-tag);
  color: var(--forest);
  display: inline-flex;
  font-size:.875rem;
  font-weight: 650;
  gap: .3rem;
  line-height: 1.35;
  padding: .2rem .45rem;
  white-space: nowrap;
}

.ff-badge--season { background: rgba(216, 155, 54, .12); border-color: rgba(216, 155, 54, .34); color: #7a5410; }
.ff-badge--capability { background: rgba(36, 88, 71, .1); border-color: rgba(36, 88, 71, .26); }
.ff-badge--muted { background: transparent; border-color: var(--line); color: var(--muted); font-weight: 600; }

.ff-badge-row { display: flex; flex-wrap: wrap; gap: .35rem; }

/* Pages whose content is shorter than the window left the footer floating
   with a band of page background under it. The map page runs its own
   full-screen layout and is deliberately excluded. */
body:not(.maps-body) {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
}

body:not(.maps-body) > main {
  flex: 1 0 auto;
}

/* One inline icon set, drawn in the current text colour so an icon always
   matches the type it sits with. */
.ff-sprite {
  height: 0;
  overflow: hidden;
  position: absolute;
  width: 0;
}

.ff-icon {
  color: var(--forest);
  display: block;
  fill: none;
  flex: 0 0 auto;
  height: 1.75rem;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  width: 1.75rem;
}

/* On a card the icon carries the section, so it gets a disc to sit in
   rather than floating as a stray glyph above the heading. */
.icon-card > .ff-icon,
.icon-panel > .ff-icon {
  background: color-mix(in srgb, var(--forest) 9%, transparent);
  border-radius: var(--r-control);
  box-sizing: content-box;
  height: 1.5rem;
  margin-bottom: 1rem;
  padding: .58rem;
  width: 1.5rem;
}

/* Icon card rows carry three or four items depending on the page, so they
   size themselves rather than being pinned to a three column track. */
.icon-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.icon-card {
  display: flex;
  flex-direction: column;
}

.icon-card h2 {
  font-size: clamp(1.3rem, 2vw, 1.65rem);
}

.icon-card p {
  margin-bottom: 1.1rem;
}

/* Actions sit on a common baseline across the row regardless of copy length. */
.icon-card-action {
  align-self: flex-start;
  margin-top: auto;
}

.icon-lede {
  align-items: flex-start;
  display: flex;
  gap: .75rem;
}

.icon-lede .ff-icon {
  height: 1.4rem;
  margin-top: .15rem;
  width: 1.4rem;
}

/* The two column grid nested inside a section that already has the page
   gutter, so it must not add its own. */
.detail-grid--flush {
  padding-left: 0;
  padding-right: 0;
}

.icon-heading {
  align-items: center;
  display: flex;
  gap: .65rem;
}

.icon-heading .ff-icon {
  height: 1.45rem;
  width: 1.45rem;
}

.step-list {
  counter-reset: step;
  display: grid;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.step-list li {
  counter-increment: step;
  padding-left: 3rem;
  position: relative;
}

.step-list li::before {
  align-items: center;
  background: var(--ink);
  border-radius: 50%;
  color: #fff;
  content: counter(step);
  display: flex;
  font-weight: 800;
  height: 2rem;
  justify-content: center;
  left: 0;
  position: absolute;
  top: -.15rem;
  width: 2rem;
}

.step-list h3 {
  margin: 0 0 .3rem;
}

.step-list p {
  margin: 0;
}

.check-list {
  display: grid;
  gap: .65rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.check-list li {
  align-items: flex-start;
  display: flex;
  gap: .6rem;
}

.check-list .ff-icon {
  height: 1.3rem;
  margin-top: .18rem;
  width: 1.3rem;
}

/* Public media must always honor the width of its containing card or panel. */
img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

img,
video {
  height: auto;
}

/* Touch targets. Measured on a 375px viewport: the nav toggle was 34px tall
   and the footer links 26px, both under the 44px minimum. The nav toggle
   matters most - it is the only way to reach the menu on a phone, so a miss
   there is a dead end rather than an annoyance.

   Scoped to coarse pointers so mouse users keep the current compact spacing;
   applying it globally would add ~18px of height to every footer link on
   desktop for no benefit. */
@media (pointer: coarse) {
  .nav-toggle { min-height: 44px; min-width: 44px; }
  .site-footer nav { flex-wrap: wrap; gap: .25rem 1rem; }
  .site-footer nav a { display: inline-flex; align-items: center; min-height: 44px; }
  .button { min-height: 44px; }

  /* A directory card carries exactly one link and nothing else interactive, so
     the whole card becomes its tap target instead of the 29px line of heading
     text. On a directory of several thousand farms that link IS the product,
     and 29px is a miss-prone target on a phone.

     The overlay is a pseudo-element, so nothing about the layout moves. It is
     scoped to coarse pointers deliberately: on a mouse the same overlay would
     make the card body harder to select text from, for no benefit. */
  .card-grid > .card { position: relative; }
  .card-grid > .card h2 a::after { content: ""; position: absolute; inset: 0; }
}

/* Keep the page width stable when the full screen menu locks scrolling. */
html { scrollbar-gutter: stable; }
/* One three-bar icon morphs into the close mark without replacing layout boxes. */
.nav-toggle {
  align-items: center;
  /* No resting box: the three bars are the affordance. The focus ring is
     untouched, so keyboard users still see where they are. */
  border-color: transparent;
  justify-content: center;
  line-height: 0;
  padding: .45rem;
}

.nav-toggle:hover { background: rgba(23, 63, 53, .07); }

.nav-toggle { width:48px; height:48px; flex:0 0 48px; }
.nav-toggle-bars { display:block; position:relative; width:24px; height:20px; }
.nav-toggle-bars > span { position:absolute; left:1px; top:9px; width:22px; height:2px; border-radius:1px; background:currentColor; transition:transform .22s ease,opacity .16s ease; transform-origin:center; }
.nav-toggle-bars > span:first-child { transform:translateY(-7px); }
.nav-toggle-bars > span:last-child { transform:translateY(7px); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars > span:first-child { transform:rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars > span:nth-child(2) { opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bars > span:last-child { transform:rotate(-45deg); }
@media(prefers-reduced-motion:reduce){.nav-toggle-bars > span { transition:none; }}

@media (max-width: 920px) {
  .nav-toggle { display: inline-flex; }
}

/* --------------------------------------------------------------------------
   FarmFinder application foundation

   The public surface and the role workspaces share one visual language, but
   this is deliberately not the BlackRail administration palette. The colors
   interpret Victoria's Lime Green Velour board through fields and warm paper.
---------------------------------------------------------------------------- */

:root {
  --ink: var(--brand-ink);
  --forest: var(--brand-olive);
  --cream: var(--brand-cream);
  --paper: var(--brand-paper);
  --gold: var(--brand-gold);
  --clay: var(--brand-clay);
  --sky: var(--brand-meadow);
  --sage: var(--brand-sage);
  --line: var(--brand-border);
  --muted: var(--brand-muted);
  --serif: "Domine", Georgia, serif;
  --sans: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;
  --focus-ring: #8a4700;
  --focus-gap: #fffdf7;
  --shadow-1: 0 1px 2px rgba(45, 56, 36, .06), 0 8px 24px rgba(45, 56, 36, .035);
  --shadow-2: 0 18px 60px rgba(45, 56, 36, .14), 0 2px 8px rgba(45, 56, 36, .08);
  --page-gutter: clamp(1rem, 4vw, 3.5rem);
  --header-height: 76px;
  --ff-ink: var(--ink);
  --ff-action: var(--forest);
  --ff-canvas: var(--cream);
  --ff-surface: var(--paper);
  --ff-accent: var(--brand-lime);
  --ff-warm: var(--clay);
  --ff-cool: var(--sky);
  --ff-field: var(--sage);
  --ff-border: var(--line);
  --ff-muted: var(--muted);
  --ff-radius-control: 10px;
  --ff-radius-card: 14px;
  --ff-radius-feature: 20px;
}

body {
  background:
    radial-gradient(circle at 92% 14%, rgba(197, 215, 51, .09), transparent 28rem),
    var(--cream);
  font-size: 16px;
  line-height: 1.62;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--serif);
}

h1,
h2,
h3,
p { text-wrap: pretty; }

/* Lime signals an action. Dense content and form fields stay on plain paper. */
.site-nav .nav-cta {
  background: var(--brand-lime);
  border-color: var(--brand-lime);
  color: var(--brand-ink);
}
.site-nav .nav-cta:hover,
.site-nav .nav-cta:active {
  background: var(--brand-velour);
  border-color: var(--brand-velour);
  color: var(--brand-ink);
}

.site-header {
  background: color-mix(in srgb, var(--paper) 94%, transparent);
  border-bottom-color: rgba(18, 60, 54, .13);
  padding: 0;
  z-index: 40;
}

.site-header-inner {
  align-items: center;
  display: flex;
  gap: 1.5rem;
  height: var(--header-height);
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1480px;
  padding: 0 var(--page-gutter);
  width: 100%;
}

.brand { flex: 0 0 auto; }
.brand-logo { height: 3rem; width: 7.6rem; }

.site-nav {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: 1.25rem;
  justify-content: flex-end;
}

.site-nav-primary,
.site-nav-actions {
  align-items: center;
  display: flex;
  gap: clamp(.7rem, 1.25vw, 1.2rem);
}

.site-nav a,
.site-nav summary {
  color: color-mix(in srgb, var(--ink) 88%, #000);
  cursor: pointer;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

/* Explicit dark type protects contrast on the light lime action surface. */
.site-nav a.nav-cta { color: var(--brand-ink); }

.site-nav-primary > a {
  align-items: center;
  display: inline-flex;
  min-height: 44px;
  position: relative;
}

.site-nav-primary > a::after {
  background: var(--clay);
  bottom: .18rem;
  content: "";
  height: 2px;
  left: 0;
  opacity: 0;
  position: absolute;
  transform: scaleX(.4);
  transition: opacity .16s ease, transform .16s ease;
  width: 100%;
}

.site-nav-primary > a:hover::after,
.site-nav-primary > a[aria-current="page"]::after { opacity: 1; transform: scaleX(1); }

.site-nav-more { position: relative; }
.site-nav-more summary {
  align-items: center;
  display: inline-flex;
  gap: .25rem;
  list-style: none;
  min-height: 44px;
}
.site-nav-more summary::-webkit-details-marker { display: none; }
.site-nav-more summary .ff-icon { height: 1rem; transition: transform .16s ease; width: 1rem; }
.site-nav-more[open] summary .ff-icon { transform: rotate(180deg); }

.site-nav-menu {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-2);
  display: grid;
  gap: .2rem;
  padding: .55rem;
  position: absolute;
  right: 0;
  top: calc(100% + .45rem);
  width: min(22rem, calc(100vw - 2rem));
}

.site-nav-menu a {
  border-radius: 8px;
  display: grid;
  gap: .15rem;
  padding: .8rem;
}
.site-nav-menu a:hover { background: var(--sky); }
.site-nav-menu strong { font-size: .92rem; }
.site-nav-menu span { color: var(--muted); font-size: .78rem; font-weight: 500; line-height: 1.45; }

.nav-account { padding: .7rem .25rem; }
.nav-cta,
.button {
  align-items: center;
  border-radius: 8px;
  display: inline-flex;
  justify-content: center;
  letter-spacing: -.01em;
}
.nav-cta { white-space: nowrap; }
.button:hover,
.nav-cta:hover { transform: translateY(-1px); }

.button:active,
.nav-cta:active {
  background: #164b41;
  border-color: #164b41;
  color: #fff;
  transform: translateY(0);
}

.button--secondary:active {
  background: rgba(18, 60, 54, .12);
  border-color: var(--ink);
  color: var(--ink);
}

button:disabled,
.button:disabled,
.button:disabled:hover,
.button[aria-disabled="true"],
.nav-cta[aria-disabled="true"] {
  background: #e7e2d6;
  border-color: #aaa397;
  color: #56625d;
  cursor: not-allowed;
  opacity: 1;
  transform: none;
}

.button[aria-disabled="true"],
.nav-cta[aria-disabled="true"] { pointer-events: none; }

.hero,
.section {
  max-width: 1280px;
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
}

.section { padding-bottom: clamp(3.5rem, 7vw, 6.5rem); padding-top: clamp(2rem, 5vw, 4.5rem); }
.section + .section { padding-top: 0; }
.section-head { align-items: end; gap: 2rem; margin-bottom: clamp(1.4rem, 3vw, 2.2rem); }
.section-head h2 { margin-bottom: .45rem; }
.section-head p { color: var(--muted); margin: 0; max-width: 44rem; }

.section h2,
.card h2,
.panel h2 {
  letter-spacing: -.025em;
}

.card-grid,
.feature-grid { gap: clamp(.8rem, 2vw, 1.35rem); }

.card,
.panel,
.public-form-card {
  background: color-mix(in srgb, var(--paper) 98%, var(--sky));
  border-color: rgba(18, 60, 54, .14);
  border-radius: 14px;
}

.card,
.panel { padding: clamp(1.2rem, 2.6vw, 1.75rem); }
.card { min-height: 0; }
.icon-card { min-height: 17rem; }
.icon-card > .ff-icon,
.icon-panel > .ff-icon { background: var(--sky); border-radius: 8px; color: var(--forest); }

.site-footer {
  background: #103a34;
  display: block;
  padding: 0;
}

.site-footer-main {
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
  grid-template-columns: minmax(16rem, 1.6fr) repeat(3, minmax(8rem, .7fr));
  margin: 0 auto;
  max-width: 1480px;
  padding: clamp(3rem, 6vw, 5.5rem) var(--page-gutter);
}

.site-footer-brand { max-width: 24rem; }
.site-footer-brand strong { font: 600 clamp(1.45rem, 2vw, 2rem)/1.1 var(--serif); }
.site-footer-brand p { color: rgba(255, 255, 255, .72); }
.site-footer-brand > a { font-weight: 700; }
.site-footer-main nav { align-content: start; display: grid; gap: .7rem; }
.site-footer-main nav strong { color: #fff; font-size: .82rem; letter-spacing: .04em; }
.site-footer-main nav a { color: rgba(255, 255, 255, .76); text-decoration: none; }
.site-footer-main nav a:hover,
.site-footer-brand > a:hover { color: #fff; text-decoration: underline; }

.site-footer-bottom {
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, .14);
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1480px;
  padding: 1.2rem var(--page-gutter) 1.5rem;
}
.site-footer-bottom p { color: rgba(255, 255, 255, .58); font-size: .78rem; margin: 0; max-width: 54rem; }
.site-footer-bottom nav { display: flex; flex: 0 0 auto; gap: 1rem; }
.site-footer-bottom a { color: rgba(255, 255, 255, .76); font-size: .8rem; }

.site-toast {
  background: var(--ink);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 9px;
  bottom: calc(1rem + env(safe-area-inset-bottom));
  box-shadow: var(--shadow-2);
  color: #fff;
  font-size: .9rem;
  font-weight: 700;
  left: 50%;
  max-width: calc(100vw - 2rem);
  opacity: 0;
  padding: .75rem 1rem;
  pointer-events: none;
  position: fixed;
  transform: translate(-50%, .75rem);
  transition: opacity .18s ease, transform .18s ease;
  z-index: 100;
}
.site-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1060px) {
  .site-nav { gap: .7rem; }
  .site-nav-primary { gap: .65rem; }
  .site-nav a,
  .site-nav summary { font-size: .82rem; }
}

@media (max-width: 920px) {
  :root { --header-height: 72px; }
  body.nav-open { overflow: hidden; }
  .site-header-inner { height: var(--header-height); }
  .brand-logo { height: 2.8rem; width: 7rem; }
  .site-nav {
    align-items: stretch;
    background: var(--paper);
    border: 0;
    border-top: 1px solid var(--line);
    bottom: 0;
    display: flex;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    flex-direction: column;
    gap: 1.5rem;
    justify-content: flex-start;
    left: 0;
    overflow-y: auto;
    padding: 1.25rem var(--page-gutter) calc(2rem + env(safe-area-inset-bottom));
    position: fixed;
    right: 0;
    top: var(--header-height);
  }
  .site-nav.is-open { visibility:visible; opacity:1; pointer-events:auto; transform:none; }
  @media(prefers-reduced-motion:reduce){.site-nav { transition:none; transform:none; }}
  .site-nav-primary,
  .site-nav-actions { align-items: stretch; display: grid; gap: .25rem; }
  .site-nav-primary > a,
  .site-nav-more summary,
  .nav-account {
    border-bottom: 1px solid var(--line);
    font-size: 1.05rem;
    min-height: 52px;
    padding: .8rem .15rem;
  }
  .site-nav-primary > a::after { display: none; }
  .site-nav-more summary { justify-content: space-between; width: 100%; }
  .site-nav-more { position: static; }
  .site-nav-menu {
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
    padding: .35rem 0 .85rem;
    position: static;
    width: 100%;
  }
  .site-nav-actions { margin-top: auto; }
  .nav-account { text-align: center; }
  .nav-cta { min-height: 50px; }
  .site-footer-main { grid-template-columns: 1fr 1fr; }
  .site-footer-brand { grid-column: 1 / -1; }
  .site-footer-bottom { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .site-footer-bottom nav { flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .section { padding-bottom: 3.75rem; padding-top: 2.75rem; }
  .section + .section { padding-top: 0; }
  .section-head { gap: 1.1rem; }
  .site-footer-main { grid-template-columns: 1fr 1fr; }
  .site-footer-brand { grid-column: 1 / -1; }
  .site-footer-bottom { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .site-footer-bottom nav { flex-wrap: wrap; }
}

@media (max-width: 430px) {
  .site-footer-main { grid-template-columns: 1fr; }
  .site-footer-brand { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .nav-cta,
  .site-nav-primary > a::after,
  .site-toast { transition: none; }
  .button:hover,
  .nav-cta:hover { transform: none; }
}

/* Keep supporting copy readable without overriding every component's type
   scale. A universal inherited size erased the hero and metric hierarchy. */
small { font-size: max(.875rem, .85em); }
.site-nav-menu span,
.site-footer-main nav strong,
.site-footer-bottom p,
.site-footer-bottom a { font-size: .875rem; }
p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }

/* Early onboarding uses the public site stylesheet, including on the gated host. */
.farmer-signup{max-width:720px;margin:0 auto;padding:clamp(24px,5vw,64px) 20px;color:#26391e}
.farmer-signup h1,.farmer-signup h2,.sponsor-farmer h2{text-wrap:balance}
.farmer-signup h1{font-size:clamp(32px,5vw,52px);margin-top:32px}
.farmer-signup p{line-height:1.7}
.farmer-search,.farmer-form{background:#fffdf6;border:1px solid #d8d9bc;border-radius:24px;padding:clamp(20px,4vw,36px);margin-top:28px}
.farmer-form,.farmer-search form{display:flex;flex-direction:column;gap:12px}
.farmer-form label,.farmer-search label{font-weight:700;margin-top:12px}
.farmer-signup input:not([type=checkbox]),.farmer-signup select{width:100%;min-width:0;min-height:48px;border:1px solid #82956b;border-radius:10px;background:white;color:#26391e;padding:12px;font:inherit;font-size:16px;box-sizing:border-box}
.farmer-signup button{min-height:48px;border:0;border-radius:10px;padding:12px 20px;background:#293d20;color:white;font:inherit;font-weight:700;cursor:pointer}
.farmer-search-row{display:flex;gap:12px}.farmer-search-row button{flex-shrink:0}
.farmer-check{display:flex;gap:12px;align-items:flex-start;font-weight:400!important;line-height:1.6}.farmer-check input{width:22px;height:22px;flex-shrink:0;margin-top:2px;accent-color:#476a28}
.farmer-help{font-size:14px;margin:0}.farmer-error{border-left:4px solid #a62c24;padding:12px;background:#fff0e9}
.sponsor-farmer{display:grid;grid-template-columns:190px 1fr;gap:clamp(24px,5vw,64px);align-items:center;padding:clamp(24px,5vw,56px);margin:40px 0;border:1px solid #a9b879;border-radius:28px;background:#edf0cc;scroll-margin-top:110px}
.sponsor-farmer img{width:100%;height:auto;transform:rotate(-5deg);filter:drop-shadow(0 12px 12px #26391e26)}
.sponsor-farmer h2{margin:0 0 16px;font-size:clamp(28px,4vw,42px)}.sponsor-farmer p{max-width:65ch;line-height:1.7}.sponsor-farmer small{display:block;margin-top:12px;font-size:14px}
@media(max-width:600px){.farmer-search-row{flex-direction:column}.sponsor-farmer{grid-template-columns:1fr}.sponsor-farmer img{width:130px;margin:auto}.sponsor-farmer .sponsor-primary{width:100%;box-sizing:border-box}}

}
