/* =============================================================================
   WONDROUS WORLD — THEME STYLESHEET (rebuild 2026-10)

   One rule per component. Order:
     1. Fonts            6. Chrome (header, footer)
     2. Tokens           7. Page patterns (banner, intro, section head, list rows, cards, feature, callout)
     3. Base             8. Page families (only what is unique to a family)
     4. Layout           9. Utilities & print
     5. Components (crumb, buttons, links, forms, accordion)

   Standards (docs/STYLE_AUDIT_2026-10-11.md §7):
   - Widths: wide 1320 / content 1120 / reading 740. Gutter 48 / 32 / 24.
     Only the OUTERMOST container adds the gutter (no doubled padding).
   - Breadcrumb: one component (.crumb), first item in the page's content column.
   - H1: hero 40/34, page 52/38, article 50/34.
   - Body: 17px/1.85 soil; secondary 15px/1.85.
   - End of page: --space-end before the footer.
   - Breakpoints: 1099px (tablet) and 767px (phone) only.
   - No !important except accessibility helpers.
   ============================================================================= */

/* 1. FONTS ------------------------------------------------------------------ */

@font-face { font-family: 'Marcellus'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/Marcellus-400.ttf') format('truetype'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 500; font-display: swap; src: url('../fonts/CormorantGaramond-500-Italic.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/Montserrat-400.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/Montserrat-500.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/Montserrat-600.ttf') format('truetype'); }

/* 2. TOKENS ----------------------------------------------------------------- */

:root {
  /* Colour */
  --c-green: #324B24;       /* headings, primary actions */
  --c-green-dark: #243C23;  /* hover, dark surfaces (replaces #25391B, #244B3B, #233C28, #233820) */
  --c-soil: #5A4836;        /* body text */
  --c-gold: #B3892C;        /* accents, rules, separators */
  --c-gold-light: #E8D8A5;  /* text accents on dark */
  --c-ivory: #F6F1E7;       /* panels */
  --c-paper: #FCFAF5;       /* page background, text on dark */
  --c-stone: #C8BFAF;       /* borders */
  --c-linen: #E9E0D1;       /* soft fills */
  --c-error: #842D26;

  /* Type */
  --f-serif: Marcellus, Georgia, serif;
  --f-sans: Montserrat, Arial, sans-serif;
  --f-accent: 'Cormorant Garamond', Georgia, serif;

  --t-body: 17px;
  --t-small: 15px;
  --t-xs: 13px;
  --t-label: 11px;
  --lh-body: 1.85;

  --h1-hero: 40px;
  --h1-page: 52px;
  --h1-article: 50px;
  --h2: 32px;
  --h3: 24px;
  --h4: 18px;

  /* Layout */
  --w-wide: 1320px;
  --w-content: 1120px;
  --w-reading: 740px;
  --gutter: 48px;
  --header: 120px;
  --admin-bar: 0px;         /* WordPress toolbar height when logged in (set below) */

  /* Rhythm */
  --flow: 1.1em;            /* gap between stacked blocks (relative to the block's font size) */
  --space-crumb: 56px;      /* breadcrumb -> page heading */
  --space-block: 56px;      /* between top-level blocks of a content column */
  --space-section: 88px;    /* between major page sections */
  --space-end: 96px;        /* last content -> footer */
}

/* Logged-in toolbar: fixed above the page, so sticky elements sit below it (it scrolls away under 601px) */
.admin-bar { --admin-bar: 32px; }
@media (max-width: 782px) { .admin-bar { --admin-bar: 46px; } }
@media (max-width: 600px) { .admin-bar { --admin-bar: 0px; } }

@media (max-width: 1099px) {
  :root {
    --gutter: 32px;
    --header: 72px;
    --space-section: 64px;
  }
}

@media (max-width: 767px) {
  :root {
    --t-body: 16px;
    --h1-hero: 34px;
    --h1-page: 38px;
    --h1-article: 34px;
    --h2: 26px;
    --h3: 21px;
    --gutter: 24px;
    --space-crumb: 36px;
    --space-block: 40px;
    --space-section: 48px;
    --space-end: 64px;
  }
}

/* 3. BASE ------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--c-paper);
  color: var(--c-soil);
  font: 400 var(--t-body)/var(--lh-body) var(--f-sans);
}

h1, h2, h3, h4 {
  margin: 0 0 0.5em;
  font-family: var(--f-serif);
  font-weight: 400;
  line-height: 1.25;
  color: var(--c-green);
}
h1 { font-size: var(--h1-page); line-height: 1.15; letter-spacing: -0.015em; }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); }
h4 { font: 600 var(--h4)/1.4 var(--f-sans); }

p, ul, ol, dl, blockquote, figure, table { margin: 0 0 var(--flow); }
ul, ol { padding-left: 1.3em; }
li + li { margin-top: 0.35em; }
strong, b { font-weight: 600; }
img, svg, video { max-width: 100%; height: auto; }
figure { margin-inline: 0; }
hr { border: 0; border-top: 1px solid var(--c-stone); margin: var(--space-section) 0; }

a { color: var(--c-green); text-decoration: none; touch-action: manipulation; }
a:hover { color: var(--c-green-dark); }

button, input, select, textarea { font: inherit; color: inherit; touch-action: manipulation; }
button { cursor: pointer; border: 0; background: none; padding: 0; }

/* Inline line icons (header, footer, UI): stroked, never filled */
svg[viewBox="0 0 24 24"], svg[viewbox="0 0 24 24"] {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Block flow rhythm: one gap rule replaces core's 24px blockGap inside page content */
.site-main .is-layout-flow > *,
.site-main .is-layout-constrained > * { margin-block: 0; }
.site-main .is-layout-flow > * + *,
.site-main .is-layout-constrained > * + * { margin-block-start: var(--flow); }
.site-main .is-layout-flow > * + :is(h2, h3),
.site-main .is-layout-constrained > * + :is(h2, h3) { margin-block-start: 1.4em; }

/* Accessibility */
:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.sr-only, .screen-reader-text {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
[hidden] { display: none !important; }
.skip-link {
  position: fixed; top: -100px; left: 16px; z-index: 9999;
  padding: 12px 18px; background: var(--c-paper); border: 1px solid var(--c-stone); font-weight: 600;
  transition: top 0.2s ease;
}
.skip-link:focus { top: 8px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* 4. LAYOUT ----------------------------------------------------------------- */

/* Containers. Each wrapper declares its width (--w); the generic rule centres it and adds
   the gutter. A container nested in another container drops the gutter, so side padding
   never doubles. Page families add their legacy wrapper classes to these lists. */
:where(.l-wide, .container, .wrap) { --w: var(--w-wide); }
:where(.l-content) { --w: var(--w-content); }
:where(.l-reading) { --w: var(--w-reading); }

:where(.l-wide, .l-content, .l-reading, .container, .wrap) {
  width: 100%;
  max-width: calc(var(--w) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
}
:where(.l-wide, .l-content, .l-reading, .container, .wrap) :where(.l-wide, .l-content, .l-reading, .container, .wrap) {
  max-width: var(--w);
  padding-inline: 0;
}

/* Every page ends with the same space before the footer */
.site-main { display: block; padding-bottom: var(--space-end); }
.site-main > :last-child { margin-bottom: 0; }
.site-main.is-end-flush { padding-bottom: 0; } /* pages whose last section is a full-bleed band */

section[id], h2[id], h3[id] { scroll-margin-top: calc(var(--header) + var(--admin-bar) + 24px); }

/* Core block helpers */
.wp-block-image img { display: block; }
.wp-block-image { margin-inline: 0; }
.wp-block-columns { margin-bottom: 0; }

/* 5. COMPONENTS ------------------------------------------------------------- */

/* Breadcrumb (inc/breadcrumb.php). Sits at the top of the content column. */
.crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 10px;
  margin: 0;
  padding-top: 26px;
  font: 400 var(--t-label)/1.6 var(--f-sans);
  letter-spacing: 0.02em;
  color: var(--c-soil);
}
.crumb a { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.crumb a:hover { color: var(--c-green); }
.crumb-sep { color: var(--c-gold); }
.crumb + * { margin-top: var(--space-crumb); }
.site-main .is-layout-flow > .crumb + * { margin-block-start: var(--space-crumb); }

/* Page heading: crumb -> h1 -> lead */
.lead { font-size: var(--t-body); line-height: var(--lh-body); max-width: 700px; }

/* Buttons: one primary style everywhere (theme, core blocks, WooCommerce) */
.button, .solid,
.wp-block-button__link, .wp-element-button,
.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce input.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 12px 26px;
  border: 1px solid var(--c-green);
  border-radius: 0;
  background: var(--c-green);
  color: var(--c-paper);
  font: 600 12px/1.2 var(--f-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.button:hover, .solid:hover,
.wp-block-button__link:hover, .wp-element-button:hover,
.woocommerce .button:hover, .woocommerce button.button:hover, .woocommerce a.button:hover {
  background: var(--c-green-dark);
  border-color: var(--c-green-dark);
  color: var(--c-paper);
}
.is-style-outline .wp-block-button__link, .button.is-secondary {
  background: transparent;
  color: var(--c-green);
}
.is-style-outline .wp-block-button__link:hover, .button.is-secondary:hover {
  background: var(--c-green);
  color: var(--c-paper);
}

/* Disabled (e.g. WooCommerce "Update cart" until a quantity changes): outlined and muted */
.button:disabled, .wp-element-button:disabled,
.woocommerce button.button:disabled, .woocommerce button.button:disabled[disabled],
.button:disabled:hover, .woocommerce button.button:disabled:hover {
  padding: 12px 26px;
  border-color: var(--c-stone);
  background: transparent;
  color: var(--c-soil);
  opacity: 0.6;
  cursor: not-allowed;
}

/* Action link: underlined call-to-action text with an optional arrow (span) */
.action-link, .text-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  padding: 6px 0 7px;
  border-bottom: 1px solid var(--c-gold);
  color: var(--c-green);
  font: 600 var(--t-xs)/1.6 var(--f-sans);
  text-decoration: none;
}
.action-link:hover, .text-link:hover { color: var(--c-soil); }
:is(.action-link, .text-link) span[aria-hidden], :is(.action-link, .text-link) .arrow { font-weight: 400; font-size: 18px; line-height: 1; }
.on-dark :is(.action-link, .text-link) { color: var(--c-gold-light); border-color: currentColor; }

/* Links inside running text */
:is(.site-main, .editor-styles-wrapper) :is(p, li, dd, td) a:not([class]) {
  color: var(--c-green);
  text-decoration: underline;
  text-decoration-color: var(--c-gold);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
:is(.site-main, .editor-styles-wrapper) :is(p, li, dd, td) a:not([class]):hover { color: var(--c-green-dark); }

/* Form fields */
input:not([type]), input[type="text"], input[type="email"], input[type="search"], input[type="tel"],
input[type="password"], input[type="number"], input[type="url"], select, textarea,
.woocommerce .input-text {
  width: 100%;
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid var(--c-stone);
  border-radius: 0;
  background: #fff;
  color: var(--c-soil);
  font-size: var(--t-small);
}
textarea { min-height: 140px; resize: vertical; }
label { font-size: var(--t-xs); font-weight: 600; color: var(--c-green); }

/* Accordion (core/details) */
.wp-block-details { border-bottom: 1px solid var(--c-stone); padding: 0; }
.wp-block-details > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 14px 0;
  cursor: pointer;
  list-style: none;
  font: 400 21px/1.35 var(--f-serif);
  color: var(--c-green);
}
.wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-block-details > summary::before {
  content: "";
  flex: 0 0 auto;
  width: 0; height: 0;
  border-block: 5px solid transparent;
  border-left: 7px solid currentColor;
  transition: transform 0.2s ease;
}
.wp-block-details[open] > summary::before { transform: rotate(90deg); }
.wp-block-details > :not(summary) { margin-block: 0 var(--flow); }
.wp-block-details[open] > :last-child { margin-bottom: 24px; }

/* 6. CHROME ----------------------------------------------------------------- */

/* Header */
.site-header {
  position: sticky;
  top: var(--admin-bar);
  z-index: 100;
  background: var(--c-paper);
  border-bottom: 1px solid var(--c-stone);
  color: var(--c-green);
}
.head-row { display: flex; align-items: center; gap: 30px; height: var(--header); }
.brand { display: flex; flex-shrink: 0; line-height: 0; }
.brand img { display: block; width: 365px; height: auto; }

.nav { display: flex; align-items: center; gap: 22px; margin-left: auto; }
.nav-item { position: relative; display: flex; align-items: center; }
.nav-link, .nav-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  color: var(--c-green);
  font: 500 14px/1 var(--f-sans);
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.nav-link:hover, .nav-button:hover { color: var(--c-green); text-decoration: underline; text-decoration-color: var(--c-gold); text-underline-offset: 7px; }
.nav-link[aria-current="page"], .nav-link.active { text-decoration: underline; text-decoration-color: var(--c-gold); text-decoration-thickness: 2px; text-underline-offset: 9px; }
.nav-button svg, .chevron svg { width: 14px; height: 14px; }
.chevron { display: grid; place-items: center; width: 28px; height: 44px; color: var(--c-green); }
.chevron[aria-expanded="true"] svg, .nav-button[aria-expanded="true"] svg { transform: rotate(180deg); }

.dropdown {
  position: absolute;
  top: calc(100% + 14px);
  left: -18px;
  z-index: 105;
  min-width: 250px;
  padding: 12px;
  background: var(--c-paper);
  border: 1px solid var(--c-stone);
  box-shadow: 0 8px 18px rgba(51, 42, 32, 0.08);
}
.dropdown a { display: block; padding: 10px 12px; color: var(--c-green); font-size: 14px; line-height: 1.5; }
.dropdown a:hover { background: var(--c-ivory); }

.utilities { display: flex; align-items: center; gap: 4px; }
.icon-button { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; color: var(--c-green); }
.icon-button svg { width: 22px; height: 22px; }
.menu-button { display: none; }

.search-panel {
  padding: 20px 0;
  background: var(--c-ivory);
  border-top: 1px solid var(--c-stone);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}
.search-form { display: flex; align-items: center; gap: 24px; }
.search-form label { font-size: 12px; letter-spacing: 0.05em; white-space: nowrap; }
.search-entry { display: flex; flex: 1; gap: 10px; }
.search-entry input { flex: 1; min-width: 0; }

.mobile-menu:not([hidden]) {
  position: fixed;
  inset: calc(var(--header) + var(--admin-bar)) 0 auto 0;
  z-index: 99;
  height: calc(100dvh - var(--header) - var(--admin-bar));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 22px var(--gutter) 40px;
  background: var(--c-paper);
  border-top: 1px solid var(--c-stone);
}
.mobile-item { padding: 7px 0; border-bottom: 1px solid rgba(200, 191, 175, 0.45); }
.mobile-title > a { display: block; padding: 12px 0; color: var(--c-green); font-size: 16px; font-weight: 600; }
.mobile-children { padding: 0 0 10px 16px; }
.mobile-children a { display: block; padding: 10px 0; color: var(--c-green); font-size: 14px; }

/* Footer */
.site-footer { background: var(--c-soil); color: var(--c-paper); border-top: 2px solid var(--c-gold); font-size: var(--t-xs); line-height: 1.65; }
.site-footer a { color: var(--c-paper); }

.newsletter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
  padding: 28px 0;
  border-bottom: 1px solid rgba(200, 191, 175, 0.4);
}
.newsletter h2 { margin: 0 0 6px; font: 600 12px/1.4 var(--f-sans); letter-spacing: 0.07em; color: var(--c-gold-light); }
.newsletter p { margin: 0; }
.newsletter h2 { text-transform: uppercase; }
/* Heading and text centred as a pair (rows 2-3) beside the form (rows 1-4) */
.newsletter--widgets { display: grid; grid-template-columns: 1fr 48%; grid-template-rows: 1fr auto auto 1fr; gap: 0 35px; }
.newsletter--widgets > * { grid-column: 1; }
.newsletter--widgets > :nth-child(1) { grid-row: 2; }
.newsletter--widgets > :nth-child(2) { grid-row: 3; }
.newsletter--widgets > .newsletter-form { grid-column: 2; grid-row: 1 / 5; align-self: center; }
.newsletter-fields { display: flex; align-items: flex-end; }
.newsletter-email { flex: 1; min-width: 0; }
.newsletter-email label { display: block; margin-bottom: 6px; font: 600 10px/1.4 var(--f-sans); letter-spacing: 0.07em; text-transform: uppercase; color: var(--c-gold-light); }
.site-main .newsletter-email label { color: var(--c-green); }
.site-main .newsletter-form { max-width: 560px; }
.newsletter .solid { flex-shrink: 0; }
.newsletter-feedback { margin: 10px 0 0; font-weight: 600; }
.newsletter-feedback.is-error { color: #f3b4b4; }
.site-main .newsletter-feedback.is-error { color: var(--c-error); }

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.05fr 0.85fr;
  gap: 38px;
  padding: 48px 0 64px;
}
.footer-logo { display: block; width: 245px; max-width: 100%; height: auto; }
.socials { display: flex; align-items: center; gap: 6px; margin-top: 20px; }
.socials span { margin-right: 4px; font-size: 10px; font-weight: 600; letter-spacing: 0.07em; color: var(--c-gold-light); }
.socials a { display: grid; place-items: center; width: 36px; height: 44px; }
.socials svg { width: 21px; height: 21px; }
.footer-group h2 { margin: 0 0 20px; font: 600 11px/1.4 var(--f-sans); letter-spacing: 0.07em; text-transform: uppercase; color: var(--c-gold-light); }
.footer-group a, .footer-group .linklike { display: block; margin: 0 0 16px; }
.footer-group a:hover { text-decoration: underline; text-underline-offset: 4px; }
.portal-inactive { opacity: 0.85; cursor: default; }
.closure { padding: 20px 0 24px; border-top: 1px solid rgba(200, 191, 175, 0.4); font-size: 10px; color: rgba(252, 250, 245, 0.8); }

@media (max-width: 1199px) {
  .nav { gap: 12px; }
  .head-row { gap: 16px; }
}

@media (max-width: 1099px) {
  .nav, .desktop-account { display: none; }
  .menu-button { display: grid; }
  .utilities { margin-left: auto; }
  .brand img { width: 245px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px; padding: 40px 0; }
  .newsletter { gap: 24px; }
  .newsletter--widgets { grid-template-columns: 1fr 50%; gap: 0 24px; }
}

@media (max-width: 767px) {
  .head-row { gap: 4px; }
  .brand img { width: min(190px, calc(100vw - 174px)); min-width: 130px; }
  .search-form { flex-direction: column; align-items: stretch; gap: 10px; }
  .newsletter { display: block; padding: 25px 0 28px; }
  .newsletter .newsletter-form { margin-top: 24px; }
  .newsletter-fields { display: block; }
  .newsletter .solid { width: 100%; margin-top: 8px; }
  .footer-grid { grid-template-columns: 1fr; padding: 35px 0 24px; }
  .footer-brand { margin-bottom: 34px; text-align: center; }
  .footer-logo { margin: auto; }
  .socials { justify-content: center; }
}

/* 7. PAGE PATTERNS ---------------------------------------------------------- */
/* Shared building blocks of content pages. Page families below only add what is unique. */

/* Banner: the page's featured image, full width, flush under the header (page.php) */
.page-banner { margin: 0; }
/* A band of fixed height: the image is cropped to fit (never enlarged past its shape), centred */
.page-banner img { display: block; width: 100%; height: clamp(200px, 28vw, 420px); object-fit: cover; object-position: center; }

/* Pages that end on a full-bleed band sit flush on the footer */
.site-main:has(> .alignfull:last-child),
.site-main:has(> :last-child > .wp-block-cover:last-child) { padding-bottom: 0; }

/* Band: full-width section; content aligned to the wide column */
.band { padding: var(--space-section) max(var(--gutter), calc((100% - var(--w-wide)) / 2)); }
.is-parchment { background: var(--c-ivory); }

/* Split: image beside text */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 76px; align-items: center; }
.site-main .split > * { margin: 0; }
.split img { display: block; width: 100%; height: auto; max-height: 720px; object-fit: cover; }

/* Reflection: the brand's italic aside */
.reflection { font: italic 500 28px/1.3 var(--f-accent); color: var(--c-green); }
/* Quote block: a reflective voice with a gold rule; the citation in small capitals */
.wp-block-quote { margin-block: 40px; padding: 4px 0 4px 28px; border-left: 2px solid var(--c-gold); }
.wp-block-quote p { font: italic 500 26px/1.4 var(--f-accent); color: var(--c-green); }
.wp-block-quote > :last-child { margin-bottom: 0; }
.wp-block-quote cite { display: block; margin-top: 14px; font: 600 var(--t-xs)/1.5 var(--f-sans); font-style: normal; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-soil); }
.wp-block-quote .wp-block-quote { margin: 0; padding: 0; border: 0; }
.is-style-ornament::before { content: "\25C6"; display: block; margin-bottom: 20px; font: 10px var(--f-sans); color: var(--c-gold); }

/* Scrim: dark gradient behind light text on a cover image. Drawn on its own layer: the cover's
   overlay span can carry an editor-picked inline colour that would hide the image if made opaque. */
.wp-block-cover:is(.has-scrim, .has-scrim-bottom)::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.wp-block-cover:is(.has-scrim, .has-scrim-bottom) > .wp-block-cover__inner-container { position: relative; z-index: 2; }
.wp-block-cover.has-scrim::before { background: linear-gradient(90deg, rgba(12, 36, 26, 0.75), rgba(12, 36, 26, 0.1) 85%); }
.wp-block-cover.has-scrim-bottom::before { background: linear-gradient(0deg, rgba(19, 36, 17, 0.73), transparent); }
.has-scrim, .has-scrim :is(h1, h2, h3, p, .reflection) { color: var(--c-paper); }

/* Pathways: closing band of action links on dark green */
.pathways {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
  padding: 55px max(var(--gutter), calc((100% - var(--w-wide)) / 2));
  background: var(--c-green-dark);
}
.site-main .pathways > * { margin: 0; }
.pathways .action-link { color: var(--c-paper); border-color: var(--c-gold); }
.pathways .action-link:hover { color: var(--c-gold-light); }

/* Page hero: cover block with the title over art (Earth Biome, About, FAQ, Philosophy) */
.wp-block-cover.page-hero {
  min-height: 350px;
  padding: 0;
  align-items: flex-end;
  justify-content: flex-start;
  background: var(--c-green-dark);
  color: var(--c-paper);
}
.page-hero .wp-block-cover__inner-container {
  width: 100%;
  max-width: calc(var(--w-content) + 2 * var(--gutter));
  margin-inline: auto;
  padding: 56px var(--gutter);
}
.page-hero h1 { max-width: 620px; margin: 0; color: var(--c-paper); }

/* Small uppercase label above a heading */
.eyebrow { font: 600 var(--t-label)/1.6 var(--f-sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-soil); }

/* Trademark sign */
.tm { margin-left: 0.1em; font: 400 0.35em/0 var(--f-sans); vertical-align: super; letter-spacing: 0; }

/* Vertical rhythm of a content column: crumb -> intro -> sections */
.site-main .l-content.is-layout-flow > * + * { margin-block-start: var(--space-block); }
.site-main .l-content.is-layout-flow > .crumb + * { margin-block-start: var(--space-crumb); }

/* Page intro: H1 + lead paragraphs */
.page-intro { max-width: 780px; }
.page-intro h1 { margin: 0 0 24px; }
.site-main .page-intro.is-layout-flow > h1 + * { margin-block-start: 24px; }
.page-intro p { max-width: 700px; font-size: var(--t-body); line-height: var(--lh-body); }
.page-head { padding-bottom: 8px; }
/* Plain pages and posts: text at reading width, aligned under the title */
.page-body > * { max-width: var(--w-reading); }
.page-body { padding-bottom: var(--space-section); }
.page-body > h1:first-child { margin-top: var(--space-crumb); }
.page-head .crumb + h1 { margin-top: var(--space-crumb); }

/* Section head: title (+ meta) over a gold rule */
.section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--c-gold);
}
.site-main .section-head > * { margin: 0; }
.section-meta { font-size: var(--t-label); letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; }

