/* CropFarming.net blocks
   One file, loaded in the editor and on the front end, so both match. */

:root{
  /* Every farming site reaches for green plus brown or green plus gold.
     Half of every field photograph is sky, and nobody uses it. This palette
     runs on fresh field green with an irrigation blue as the second accent,
     and keeps wheat gold for rules and washes only, never for text. */
  --cfn-field:#2E7D4F;
  --cfn-field-dark:#24643E;
  --cfn-field-soft:#7FB894;
  --cfn-sky:#3E7C9B;
  --cfn-sky-dark:#31647E;
  --cfn-wheat:#D99A1F;
  --cfn-straw:#D99A1F;      /* kept so older saved blocks keep working */
  --cfn-soil:#8A6E4B;
  --cfn-furrow:#16241B;
  --cfn-ink:#2F382F;
  --cfn-muted:#616B62;
  --cfn-tint:#F2F8F3;
  --cfn-tint-sky:#F1F6F9;
  --cfn-tint-warm:#FDF9F0;
  --cfn-line:#E2E9E3;
  --cfn-r:5px;
  --cfn-head-font:Bitter,Georgia,"Times New Roman",serif;
  --cfn-body-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ---------- section shell ---------- */
.cfn-sec{
  font-family:var(--cfn-body-font);
  color:var(--cfn-ink);
  font-size:17px;
  line-height:1.62;
  padding-top:64px;
  padding-bottom:64px;
}
.cfn-sec *{box-sizing:border-box}
.cfn-wrap{max-width:1140px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}

.cfn-sec h1,.cfn-sec h2,.cfn-sec h3{
  font-family:var(--cfn-head-font);
  color:var(--cfn-furrow);
  margin:0 0 .5em;
  line-height:1.22;
  font-weight:700;
}
.cfn-sec h1{font-size:clamp(2rem,4.4vw,3.05rem);letter-spacing:-.015em}
.cfn-sec h2{font-size:clamp(1.45rem,2.6vw,2rem);letter-spacing:-.01em}
.cfn-sec h3{font-size:1.1rem;font-weight:600}
.cfn-sec p{margin:0 0 1rem;max-width:68ch}
.cfn-sec .cfn-lede{margin-bottom:0}
.cfn-sec a{color:var(--cfn-field);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.cfn-sec a:hover{color:var(--cfn-field-dark)}
.cfn-sec a:focus-visible{outline:2px solid var(--cfn-field);outline-offset:3px;border-radius:2px}
.cfn-sec img{max-width:100%;height:auto}
.cfn-lede{font-size:1.06rem;color:var(--cfn-muted);max-width:64ch}

/* ---------- hero ---------- */
.cfn-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:start}
.cfn-hero .cfn-lede{font-size:1.14rem}
.cfn-shot{margin:22px 0 0}
.cfn-shot .cfn-frame{
  position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;
  border-radius:var(--cfn-r);border:1px solid var(--cfn-line);
  background:linear-gradient(175deg,#EAF0E6 0%,#DCE6D6 45%,#D3DECB 100%);
}
.cfn-shot img{width:100%;height:100%;object-fit:cover;display:block}
.cfn-cta{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 20px}
.cfn-btn{
  display:inline-block;padding:12px 22px;border-radius:var(--cfn-r);
  font-weight:600;font-size:.98rem;text-decoration:none;border:1px solid transparent;
  cursor:pointer;line-height:1.4;
}
.cfn-btn-1{background:var(--cfn-field);color:#fff}
.cfn-btn-1:hover{background:var(--cfn-field-dark);color:#fff}
.cfn-btn-2{background:transparent;color:var(--cfn-furrow);border-color:var(--cfn-line)}
.cfn-btn-2:hover{border-color:var(--cfn-field);color:var(--cfn-field)}
.cfn-btn--sm{padding:9px 17px;font-size:.92rem}
.cfn-btn--lg{padding:15px 28px;font-size:1.05rem}
.cfn-sec .cfn-sourced{font-size:.9rem;color:var(--cfn-muted);margin:0;max-width:56ch}
.cfn-sourced strong{color:var(--cfn-furrow);font-weight:600}

.cfn-panel{border:1px solid var(--cfn-line);border-top:3px solid var(--cfn-sky);border-radius:var(--cfn-r);background:#fff}
.cfn-panel-hd{padding:14px 18px 12px;border-bottom:1px solid var(--cfn-line)}
.cfn-panel-hd h2{font-size:1.02rem;margin:0 0 2px}
.cfn-sec .cfn-panel-hd p{font-size:.85rem;color:var(--cfn-muted);margin:0;max-width:none}
.cfn-temp{width:100%;border-collapse:collapse;font-size:.95rem}
.cfn-temp th{text-align:left;font-weight:600;color:var(--cfn-muted);font-size:.82rem;padding:9px 18px;border-bottom:1px solid var(--cfn-line)}
.cfn-temp th:last-child{text-align:right}
.cfn-temp td{padding:9px 18px;border-bottom:1px solid var(--cfn-line)}
.cfn-temp tr:last-child td{border-bottom:0}
.cfn-temp td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;color:var(--cfn-furrow)}
.cfn-panel-ft{padding:12px 18px;font-size:.84rem;color:var(--cfn-muted);background:var(--cfn-tint);border-radius:0 0 var(--cfn-r) var(--cfn-r)}
.cfn-sec .cfn-panel-ft p{margin:0;max-width:none}

/* ---------- two text columns ---------- */
.cfn-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,52px)}

/* ---------- crop rows ---------- */
.cfn-rows{margin-top:28px;border-top:1px solid var(--cfn-line)}
.cfn-row{
  display:grid;grid-template-columns:184px 1fr auto;gap:20px;align-items:baseline;
  padding:17px 0 17px 16px;border-bottom:1px solid var(--cfn-line);border-left:3px solid var(--cfn-field);
}
.cfn-sec .cfn-row h3{margin:0}
.cfn-row h3 a{text-decoration:none;color:var(--cfn-furrow)}
.cfn-row h3 a:hover{color:var(--cfn-field);text-decoration:underline;text-underline-offset:3px}
.cfn-sec .cfn-row p{margin:0;font-size:.95rem;color:var(--cfn-muted);max-width:60ch}
.cfn-row-count{font-size:.85rem;color:var(--cfn-muted);white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---------- steps ---------- */
.cfn-steps{counter-reset:cfnstep;display:grid;grid-template-columns:repeat(2,1fr);gap:26px 40px;margin-top:26px}
.cfn-step{padding-left:46px;position:relative}
.cfn-step:before{
  counter-increment:cfnstep;content:counter(cfnstep);
  position:absolute;left:0;top:1px;width:30px;height:30px;border-radius:50%;
  background:var(--cfn-field);color:#fff;font-weight:600;font-size:.92rem;
  display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;
}
.cfn-sec .cfn-step h3{margin:2px 0 6px}
.cfn-sec .cfn-step p{margin:0;font-size:.96rem;color:var(--cfn-muted)}

/* ---------- timeline ---------- */
.cfn-tl{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;border-top:2px solid var(--cfn-line)}
.cfn-tl-item{padding:18px 18px 0 0;border-right:1px solid var(--cfn-line);position:relative}
.cfn-tl-item:last-child{border-right:0}
.cfn-tl-item:before{content:"";position:absolute;top:-6px;left:0;width:9px;height:9px;border-radius:50%;background:var(--cfn-field)}
.cfn-tl-item b{display:block;font-family:var(--cfn-head-font);color:var(--cfn-furrow);font-size:1.02rem;margin-bottom:3px}
.cfn-sec .cfn-tl-item span{font-size:.93rem;color:var(--cfn-muted);display:block}

/* ---------- paths ---------- */
.cfn-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:26px}
.cfn-path{border-top:2px solid var(--cfn-field);padding-top:16px}
.cfn-sec .cfn-path h3{margin:0 0 7px}
.cfn-sec .cfn-path p{margin:0;font-size:.96rem;color:var(--cfn-muted)}
.cfn-after{margin-top:26px}

/* ---------- chips ---------- */
.cfn-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.cfn-chip{
  border:1px solid var(--cfn-line);border-radius:var(--cfn-r);padding:9px 15px;
  font-size:.95rem;text-decoration:none;color:var(--cfn-furrow);background:#fff;
}
.cfn-chip:hover{border-color:var(--cfn-field);color:var(--cfn-field)}

/* ---------- articles ---------- */
.cfn-arts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 30px;margin-top:26px}
.cfn-art{border-top:1px solid var(--cfn-line);padding-top:15px}
.cfn-art-cat{font-size:.82rem;color:var(--cfn-field);text-decoration:none;font-weight:600;display:inline-block}
.cfn-sec .cfn-art h3{margin:5px 0 6px;font-size:1.02rem}
.cfn-art h3 a{text-decoration:none;color:var(--cfn-furrow)}
.cfn-art h3 a:hover{color:var(--cfn-field);text-decoration:underline;text-underline-offset:3px}
.cfn-sec .cfn-art p{margin:0;font-size:.93rem;color:var(--cfn-muted)}

/* ---------- how we work ---------- */
.cfn-work{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,52px);align-items:start}
.cfn-srcs{list-style:none;margin:16px 0 0;padding:0;columns:2;column-gap:28px}
.cfn-sec .cfn-srcs li{font-size:.94rem;color:var(--cfn-muted);padding:5px 0;break-inside:avoid}
.cfn-srcs li strong{color:var(--cfn-furrow);font-weight:600}

