/*
Theme Name: Agrezen Child
Theme URI: https://zozothemes.com/
Author: ZozoThemes
Author URI: https://zozothemes.com/
Description: Child theme for Agrezen parent theme.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: agrezen
Template: agrezen
Tags: one-column, two-columns, right-sidebar, flexible-header, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain: zozothemes
*/

/* ==== ZW ADDITIONS START ==== */
/* ==========================================================================
   Zenwholesalers — child theme additions
   Single source of truth. Rebuild this whole file; never append blindly.
   Sections: 1 tokens · 2 footer · 3 header/nav · 4 homepage · 5 articles
             6 review carousel · 7 theme cleanup · 8 affiliate listings
             9 quote-only products · 10 raw sea moss catalogue · 11 quote form
             12 botanical specimen sheets
   ========================================================================== */

/* ---- 1. tokens --------------------------------------------------------- */
:root {
  --zw-brand: #90C52D;
  --zw-lime:  #DCE25A;
  --zw-ink:   #181818;
  --zw-body:  #4E4E4E;
  --zw-cream: #FAF7F0;
  --zw-deep:  #394E10;
  --zw-line:  #E6E3DA;
  --zw-ease:  cubic-bezier(.2, .8, .2, 1);
}

/* ---- 2. footer columns ------------------------------------------------- */
.zwf { font-family: "DM Sans", "Nunito Sans", system-ui, sans-serif; }
.zwf__brand { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; text-decoration: none; }
.zwf__brand span {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 26px; letter-spacing: -1px; color: #fff; line-height: 1;
}
.zwf__brand b { color: var(--zw-lime); font-weight: 600; }
.zwf__blurb { margin: 0 0 20px; font-size: 15px; line-height: 1.7; color: rgba(255,255,255,.78); max-width: 34ch; }
.site-footer .zwf__h, .zwf .zwf__h {
  display: flex; align-items: center; gap: 10px; margin: 0 0 20px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 20px; letter-spacing: -.5px; color: #fff;
}
.site-footer .zwf__h::before, .zwf .zwf__h::before {
  content: ""; width: 11px; height: 11px; flex: none; border-radius: 50%; background: var(--zw-brand);
}
.zwf__contact, .zwf__links, .zwf__legal { margin: 0; padding: 0; list-style: none; }
.zwf__contact li { margin-bottom: 14px; }
.zwf__contact li, .zwf__contact li a {
  display: flex; align-items: center; gap: 12px;
  color: rgba(255,255,255,.86); font-size: 15px; line-height: 1.5; text-decoration: none;
}
.site-footer .zwf__ico, .zwf .zwf__ico {
  flex: 0 0 40px; width: 40px !important; height: 40px !important; min-width: 40px;
  display: flex; align-items: center; justify-content: center;
  background: var(--zw-brand); color: #fff; border-radius: 12px; font-size: 17px;
  transition: transform .3s var(--zw-ease);
}
.zwf__contact a:hover { color: var(--zw-lime); }
.zwf__contact a:hover .zwf__ico { transform: translateY(-3px); }
.zwf__links li, .zwf__legal li { margin-bottom: 11px; }
.zwf__links a, .zwf__legal a {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 15px; color: rgba(255,255,255,.8); text-decoration: none;
  transition: color .3s ease, transform .3s ease;
}
.zwf__links a::before, .zwf__legal a::before {
  content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--zw-lime); opacity: .8;
}
.zwf__links a:hover, .zwf__legal a:hover { color: var(--zw-lime); transform: translateX(3px); }
.zwf__legal { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.16); }
.zwf__legal a { font-size: 14px; color: rgba(255,255,255,.62); }
.site-footer .zwf__cta, .zwf .zwf__cta {
  display: inline-flex; align-items: center; margin-bottom: 6px; padding: 14px 26px;
  background: var(--zw-lime); color: var(--zw-ink); border-radius: 15px;
  text-decoration: none; font-weight: 700; font-size: 15px;
  transition: transform .3s var(--zw-ease), background-color .3s ease, color .3s ease;
}
.site-footer .zwf__cta:hover { transform: translateY(-3px); background: var(--zw-brand); color: #fff; }
.site-footer .footer-widgets .row > [class*="col-"] { margin-bottom: 30px; }
.site-footer .widget { margin-bottom: 0; }

/* ---- 3. header + nav (also mirrored inline in wp_head for first paint) -- */
.zw-nav-cta { position: relative; overflow: hidden; isolation: isolate; }
.site-header .sub-menu { background: #fff; border-radius: 12px; overflow: hidden; padding: 8px 0; }

/* ---- 4. homepage ------------------------------------------------------- */
.elementor .zw-card-img img    { width: 100% !important; height: 220px !important; object-fit: cover !important; border-radius: 14px !important; }
.elementor .zw-variety-img img { width: 100% !important; height: 250px !important; object-fit: cover !important; border-radius: 14px !important; }
.elementor .zw-post-img img    { width: 100% !important; height: 240px !important; object-fit: cover !important; border-radius: 14px !important; }
.elementor .zw-proof-img img   { width: 100% !important; height: 420px !important; object-fit: cover !important; border-radius: 20px !important; }
.elementor .zw-card { height: 100%; }
.elementor .zw-supply-shot img {
  width: 100% !important; height: 100% !important; min-height: 560px !important;
  object-fit: cover !important; border-radius: 20px !important;
}
.zw-radial-side { position: relative; z-index: 2; }
@media (max-width: 1024px) { .elementor .zw-supply-shot img { min-height: 340px !important; } }

/* ---- 5. Learn articles ------------------------------------------------- */
.single-post .entry-content {
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 17px; line-height: 1.75; color: var(--zw-body);
}
.single-post .entry-content > * { max-width: 760px; margin-left: auto; margin-right: auto; }
.single-post .entry-content p { margin: 0 0 22px; }
.single-post .entry-content h2 {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 32px; line-height: 40px; letter-spacing: -1px;
  color: var(--zw-ink); margin: 48px 0 16px;
}
.single-post .entry-content h3 {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 22px; line-height: 30px; letter-spacing: -.5px;
  color: var(--zw-ink); margin: 34px 0 12px;
}
.single-post .entry-content ul, .single-post .entry-content ol { margin: 0 0 24px; padding-left: 22px; }
.single-post .entry-content li { margin-bottom: 10px; }
.single-post .entry-content a { color: #6E9A1F; text-decoration: underline; text-underline-offset: 3px; }
.single-post .entry-content a:hover { color: var(--zw-deep); }
.single-post .entry-content strong { color: var(--zw-ink); }

/* Pull quote.
   The parent theme decorates every blockquote with a bootstrap-icons quote
   glyph in a 60px disc, and reserves room for it with padding-left: 115px.
   It then contradicts itself: a later rule flips the pseudo to
   position: relative, so it re-enters the flow. Overriding the parent padding
   here without also pinning the glyph dropped it straight on top of the text.
   Both halves are set explicitly below - never restyle .zw-pull padding
   without moving the mark to match. */
.single-post .entry-content blockquote.zw-pull,
.zw-pull {
  position: relative;
  margin: 34px 0; padding: 28px 30px 28px 96px;
  border-left: 4px solid var(--zw-brand); background: var(--zw-cream);
  border-radius: 0 14px 14px 0;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-size: 21px; line-height: 1.5; letter-spacing: -.4px; color: var(--zw-ink);
}
.single-post .entry-content blockquote.zw-pull::before,
body .zw-pull::before {
  position: absolute;
  top: 28px;
  left: 28px;
  right: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  margin: 0;
  font-size: 20px;
  line-height: 1;
  border-radius: 50%;
  background: var(--zw-lime);
  color: var(--zw-deep);
  transform: none;
}

@media (max-width: 680px) {
  .single-post .entry-content blockquote.zw-pull,
  .zw-pull { padding: 76px 22px 24px 22px; font-size: 19px; }
  .single-post .entry-content blockquote.zw-pull::before,
  body .zw-pull::before { top: 20px; left: 22px; width: 42px; height: 42px; font-size: 18px; }
}
}
.zw-note { margin: 30px 0; padding: 20px 24px; background: var(--zw-cream); border: 1px dashed #C9CF7A; border-radius: 14px; }
.zw-note p { margin: 0 !important; font-size: 16px; }
.zw-figure { margin: 34px 0; }
.zw-figure img { width: 100%; height: auto; border-radius: 16px; display: block; }
.zw-figure figcaption { margin-top: 10px; font-size: 14px; color: #6b7280; font-style: italic; }
.zw-cta { margin: 40px 0; padding: 30px 30px 32px; background: var(--zw-deep); border-radius: 18px; color: rgba(255,255,255,.86); }
.zw-cta h3 { margin: 0 0 10px !important; color: #fff !important; font-family: "Instrument Sans", system-ui, sans-serif; font-weight: 600; font-size: 24px; letter-spacing: -.5px; }
.zw-cta p { margin: 0 0 20px !important; color: rgba(255,255,255,.86); }
.zw-cta__btn {
  display: inline-flex; align-items: center; padding: 14px 28px;
  background: var(--zw-lime); color: var(--zw-ink) !important; border-radius: 15px;
  font-weight: 700; text-decoration: none !important;
  transition: transform .3s var(--zw-ease), background-color .3s ease;
}
.zw-cta__btn:hover { transform: translateY(-3px); background: #fff; }
/* comparison tables lifted from the manuscript. The wrapper scrolls on its own
   so a wide table never makes the page scroll sideways. */
.zw-tablewrap { margin: 30px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 14px; border: 1px solid var(--zw-line); }
.zw-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; line-height: 1.6; background: #fff; }
.zw-table th, .zw-table td { padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--zw-line); }
.zw-table th {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 14px; letter-spacing: .01em;
  color: #fff; background: var(--zw-deep); border-bottom: none;
}
.zw-table tbody tr:last-child td { border-bottom: none; }
.zw-table tbody tr:nth-child(even) { background: var(--zw-cream); }
.zw-table td:empty, .zw-table th:empty { padding: 0; }

/* reference list — small, muted, wrapping long URLs rather than overflowing */
.zw-refs { margin: 44px 0 0; padding-top: 28px; border-top: 1px solid var(--zw-line); }
.zw-refs h2 { margin: 0 0 14px !important; font-size: 22px !important; }
.zw-refs ol { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.7; color: #55605a; }
.zw-refs li { margin-bottom: 8px; }
.zw-refs a { word-break: break-word; color: #6E9A1F; }

@media (max-width: 640px) {
  .zw-table { font-size: 14px; }
  .zw-table th, .zw-table td { padding: 11px 12px; }
}

.zw-faq { margin: 48px 0 0; }
.zw-faq h2 { margin-bottom: 18px !important; }
.zw-faq__item { border: 1px solid var(--zw-line); border-radius: 14px; margin-bottom: 12px; background: #fff; overflow: hidden; }
.zw-faq__item summary {
  cursor: pointer; list-style: none; padding: 18px 22px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 18px; color: var(--zw-ink);
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
}
.zw-faq__item summary::-webkit-details-marker { display: none; }
.zw-faq__item summary::after { content: "+"; font-size: 24px; color: var(--zw-brand); line-height: 1; flex: none; transition: transform .3s var(--zw-ease); }
.zw-faq__item[open] summary::after { transform: rotate(45deg); }
.zw-faq__item[open] summary { border-bottom: 1px solid var(--zw-line); }
.zw-faq__a { padding: 18px 22px 20px; font-size: 16px; }
.zw-faq__a p:last-child { margin-bottom: 0 !important; }
.zw-related { margin: 44px 0 0; padding: 28px 30px; background: var(--zw-cream); border-radius: 18px; }
.zw-related h2 { margin: 0 0 16px !important; font-size: 24px !important; }
.zw-related ul { margin: 0; padding: 0; list-style: none; }
.zw-related li { margin-bottom: 10px; }
.zw-related a {
  display: inline-flex; align-items: center; gap: 10px; font-weight: 600;
  text-decoration: none !important; color: var(--zw-ink) !important;
  transition: color .3s ease, transform .3s ease;
}
.zw-related a::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--zw-brand); flex: none; }
.zw-related a:hover { color: #6E9A1F !important; transform: translateX(3px); }

/* ---- 6. review carousel ------------------------------------------------ */
.zw-revs { position: relative; }
.zw-revs__flag {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 20px; padding: 8px 16px;
  background: rgba(57,78,16,.07); border: 1px dashed #7D8F4E; border-radius: 999px;
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--zw-deep);
}
.zw-revs__dot { width: 8px; height: 8px; border-radius: 50%; background: #C9CF7A; flex: none; }
.zw-revs__viewport { overflow: hidden; border-radius: 20px; }
.zw-revs__track { display: flex; transition: transform .6s var(--zw-ease); will-change: transform; }
.zw-rev {
  flex: 0 0 100%; min-width: 100%; box-sizing: border-box;
  padding: 34px 36px 32px; background: #fff;
  border: 1px solid var(--zw-line); border-radius: 20px;
}
.zw-rev__stars { display: flex; gap: 5px; margin-bottom: 18px; }
.zw-rev__stars span {
  width: 17px; height: 17px; flex: none; background: var(--zw-line);
  clip-path: polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
.zw-rev__stars span.is-on { background: #E3B341; }
/* Agrezen decorates every blockquote with a large disc — suppress it here */
.zw-revs blockquote::before, .zw-revs blockquote::after, .zw-rev__quote::after {
  content: none !important; background: none !important; display: none !important;
}
.zw-revs blockquote.zw-rev__quote, .zw-rev__quote {
  margin: 0 0 26px; padding: 0; border: 0;
  background: none !important; box-shadow: none !important;
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 18px; line-height: 1.7; color: var(--zw-body); font-style: normal;
}
.zw-rev__quote::before {
  content: "\201C" !important; display: inline !important;
  position: static !important; width: auto !important; height: auto !important;
  color: var(--zw-brand); background: none !important;
  font-size: 34px; line-height: 0; vertical-align: -8px; margin-right: 4px;
}
.zw-rev__by { display: flex; align-items: center; gap: 14px; }
.zw-rev__avatar {
  width: 52px; height: 52px; flex: none; border-radius: 50%;
  background: var(--zw-cream); border: 1px dashed #C9CF7A;
  display: flex; align-items: center; justify-content: center;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 20px; color: #7D8F4E;
}
.zw-rev__avatar::after { content: attr(data-initial); }
/* real reviewer, no photograph available — solid initial rather than stock imagery */
.zw-rev__avatar.is-real { background: var(--zw-brand); border: 0; color: #fff; }

/* avatar slot accepts a real photo, a business logo, or an illustrated mark */
.zw-rev__photo {
  width: 52px; height: 52px; flex: none;
  border-radius: 50%; object-fit: cover;
  background: var(--zw-cream); border: 1px solid var(--zw-line);
}
/* a logo should sit inside the circle, not be cropped by it */
.zw-rev__photo.is-logo { object-fit: contain; padding: 6px; background: #fff; }
.zw-rev__meta b {
  display: block; font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 17px; color: var(--zw-ink); letter-spacing: -.3px;
}
.zw-rev__meta span { font-size: 14px; color: #6b7280; }
.zw-revs__controls { display: flex; align-items: center; gap: 14px; margin-top: 24px; }
.zw-revs__arrow {
  width: 44px; height: 44px; flex: none; padding: 0;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: var(--zw-ink);
  border: 1px solid var(--zw-line); border-radius: 50%; cursor: pointer;
  transition: transform .3s var(--zw-ease), background-color .3s ease, color .3s ease, border-color .3s ease;
}
.zw-revs__arrow svg { width: 20px; height: 20px; }
.zw-revs__arrow:hover { background: var(--zw-brand); color: #fff; border-color: var(--zw-brand); transform: translateY(-2px); }
.zw-revs__arrow:focus-visible { outline: 3px solid var(--zw-deep); outline-offset: 3px; }
.zw-revs__dots { display: flex; gap: 8px; margin-left: 4px; }
.zw-revs__dots button {
  width: 9px; height: 9px; padding: 0; border: 0; border-radius: 999px;
  background: #D7D9C4; cursor: pointer;
  transition: width .35s var(--zw-ease), background-color .35s ease;
}
.zw-revs__dots button[aria-selected="true"] { width: 26px; background: var(--zw-brand); }
.zw-revs__dots button:focus-visible { outline: 2px solid var(--zw-deep); outline-offset: 3px; }

/* ---- 6b. article meta: no date, no author ------------------------------- */
/* Evergreen reference content — a visible date makes a guide look stale long
   before it is, and there is no author persona to attribute these to. */
.single-post .entry-meta,
.single-post .post-meta,
.single-post .entry-date,
.single-post .posted-on,
.single-post .byline,
.single-post .author,
.single-post .post-author,
.single-post .cea-post-meta,
.single-post .cea-blog-meta,
.single-post .entry-header .meta,
.single-post time.entry-date,
.single-post .updated,
.blog .entry-meta, .archive .entry-meta,
.blog .post-meta, .archive .post-meta,
.blog .cea-post-meta, .archive .cea-post-meta,
.blog .entry-date, .archive .entry-date,
.blog .byline, .archive .byline { display: none !important; }

/* author box / bio under the post */
.single-post .author-info,
.single-post .author-bio,
.single-post .about-author,
.single-post .cea-author-box { display: none !important; }

/* The featured image is set on every article so it can serve as the og:image
   and the thumbnail on the Learn hubs, but the diagram already appears in the
   body exactly where it belongs — the theme's own copy above the text is a
   duplicate. */
.single-post figure.featured-media,
.single-post .featured-media { display: none !important; }

/* ---- 7. theme cleanup -------------------------------------------------- */
.cea-page-title img[src*="tractor"], .page-title-wrap img[src*="tractor"],
.cea-page-title-inner > img, .cea-page-title .cea-title-shape { display: none !important; }
.site-footer .copyright-section a[href*="agrezen"],
.site-footer .copyright-section a[href*="zozothemes"] { display: none; }

@media (prefers-reduced-motion: reduce) {
  .zw-revs__track { transition: none; }
  .zw-revs__arrow:hover { transform: none; }
}
@media (max-width: 780px) {
  .single-post .entry-content h2 { font-size: 26px; line-height: 34px; }
  .zw-cta { padding: 24px 22px 26px; }
  .zw-rev { padding: 26px 22px 24px; }
  .zw-rev__quote { font-size: 16px; }
}


/* ==========================================================================
   Blog archive — a rank-and-file card grid
   --------------------------------------------------------------------------
   The parent theme ships a hand-rolled masonry script (theme.js -> $.fn
   .rcmasonry) that reads data-columns off .agrezen-masonry. index.php and
   archive.php hard-code data-columns="1" unless the Customizer's blog-layout
   is "grid", so the script writes width:100%;left:0 into each article's style
   attribute and the cards stack in one 416px column with two thirds of every
   row left empty.

   The grid is therefore CSS, not JS: flex-wrap on the container, plus
   !important on exactly the properties the script writes inline — an author
   !important declaration outranks a non-important style attribute, so the
   script still runs and is simply unable to move anything. Rows align and
   columns align; this is deliberately not masonry.

   Selectors are prefixed with `body` to reach (0,1,2). The parent theme's own
   rules sit at (0,1,1), and theme.js injects `.agrezen-masonry article
   { transition: none !important }` into the head *after* this sheet, which a
   tie on specificity would lose to.
   ========================================================================== */

body .agrezen-masonry {
  display: flex !important;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 26px;
  height: auto !important;
  position: relative;
}

body .agrezen-masonry > article {
  /* the five rcmasonry writes, neutralised */
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  height: auto !important;
  transform: none !important;
  visibility: visible !important;
  margin: 0 !important;

  flex: 0 0 auto !important;
  width: calc((100% - 52px) / 3) !important;
  max-width: calc((100% - 52px) / 3) !important;

  display: flex;
  flex-direction: column;
  padding: 16px 16px 24px;
  background: #fff;
  border: 1px solid var(--zw-line);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(24, 24, 24, .03);
  transition: transform .4s var(--zw-ease), box-shadow .4s var(--zw-ease) !important;
}
body .agrezen-masonry > article:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 1px 2px rgba(24, 24, 24, .04), 0 12px 24px -12px rgba(24, 24, 24, .14),
              0 32px 56px -32px rgba(57, 78, 16, .24);
}
body .agrezen-masonry > article:focus-within {
  box-shadow: 0 0 0 3px rgba(144, 197, 45, .38), 0 12px 24px -12px rgba(24, 24, 24, .14);
}

/* thumbnail — fixed height so the titles in a row start on one line.
   .zw-card-thumb is the anchor added in inc/zenwholesalers-head.php; the
   rules below still hold if a template ever prints the image unwrapped. */
/* The 18px sits on the figure, never on the image: the image is sometimes
   wrapped in .zw-card-thumb and sometimes not, and carrying the margin on
   both the anchor and the image stacked it twice. */
body .agrezen-masonry > article .featured-media { margin: 0 0 18px !important; padding: 0 !important; }
body .agrezen-masonry > article .featured-media-inner,
body .agrezen-masonry > article .media { margin: 0 !important; padding: 0 !important; }
body .agrezen-masonry > article .featured-media-inner.section-inner img,
body .agrezen-masonry > article img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 14px;
  margin: 0;
}
body .agrezen-masonry > article .zw-card-thumb {
  display: block;
  overflow: hidden;      /* clips the hover zoom to the card's own radius */
  border-radius: 14px;
  margin: 0;
}
body .agrezen-masonry > article .zw-card-thumb img { transition: transform .55s var(--zw-ease); }
body .agrezen-masonry > article:hover .zw-card-thumb img { transform: scale(1.045); }

/* title — two lines reserved, so every excerpt starts at the same y */
body .agrezen-masonry > article .entry-header { margin: 0; padding: 0; }
body .agrezen-masonry > article .entry-title {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 22px;
  line-height: 30px;
  letter-spacing: -.5px;
  margin: 0 0 10px;
  padding: 0 6px;
  min-height: 60px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
body .agrezen-masonry > article .entry-title a {
  color: var(--zw-ink);
  transition: color .25s var(--zw-ease);
}
body .agrezen-masonry > article .entry-title a:hover,
body .agrezen-masonry > article .entry-title a:focus-visible { color: var(--zw-brand); }

/* excerpt — clamped, so the cards in a row end level */
body .agrezen-masonry > article .post-inner {
  flex: 1 1 auto;
  display: block;
  margin: 0;
  width: auto;
}
body .agrezen-masonry > article .entry-content,
body .agrezen-masonry > article .entry-summary {
  padding: 0 6px;
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--zw-body);
}
body .agrezen-masonry > article .entry-content p {
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body .agrezen-masonry + .pagination,
body .agrezen-masonry ~ nav.pagination { margin-top: 46px; }

@media (max-width: 1024px) {
  body .agrezen-masonry > article {
    width: calc((100% - 26px) / 2) !important;
    max-width: calc((100% - 26px) / 2) !important;
  }
}
@media (max-width: 680px) {
  body .agrezen-masonry { gap: 22px; }
  body .agrezen-masonry > article {
    width: 100% !important;
    max-width: 100% !important;
  }
  body .agrezen-masonry > article .entry-title {
    font-size: 20px; line-height: 28px; min-height: 0;
  }
  body .agrezen-masonry > article img { height: 200px; }
}
@media (prefers-reduced-motion: reduce) {
  body .agrezen-masonry > article { transition: none !important; }
  body .agrezen-masonry > article:hover { transform: none !important; }
  body .agrezen-masonry > article .zw-card-thumb img { transition: none; }
  body .agrezen-masonry > article:hover .zw-card-thumb img { transform: none; }
}

/* ==========================================================================
   Single article — readable measure, clear hierarchy
   ========================================================================== */

.single-post .entry-content {
  max-width: 760px; margin: 0 auto; padding: 56px 20px 40px;
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 18px; line-height: 1.8; color: #3C4A3A;
}
.single-post .entry-content > * + * { margin-top: 1.15em; }
.single-post .entry-content h2 {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 32px; line-height: 1.25; letter-spacing: -.6px;
  color: var(--zw-ink); margin-top: 2em;
}
.single-post .entry-content h3 {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 23px; line-height: 1.35; letter-spacing: -.4px;
  color: var(--zw-ink); margin-top: 1.7em;
}
.single-post .entry-content img { border-radius: 16px; }
.single-post .entry-content a { color: var(--zw-brand); text-decoration: underline; text-underline-offset: 3px; }
.single-post .entry-content a:hover { color: var(--zw-deep); }
.single-post .entry-content ul, .single-post .entry-content ol { padding-left: 1.25em; }
.single-post .entry-content li + li { margin-top: .5em; }
.single-post .entry-content blockquote {
  margin: 1.6em 0; padding: 20px 26px;
  background: var(--zw-cream); border-left: 4px solid var(--zw-brand);
  border-radius: 0 14px 14px 0; font-size: 17px;
}

/* FAQ block */
.zw-faq { margin-top: 2.4em; }
.zw-faq h3 { font-size: 20px !important; margin-top: 1.4em !important; }

/* Related guides module */
.zw-related {
  margin: 3em auto 0; max-width: 760px; padding: 28px 30px;
  background: var(--zw-cream); border: 1px solid #E6E3DA; border-radius: 20px;
}
.zw-related h2 { margin: 0 0 14px !important; font-size: 22px !important; }
.zw-related ul { margin: 0; padding: 0; list-style: none; }
.zw-related li { margin: 0 0 10px; }
.zw-related a {
  display: inline-flex; align-items: center; gap: 9px;
  color: var(--zw-ink) !important; text-decoration: none !important; font-weight: 600;
}
.zw-related a::before {
  content: ""; width: 7px; height: 7px; flex: none;
  background: var(--zw-brand); border-radius: 50%;
}
.zw-related a:hover { color: var(--zw-brand) !important; }

/* ---- 8. Amazon affiliate listings -------------------------------------- */
/* Price, rating and review count are deliberately absent — Amazon only lets
   those be displayed from the Product Advertising API. See
   inc/zenwholesalers-affiliate.php. */

.zw-amz-button,
.woocommerce a.button.zw-amz-button,
.woocommerce div.product form.cart .button.zw-amz-button,
.woocommerce div.product .zw-amz-cart a.zw-amz-button {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  padding: 15px 30px 14px !important;
  border-radius: 15px !important;
  background: var(--zw-brand) !important;
  color: #fff !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: -.2px;
  text-decoration: none !important;
  border: 0 !important;
  transition: transform .3s var(--zw-ease), background-color .3s ease;
}
.zw-amz-button:hover,
.woocommerce a.button.zw-amz-button:hover,
.woocommerce div.product .zw-amz-cart a.zw-amz-button:hover {
  background: var(--zw-deep) !important;
  color: #fff !important;
  transform: translateY(-2px);
}
.zw-amz-button:focus-visible {
  outline: 3px solid var(--zw-deep);
  outline-offset: 3px;
}
.zw-amz-button__icon { flex: none; opacity: .85; }
.zw-amz-button { position: relative; overflow: hidden; isolation: isolate; }
/* The theme fills .button on hover with a 400x300px rotated diamond pseudo.
   These buttons already have a designed hover (deep green + a 2px lift), and
   the diamond only washes them olive, so it is switched off rather than
   contained. */
.zw-amz-button::before,
.zw-amz-button::after,
.zw-quote-button::before,
.zw-quote-button::after,
body ul.products li.product a.button::before,
body ul.products li.product a.button::after { content: none !important; display: none !important; }

.zw-amz-cart { margin-bottom: 8px; }

.zw-amz-disclosure {
  margin: 14px 0 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--zw-body);
  max-width: 52ch;
}
.zw-amz-disclosure a { color: var(--zw-deep); text-decoration: underline; }
.zw-amz-disclosure--archive {
  margin: 0 0 30px;
  padding: 14px 18px;
  background: var(--zw-cream);
  border: 1px dashed #C9CF7A;
  border-radius: 12px;
  max-width: none;
}

.zw-amz-price-note {
  margin: 4px 0 10px;
  font-size: 13px;
  color: var(--zw-body);
}

/* the "Before you buy" note in the product description */
.zw-amz-note {
  margin: 30px 0 0;
  padding: 18px 22px;
  background: var(--zw-cream);
  border: 1px dashed #C9CF7A;
  border-radius: 14px;
  font-size: 15px;
  line-height: 1.7;
}

/* ---- shop grid: rank and file, not ragged ------------------------------
   The parent theme floats the cards and reveals the add-to-cart on hover.
   On an affiliate listing the outbound button IS the page, so it is pinned
   visible at the foot of every card and the row is equalised. Flexbox, per
   the project's no-CSS-grid rule.

   Selectors hang off `body ul.products`, never `body .woocommerce ul.products`:
   the woocommerce class sits on <body> itself, and a descendant combinator
   does not match the element carrying the class, so the .woocommerce form
   silently matched nothing. */
body ul.products {
  display: flex !important;
  flex-wrap: wrap;
  gap: 26px;
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
body ul.products::before,
body ul.products::after { content: none !important; display: none !important; }

body ul.products li.product {
  display: flex !important;
  flex-direction: column;
  float: none !important;
  clear: none !important;
  width: calc((100% - 78px) / 4) !important;
  margin: 0 !important;
  padding: 20px 20px 22px !important;
  background: #fff;
  border: 1px solid var(--zw-line);
  border-radius: 20px;
  text-align: left;
  transition: transform .3s var(--zw-ease), box-shadow .3s ease;
}
body ul.products li.product:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 34px -22px rgba(24, 38, 8, .34), 0 3px 10px -6px rgba(24, 38, 8, .16);
}

/* The theme wraps image + title + note in one link and draws a second
   bordered box on it, so the card had a box inside a box and the button fell
   outside both. The card is the <li>; this link is just a stretchy wrapper. */
body ul.products li.product a.woocommerce-LoopProduct-link {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  text-decoration: none;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* packshots arrive at mixed aspect ratios; letterbox rather than crop */
body ul.products li.product img {
  width: 100%;
  height: 230px;
  object-fit: contain;
  background: #fff;
  border-radius: 14px;
  margin: 0 0 16px !important;
}
.woocommerce div.product div.images img { object-fit: contain; background: #fff; }

/* the theme capitalises every word, which breaks "16-in-1" and "3000mg" */
body ul.products li.product .woocommerce-loop-product__title,
body ul.products li.product h2 {
  text-transform: none !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 17px;
  line-height: 1.35;
  letter-spacing: -.3px;
  color: var(--zw-ink);
  margin: 0 0 6px !important;
  min-height: 69px;                /* 3 lines, so the notes and buttons align */
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body ul.products li.product .zw-amz-price-note {
  margin: 0 0 16px !important;
  font-size: 13px;
  color: var(--zw-body);
}

/* Button always visible, pinned to the foot so every card lines up.
   position MUST be relative, not static: the theme decorates
   `ul.products li.product .button::before` with a 400x300px rotated diamond
   that expands on hover. Made static, the button stops being the containing
   block for that absolutely-positioned pseudo, so the diamond anchors to
   li.product instead and paints a huge olive lozenge across the whole card.
   relative + overflow hidden keeps it inside the button where it belongs. */
body ul.products li.product a.zw-amz-button,
body ul.products li.product a.zw-quote-button,
body ul.products li.product a.button {
  position: relative !important;
  /* relative honours the theme's hover-reveal offsets, which shove the button
     70px down onto the next row — zero them and it sits in normal flow while
     still anchoring the ::before diamond. */
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  overflow: hidden;
  isolation: isolate;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  margin: auto 0 0 !important;
  align-self: stretch;
  justify-content: center;
  white-space: nowrap;
  padding: 14px 16px 13px !important;
  font-size: 13.5px !important;
}
body ul.products li.product a.zw-amz-button:hover { transform: translateY(-2px) !important; }

@media (max-width: 1199px) {
  body ul.products li.product { width: calc((100% - 52px) / 3) !important; }
}
@media (max-width: 1024px) {
  body ul.products li.product { width: calc((100% - 26px) / 2) !important; }
}
@media (max-width: 680px) {
  body ul.products { gap: 20px; }
  body ul.products li.product { width: 100% !important; }
  body ul.products li.product .woocommerce-loop-product__title { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body ul.products li.product,
  body ul.products li.product:hover { transition: none; transform: none; }
}
}

/* ---- single affiliate product ------------------------------------------ */
/* The theme hides every h2 inside the tab panel to suppress WooCommerce's own
   "Description" heading — which also swallowed the headings in our copy. The
   heading itself is removed in PHP (woocommerce_product_description_heading),
   so these can simply come back. */
body .woocommerce-Tabs-panel {
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  color: var(--zw-body);
}
body .woocommerce-Tabs-panel h2 {
  display: block !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 26px !important;
  line-height: 34px !important;
  letter-spacing: -.6px;
  color: var(--zw-ink);
  margin: 34px 0 12px !important;
}
body .woocommerce-Tabs-panel h2:first-child { margin-top: 0 !important; }
body .woocommerce-Tabs-panel h3 {
  display: block !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 20px !important;
  line-height: 28px !important;
  color: var(--zw-ink);
  margin: 26px 0 10px !important;
}
body .woocommerce-Tabs-panel p { margin: 0 0 18px; }
body .woocommerce-Tabs-panel ul { margin: 0 0 20px; padding-left: 22px; list-style: disc; }
body .woocommerce-Tabs-panel li { margin-bottom: 9px; }
body .woocommerce-Tabs-panel a { color: #6E9A1F; text-decoration: underline; text-underline-offset: 3px; }
body .woocommerce-Tabs-panel a:hover { color: var(--zw-deep); }

/* product titles here are full manufacturer names — 56px wraps to five lines */
body.single-product .product_title {
  font-size: 40px !important;
  line-height: 46px !important;
  letter-spacing: -1.2px;
}
@media (max-width: 680px) {
  body.single-product .product_title { font-size: 30px !important; line-height: 36px !important; }
}

/* ---- 9. quote-only products (Raw Sea Moss) ----------------------------- */
.zw-quote-box { margin: 22px 0 26px; }
.zw-quote-button,
.woocommerce a.button.zw-quote-button,
body ul.products li.product a.zw-quote-button {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  padding: 15px 30px 14px !important;
  border-radius: 15px !important;
  background: var(--zw-brand) !important;
  color: #fff !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: -.2px;
  text-decoration: none !important;
  border: 0 !important;
  transition: transform .3s var(--zw-ease), background-color .3s ease;
}
.zw-quote-button:hover,
.woocommerce a.button.zw-quote-button:hover { background: var(--zw-deep) !important; color: #fff !important; transform: translateY(-2px); }
.zw-quote-button:focus-visible { outline: 3px solid var(--zw-deep); outline-offset: 3px; }
.zw-quote-button { position: relative; overflow: hidden; isolation: isolate; }
.zw-quote-note {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.65;
  color: var(--zw-body);
  max-width: 46ch;
}
.zw-quote-note a { color: var(--zw-deep); text-decoration: underline; text-underline-offset: 3px; }

/* the quote-only card in the shop grid keeps the same footprint as the rest */
body ul.products li.product a.zw-quote-button {
  font-size: 13.5px !important;
  padding: 14px 16px 13px !important;
  justify-content: center;
  white-space: nowrap;
}

/* A quoted trade page is long-form, so the description gets a reading measure
   rather than the full 1320px panel — 150 characters a line is unreadable. */
body .woocommerce-Tabs-panel > * {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

/* figures, tables, notes and the FAQ are shared with the article styles, but
   the product description sits in the tab panel rather than .entry-content */
body .woocommerce-Tabs-panel .zw-figure { margin: 30px auto; }
body .woocommerce-Tabs-panel .zw-figure img { width: 100%; height: auto; border-radius: 16px; display: block; }
body .woocommerce-Tabs-panel .zw-figure figcaption { margin-top: 10px; font-size: 14px; color: #6b7280; font-style: italic; }
body .woocommerce-Tabs-panel .zw-cta h3 { color: #fff !important; margin-top: 0 !important; }
body .woocommerce-Tabs-panel .zw-cta p { color: rgba(255,255,255,.86); }
body .woocommerce-Tabs-panel .zw-cta a { color: var(--zw-ink) !important; text-decoration: none; }
body .woocommerce-Tabs-panel .zw-note p { margin: 0 !important; }
body .woocommerce-Tabs-panel ol { margin: 0 0 20px; padding-left: 22px; }
body .woocommerce-Tabs-panel ol li { margin-bottom: 9px; }

/* ---- 10. Raw Sea Moss catalogue archive -------------------------------- */
.zw-archive-hero { margin: 0 0 30px; }
.zw-archive-hero img { width: 100%; height: 320px; object-fit: cover; border-radius: 18px; display: block; }
.zw-archive-hero figcaption { margin-top: 10px; font-size: 14px; color: #6b7280; font-style: italic; }

.zw-varieties { display: flex; flex-wrap: wrap; gap: 26px; margin: 0 0 40px; }
.zw-variety { width: calc((100% - 78px) / 4); }
.zw-variety img { width: 100%; height: 190px; object-fit: cover; border-radius: 14px; display: block; margin-bottom: 14px; }
.zw-variety h3 {
  margin: 0 0 6px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 20px; letter-spacing: -.4px; color: var(--zw-ink);
}
.zw-variety p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--zw-body); }

@media (max-width: 1024px) { .zw-variety { width: calc((100% - 26px) / 2); } }
@media (max-width: 680px) {
  .zw-varieties { gap: 20px; }
  .zw-variety { width: 100%; }
  .zw-archive-hero img { height: 220px; }
}

/* ---- 11. inline quote form on the variety pages ------------------------ */
.zw-quote-form {
  margin: 26px 0 34px;
  padding: 30px 32px 26px;
  background: var(--zw-cream);
  border: 1px solid var(--zw-line);
  border-radius: 18px;
}
.zw-quote-form .wpforms-field { padding: 0 0 18px; }
.zw-quote-form .wpforms-field-label {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 15px; color: var(--zw-ink); margin-bottom: 7px;
}
.zw-quote-form .wpforms-field-sublabel,
.zw-quote-form .wpforms-field-description { font-size: 13px; color: var(--zw-body); }
.zw-quote-form input[type="text"],
.zw-quote-form input[type="email"],
.zw-quote-form input[type="tel"],
.zw-quote-form input[type="number"],
.zw-quote-form select,
.zw-quote-form textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--zw-line);
  border-radius: 12px;
  background: #fff;
  font-family: "Nunito Sans", system-ui, sans-serif;
  font-size: 15px;
  color: var(--zw-ink);
}
.zw-quote-form input:focus-visible,
.zw-quote-form select:focus-visible,
.zw-quote-form textarea:focus-visible {
  outline: 3px solid var(--zw-brand);
  outline-offset: 1px;
  border-color: var(--zw-brand);
}
.zw-quote-form input[type="number"] { max-width: 220px; }
.zw-quote-form ul.wpforms-field-required,
.zw-quote-form .wpforms-field-checkbox ul { margin: 0; padding: 0; list-style: none; }
.zw-quote-form .wpforms-field-checkbox li { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.zw-quote-form .wpforms-field-checkbox label { font-size: 15px; color: var(--zw-body); margin: 0; }
.zw-quote-form .wpforms-submit {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 15px 30px 14px !important;
  border-radius: 15px !important;
  background: var(--zw-brand) !important;
  color: #fff !important;
  border: 0 !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600; font-size: 16px; letter-spacing: -.2px;
  cursor: pointer;
  transition: transform .3s var(--zw-ease), background-color .3s ease;
}
.zw-quote-form .wpforms-submit:hover { background: var(--zw-deep) !important; transform: translateY(-2px); }
.zw-quote-form .wpforms-submit::before,
.zw-quote-form .wpforms-submit::after { content: none !important; }
.zw-quote-form .wpforms-required-label { color: #B4471F; }

@media (max-width: 680px) {
  .zw-quote-form { padding: 22px 20px 18px; }
  .zw-quote-form input[type="number"] { max-width: none; }
}

/* trade route on the retail botanical pages */
.zw-trade-note {
  margin: 18px 0 0;
  padding: 14px 18px;
  background: var(--zw-cream);
  border: 1px dashed #C9CF7A;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--zw-body);
  max-width: 52ch;
}
.zw-trade-note a { color: var(--zw-deep); text-decoration: underline; text-underline-offset: 3px; }

/* ---- 12. Caribbean botanicals — specimen sheets ------------------------
   The archive is an identification page, so it is built like a herbarium
   sheet: a mounted plate, a typed data block, and a revision line naming the
   thing each specimen gets mistaken for. The mount (cream ground, hairline
   border, 6px radius) is the one place the 14–20px card radius is broken —
   deliberately, because a specimen plate is a flat mounted card, not a card
   in the shop grid below it. */
.zw-herbarium {
  display: flex;
  flex-direction: column;
  gap: 74px;
  margin: 8px 0 60px;
}

.zw-spec {
  display: flex;
  gap: 56px;
  align-items: flex-start;
}
.zw-spec:nth-child(even) { flex-direction: row-reverse; }

.zw-spec__plate {
  flex: 0 0 44%;
  max-width: 44%;
  padding: 14px;
  background: var(--zw-cream);
  border: 1px solid var(--zw-line);
  border-radius: 6px;
}
.zw-spec__plate a { display: block; overflow: hidden; border-radius: 2px; }
.zw-spec__plate img {
  display: block;
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 2px;
  transition: transform .6s var(--zw-ease);
}
.zw-spec:hover .zw-spec__plate img { transform: scale(1.03); }

.zw-spec__body { flex: 1 1 auto; min-width: 0; padding-top: 4px; }

.zw-spec__name {
  margin: 0 0 2px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: -.8px;
}
.zw-spec__name a { color: var(--zw-ink); text-decoration: none; }
.zw-spec__name a:hover { color: var(--zw-deep); }
.zw-spec__latin {
  margin: 0 0 20px;
  font-size: 17px;
  font-style: italic;
  color: var(--zw-deep);
}

/* the typed specimen label */
.zw-spec__data { margin: 0 0 22px; padding: 0; border-top: 1px solid var(--zw-line); }
.zw-spec__data > div {
  display: flex;
  gap: 18px;
  padding: 9px 0;
  border-bottom: 1px solid var(--zw-line);
}
.zw-spec__data dt {
  flex: 0 0 116px;
  margin: 0;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--zw-deep);
}
.zw-spec__data dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--zw-ink);
}

/* the revision line — what this gets mistaken for */
.zw-spec__revision {
  margin: 0 0 20px;
  padding: 2px 0 2px 20px;
  border-left: 2px solid var(--zw-brand);
}
.zw-spec__not {
  margin: 0 0 7px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--zw-deep);
}
.zw-spec__not s { text-decoration-thickness: 1px; text-underline-offset: 2px; }
.zw-spec__why { margin: 0; font-size: 15px; line-height: 1.75; color: var(--zw-body); }

.zw-spec__use { margin: 0 0 18px; font-size: 16px; line-height: 1.75; color: var(--zw-ink); }

.zw-spec__links { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; }
.zw-spec__buy,
.zw-spec__read {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: transform .3s var(--zw-ease), color .3s ease;
}
.zw-spec__buy { color: var(--zw-deep); }
.zw-spec__buy::after { content: " \2192"; }
.zw-spec__buy:hover { color: var(--zw-brand); }
.zw-spec__read { color: var(--zw-body); text-decoration: underline; text-underline-offset: 4px; }
.zw-spec__read:hover { color: var(--zw-deep); }
.zw-spec__buy:focus-visible,
.zw-spec__read:focus-visible,
.zw-spec__name a:focus-visible { outline: 3px solid var(--zw-brand); outline-offset: 3px; }

@media (max-width: 900px) {
  .zw-herbarium { gap: 54px; }
  .zw-spec, .zw-spec:nth-child(even) { flex-direction: column; gap: 22px; }
  .zw-spec__plate { flex: 1 1 auto; max-width: none; width: 100%; }
  .zw-spec__plate img { height: 240px; }
  .zw-spec__name { font-size: 26px; }
  .zw-spec__data dt { flex-basis: 96px; }
}
@media (prefers-reduced-motion: reduce) {
  .zw-spec__plate img,
  .zw-spec:hover .zw-spec__plate img { transition: none; transform: none; }
}

/* the archive intro — the theme leaves term-description paragraphs at margin 0,
   so they run together as one block. The opening line is the page's thesis and
   is set as a lead. */
body.tax-product_cat.term-caribbean-botanicals .term-description {
  max-width: 780px;
  margin: 0 0 46px;
}
body.tax-product_cat.term-caribbean-botanicals .term-description p {
  margin: 0 0 18px;
  font-size: 17px;
  line-height: 1.75;
  color: var(--zw-body);
}
body.tax-product_cat.term-caribbean-botanicals .term-description p:first-child {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 27px;
  line-height: 1.3;
  letter-spacing: -.7px;
  color: var(--zw-ink);
  margin-bottom: 24px;
}
body.tax-product_cat.term-caribbean-botanicals .term-description p:last-child { margin-bottom: 0; }
@media (max-width: 680px) {
  body.tax-product_cat.term-caribbean-botanicals .term-description p:first-child { font-size: 22px; }
}

/* ==========================================================================
   13. In-article product picks  (.zw-picks)
   --------------------------------------------------------------------------
   Deliberately the quietest block on the page. .zw-cta is a solid deep-green
   panel with white type because it is asking for a wholesale enquiry, which is
   our own business. This block sends the reader to Amazon, so it is set as
   editorial matter: no fill, hairline rules, ink on white, and type at body
   scale. If it ever starts to look like an advertisement it has failed, and it
   will cost more in trust than it earns in commission.
   ========================================================================== */

.single-post .entry-content .zw-picks,
.zw-picks {
  margin: 48px 0;
  padding: 0;
  border-top: 1px solid rgba(24, 24, 24, .14);
  border-bottom: 1px solid rgba(24, 24, 24, .14);
  background: none;
}

.single-post .entry-content .zw-picks__title,
.zw-picks__title {
  margin: 26px 0 8px !important;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: -.5px;
  color: var(--zw-ink) !important;
}

.single-post .entry-content .zw-picks__intro,
.zw-picks__intro {
  margin: 0 0 20px !important;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--zw-body);
}

.single-post .entry-content ul.zw-picks__list,
.zw-picks__list {
  margin: 0 0 20px !important;
  padding: 0 !important;
  list-style: none !important;
}

.single-post .entry-content ul.zw-picks__list > li.zw-picks__item,
.zw-picks__item {
  display: flex;
  flex-direction: column;
  padding: 14px 0;
  border-top: 1px solid rgba(24, 24, 24, .08);
  list-style: none !important;
}

.single-post .entry-content ul.zw-picks__list > li.zw-picks__item:first-child,
.zw-picks__item:first-child { border-top: 0; margin-top: 0; }

.single-post .entry-content .zw-picks__link,
.zw-picks__link {
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 16.5px;
  line-height: 1.4;
  color: var(--zw-ink);
  text-decoration: none;
  border-bottom: 2px solid rgba(144, 197, 45, .5);
  align-self: flex-start;
  transition: color .18s cubic-bezier(.2, .7, .3, 1),
              border-color .18s cubic-bezier(.2, .7, .3, 1);
}

.single-post .entry-content .zw-picks__link:hover,
.single-post .entry-content .zw-picks__link:focus-visible,
.zw-picks__link:hover,
.zw-picks__link:focus-visible {
  color: var(--zw-deep);
  border-bottom-color: var(--zw-brand);
}

.zw-picks__link:focus-visible {
  outline: 2px solid var(--zw-brand);
  outline-offset: 3px;
  border-radius: 2px;
}

.single-post .entry-content .zw-picks__note,
.zw-picks__note {
  margin-top: 6px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--zw-body);
}

.single-post .entry-content .zw-picks__disclosure,
.zw-picks__disclosure {
  margin: 0 0 24px !important;
  padding-top: 16px;
  border-top: 1px solid rgba(24, 24, 24, .08);
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(78, 78, 78, .82);
}

@media (max-width: 680px) {
  .zw-picks { margin: 36px 0; }
  .zw-picks__title { font-size: 20px; margin-top: 22px !important; }
  .zw-picks__intro { font-size: 15px; }
  .zw-picks__link { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .zw-picks__link { transition: none; }
}


/* ==========================================================================
   14. Previous / next article navigation  (.zw-postnav)
   --------------------------------------------------------------------------
   Markup is emitted by inc/zenwholesalers-postnav.php, which deliberately
   drops the .post-navigation / .nav-links / .nav-previous / .nav-next class
   names so none of the parent theme's rules apply. That is why nothing here
   needs !important - if these selectors ever stop working, check that file
   first rather than adding weight here.
   ========================================================================== */

.zw-postnav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  max-width: 760px;          /* matches .single-post .entry-content > * */
  margin: 44px auto 8px;
}

.zw-postnav__item {
  flex: 1 1 240px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  padding: 15px 18px 16px;
  background: #fff;
  border: 1px solid rgba(24, 24, 24, .13);
  border-radius: 14px;
  text-decoration: none;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1),
              border-color .2s cubic-bezier(.2, .7, .3, 1),
              box-shadow .2s cubic-bezier(.2, .7, .3, 1);
}

.zw-postnav__item--next { text-align: right; align-items: flex-end; }

.zw-postnav__label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 10.5px;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(78, 78, 78, .75);
}

.zw-postnav__item--prev .zw-postnav__label::before { content: "\2190"; font-size: 13px; letter-spacing: 0; }
.zw-postnav__item--next .zw-postnav__label::after  { content: "\2192"; font-size: 13px; letter-spacing: 0; }

body .zw-postnav .zw-postnav__title,
.zw-postnav__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 15.5px;
  line-height: 1.38;
  letter-spacing: -.2px;
  text-transform: none;
  color: var(--zw-ink);
  transition: color .2s cubic-bezier(.2, .7, .3, 1);
}

.zw-postnav__item:hover,
.zw-postnav__item:focus-visible {
  transform: translateY(-2px);
  border-color: var(--zw-brand);
  box-shadow: 0 6px 18px -10px rgba(57, 78, 16, .45),
              0 2px 6px -3px rgba(24, 24, 24, .10);
}

.zw-postnav__item:hover .zw-postnav__title,
.zw-postnav__item:focus-visible .zw-postnav__title { color: var(--zw-deep); }

.zw-postnav__item:focus-visible { outline: 2px solid var(--zw-brand); outline-offset: 3px; }

@media (max-width: 600px) {
  .zw-postnav { gap: 10px; margin-top: 34px; }
  .zw-postnav__item { flex: 1 1 100%; }
  .zw-postnav__item--next { text-align: left; align-items: flex-start; }
  .zw-postnav__item--next .zw-postnav__label { flex-direction: row; }
}

@media (prefers-reduced-motion: reduce) {
  .zw-postnav__item, .zw-postnav__title { transition: none; }
  .zw-postnav__item:hover, .zw-postnav__item:focus-visible { transform: none; }
}

/* entry-content sets underline on every link and a margin on every li; the picks
   block draws its own underline as a border and spaces items with padding. */
.single-post .entry-content .zw-picks__link { text-decoration: none; }
.single-post .entry-content ul.zw-picks__list > li.zw-picks__item + li.zw-picks__item { margin-top: 0; }
.single-post .entry-content ul.zw-picks__list { padding-left: 0; }

/* ==== ZW ADDITIONS END ==== */