/* List rows: title left, summary right (article lists and curated rows) */
.article-list { list-style: none; margin: 0; padding: 0; }
.article-list-item,
.wp-block-columns.list-row {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 50px;
  margin: 0;
  padding: 32px 0;
  border-bottom: 1px solid var(--c-stone);
}
.article-list-item + .article-list-item { margin-top: 0; }
.site-main .list-row > .wp-block-column > * { margin: 0; }
:is(.article-list-item, .list-row) h3 { margin: 0; font-size: 25px; line-height: 1.35; }
:is(.article-list-item, .list-row) h3 a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--c-gold);
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
:is(.article-list-item, .list-row) h3 a:hover { color: var(--c-gold); }
:is(.article-list-item, .list-row) p { margin: 0; font-size: var(--t-small); line-height: var(--lh-body); }
.article-list-empty { font-size: var(--t-small); }
.article-list-item .eyebrow { display: block; margin-bottom: 8px; }

/* Search box (core/search on the Search page) */
.wp-block-search.page-search { max-width: 700px; }
.wp-block-search .wp-block-search__inside-wrapper { gap: 10px; }
.wp-block-search .wp-block-search__input { border: 1px solid var(--c-stone); }
.search-results-body { margin-top: var(--space-section); }
.site-main .search-results-body > * + * { margin-top: var(--space-block); }