/* ---------- contact ---------- */
.cfn-contact{border:1px solid var(--cfn-line);border-left:3px solid var(--cfn-wheat);border-radius:var(--cfn-r);padding:26px 28px;background:#fff}
.cfn-contact h2{font-size:1.25rem}
.cfn-sec .cfn-contact p{margin-bottom:.4rem}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .cfn-hero-grid,.cfn-two,.cfn-work{grid-template-columns:1fr}
  .cfn-arts,.cfn-paths,.cfn-steps{grid-template-columns:1fr 1fr}
  .cfn-tl{grid-template-columns:1fr 1fr}
  .cfn-tl-item{border-right:0;border-bottom:1px solid var(--cfn-line);padding-bottom:16px}
}
@media (max-width:620px){
  .cfn-sec{font-size:16px;padding-top:44px;padding-bottom:44px}
  .cfn-arts,.cfn-paths,.cfn-steps,.cfn-tl{grid-template-columns:1fr}
  .cfn-row{grid-template-columns:1fr;gap:5px}
  .cfn-row-count{grid-row:1}
  .cfn-srcs{columns:1}
  .cfn-shot .cfn-frame{aspect-ratio:16/10}
}
@media (prefers-reduced-motion:reduce){
  .cfn-sec *{animation:none !important;transition:none !important}
}


