/*
 * blackwood.css: the CSS on blackwoodland.org that Webflow cannot express natively.
 *
 * Every page loads it from one line in Site settings → Custom code → Head:
 *   <link rel="stylesheet" href="https://site-blackwoodland-integrations.developer-753.workers.dev/blackwood.css">
 * Edit it here and deploy (see README); never paste CSS back into Webflow.
 *
 * House rule (build-standard §1): native Webflow first, meaning classes, conditional visibility
 * and variables. A rule lives here only when Webflow cannot express it, and each block says why
 * and where it used to live. Moved out of Webflow 2026-09-29.
 *
 * The link sits after Webflow's own stylesheets, as the inline copies did, so a specificity tie
 * with a Webflow class still goes to these rules. The rules that came from body embeds now load
 * before the Global Styles embed instead of after it; none of them ties with a Global Styles rule.
 */

/* ── Every page ─────────────────────────────────────────────────────────── */

/* Crisper type on macOS. Webflow's Style panel has no font-smoothing control.
   Was: Site settings head code ("Keep this css code to improve the font quality").
   Its third line, -o-font-smoothing, was dropped: no browser ever implemented it. */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Two-line clamp with an ellipsis on .is-truncated card text (Home, /on-the-farm,
   /the-field-library, /get-involved/get-involved). The class's combo styles
   (.text-size-regular.is-truncated, .heading-style-h5.is-truncated) stay native in Webflow.
   Only the clamp is here: it needs display: -webkit-box and -webkit-line-clamp, which the
   Style panel does not offer, and Webflow's style API refuses the set outright ("Invalid style
   property -webkit-box-orient", tried on the global class 2026-09-29). Was: Site settings head code. */
.is-truncated {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Programs template (/programs/<slug>) ───────────────────────────────── */

/* Hide Upcoming Events when the program has none, i.e. when the section's Collection List
   renders its empty state. Conditional visibility cannot test whether a list is empty.
   Scoped to the Programs template by its page id, because /events, /programs and
   /program-categories use the same section and never had this rule.
   Was: an embed inside .program-body_component on the Programs template. */
html[data-wf-page="69d8464ea6899ebdeb576279"] .section_events:has(.featured-events_list-wrapper .w-dyn-empty) {
  display: none;
}

/* ── Home ───────────────────────────────────────────────────────────────── */

/* Hero background loop. The <video> is markup inside the embed .home_hero_split_video (the
   file comes from the R2 media Worker), so it has no Webflow class to style. Was: that embed. */
.bw-hero-loop {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background-color: #213815;
}

/* Navbar Menu label and hamburger over the pale split hero, desktop only.
   home-nav-on-light.js adds .is-on-light to .navbar_component while the navbar is still
   transparent over the pale green panel (white on #a9ada3 is 2.28:1), and removes it once the
   GSAP interaction has filled the navbar with --pale-dark. Below 992px the hero stacks and the
   navbar sits over the video. Was: the unclassed embed at the top of .section_home_hero, which
   still loads the script.

   ---- Two things here look like they could be tidied up. Neither can. ----

   1) !important is load-bearing. The hamburger's open/close morph is a CLASSIC (IX2)
      interaction, and IX2 animates by writing INLINE style. Opening the menu once leaves
      inline background-color on .menu-icon_line-middle (rgb(52,66,54)) and, on close,
      .menu-icon_line-middle-base (rgb(255,255,255)), which sits at the SAME coordinates
      as -middle, so the middle bar renders white from then on. Inline beats a class rule,
      so without !important this looks correct until the first time anyone opens the menu.

   2) :not(.menu-icon_line-middle-top) is also load-bearing. That element is TRANSPARENT at
      rest and absolutely positioned with no offsets, so giving it a background paints a
      stray dash at the button's origin, on top of the Menu label.

   The :not(.w--open) guard keeps all of this off the open state, where the X must stay
   light on the dark menu panel.

   The transition rule is scoped to Home by page id. Unlike the two color rules it is not
   gated on .is-on-light, so unscoped it would reach the menu button on every page. */
@media (min-width: 992px) {
  .navbar_component.is-on-light .navbar_menu-button:not(.w--open) .navbar_menu-text.is-menu {
    color: var(--deep-dark-green) !important;
  }
  .navbar_component.is-on-light .navbar_menu-button:not(.w--open)
    [class*="menu-icon_line"]:not(.menu-icon_line-middle-top) {
    background-color: var(--deep-dark-green) !important;
  }
  html[data-wf-page="69bab3aeaf0f5bdce0cd463c"] .navbar_menu-text.is-menu,
  html[data-wf-page="69bab3aeaf0f5bdce0cd463c"] [class*="menu-icon_line"] {
    transition: color .15s linear, background-color .15s linear;
  }
}

/* ── Contact component (Home and /contact) ──────────────────────────────── */

/* Section background loop. The <video> is markup inside the component's embed
   .contact_background-video, so it has no Webflow class to style. Was: that embed. */
.bw-contact-video {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: .75rem;
  background-color: #213815;
}

/* ── The Field Library listing (/the-field-library) ─────────────────────── */

/* Card meta line: a Field Notes series entry shows its number in place of its date, so every
   card has one meta line and the titles stay on one baseline in a mixed row. The number hides
   itself when empty (.w-dyn-bind-empty). The date is hidden here rather than by conditional
   visibility because a failed condition removes the element from the page, and Finsweet List
   sorts these cards by reading [fs-list-field="date"]: a numbered card would lose its sort key.
   :has() is needed because the date comes BEFORE the number in the DOM.
   LOAD-BEARING STRUCTURE: the date and .field-library_note-number must stay direct children of
   .home_programs_main_heading-wrapper.
   Was: /the-field-library page head code. */
.home_programs_main_heading-wrapper:has(.field-library_note-number:not(.w-dyn-bind-empty)) > [fs-list-field="date"] {
  display: none;
}

/* ── Field Library template: custom layout (Edible Wildscapes) ──────────── */

/* Typography inside the custom layout's two bound Rich Text blocks, matching .text-rich-text so
   the custom branch reads like a standard field note. Nested rich-text styles can only be set in
   the Designer by clicking into the content, where a slip styles every paragraph on the site,
   and the :first-child/:last-child resets have no native form, so the set stays together here.
   Only the custom-layout page carries these classes.
   Was: the embed .field-note_stylesheet inside .field-note_custom. */
.field-note_prose p { margin-bottom: 1rem; }
.field-note_prose ul,
.field-note_prose ol { margin-top: 0; margin-bottom: 1rem; padding-left: 1.5rem; }
.field-note_prose li { margin-bottom: 0.4rem; }
.field-note_prose h2 { margin-top: 2rem; margin-bottom: 0.75rem; }
.field-note_prose > *:first-child { margin-top: 0; }
.field-note_prose > *:last-child { margin-bottom: 0; }
.field-note_prose a,
.field-note_plant_notes a { font-weight: 700; text-decoration: underline; color: inherit; }

.field-note_plant_notes ul,
.field-note_plant_notes ol { margin: 0; padding-left: 1.15rem; }
.field-note_plant_notes li { margin-bottom: 0.4rem; }
.field-note_plant_notes li:last-child { margin-bottom: 0; }
.field-note_plant_notes p:last-child { margin-bottom: 0; }