/* 404: no breadcrumb above the intro, so it takes the section spacing from the header */
.not-found .page-intro { padding-top: var(--space-section); }
.not-found-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-block: var(--space-block); }

/* Cards: image, title, short text (topic grids) */
.wp-block-columns.card-grid { gap: 28px 56px; }
.site-main .card > * { margin: 0; }
.site-main .card > * + * { margin-top: 14px; }
.card img { display: block; width: 100%; height: auto; }
.card h3 a { color: inherit; }
.card h3 a:hover { color: var(--c-gold); }
.card p { font-size: var(--t-small); }

/* Feature: image beside text on an ivory panel */
.feature { padding: 32px; background: var(--c-ivory); }
.feature > .wp-block-columns { display: grid; grid-template-columns: 320px 1fr; gap: 44px; align-items: center; }
.feature img { display: block; width: 100%; height: auto; }
.feature h2 { margin-bottom: 15px; }
.feature p { font-size: var(--t-small); }

/* Callout: closing invitation with an action link */
.callout { padding: 34px 36px; background: var(--c-ivory); border-left: 2px solid var(--c-gold); }
.callout h2 { font-size: 28px; }
.callout p { max-width: 670px; font-size: var(--t-small); }

/* Link row: several action links side by side */
.link-row { display: flex; flex-wrap: wrap; gap: 4px 32px; }
.site-main .link-row > * { margin: 0; }