/* =====================================================================
 * About page blocks
 * ===================================================================== */

/* ---------- page header ---------- */
.cfn-phead h1{max-width:20ch}
.cfn-phead .cfn-lede{font-size:1.14rem;max-width:66ch}
.cfn-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:30px;border-top:2px solid var(--cfn-line)}
.cfn-stat{padding:16px 30px 0 0;margin-right:30px;border-right:1px solid var(--cfn-line);position:relative}
.cfn-stat:last-child{border-right:0;margin-right:0;padding-right:0}
.cfn-stat:before{content:"";position:absolute;top:-6px;left:0;width:9px;height:9px;border-radius:50%;background:var(--cfn-field)}
.cfn-stat b{display:block;font-family:var(--cfn-head-font);font-size:1.6rem;color:var(--cfn-furrow);line-height:1.1}
.cfn-sec .cfn-stat span{font-size:.9rem;color:var(--cfn-muted);display:block}

/* ---------- team ---------- */
.cfn-team{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 30px;margin-top:30px}
.cfn-member{border-top:2px solid var(--cfn-field)}
.cfn-member .cfn-ph{
  width:100%;aspect-ratio:1/1;margin-top:18px;overflow:hidden;
  border:1px solid var(--cfn-line);border-radius:var(--cfn-r);
  background:linear-gradient(175deg,#EAF0E6 0%,#DCE6D6 100%);
}
.cfn-member .cfn-ph img{width:100%;height:100%;object-fit:cover;display:block}
.cfn-sec .cfn-member h3{margin:14px 0 2px;font-size:1.06rem}
.cfn-sec .cfn-member .cfn-role{font-size:.9rem;color:var(--cfn-field);font-weight:600;margin:0 0 7px}
.cfn-sec .cfn-member p{margin:0 0 9px;font-size:.94rem;color:var(--cfn-muted)}
.cfn-member a.cfn-fb{font-size:.9rem;text-decoration:none;border-bottom:1px solid var(--cfn-line);padding-bottom:1px}
.cfn-member a.cfn-fb:hover{border-bottom-color:var(--cfn-field)}

/* ---------- standards ---------- */
.cfn-rules{display:grid;grid-template-columns:1fr 1fr;gap:20px 40px;margin-top:26px;list-style:none;padding:0}
.cfn-sec .cfn-rules li{padding-left:20px;position:relative;font-size:.98rem;color:var(--cfn-ink)}
.cfn-rules li:before{content:"";position:absolute;left:0;top:.62em;width:8px;height:2px;background:var(--cfn-field)}
.cfn-rules li strong{color:var(--cfn-furrow);font-weight:600}

/* ---------- note ---------- */
.cfn-note{border-left:3px solid var(--cfn-field);padding:2px 0 2px 20px;margin:24px 0 0}
.cfn-sec .cfn-note p{margin:0;color:var(--cfn-muted);font-size:.98rem;max-width:74ch}

@media (max-width:900px){
  .cfn-team{grid-template-columns:1fr 1fr}
  .cfn-rules{grid-template-columns:1fr}
}
@media (max-width:620px){
  .cfn-team{grid-template-columns:1fr}
  .cfn-stats{flex-direction:column}
  .cfn-stat{border-right:0;border-bottom:1px solid var(--cfn-line);margin-right:0;padding:16px 0 14px}
  .cfn-stat:last-child{border-bottom:0}
}




/* ---------- methods grid ---------- */
.cfn-methods{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 30px;margin-top:28px}
.cfn-method{border-left:3px solid var(--cfn-field);padding:2px 0 2px 16px}
.cfn-sec .cfn-method h3{margin:0 0 6px;font-size:1.04rem}
.cfn-sec .cfn-method p{margin:0;font-size:.95rem;color:var(--cfn-muted)}

/* ---------- faq ---------- */
.cfn-faq{margin-top:26px;border-top:1px solid var(--cfn-line)}
.cfn-faq-item{padding:20px 0;border-bottom:1px solid var(--cfn-line)}
.cfn-sec .cfn-faq-item h3{margin:0 0 7px;font-size:1.05rem}
.cfn-sec .cfn-faq-item p{margin:0;color:var(--cfn-muted);max-width:76ch}

/* ---------- contact box ---------- */
.cfn-contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,3vw,44px);align-items:start}
.cfn-mail{list-style:none;margin:18px 0 0;padding:0}
.cfn-mail li{padding:11px 0;border-top:1px solid var(--cfn-line)}
.cfn-mail li:first-child{border-top:0;padding-top:0}
.cfn-mail-label{display:block;font-size:.82rem;color:var(--cfn-muted);margin-bottom:2px}
.cfn-mail a{font-weight:600;text-decoration:none;border-bottom:1px solid var(--cfn-line)}
.cfn-mail a:hover{border-bottom-color:var(--cfn-field)}
.cfn-social-head{font-size:.82rem;color:var(--cfn-muted);margin:0 0 10px;display:block}
.cfn-social{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.cfn-social a{
  display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;border:1px solid var(--cfn-line);border-radius:var(--cfn-r);
  color:var(--cfn-furrow);text-decoration:none;background:#fff;
}
.cfn-social a:hover{border-color:var(--cfn-field);color:var(--cfn-field)}
.cfn-social svg{width:17px;height:17px;display:block;fill:currentColor}
.cfn-contact-note{font-size:.86rem;color:var(--cfn-muted);margin:18px 0 0;padding-top:14px;border-top:1px solid var(--cfn-line)}

@media (max-width:900px){
  .cfn-methods{grid-template-columns:1fr 1fr}
  .cfn-contact-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  .cfn-methods{grid-template-columns:1fr}
}


/* ---------- link underlines ----------
   A theme setting that underlines every link also underlines button text,
   chips, and icon links, which is not what an underline is for. This turns
   it off for those, at a specificity a theme rule cannot beat, and leaves
   real content links underlined. */
/* The class is repeated on purpose. Kadence writes its underline rule as
   .entry-content a:not(.button), which is 0,2,1 and would tie a single
   .cfn-sec prefix. Repeating the class reaches 0,3,1 and wins cleanly,
   which is preferable to !important because you can still override it. */
.cfn-sec.cfn-sec a.cfn-btn,
.cfn-sec.cfn-sec a.cfn-btn:hover,
.cfn-sec.cfn-sec a.cfn-btn:focus,
.cfn-sec.cfn-sec a.cfn-chip,
.cfn-sec.cfn-sec a.cfn-chip:hover,
.cfn-sec.cfn-sec a.cfn-art-cat,
.cfn-sec.cfn-sec .cfn-mail a,
.cfn-sec.cfn-sec .cfn-social a,
.cfn-sec.cfn-sec .cfn-row h3 a,
.cfn-sec.cfn-sec .cfn-art h3 a,
.cfn-sec.cfn-sec .cfn-member a.cfn-fb{
  text-decoration:none;
  text-underline-offset:0;
}

/* Heading links still underline on hover, which is where it helps. */
.cfn-sec.cfn-sec .cfn-row h3 a:hover,
.cfn-sec.cfn-sec .cfn-art h3 a:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}