@media (max-width: 767px) {
  .section-head { display: block; }
  .section-meta { margin-top: 12px; font-size: 10px; }
  .article-list-item, .wp-block-columns.list-row { display: block; padding: 27px 0; }
  :is(.article-list-item, .list-row) h3 { margin-bottom: 13px; font-size: 22px; }
  .feature { padding: 24px; }
  .feature > .wp-block-columns { display: block; }
  .feature > .wp-block-columns > * + * { margin-top: 24px; }
  .callout { padding: 27px 22px; }
  .wp-block-cover.page-hero { min-height: 260px; }
  .page-hero .wp-block-cover__inner-container { padding-block: 38px; }
  .split { grid-template-columns: 1fr; gap: 32px; }
  .reflection { font-size: 24px; }
  .wp-block-quote { padding-left: 20px; }
  .wp-block-quote p { font-size: 22px; }
  .pathways { grid-template-columns: 1fr; gap: 12px; padding-block: 35px; }
}

/* 8. PAGE FAMILIES ---------------------------------------------------------- */

/* 8.0 Home (front-page.php) ------------------------------------------------- */

.wp-block-cover.home-hero { min-height: max(620px, 82svh); padding: 0; align-items: center; justify-content: flex-start; }
:is(.home-hero, .hp-eight) .wp-block-cover__inner-container {
  width: 100%;
  max-width: calc(var(--w-wide) + 2 * var(--gutter));
  margin-inline: auto;
  padding: 90px var(--gutter);
}
.hero-copy { max-width: 600px; }
.home-hero h1 { margin-bottom: 24px; font-size: var(--h1-hero); }
.site-main .hero-copy > * { margin: 0; }
.hp-support-one { font-size: 24px; font-weight: 600; }
.site-main .hero-copy > .hp-support-two { margin-top: 4px; font-size: 20px; }
.site-main .hero-copy > .reflection { position: relative; max-width: 550px; margin-top: 36px; padding-top: 28px; }
.hero-copy .reflection::before { content: ""; position: absolute; top: 0; left: 0; width: 140px; height: 1px; background: var(--c-gold); }

.band .reflection { margin-top: 28px; }
.hp-three { align-items: end; }
.hp-three img { aspect-ratio: 1.12; }

/* Photo band: full-height photo beside copy on dark green */
.hp-four { display: grid; grid-template-columns: 45% 55%; background: var(--c-green-dark); color: var(--c-paper); }
.site-main .hp-four > * { margin: 0; }
.hp-full-photo { min-height: 600px; }
.site-main .hp-full-photo > figure { height: 100%; margin: 0; }
.hp-full-photo img { width: 100%; height: 100%; object-fit: cover; }
.hp-four-copy { padding: 100px max(var(--gutter), calc((100vw - var(--w-wide)) / 2)) 100px 80px; }
.hp-four-copy :is(h2, p, .reflection) { color: var(--c-paper); }
.hp-four-copy .action-link { color: var(--c-gold-light); }

/* Offset image with a quote panel overlapping its corner */
.hp-offset { position: relative; padding: 0 40px 50px 0; }
.hp-offset img { aspect-ratio: 1; object-fit: cover; }
.site-main .hp-offset > .hp-quote { position: absolute; right: 0; bottom: 0; width: 60%; margin: 0; padding: 28px; background: var(--c-green-dark); color: var(--c-paper); }

/* Parchment band with a narrow image column */
.hp-six { display: grid; grid-template-columns: 64% 36%; align-items: stretch; }
.site-main .hp-six > * { margin: 0; }
.hp-six > .wp-block-group { padding: 100px 70px; text-align: center; }
.hp-six img { height: 100%; object-fit: cover; }

/* Collection teaser */
.hp-category-copy { max-width: 930px; margin-inline: auto; text-align: center; }
.hp-product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
  max-width: 1000px;
  margin: 60px auto 0;
  padding: 40px;
  background: var(--c-ivory);
}
.site-main .hp-product > * { margin: 0; }
.hp-product img { max-height: 520px; object-fit: contain; }
.hp-shop-link { margin-top: 36px; text-align: center; }

/* Closing image band */
.wp-block-cover.hp-eight { min-height: 500px; padding: 0; align-items: center; justify-content: flex-start; }
.hp-eight .wp-block-cover__inner-container > * { max-width: 680px; }

@media (max-width: 1099px) {
  .split { gap: 40px; }
  .hp-four-copy { padding: 65px 40px; }
  .hp-six > .wp-block-group { padding: 70px 36px; }
}

@media (max-width: 767px) {
  .wp-block-cover.home-hero { min-height: 560px; }
  :is(.home-hero, .hp-eight) .wp-block-cover__inner-container { padding-block: 64px; }
  .hp-support-one { font-size: 20px; }
  .hp-four, .hp-six, .hp-product { grid-template-columns: 1fr; }
  .hp-full-photo { min-height: 0; height: 380px; }
  .hp-four-copy { padding: 56px var(--gutter); }
  .hp-offset { padding: 0; }
  .site-main .hp-offset > .hp-quote { position: static; width: 100%; padding: 25px; }
  .hp-six > .wp-block-group { padding: 56px var(--gutter); }
  .hp-six img { height: 300px; }
  .hp-product { gap: 25px; padding: 25px; }
  .hp-product img { max-height: 450px; }
}

/* 8.0b About ----------------------------------------------------------------- */

/* Sections share the band rhythm; their .wrap is the wide column */
:is(.purpose, .commitments, .future) { padding-top: var(--space-section); }
:is(.identity, .purpose, .stewardship, .commitments) { padding-bottom: var(--space-section); }
.identity { background: var(--c-ivory); }

/* Hero */
.page-hero .eyebrow { margin-bottom: 26px; color: var(--c-gold-light); }
.page-hero .deck { max-width: 420px; margin-top: 18px; font-size: 21px; line-height: 1.6; color: var(--c-gold-light); }
.landscape-hero { align-items: center; }

/* Intro: two columns of large text, then a centred reflection */
.identity-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 0 65px; padding-top: 45px; }
.site-main .identity-intro > p:not(.reflection) { margin: 0 0 22px; font-size: 21px; line-height: 1.65; color: var(--c-green); }
.site-main .identity-intro > .reflection { grid-column: 1 / -1; justify-self: center; max-width: 880px; margin-top: 35px; text-align: center; }
.reflection.centered, .steward-reflection { max-width: 880px; margin-inline: auto; text-align: center; }
.site-main .steward-reflection { margin-top: 45px; }

/* Purpose: heading + drawing beside the text */
.wp-block-columns.reading-grid { display: grid; grid-template-columns: 330px 1fr; gap: 95px; align-items: start; }
.relationship-drawing { width: 240px; margin: 22px auto 0; }
.relationship-drawing img { width: 100%; height: auto; mix-blend-mode: multiply; }