/* These carry their own bottom border, so a text underline would double it. */
.cfn-sec.cfn-sec .cfn-mail a:hover,
.cfn-sec.cfn-sec .cfn-member a.cfn-fb:hover{text-decoration:none}

/* Content links keep the underline. This is the one place it belongs. */
.cfn-sec .cfn-lede a,
.cfn-sec .cfn-panel-ft a,
.cfn-sec .cfn-note a,
.cfn-sec .cfn-after a,
.cfn-sec .cfn-contact-note a{text-decoration:underline;text-underline-offset:2px}

/* ---------- theme reset ----------
   Block themes add vertical rhythm with rules like .entry-content > * + *.
   Those win on specificity and push our rows apart. This cancels the effect
   inside our sections without touching the rest of the page. */
.entry-content .cfn-sec,
.entry-content .cfn-sec *{margin-block-start:revert;margin-block-end:revert}
.entry-content > .cfn-sec{margin-top:0;margin-bottom:0}
.entry-content .cfn-sec .cfn-rows > * + *,
.entry-content .cfn-sec .cfn-steps > * + *,
.entry-content .cfn-sec .cfn-arts > * + *,
.entry-content .cfn-sec .cfn-paths > * + *,
.entry-content .cfn-sec .cfn-team > * + *{margin-top:0}
.cfn-sec > *:last-child,
.cfn-sec .cfn-wrap > *:last-child{margin-bottom:0}

/* ---------- editor parity ----------
   The editor wraps blocks in extra elements. These rules stop that wrapper
   from changing width or spacing, so what you see is what publishes. */
.editor-styles-wrapper .cfn-sec{max-width:none}
.editor-styles-wrapper .cfn-wrap{max-width:1140px}
.editor-styles-wrapper .cfn-sec h1,
.editor-styles-wrapper .cfn-sec h2,
.editor-styles-wrapper .cfn-sec h3{font-family:var(--cfn-head-font)}
.editor-styles-wrapper .cfn-sec p,
.editor-styles-wrapper .cfn-sec li,
.editor-styles-wrapper .cfn-sec td{font-family:var(--cfn-body-font)}
.cfn-sec .block-editor-rich-text__editable:focus{outline:1px dashed var(--cfn-field);outline-offset:2px}
.cfn-repeat-hint{font-size:12px;color:#757575;margin:6px 0 0}