/* Stewardship / Present: image bleeds to the viewport edge beside the copy */
.wp-block-columns.steward-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.wp-block-columns.present-split { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.steward-grid > :first-child figure { max-width: none; margin: 0 0 0 calc(-1 * max(var(--gutter), (100vw - var(--w-wide)) / 2)); }
.present-image { margin: 0 calc(-1 * max(var(--gutter), (100vw - var(--w-wide)) / 2)) 0 0; }
.steward-grid > :first-child img { width: 100%; height: 600px; object-fit: cover; object-position: 68% center; mask-image: linear-gradient(90deg, #000 75%, transparent); }
.present-image img { width: 100%; height: 600px; object-fit: cover; mask-image: linear-gradient(270deg, #000 75%, transparent); }
.present-reading { max-width: 660px; padding-block: 80px; }

/* Mission: copy over landscape */
.wp-block-cover.mission { min-height: 430px; padding: 70px 0; }
.mission .wp-block-cover__inner-container { width: 100%; }
.mission-reading { max-width: 660px; }
.mission-reading :is(h2, .reflection) { color: var(--c-gold-light); }
.mission-reading p { color: var(--c-paper); }

/* Commitments: numbered rows */
.section-intro { max-width: 790px; }
.commitment-list { margin-block: 40px; border-bottom: 1px solid var(--c-stone); }
.commitment { display: grid; grid-template-columns: 50px 270px 1fr; gap: 30px; align-items: start; padding-block: 30px; border-top: 1px solid var(--c-stone); }
.site-main .commitment > * { margin: 0; }
.commitment .number { font: italic 400 32px/1 var(--f-accent); color: var(--c-soil); }
.commitment h3 { font: 600 20px/1.35 var(--f-sans); }

/* Future: four horizons with small illustrations, closing copy, closing landscape */
.wp-block-columns.horizons { display: grid; grid-template-columns: 1fr 1fr; gap: 35px 65px; margin-block: 24px 56px; }
.horizons > .wp-block-column { position: relative; padding-left: 88px; }
.site-main .horizons > .wp-block-column > .horizon-illustration { position: absolute; top: 0; left: 0; width: 58px; margin: 0; }
.horizon-illustration img { width: 58px; height: 64px; object-fit: contain; }
.horizons h3 { font: 600 20px/1.3 var(--f-sans); }
.closing-copy { max-width: 820px; margin-inline: auto; }
.wp-block-cover.closing-landscape { min-height: 520px; margin-top: 24px; padding: 160px var(--gutter) 65px; align-items: flex-end; justify-content: center; text-align: center; }
.closing-invitation { max-width: 860px; margin-inline: auto; }
.closing-invitation .reflection { margin-bottom: 35px; font-size: 36px; line-height: 1.25; color: var(--c-ivory); }
.closing-invitation .wp-block-buttons { justify-content: center; }

@media (max-width: 1099px) {
  .wp-block-columns.reading-grid { grid-template-columns: 1fr 1fr; gap: 48px; }
}

@media (max-width: 767px) {
  .identity-intro, .wp-block-columns.reading-grid, .wp-block-columns.steward-grid, .wp-block-columns.present-split, .wp-block-columns.horizons { grid-template-columns: 1fr; gap: 24px; }
  .site-main .identity-intro > p:not(.reflection) { font-size: 18px; }
  .steward-grid > :first-child figure, .present-image { margin-inline: calc(-1 * var(--gutter)); }
  .steward-grid > :first-child img { height: 370px; mask-image: none; }
  .present-image img { height: 370px; mask-image: none; }
  .present-reading { padding-block: 0; }
  .commitment { grid-template-columns: 40px 1fr; gap: 8px 16px; }
  .commitment > p:last-child { grid-column: 2; }
  .horizons > .wp-block-column { padding-left: 72px; }
  .closing-invitation .reflection { font-size: 28px; }
  .wp-block-cover.closing-landscape { min-height: 420px; padding-top: 120px; }
}

/* 8.0c Our Philosophy ------------------------------------------------------- */

:is(.ph-opening, .ph-atmosphere, .ph-close) .wp-block-cover__inner-container {
  width: 100%;
  max-width: calc(var(--w-wide) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* Opening hero */
.wp-block-cover.ph-opening { min-height: 680px; padding: 90px 0; align-items: center; }
.ph-opening .wp-block-cover__inner-container > * { max-width: 640px; }
.ph-opening .eyebrow { margin-bottom: 26px; color: var(--c-gold-light); }
.ph-opening h1 { font-size: var(--h1-hero); }
.ph-opening .reflection { margin-top: 35px; color: var(--c-gold-light); }

/* Intro: two columns + centred reflection on parchment */
.ph-intro { padding: 75px max(var(--gutter), calc((100% - var(--w-wide)) / 2)); background: var(--c-ivory); }
.wp-block-columns.ph-columns { gap: 70px; }
.ph-intro > .reflection { max-width: 800px; margin: 40px auto 0; text-align: center; }

/* Atmosphere covers: copy on light art */
.wp-block-cover.ph-atmosphere { min-height: 710px; padding: 100px 0; color: var(--c-soil); }
.ph-atmosphere h2 { color: var(--c-green); }
.ph-atmosphere .wp-block-cover__inner-container > * { max-width: 600px; padding: 40px 44px; background: rgba(252, 250, 245, 0.86); }
.ph-right .wp-block-cover__inner-container > * { margin-left: auto; }
.ph-center .wp-block-cover__inner-container > * { margin-inline: auto; text-align: center; }

/* Text + image bands */
.ph-split { padding: 85px max(var(--gutter), calc((100% - var(--w-wide)) / 2)); display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.site-main .ph-split > * { margin: 0; }
.ph-split img { width: 100%; height: auto; object-fit: cover; }

/* Stewardship: parchment band with a full-width photo between copy */
.ph-stewardship { padding-block: 85px; background: var(--c-ivory); }
.ph-stewardship > .wp-block-group { max-width: calc(var(--w-reading) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
.site-main .ph-stewardship > figure { margin-block: 40px; }
.ph-stewardship > figure img { width: 100%; height: 500px; object-fit: cover; }

/* Participation: heading beside copy, then the closing invitation */
.ph-participation-copy { display: grid; grid-template-columns: 1fr 2fr; gap: 70px; padding: 85px max(var(--gutter), calc((100% - var(--w-wide)) / 2)); background: var(--c-ivory); }
.site-main .ph-participation-copy > * { margin: 0; }
.wp-block-cover.ph-close { min-height: 700px; padding: 90px 0 120px; align-items: flex-end; justify-content: center; text-align: center; }
.ph-close .wp-block-cover__inner-container > * { max-width: 900px; margin-inline: auto; }
.ph-close :is(p, .reflection) { color: var(--c-paper); }
.ph-close p:not(.reflection) { font-size: 18px; }

@media (max-width: 767px) {
  .wp-block-cover.ph-opening { min-height: 520px; padding: 65px 0; }
  .ph-intro { padding-block: 55px; }
  .wp-block-columns.ph-columns { gap: 0; }
  .wp-block-cover.ph-atmosphere { min-height: 520px; padding: 65px 0; }
  .ph-split, .ph-participation-copy { grid-template-columns: 1fr; gap: 30px; padding-block: 55px; }
  .ph-stewardship > figure img { height: 320px; }
  .wp-block-cover.ph-close { min-height: 560px; padding: 65px 0 80px; }
}

/* 8.0d Resources (holding page) ------------------------------------------- */

.rs-intro { text-align: center; }
.rs-intro .crumb { text-align: left; }
.rs-icon { width: 72px; margin: 0 auto 18px; }
.rs-icon img { width: 72px; height: 72px; object-fit: contain; }
.rs-status { font-size: var(--t-label); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.rs-message { max-width: 440px; margin-inline: auto; font-size: var(--t-small); }

/* 8.0e FAQ + policies ---------------------------------------------------------------- */

.faq-hero h1 { max-width: 560px; color: var(--c-green); }
.faq-intro { max-width: 860px; font-size: var(--t-body); }
.faq-heading { padding-bottom: 42px; }

/* Document layout (FAQ, policies): sticky "On this page" index beside the body */
.doc-layout { display: grid; grid-template-columns: 230px 1fr; gap: 56px; align-items: start; }
.site-main .doc-layout > * { margin: 0; }
.doc-toc { position: sticky; top: calc(var(--header) + var(--admin-bar) + 24px); padding-top: 16px; border-top: 2px solid var(--c-gold); }
.doc-toc .wp-block-details { border: 0; }
.doc-toc .wp-block-details > summary { min-height: 0; padding: 0 0 12px; font: 600 12px/1.5 var(--f-sans); letter-spacing: 0.08em; text-transform: uppercase; }
.doc-toc :is(ul, ol) { list-style: none; margin: 0; padding: 0; }
.doc-toc li { margin: 0 0 12px; font-size: 12px; line-height: 1.7; }
.doc-toc li.subtopic { padding-left: 14px; }
.doc-toc a { color: var(--c-soil); }
.doc-toc a:hover { color: var(--c-green); text-decoration: underline; text-underline-offset: 3px; }
.doc-body { font-size: 16px; line-height: 1.75; }
.doc-body h2 { margin-top: 1.4em; font-size: 28px; }

/* Policy heading: icon beside the H1 */
.utility-heading { padding-bottom: 40px; }
.md-title-row { display: flex; align-items: center; gap: 20px; max-width: none; }
.site-main .md-title-row > * { margin: 0; }
.pp-head-icon { flex: 0 0 auto; width: 60px; }
.pp-head-icon img { width: 60px; height: auto; }

/* Questions */
.faq-tools { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-bottom: 28px; }
.faq-tools button { font: 600 var(--t-xs)/1.6 var(--f-sans); color: var(--c-green); text-decoration: underline; text-decoration-color: var(--c-gold); text-underline-offset: 4px; }
.faq-section + .faq-section { margin-top: 52px; }
.faq-section h3 { margin: 36px 0 14px; font: 600 var(--t-small)/1.6 var(--f-sans); }
.faq-help { padding: 30px; background: var(--c-ivory); }

/* 8.0f Contact ---------------------------------------------------------------- */

.ct-hero { padding: 40px 0 24px; text-align: center; }
.ct-art { width: 240px; max-width: 75%; margin: 0 auto 20px; }
.ct-art img { width: 100%; height: auto; }
.ct-hero p { font-size: 16px; }
.wp-block-columns.ct-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 28px 66px; align-items: start; }
.ct-how p { font-size: var(--t-small); }
.ct-form-panel { padding: 32px; background: var(--c-ivory); }
.ct-form-panel > p { font-size: 14px; }
.ct-required, .ct-helper, .ct-privacy { font-size: 12px; }
.ct-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 18px; }
.ct-field.full { grid-column: 1 / -1; }
.ct-field label { display: block; margin-bottom: 6px; }
.ct-error { margin: 6px 0 0; font-size: 12px; color: var(--c-error); }
.ct-feedback { margin-top: 18px; font-size: var(--t-xs); }
.ct-feedback.is-error { color: var(--c-error); }
.ct-optin { font-size: 13px; }
.ct-optin label { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; color: var(--c-soil); }
.ct-optin input { flex-shrink: 0; margin-top: 3px; }
.ct-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* Newsletter at checkout (opt-in under the customer details) and below the cart (inc/customers.php) */
.checkout-optin { margin-top: 18px; font-size: 13px; }
.checkout-optin label { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; color: var(--c-soil); }
.checkout-optin input { flex-shrink: 0; margin-top: 3px; }
.cart-newsletter { margin-top: var(--space-section); padding: 32px; background: var(--c-ivory); }
.cart-newsletter h2 { margin-top: 0; }

@media (max-width: 1099px) {
  .doc-layout { grid-template-columns: 180px 1fr; gap: 32px; }
}

@media (max-width: 767px) {
  .doc-layout { grid-template-columns: 1fr; gap: 32px; }
  .doc-toc { position: static; }
  .pp-head-icon, .pp-head-icon img { width: 44px; }
  .wp-block-columns.ct-grid, .ct-fields { grid-template-columns: 1fr; }
  .ct-form-panel { padding: 24px; }
}

/* 8.0g Commerce (WooCommerce cart, checkout, account) ------------------------ */

.commerce .woocommerce { font-size: var(--t-small); }
.woocommerce .coupon { display: flex; gap: 10px; max-width: 460px; margin-bottom: 16px; }
.woocommerce .coupon .input-text { flex: 1; }
.cart-empty h2 { font-size: 28px; }

.woocommerce table.shop_table { border: 1px solid var(--c-stone); border-radius: 0; border-collapse: collapse; }
.woocommerce table.shop_table :is(th, td) { padding: 14px 16px; border-color: var(--c-stone); }
.woocommerce table.shop_table th { font-weight: 600; color: var(--c-green); }
.woocommerce table.shop_table img { width: 64px; }
.woocommerce a.remove { color: var(--c-error) !important; } /* WooCommerce sets this with !important */
.woocommerce a.remove:hover { background: var(--c-error); color: #fff !important; }

.woocommerce form .form-row label { display: block; margin-bottom: 6px; line-height: 1.5; }
.woocommerce form .form-row :is(.input-text, select, textarea) { min-height: 46px; padding: 10px 14px; border: 1px solid var(--c-stone); border-radius: 0; background: #fff; }
.woocommerce form .form-row :is(.input-text, select):focus { border-color: var(--c-green); outline: 0; box-shadow: 0 0 0 2px rgba(50, 75, 36, 0.15); }
.woocommerce :is(form.login, form.register, form.checkout_coupon) { border: 1px solid var(--c-stone); border-radius: 0; padding: 24px; }

.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
  border-top: 2px solid var(--c-green);
  background: var(--c-ivory);
  color: var(--c-soil);
}
.woocommerce .woocommerce-error { border-top-color: var(--c-error); }
.woocommerce :is(.woocommerce-message, .woocommerce-info)::before { color: var(--c-green); }
.woocommerce-checkout #payment { border-radius: 0; background: var(--c-ivory); }
.woocommerce .cart-collaterals .cart_totals h2, .woocommerce-checkout h3 { font: 400 28px/1.3 var(--f-serif); color: var(--c-green); }

/* 8.1 Shop (landscape cover + collection) ---------------------------------- */

.wp-block-cover.shop-landscape { min-height: 0; padding: 0; align-items: stretch; background: var(--c-green-dark); }
.shop-landscape .wp-block-cover__image-background { object-position: center top; }
.shop-landscape .wp-block-cover__inner-container { width: 100%; color: var(--c-soil); }

/* Tall enough that the foundation band below lands on the dark lower part of the art */
.shop-entry { min-height: 44vw; padding-block: 72px 150px; }
.shop-entry .eyebrow { margin-bottom: 40px; }
.wp-block-columns.shop-entry-grid { gap: 64px; }
.shop-entry h1 { margin: 0; }
.shop-entry h1 span { display: block; color: #715238; }
.shop-expression { margin-top: 24px; font: italic 500 27px/1.4 var(--f-accent); color: var(--c-soil); }
.shop-definition { padding-left: 40px; border-left: 1px solid var(--c-stone); }
.shop-definition p { font-size: var(--t-body); }

.shop-foundation { padding-block: 40px 80px; color: var(--c-paper); }
.wp-block-columns.foundation-grid { gap: 65px; }
.wp-block-column.foundation-heading { flex: 0 0 300px; }
.foundation-heading h2 { color: var(--c-paper); }
.foundation-heading h2 span { color: var(--c-gold-light); }
.botanical-accent img { width: 160px; height: auto; }
.shop-foundation p { color: var(--c-paper); }

.shop-collection { padding-top: var(--space-section); }
.shop-collection > h2 { margin-bottom: 36px; }

/* Product cards (used wherever products are listed) */
.product-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 380px)); justify-content: center; gap: 32px; }
.site-main .product-card > * { margin: 0; }
.product-card img { display: block; width: 100%; height: auto; }
.product-card h3 { font: 500 20px/1.4 var(--f-sans); border-bottom: 1px solid var(--c-stone); transition: border-color 0.2s ease; }
.product-card h3 a { display: block; padding: 19px 0 12px; color: var(--c-green); }
.product-card h3 a span[aria-hidden] { float: right; font-size: 25px; font-weight: 400; line-height: 1.1; }
.product-card:hover h3 { border-color: var(--c-green); }
.product-card:hover h3 a { text-decoration: underline; text-underline-offset: 5px; }

@media (max-width: 767px) {
  .shop-entry { padding-block: 48px 96px; }
  .shop-entry .eyebrow { margin-bottom: 24px; }
  .shop-definition { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--c-stone); }
  .shop-expression { font-size: 22px; }
  .wp-block-column.foundation-heading { flex-basis: auto; }
  .botanical-accent img { width: 120px; }
  .shop-foundation { padding-block: 24px 56px; }
  .product-card h3 { font-size: 18px; }
}

/* 8.2 Earth Biome product page ----------------------------------------------- */

.eb { color: #384536; }
.eb-top, .wp-block-columns.eb-top { display: grid; grid-template-columns: 1.05fr 1fr; gap: 55px; }
/* Subscribe & save choice (inc/subscriptions.php) */
.eb-plan { margin-top: 14px; }
.eb-plan .eb-choice:has(input:disabled) { opacity: 0.5; }
.eb-plan-every { display: block; font-weight: 400; }
.eb-plan-note { margin: 8px 0 0; font-size: 12px; }
.eb-plan:not(:has(input[value="subscribe"]:checked)) .eb-plan-note { display: none; }
.sub-confirm { max-width: 460px; padding: 32px; border: 1px solid var(--c-stone); border-top: 2px solid var(--c-gold); background: var(--c-paper); color: var(--c-soil); }
.sub-confirm::backdrop { background: rgba(31, 42, 36, 0.55); }
.sub-confirm h2 { margin: 0 0 14px; font-size: 26px; }
.sub-confirm p { font-size: var(--t-small); }
.sub-confirm-commitment { font-weight: 600; }
.sub-confirm-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.sub-confirm .button.is-secondary { background: transparent; color: var(--c-green); }
.sub-confirm .button.is-secondary:hover { background: var(--c-green); color: var(--c-paper); }
.sub-min-note, .sub-terms { font-size: var(--t-small); }
/* Products without a designed description (woocommerce/single-product.php) */
.product-notices:has(:is(.woocommerce-message, .woocommerce-error, .woocommerce-info)) { padding-top: 24px; }
.product-standard { padding-block: 32px 56px; }
.product-standard h1 { margin: 0 0 16px; }
.product-standard__intro { margin-bottom: 24px; }

/* Gallery */
/* Fixed frame: images of other proportions (EB-02 is 1080x1512) fit inside without resizing the viewer */
.eb-image { aspect-ratio: 1122 / 1402; min-height: 0; overflow: hidden; background: var(--c-ivory); border: 1px solid var(--c-stone); }
.eb-image button { display: block; width: 100%; height: 100%; padding: 0; cursor: zoom-in; }
.eb-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.eb-thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.eb-thumbs button { aspect-ratio: 1; padding: 4px; overflow: hidden; background: var(--c-ivory); border: 1px solid var(--c-stone); }
.eb-thumbs button[aria-pressed="true"] { padding: 3px; border: 2px solid var(--c-green); }
.eb-thumbs img { width: 100%; height: 100%; object-fit: contain; }

/* Benefits panel */
.eb-benefits {
  margin: 26px 0 24px;
  padding: 30px 32px 26px;
  background: radial-gradient(ellipse at 100% 0%, #49613A 0%, transparent 65%), linear-gradient(135deg, var(--c-green), #233C28);
  border-top: 2px solid var(--c-gold);
  color: var(--c-paper);
}
.eb-benefits h2 { margin: 0 0 19px; padding-bottom: 18px; font-size: 27px; color: var(--c-paper); border-bottom: 1px solid rgba(179, 137, 44, 0.5); }
.eb-benefits ul { list-style: none; margin: 0; padding: 0; }
.eb-benefits li { margin: 0; padding: 12px 0 13px; font-size: var(--t-xs); line-height: 1.65; border-bottom: 1px solid rgba(252, 250, 245, 0.17); }
.eb-benefits li:first-child { padding-top: 0; }
.eb-benefits li strong { display: block; margin-bottom: 3px; font: 400 23px/1.2 var(--f-serif); color: var(--c-paper); }
.eb .scope, .eb .disclaimer, .eb .qualification { font-style: italic; }
.eb-benefits .scope { margin: 20px 0 0; font-size: 12px; line-height: 1.8; }
.eb .disclaimer { margin: 18px 0; font-size: 12px; line-height: 1.75; }

/* Pack size + order */
.eb-cart-form { display: flex; flex-direction: column; gap: 16px; margin: 24px 0; }
.eb-cart-form fieldset { margin: 0; padding: 0; border: 0; }
.eb-cart-form legend { margin-bottom: 10px; padding: 0; font-size: 12px; font-weight: 600; color: var(--c-green); }
.eb-cart-form p { margin: 0; }
.eb-choices { display: flex; gap: 12px; }
.eb-choice {
  flex: 1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 8px;
  align-items: center;
  padding: 13px 14px;
  border: 1px solid var(--c-green);
  background: var(--c-paper);
  color: var(--c-green);
  font: 500 14px/1.5 var(--f-sans);
  cursor: pointer;
}
.eb-choice span { grid-column: 2; font-weight: 400; font-size: var(--t-xs); }
.eb-choice input { accent-color: var(--c-green); margin: 0; }
.eb-choice:has(input:checked) { background: var(--c-green); color: var(--c-paper); }
.eb-choice:has(input:checked) input { accent-color: var(--c-paper); }
.eb-cart-form .eb-total { font-weight: 600; color: var(--c-green); }
.eb-order { display: flex; align-items: flex-end; gap: 12px; }
.eb-order label { display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.eb-order input { width: 76px; }
.eb-order .eb-cart { flex: 1; }

.eb-identifiers { display: flex; gap: 32px; margin-top: 18px; padding: 22px 0; border-block: 1px solid var(--c-stone); color: var(--c-green); }
.eb-identifier { display: flex; align-items: center; gap: 12px; font: 600 var(--t-xs)/1.5 var(--f-sans); }
.eb-identifier img { width: 44px; height: 44px; flex-shrink: 0; }
.site-main .eb-identifier > * { margin: 0; }

/* Detail panels: the shared accordion, centred */
.eb-panels { max-width: 920px; margin-inline: auto; border-top: 1px solid var(--c-stone); }
.eb-panels h3 { margin: 25px 0 12px; font: 600 var(--h4)/1.5 var(--f-sans); }
.eb-panels .qualification { padding: 16px 20px; background: #E8EDDF; }
.eb-facts { margin: 24px 0; padding: 20px; background: var(--c-paper); border: 2px solid var(--c-green); }
.eb-facts table { width: 100%; margin: 15px 0; border-collapse: collapse; font-size: var(--t-xs); line-height: 1.6; }
.eb-facts th, .eb-facts td { padding: 9px 6px; text-align: left; border-bottom: 1px solid #87957C; }

/* Closing band: art behind copy */
.eb-questions {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 410px;
  padding: 54px 48px;
  overflow: hidden;
  background: var(--c-ivory);
  color: var(--c-green);
}
.site-main .eb-questions > figure { position: absolute; inset: 0; z-index: -1; margin: 0; }
.eb-question-art img { width: 100%; height: 100%; object-fit: cover; }
.eb-question-copy { max-width: 440px; }
.eb-question-copy h2 { margin-top: 0; }
.eb-question-copy a { display: block; width: fit-content; font: 600 14px/1.5 var(--f-sans); text-decoration: underline; text-underline-offset: 5px; }
.site-main .eb-question-copy p:has(> a:only-child) + p:has(> a:only-child) { margin-block-start: 15px; }

/* Label dialog */
.eb-label-dialog { width: min(92vw, 1000px); max-height: 90vh; padding: 16px; border: 1px solid var(--c-green); background: var(--c-paper); color: var(--c-green); }
.eb-label-dialog::backdrop { background: rgba(0, 0, 0, 0.65); }
.eb-label-dialog > button { position: sticky; top: 0; display: block; margin-left: auto; padding: 12px; background: var(--c-green); color: #fff; }
.eb-label-dialog img { display: block; width: 100%; height: auto; }

@media (max-width: 767px) {
  .eb-top, .wp-block-columns.eb-top { display: block; }
  .eb-top > * + * { margin-top: 32px; }
  .eb-choices { gap: 8px; }
  .eb-benefits { padding: 24px; }
  .eb-identifiers { gap: 20px; flex-wrap: wrap; }
  .eb-questions { min-height: 640px; padding: 265px 24px 30px; align-items: flex-end; }
  .eb-question-art img { height: auto; object-fit: contain; object-position: top; }
}

/* 8.3 Journal article (template-article.php) ------------------------------- */

/* Hero: featured image with topic + title overlaid at the bottom (stacked on phones) */
.article-hero { position: relative; margin: 0; background: var(--c-green-dark); overflow: hidden; }
.article-hero-image { display: block; width: 100%; height: auto; max-height: 560px; object-fit: cover; }
.article-hero-title {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding-bottom: 48px;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.12) 70%, transparent);
  color: var(--c-paper);
}
.article-hero-title h1 { max-width: 930px; margin: 0; font-size: var(--h1-article); line-height: 1.13; color: var(--c-paper); text-wrap: balance; }
.article-topic {
  display: inline-block;
  margin-bottom: 15px;
  color: var(--c-paper);
  font: 600 12px/1.5 var(--f-sans);
  letter-spacing: 0.1em;
  text-decoration: underline;
  text-decoration-color: var(--c-gold-light);
  text-underline-offset: 4px;
}
.article-topic:hover { color: var(--c-gold-light); }

/* Head: crumb, then the centred deck and caption */
.article-deck { max-width: 760px; margin: var(--space-crumb) auto 0; font-size: 18px; line-height: 1.65; text-align: center; }
.article-caption { max-width: var(--w-reading); margin: 16px auto 0; font: italic 12px/1.7 var(--f-sans); text-align: center; }

/* Body: reading column */
.article-body { margin-top: 48px; }
.article-body h2 { margin-top: 46px; font-size: 28px; line-height: 1.3; }
.site-main .article-body.is-layout-flow > h2,
.site-main .article-body > h2 { margin-block-start: 46px; }
.article-body h3 { font: 600 var(--h4)/1.4 var(--f-sans); }

/* Digest + concept: green textured panels */
.article-digest, .article-concept {
  padding: 28px 32px;
  background: #243C23 url('../img/05-graphic-motifs/textures/TEXTURE-ARTICLE-GREEN.png') center / cover no-repeat;
  color: var(--c-paper);
}
.article-digest h2 { margin: 0 0 13px; font: 600 13px/1.5 var(--f-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-gold-light); }
.site-main .article-digest > h2 + * { margin-block-start: 0; }
:is(.article-digest, .article-concept) p { margin: 0; line-height: 1.75; color: var(--c-paper); }
:is(.article-digest, .article-concept) strong { color: var(--c-paper); }
.site-main .article-body > .article-digest + * { margin-block-start: 46px; }

/* Pull quote: wider than the column, ruled top and bottom */
.article-pull {
  margin-inline: -40px;
  padding: 28px 32px;
  border-block: 1px solid var(--c-gold);
  border-left: 0;
}
.article-pull p { margin: 0; font: 400 30px/1.42 var(--f-serif); color: var(--c-green); }

/* Reflection: light textured aside */
.journal-reflection {
  padding: 24px 28px;
  background: #F5F2EB url('../img/05-graphic-motifs/textures/TEXTURE-ARTICLE-LIGHT.png') center / cover no-repeat;
  border-left: 2px solid var(--c-gold);
}
.journal-reflection h3 { margin: 0 0 12px; font-size: var(--t-xs); letter-spacing: 0.05em; }
.journal-reflection p { margin: 0; font-size: 18px; line-height: 1.7; }

/* Sources (core/details) */
.article-sources { margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--c-stone); border-bottom: 0; font-size: var(--t-xs); line-height: 1.7; }
.article-sources > summary { min-height: 0; padding: 0; font: 600 var(--t-xs)/1.7 var(--f-sans); }
.article-sources li { margin: 13px 0; }

/* Continue exploring */
.article-related { margin-top: 50px; padding-top: 30px; border-top: 1px solid var(--c-stone); }
.article-related h2 { margin: 0 0 22px; }
.site-main .article-related > p + p { margin-block-start: 4px; }

@media (max-width: 767px) {
  .article-hero { background: none; }
  .article-hero-title { position: static; padding: 24px 0 0; background: none; color: var(--c-green); }
  .article-hero-title h1 { color: var(--c-green); }
  .article-topic { color: var(--c-green); text-decoration-color: var(--c-gold); }
  .article-deck { font-size: 16px; text-align: left; }
  .article-caption { text-align: left; }
  .article-body { margin-top: 32px; }
  .article-pull { margin-inline: 0; padding: 22px 0; }
  .article-pull p { font-size: 24px; }
  .article-digest, .article-concept { padding: 24px; }
}

/* 9. UTILITIES & PRINT ------------------------------------------------------ */

.has-text-align-center { text-align: center; }
.aligncenter { margin-inline: auto; }

@media print {
  .site-header, .site-footer, .skip-link { display: none; }
  .site-main { padding: 0; }
}