/*
Theme Name: Heritage Oaks Wildlife
Template: generatepress
Author: Heritage Oaks
Description: Heritage Oaks branding for the members' Wildlife site — matches the public website redesign (Copperplate/Avenir type, brand greens, cards, buttons) and provides the light/dark theme system with a header toggle. Child theme of GeneratePress.
Version: 1.1.0
*/

/* ============ Licensed brand fonts (same kit as the public redesign) ============ */
@font-face{font-family:"CopperplateGothicLight";src:url("fonts/CopperplateLight/font.woff2") format("woff2"),url("fonts/CopperplateLight/font.woff") format("woff");font-display:swap}
@font-face{font-family:"AvenirNextRegular";src:url("fonts/AvenirNextProRegular/font.woff2") format("woff2"),url("fonts/AvenirNextProRegular/font.woff") format("woff");font-display:swap}

/* ============ Brand constants (public redesign palette) ============ */
:root{
  --c-green-900:#214734; --c-green-700:#2c6e49; --c-green-600:#3f6f4d; --c-green-400:#6fa37c;
  --c-ink:#3f5246; --c-ink-strong:#26352c; --c-muted:#6a786f;
  --c-tint:#e7f0ea; --c-tint-soft:#eef7f3; --c-border:#d7e2d7; --c-border-soft:#eef2ef;
  --c-white:#ffffff; --c-on-dark:#e6f0ea; --c-gold:#8a6d1f;
  --serif:"CopperplateGothicLight","Copperplate Gothic Light","Copperplate",Georgia,serif;
  --sans:"AvenirNextRegular","Segoe UI",Arial,Helvetica,sans-serif;
}

/* ═══════════════════════════════════════════════════════════════════
   THEME TOKENS — the light/dark system.
   Defaults (:root) are the DARK values = the site's current
   nature-at-dusk look, so with no JS (or the child theme removed from
   a page's CSS vars) everything renders exactly as it does today.
   html.ho-light swaps in the public-redesign light values.
   Page inline CSS + components consume these via var(--wl-*, darkFallback).
   ═══════════════════════════════════════════════════════════════════ */
:root{
  color-scheme:dark;
  /* type — dark mode is "The Preserve": Cormorant Garamond display + Archivo body */
  --wl-font-display:'Cormorant Garamond',Georgia,serif;
  --wl-font-body:'Archivo',system-ui,'Segoe UI',Arial,sans-serif;
  --wl-display-tracking:.01em;
  --wl-display-weight:500;
  /* surfaces */
  --wl-bg:#10241B;
  --wl-card-bg:#183226;
  --wl-card-bg-hover:#1C3A2C;
  --wl-card-border:rgba(242,237,226,.14);
  --wl-card-border-hover:rgba(242,237,226,.3);
  --wl-card-radius:4px;
  --wl-card-shadow:none;
  --wl-card-shadow-hover:none;
  --wl-panel-bg:#183226;
  --wl-border:rgba(242,237,226,.14);
  --wl-border-strong:rgba(242,237,226,.3);
  /* text */
  --wl-heading:#F2EDE2;
  --wl-text:#C6CFBF;
  --wl-text-strong:#F2EDE2;
  --wl-text-soft:#DCE2D3;
  --wl-muted:#B9C7B4;
  --wl-card-text:#C6CFBF;
  --wl-eyebrow:#C9AE72;
  --wl-accent-line:#C9AE72;
  --wl-link:#C9AE72;
  --wl-link-hover:#D8BF85;
  --wl-card-link:#C9AE72;
  --wl-media-bg:#183226;
  /* buttons — brass on deep green */
  --wl-btn-bg:#C9AE72;
  --wl-btn-bg-hover:#D8BF85;
  --wl-btn-text:#10241B;
  --wl-btn-radius:2px;
  --wl-ghost-text:#F2EDE2;
  --wl-ghost-border:rgba(242,237,226,.5);
  --wl-ghost-hover-bg:rgba(242,237,226,.08);
  --wl-ghost-hover-text:#F2EDE2;
  /* chrome */
  --wl-header-bg:#10241B;
  --wl-header-border:rgba(242,237,226,.14);
  --wl-nav-text:#C6CFBF;
  --wl-nav-active:#F2EDE2;
  --wl-nav-hover-bg:transparent;
  --wl-footer-bg:#10241B;
  --wl-footer-text:#B9C7B4;
  --wl-footer-link:#B9C7B4;
  /* forms */
  --wl-input-bg:#183226;
  --wl-input-border:rgba(242,237,226,.2);
  --wl-input-text:#F2EDE2;
}
html.ho-light{
  color-scheme:light;
  /* type — light mode matches the club redesign kit */
  --wl-font-display:"CopperplateGothicLight","Copperplate Gothic Light","Copperplate",Georgia,serif;
  --wl-font-body:"AvenirNextRegular","Segoe UI",Arial,Helvetica,sans-serif;
  --wl-display-tracking:.03em;
  --wl-display-weight:400;
  /* surfaces */
  --wl-bg:#ffffff;
  --wl-card-bg:#ffffff;
  --wl-card-bg-hover:#ffffff;
  --wl-card-border:#d7e2d7;
  --wl-card-border-hover:#6fa37c;
  --wl-card-radius:12px;
  --wl-card-shadow:0 3px 10px rgba(32,51,38,.08);
  --wl-card-shadow-hover:0 12px 26px rgba(32,51,38,.16);
  --wl-panel-bg:#eef7f3;
  --wl-border:#d7e2d7;
  --wl-border-strong:#d7e2d7;
  /* text */
  --wl-heading:#214734;
  --wl-text:#3f5246;
  --wl-text-strong:#26352c;
  --wl-text-soft:#3f5246;
  --wl-muted:#7d8c82;
  --wl-card-text:#3f5246;
  --wl-eyebrow:#2c6e49;
  --wl-accent-line:#6fa37c;
  --wl-link:#2c6e49;
  --wl-link-hover:#214734;
  --wl-card-link:#214734;
  --wl-media-bg:#e7f0ea;
  /* buttons */
  --wl-btn-bg:#214734;
  --wl-btn-bg-hover:#2c6e49;
  --wl-btn-text:#ffffff;
  --wl-btn-radius:8px;
  --wl-ghost-text:#214734;
  --wl-ghost-border:#214734;
  --wl-ghost-hover-bg:#214734;
  --wl-ghost-hover-text:#ffffff;
  /* chrome */
  --wl-header-bg:#ffffff;
  --wl-header-border:#d7e2d7;
  --wl-nav-text:#214734;
  --wl-nav-active:#2c6e49;
  --wl-nav-hover-bg:#eef7f3;
  --wl-footer-bg:#ffffff;
  --wl-footer-text:#3f5246;
  --wl-footer-link:#214734;
  /* forms */
  --wl-input-bg:#ffffff;
  --wl-input-border:#d7e2d7;
  --wl-input-text:#3f5246;
}

/* ============ Theme type (per-mode via tokens) ============
   Light = Copperplate/Avenir (club kit) · Dark = Cormorant Garamond/Archivo
   ("The Preserve"). The plugin/page CSS embeds Cinzel + Nunito Sans with
   !important; these load later in the cascade at >= specificity, so they win. */
body,button,input,select,textarea,
.ho-wildlife-wrap,.ho-site-footer,.ho-site-footer-inner,.ho-cookie-text{font-family:var(--wl-font-body) !important}
#site-navigation a,.main-navigation a{font-family:var(--wl-font-body) !important}
h1,h2,h3,h4,h5,.site-title,.widget-title,.wp-block-heading,
h1.entry-title,.entry-title,
.ho-wildlife-card h2,.ho-home-hero h1,.ho-count-number,
.ho-article-feature-card h2,.ho-article-feature-text h3,.ho-article-card h3,
.ho-lightbox-caption,.ho-game-title,
[class*="ho-nac"] h1,[class*="ho-nac"] h2,[class*="ho-nac"] h3{
  font-family:var(--wl-font-display) !important;font-weight:var(--wl-display-weight);
  letter-spacing:var(--wl-display-tracking);line-height:1.2}
a{color:var(--wl-link);text-decoration:none}
a:hover,a:focus{color:var(--wl-link-hover)}

/* ============ Theme toggle — pill with sliding knob (lives in the menu) ============ */
li.ho-theme-item{align-items:center}
.ho-theme-toggle{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;margin:0 2px 0 8px;cursor:pointer;
  border-radius:999px;background:transparent;
  border:1px solid rgba(242,237,226,.3);
  transition:border-color .18s}
.ho-theme-toggle:hover{border-color:#C9AE72}
.ho-tgl-club{line-height:0}
.ho-tgl-club img{width:16px;height:16px;display:block;filter:grayscale(1) brightness(2.4)}
html.ho-light .ho-tgl-club img{filter:none}
.ho-tgl-paw{line-height:0}
.ho-tgl-paw svg{width:15px;height:15px}
html.ho-dark span.ho-tgl-paw{color:#C9AE72 !important}
html.ho-light span.ho-tgl-paw{color:var(--c-muted) !important}
.ho-tgl-track{position:relative;width:38px;height:20px;border-radius:999px;display:inline-block;background:#183226}
.ho-tgl-knob{position:absolute;top:2px;left:20px;width:16px;height:16px;border-radius:50%;background:#C9AE72;transition:left .2s ease}
html.ho-light .ho-theme-toggle{border-color:var(--c-border)}
html.ho-light .ho-theme-toggle:hover{border-color:var(--c-green-400)}
html.ho-light .ho-tgl-track{background:var(--c-tint)}
html.ho-light .ho-tgl-knob{left:2px;background:var(--c-green-900)}
/* GP paints button:focus dark grey (#3f4047) — keep the toggle its normal self
   after a click; show a ring only for keyboard focus */
.ho-theme-toggle:focus{outline:none;background:transparent;border-color:rgba(242,237,226,.3);color:inherit}
html.ho-light .ho-theme-toggle:focus{background:transparent;border-color:var(--c-border)}
.ho-theme-toggle:focus-visible{outline:2px solid var(--c-green-400);outline-offset:2px}
/* same GP focus-grey bug on the plugin's own <button> pills (dark mode; the
   light layer's !important rules already win there) */
button.ho-wildlife-button:focus,button.ho-filter-button:focus,
button.ho-bulk-download-button:focus,button.ho-slideshow-launch:focus,
button.ho-selection-cancel:focus{
  outline:none;background:rgba(53,136,115,.1);border-color:rgba(53,136,115,.4);color:#a8c8bc}
button.ho-filter-button.is-active:focus{background:#358873;border-color:#358873;color:#fff}
button[class*="ho-"]:focus-visible{outline:2px solid var(--c-green-400);outline-offset:2px}
html.ho-light .ho-theme-toggle{color:var(--c-green-900);border-color:var(--c-border)}
html.ho-light .ho-theme-toggle:hover{color:var(--c-green-700);border-color:var(--c-green-400);background:var(--c-tint-soft)}
/* show the icon of the mode you'll switch TO */
html.ho-dark .ho-icon-moon{display:none}
html.ho-light .ho-icon-sun{display:none}
/* mobile menu: keep it a compact control, not a full-width item */
@media (max-width:768px){
  #site-navigation.toggled li.ho-theme-item{padding:10px 20px}
}

/* ============ Site branding per mode ============
   Light: club logo + "Natural Assets" wordmark beside it.
   Dark (Preserve): no logo image — serif "Heritage Oaks" over a tracked
   "NATURAL ASSETS" label (both pseudo-content on the home link). */
.site-header .site-logo a{display:flex !important;align-items:center;gap:16px;text-decoration:none}
html.ho-light .site-header .site-logo a::after{
  content:"Natural Assets";font-family:var(--wl-font-display);
  font-size:17px;letter-spacing:.04em;color:var(--c-green-900);line-height:1.2}
html.ho-dark .site-header img.header-image.is-logo-image{display:none !important}
html.ho-dark .site-header .site-logo a{flex-direction:column;align-items:flex-start;gap:2px;line-height:1.15 !important}
html.ho-dark .site-header .site-logo a::before{
  content:"Heritage Oaks";font-family:var(--wl-font-display);
  font-size:24px;font-weight:600;letter-spacing:.04em;color:#F2EDE2}
html.ho-dark .site-header .site-logo a::after{
  content:"Natural Assets";font-family:var(--wl-font-body);
  font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:#B9C7B4}

/* ============ "Member Portal" control ============
   Light: solid green button. Dark (Preserve): outlined pill with ↗. */
.main-navigation .main-nav ul li.ho-portal-item{margin-left:auto}
#site-navigation li.ho-portal-item a{
  border:1px solid rgba(242,237,226,.35) !important;border-radius:999px !important;
  color:#F2EDE2 !important;margin:6px 4px;line-height:1;padding:9px 18px !important}
#site-navigation li.ho-portal-item a::after{content:" \2197"}
#site-navigation li.ho-portal-item a:hover{
  background:transparent !important;border-color:#C9AE72 !important;color:#C9AE72 !important}
/* matches the club header's Member Login button (teal #358873, radius 6) */
html.ho-light #site-navigation li.ho-portal-item a{
  background:#358873 !important;border:0 !important;border-radius:6px !important;
  color:#fff !important;font-weight:500 !important;font-size:15px !important;padding:10px 20px !important;
  box-shadow:none}
html.ho-light #site-navigation li.ho-portal-item a::after{content:""}
html.ho-light #site-navigation li.ho-portal-item a:hover{
  background:var(--c-green-700) !important;color:#fff !important}

/* ============ Buttons (theme-aware) ============
   Skips the GP menu/dropdown toggles and EVERY ho-* classed control — the
   plugin styles its own buttons (filter pills, CTAs, game) and this generic
   rule must not out-specify them. */
.button,button:not(.menu-toggle):not(.dropdown-menu-toggle):not([class*="ho-"]),
input[type="submit"],input[type="button"],
.wp-block-button__link,.entry-content .button{
  background:var(--wl-btn-bg);color:var(--wl-btn-text);border:0;border-radius:var(--wl-btn-radius);
  padding:12px 22px;font-family:var(--sans);font-weight:600;font-size:15px;line-height:1.2;
  letter-spacing:.01em;text-decoration:none;display:inline-block;cursor:pointer;transition:background .15s}
.button:hover,button:not(.menu-toggle):not(.dropdown-menu-toggle):not([class*="ho-"]):hover,
input[type="submit"]:hover,.wp-block-button__link:hover{background:var(--wl-btn-bg-hover);color:var(--wl-btn-text)}
.is-style-outline .wp-block-button__link,.button.ho-ghost{
  background:transparent;color:var(--wl-ghost-text);border:2px solid var(--wl-ghost-border)}
.is-style-outline .wp-block-button__link:hover,.button.ho-ghost:hover{
  background:var(--wl-ghost-hover-bg);color:var(--wl-ghost-hover-text)}

/* ============ Generic tinted panel + card helpers (theme-aware) ============ */
.ho-panel{background:var(--wl-panel-bg);border:1px solid var(--wl-border);border-radius:14px;padding:22px 24px}
.ho-card{background:var(--wl-card-bg);border:1px solid var(--wl-card-border);border-radius:var(--wl-card-radius);overflow:hidden;box-shadow:var(--wl-card-shadow)}
blockquote{border-left:4px solid var(--c-green-400);color:var(--wl-text-strong)}
.entry-content h2{margin-top:1.4em}

/* ═══════════════════════════════════════════════════════════════════
   LIGHT MODE — chrome overrides.
   The wildlife plugin paints the dark chrome (html/body background,
   header, nav, footers) with un-scoped !important rules. These rules
   carry higher specificity (html.ho-light prefix) and load later, so
   they win deterministically in light mode; dark mode is untouched.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Page background + base text ── */
/* full-bleed header bands use 100vw; clip the sliver of x-overflow (same fix
   as the public redesign's site CSS) */
html,body{overflow-x:clip;max-width:100%}
html.ho-light{background:#fff !important}
html.ho-light body{
  background:var(--wl-bg) !important;background-image:none !important;
  color:var(--wl-text) !important}
/* the plugin's readability catch-all forces #c8ddd5 on these tags */
html.ho-light body,html.ho-light .site,html.ho-light p,html.ho-light li,
html.ho-light td,html.ho-light th,html.ho-light label,html.ho-light span{
  color:var(--wl-text) !important}
html.ho-light h1,html.ho-light h2,html.ho-light h3,html.ho-light h4,html.ho-light h5,
html.ho-light h1.entry-title,html.ho-light .entry-title{color:var(--wl-heading) !important}
html.ho-light h1.entry-title::after,html.ho-light .entry-title::after{background:var(--wl-accent-line) !important}

/* ── Header + nav ── */
html.ho-light #masthead,html.ho-light .site-header,
html.ho-light #masthead .inside-header,html.ho-light .site-header .inside-header{
  background-color:var(--wl-header-bg) !important;
  border-bottom:1px solid var(--wl-header-border) !important}
/* chrome parity with the club site header (measured live): 16px/400 #404040
   links, ~64px logo, roomier header; active page gets a sage underline */
html.ho-light .site-header img.header-image.is-logo-image{max-height:64px !important}
html.ho-light .inside-header{min-height:96px !important}
html.ho-light #site-navigation a,html.ho-light .main-navigation a{
  color:#404040 !important;font-weight:400 !important;font-size:16px !important;
  letter-spacing:normal !important;text-transform:none !important;padding:10px 14px !important;
  border-radius:0 !important;border-bottom:2px solid transparent !important}
html.ho-light #site-navigation a:hover,html.ho-light .main-navigation a:hover{
  color:var(--c-green-900) !important;background:transparent !important}
html.ho-light #site-navigation .current-menu-item > a,html.ho-light .main-navigation .current-menu-item > a,
html.ho-light #site-navigation .current_page_item > a,html.ho-light .main-navigation .current_page_item > a{
  color:var(--c-green-900) !important;background:transparent !important;
  border-bottom-color:var(--c-green-400) !important}
/* dropdowns */
html.ho-light #site-navigation .sub-menu{
  background:#fff !important;border:1px solid var(--c-border) !important;
  border-top:2px solid var(--c-green-700) !important;box-shadow:0 8px 24px rgba(32,51,38,.12) !important}
html.ho-light #site-navigation .sub-menu a{color:var(--c-green-900) !important}
html.ho-light #site-navigation .sub-menu a:hover,
html.ho-light #site-navigation .sub-menu .current-menu-item > a{
  color:var(--c-green-700) !important;background:var(--c-tint-soft) !important}
/* mobile hamburger + opened menu */
html.ho-light .menu-toggle,html.ho-light button.menu-toggle{
  color:var(--c-green-900) !important;border:1px solid var(--c-border) !important;background:transparent !important}
html.ho-light .menu-toggle .gp-icon,html.ho-light .menu-toggle svg{
  fill:var(--c-green-900) !important;color:var(--c-green-900) !important}
@media (max-width:768px){
  html.ho-light #site-navigation.toggled > div > ul,html.ho-light #site-navigation.toggled > ul,
  html.ho-light .main-navigation.toggled > div > ul,html.ho-light .main-navigation.toggled > ul{
    background:#fff !important;border-top:2px solid var(--c-green-700) !important}
  html.ho-light #site-navigation.toggled a,html.ho-light .main-navigation.toggled a{
    border-bottom:1px solid var(--c-border-soft) !important}
  html.ho-light #site-navigation .sub-menu,html.ho-light .main-navigation .sub-menu{
    background:var(--c-tint-soft) !important}
  html.ho-light #site-navigation .sub-menu a,html.ho-light .main-navigation .sub-menu a{
    color:var(--c-ink) !important}
  html.ho-light .menu-item-has-children .dropdown-menu-toggle{color:var(--c-green-400) !important}
}

/* ── Site footer (the plugin's .ho-site-footer is the visible one) ──
   Light mode matches the public redesign footer: white body, thin green
   separator, ink text, green-900 links. */
html.ho-light .ho-site-footer{
  background:var(--wl-footer-bg) !important;border-top:1px solid var(--c-green-400) !important}
html.ho-light .ho-site-footer-inner,html.ho-light .ho-site-footer span,
html.ho-light .ho-site-footer-inner span{color:var(--wl-footer-text) !important}
html.ho-light .ho-site-footer a{color:var(--wl-footer-link) !important;text-decoration:none}
html.ho-light .ho-site-footer a:hover{color:var(--c-green-700) !important;text-decoration:underline;text-underline-offset:2px}
html.ho-light .ho-footer-sep{color:var(--c-muted) !important}
/* GP fallback footer (normally hidden by the plugin) */
html.ho-light .site-footer .site-info{background:var(--wl-footer-bg);color:var(--wl-footer-text);border-top:1px solid var(--c-green-400)}
html.ho-light .site-info a{color:var(--wl-footer-link)}

/* ── Forms ── */
html.ho-light input[type="text"],html.ho-light input[type="email"],html.ho-light input[type="url"],
html.ho-light input[type="search"],html.ho-light textarea,html.ho-light select{
  background:var(--wl-input-bg) !important;border:1px solid var(--wl-input-border) !important;
  color:var(--wl-input-text) !important;border-radius:8px}
html.ho-light input:focus,html.ho-light textarea:focus,html.ho-light select:focus{
  border-color:var(--c-green-400) !important;outline:2px solid rgba(111,163,124,.35)}

/* ── Healthy Lakes page-header photo (band itself is styled in the page CSS) ── */
html.ho-light .page-id-414 .ho-hl-head{
  position:relative;overflow:hidden;
  background-image:url("images/bands/band-lakes.jpg?v=2") !important;
  background-size:cover !important;background-position:center !important}
html.ho-light .page-id-414 .ho-hl-head::after{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(20,33,25,.50),rgba(20,33,25,.72))}
html.ho-light .page-id-414 .ho-hl-head > *{position:relative;z-index:1}

/* ── Cookie banner ── */
html.ho-light .ho-cookie-inner{
  background:#fff !important;border:1px solid var(--c-border) !important;
  box-shadow:0 -4px 20px rgba(32,51,38,.14) !important}
html.ho-light .ho-cookie-text,html.ho-light .ho-cookie-text span{color:var(--c-ink) !important}
html.ho-light .ho-cookie-text strong{color:var(--c-green-900) !important}

/* ═══════════════════════════════════════════════════════════════════
   LIGHT MODE — plugin components (Wildlife hero, WotM, counts, gallery,
   filter/toolbar pills, pagination, upload form, property map, articles).
   Dark mode keeps the plugin's own CSS untouched.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Content cards (plugin panels → redesign white cards) ── */
html.ho-light .ho-wildlife-card,
html.ho-light article.ho-article-card,
html.ho-light .ho-article-feature-card{
  background:var(--wl-card-bg) !important;
  border:1px solid var(--wl-card-border) !important;
  border-radius:var(--wl-card-radius) !important;
  box-shadow:var(--wl-card-shadow) !important}
/* redesign headings are clean — no underline rule under card headings */
html.ho-light .ho-wildlife-card h2,
html.ho-light .ho-article-feature-card h2{border-bottom:none;padding-bottom:0}
/* upload form reads better as a centered column (progressive :has enhancement) */
html.ho-light .ho-wildlife-wrap .ho-wildlife-card:has(.ho-wildlife-form){
  max-width:780px;margin-left:auto;margin-right:auto}

/* ── Redesign page-header band ──
   Interior pages open with the public redesign's signature: a full-bleed
   green-900 band with the "Natural Assets" eyebrow and a big white
   Copperplate title. Applied to GP's .entry-header (Gallery, Map,
   Articles, Upload). */
/* band sits flush under the site header (GP gives .site-main a 20px gap) */
html.ho-light .site-main{margin-top:0 !important}
html.ho-light .entry-header{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;overflow:hidden;
  background-color:var(--c-green-900) !important;
  background-size:cover !important;background-position:center !important;
  padding:clamp(56px,9vw,110px) clamp(20px,5vw,80px) !important;
  margin-bottom:clamp(28px,4vw,44px) !important;
  text-align:center !important}
/* dark gradient overlay so the white title reads over the photo */
html.ho-light .entry-header::after{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(20,33,25,.50),rgba(20,33,25,.72))}
html.ho-light .entry-header::before,
html.ho-light .entry-header > *{position:relative;z-index:1}
html.ho-light .entry-header::before{
  content:"Natural Assets";display:block;font-family:var(--sans);
  font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--c-green-400);margin:0 0 14px}
/* per-page band photos (shipped in the child theme's images/bands/) */
html.ho-light .page-id-120 .entry-header{background-image:url("images/bands/band-gallery.jpg?v=2") !important}
html.ho-light .page-id-246 .entry-header{background-image:url("images/bands/band-map.jpg?v=2") !important}
html.ho-light .page-id-280 .entry-header{background-image:url("images/bands/band-articles.jpg?v=2") !important}
html.ho-light .page-id-117 .entry-header{background-image:url("images/bands/band-upload.jpg?v=2") !important}
html.ho-light h1.entry-title,html.ho-light .entry-title{
  color:#fff !important;font-size:clamp(30px,5vw,52px) !important;
  line-height:1.12 !important;margin:0 !important}
html.ho-light h1.entry-title::after,html.ho-light .entry-title::after{display:none !important}

/* ── Wildlife page hero → redesign pageheader (photo band + white title + sub) ── */
html.ho-light .ho-home-hero{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;overflow:hidden;
  background:var(--c-green-900) url("images/bands/band-wildlife.jpg?v=2") center/cover !important;
  padding:clamp(56px,9vw,110px) clamp(20px,5vw,80px) !important;
  margin:0 0 clamp(28px,4vw,44px) calc(50% - 50vw) !important;
  text-align:center !important}
/* repurpose the plugin's accent-line ::before as the gradient overlay */
html.ho-light .ho-home-hero::before{
  display:block !important;content:"" !important;position:absolute !important;
  left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;
  width:auto !important;border-radius:0 !important;z-index:0;
  background:linear-gradient(180deg,rgba(20,33,25,.50),rgba(20,33,25,.72)) !important}
html.ho-light .ho-home-hero > *{position:relative;z-index:1}
html.ho-light .ho-home-hero h1{
  color:#fff !important;text-transform:none !important;
  font-size:clamp(30px,5vw,52px) !important;line-height:1.12 !important;
  margin:0 auto 16px !important;max-width:860px}
/* the plugin hero has no eyebrow element — add the site eyebrow like the other bands */
html.ho-light .ho-home-hero h1::before{
  content:"Natural Assets";display:block;font-family:var(--sans);
  font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  line-height:1.4;color:var(--c-green-400);margin:0 0 14px}
html.ho-light .ho-home-hero p{
  color:var(--c-on-dark) !important;margin:0 auto 4px !important;
  max-width:640px !important;font-size:clamp(15px,1.5vw,19px) !important}
html.ho-light .ho-home-cta-row{
  justify-content:center !important;margin:26px auto 0 !important}
/* pageheader buttons: primary = white on green, secondary = white ghost */
html.ho-light .ho-home-cta,html.ho-light .ho-home-cta span{color:var(--c-green-900) !important}
html.ho-light .ho-home-cta{
  background:#fff !important;box-shadow:0 6px 18px rgba(32,51,38,.22) !important}
html.ho-light .ho-home-cta:hover{background:var(--c-tint-soft) !important;transform:translateY(-1px)}
html.ho-light .ho-home-cta-secondary,html.ho-light .ho-home-cta-secondary span{color:#fff !important}
html.ho-light .ho-home-cta-secondary{
  background:transparent !important;border:1.5px solid rgba(255,255,255,.75) !important;box-shadow:none !important}
html.ho-light .ho-home-cta-secondary:hover,html.ho-light .ho-home-cta-secondary:hover span{color:#fff !important}
html.ho-light .ho-home-cta-secondary:hover{
  background:rgba(255,255,255,.12) !important;border-color:#fff !important}

/* ── Wildlife of the Month / article accents ── */
html.ho-light .ho-article-month{color:var(--c-green-700) !important}
html.ho-light .ho-article-month::before{background:var(--c-green-700) !important}
html.ho-light .ho-article-card:hover{
  border-color:var(--c-green-400) !important;box-shadow:var(--wl-card-shadow-hover) !important}
html.ho-light .ho-article-card-actions{border-top-color:var(--c-border-soft) !important}
html.ho-light .ho-article-read-link,html.ho-light .ho-article-read-link span{color:var(--c-green-900) !important}
html.ho-light .ho-article-read-link:hover,html.ho-light .ho-article-read-link:hover span{color:var(--c-green-700) !important}
html.ho-light .ho-article-image-wrap{background:var(--c-tint) !important}
html.ho-light .ho-article-placeholder{background:linear-gradient(145deg,var(--c-tint),var(--c-tint-soft)) !important}
html.ho-light .ho-featured-photo-image{background:var(--c-tint) !important}
/* solid CTA — beats the ghost-pill rule below (it also carries .ho-wildlife-button) */
html.ho-light .ho-wildlife-button.ho-wotm-button,html.ho-light .ho-wotm-button{
  background:var(--wl-btn-bg) !important;border-color:var(--wl-btn-bg) !important;
  color:#fff !important;box-shadow:0 6px 18px rgba(32,51,38,.18) !important}
html.ho-light .ho-wildlife-button.ho-wotm-button:hover,html.ho-light .ho-wotm-button:hover{
  background:var(--wl-btn-bg-hover) !important;border-color:var(--wl-btn-bg-hover) !important;color:#fff !important}

/* ── Wildlife Snapshot count cards (→ contained tinted stat panels) ── */
html.ho-light .ho-count-grid{gap:10px}
html.ho-light .ho-count-card{
  background:var(--c-tint-soft) !important;border:1px solid var(--c-border-soft) !important;border-radius:12px}
html.ho-light .ho-count-card::before{background:none !important}
html.ho-light .ho-count-card-link:hover .ho-count-card{background:var(--c-tint) !important}
html.ho-light .ho-count-number{color:var(--c-green-900) !important}
html.ho-light .ho-count-label{color:var(--c-ink) !important}
html.ho-light .ho-count-recent-badge{background:var(--c-green-700) !important;color:#fff !important}
html.ho-light .ho-active-filter-bar{background:var(--c-tint-soft) !important;border-color:var(--c-border) !important}
html.ho-light .ho-active-filter-label{color:var(--c-green-900) !important}
html.ho-light .ho-clear-filter{color:var(--c-green-700) !important}

/* ── Gallery grid (redesign gallery: 12px gaps, rounded tiles) ── */
html.ho-light .ho-wildlife-grid{gap:12px}
html.ho-light .ho-wildlife-item{background:var(--c-tint) !important;border-radius:10px}
html.ho-light .ho-wildlife-item:hover{box-shadow:0 12px 26px rgba(32,51,38,.25) !important}
html.ho-light .ho-wildlife-thumb{background:var(--c-tint) !important}

/* ── Toolbar / filter pills / pagination ── */
html.ho-light .ho-wildlife-button,html.ho-light .ho-filter-button,
html.ho-light .ho-bulk-download-button,html.ho-light .ho-slideshow-launch{
  background:#fff !important;border:1px solid var(--c-border) !important;color:var(--c-green-900) !important}
html.ho-light .ho-wildlife-button:hover,html.ho-light .ho-filter-button:hover,
html.ho-light .ho-bulk-download-button:hover,html.ho-light .ho-slideshow-launch:hover{
  background:var(--c-tint-soft) !important;border-color:var(--c-green-400) !important;color:var(--c-green-900) !important}
html.ho-light .ho-filter-button.is-active{
  background:var(--c-green-900) !important;border-color:var(--c-green-900) !important;color:#fff !important}
html.ho-light .ho-gallery-sort-select{
  background:#fff !important;border:1px solid var(--c-border) !important;color:var(--c-ink) !important}
html.ho-light .ho-page-link{border-color:var(--c-border) !important;color:var(--c-green-900) !important}
html.ho-light .ho-page-link:hover{
  background:var(--c-tint-soft) !important;border-color:var(--c-green-400) !important;color:var(--c-green-900) !important}
html.ho-light .ho-page-link.is-active{
  background:var(--c-green-900) !important;border-color:var(--c-green-900) !important;color:#fff !important}

/* ── Upload form ── */
html.ho-light .ho-wildlife-form label{color:var(--c-green-900) !important}
html.ho-light .ho-wildlife-form input[type="text"],html.ho-light .ho-wildlife-form input[type="email"],
html.ho-light .ho-wildlife-form input[type="file"],html.ho-light .ho-wildlife-form select{
  background:#fff !important;border:1px solid var(--wl-input-border) !important;color:var(--wl-input-text) !important}
html.ho-light .ho-wildlife-form input:focus,html.ho-light .ho-wildlife-form select:focus{
  border-color:var(--c-green-400) !important;box-shadow:0 0 0 3px rgba(111,163,124,.25) !important}
html.ho-light .ho-wildlife-form input::placeholder{color:var(--c-muted) !important}
html.ho-light .ho-wildlife-form small{color:var(--c-muted) !important}
html.ho-light .ho-selected-property-area{color:var(--c-green-700) !important}
html.ho-light .ho-wildlife-success{
  background:var(--c-tint-soft) !important;border-color:var(--c-green-400) !important;color:var(--c-green-900) !important}
html.ho-light .ho-wildlife-error{
  background:#fbf0f0 !important;border-color:#dcaaaa !important;color:#8a3434 !important}

/* ── Property map (page, legend, tooltip, picker modal) ── */
/* map page section heading — centered, redesign section-heading scale */
html.ho-light .page-id-246 .ho-property-map-wrap h2{
  display:block;text-align:center;font-size:clamp(22px,2.6vw,30px);
  border-bottom:none;padding-bottom:0;margin:10px 0 18px}
html.ho-light .ho-property-map{background:#fff !important;border-color:var(--c-border) !important}
html.ho-light .ho-property-map-legend-item{
  background:#fff !important;border:1px solid var(--c-border) !important;color:var(--c-ink) !important}
/* zone circles keep their per-zone inline colors (match the map polygons) */
html.ho-light .ho-property-map-legend-zone{color:#fff !important}
html.ho-light .ho-property-map-legend-count{color:var(--c-green-700) !important}
html.ho-light .ho-property-map-tooltip-card{
  background:rgba(255,255,255,.97) !important;border:1px solid var(--c-border) !important;
  box-shadow:0 10px 24px rgba(32,51,38,.18) !important}
html.ho-light .ho-property-map-tooltip-title{color:var(--c-ink-strong) !important}
html.ho-light .ho-property-map-tooltip-total{color:var(--c-muted) !important}
html.ho-light .ho-property-map-tooltip-cat{color:var(--c-ink) !important}
html.ho-light .ho-property-map-tooltip-cat strong{color:var(--c-green-700) !important}
html.ho-light .ho-property-map-modal-dialog{
  background:#fff !important;border-color:var(--c-border) !important;color:var(--c-ink) !important}
html.ho-light .ho-property-map-close{color:var(--c-muted) !important}
html.ho-light .ho-property-map-close:hover{color:var(--c-green-700) !important}

/* ── Dark overlays stay dark in light mode (photos pop on black) ──
   Re-assert their text colors after the light catch-all above. */
/* (lightbox text colors unified for both themes — see the overlay block at end of file) */
html.ho-light .ho-wildlife-meta h3{color:#fff !important}
html.ho-light .ho-wildlife-credit{color:rgba(255,255,255,.6) !important}
html.ho-light .ho-wildlife-area{color:rgba(255,255,255,.4) !important}
/* (game modal styling unified for both themes — see the overlay block at end of file) */

/* ═══════════════════════════════════════════════════════════════════
   DARK MODE — "The Preserve" re-skin (design handoff 2026-07).
   Deep-green editorial look: page #10241B, surfaces #183226, cream text,
   brass #C9AE72 accents, hairline borders, square 2–4px radii,
   Cormorant Garamond display / Archivo body (fonts via tokens above).
   These override the plugin's legacy teal dark CSS the same way the
   light layer does — higher specificity + later cascade.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Page + base text ── */
html.ho-dark{background:#10241B !important}
html.ho-dark body{
  background:#10241B !important;background-image:none !important;
  color:var(--wl-text) !important}
html.ho-dark body,html.ho-dark .site,html.ho-dark p,html.ho-dark li,
html.ho-dark td,html.ho-dark th,html.ho-dark label,html.ho-dark span{
  color:var(--wl-text) !important}
html.ho-dark h1,html.ho-dark h2,html.ho-dark h3,html.ho-dark h4,html.ho-dark h5,
html.ho-dark h1.entry-title,html.ho-dark .entry-title{color:var(--wl-heading) !important}
/* Preserve headers carry no decorative rule under the title */
html.ho-dark h1.entry-title::after,html.ho-dark .entry-title::after{display:none !important}

/* ── Header + nav ── */
html.ho-dark #masthead,html.ho-dark .site-header,
html.ho-dark #masthead .inside-header,html.ho-dark .site-header .inside-header{
  background-color:#10241B !important;
  border-bottom:1px solid var(--wl-header-border) !important}
html.ho-dark #site-navigation a,html.ho-dark .main-navigation a{
  color:var(--wl-nav-text) !important;font-weight:400 !important;font-size:14px !important;
  letter-spacing:.02em !important;text-transform:none !important;padding:10px 14px !important;
  border-radius:0 !important;border-bottom:1px solid transparent !important}
html.ho-dark #site-navigation a:hover,html.ho-dark .main-navigation a:hover{
  color:#F2EDE2 !important;background:transparent !important}
html.ho-dark #site-navigation .current-menu-item > a,html.ho-dark .main-navigation .current-menu-item > a,
html.ho-dark #site-navigation .current_page_item > a,html.ho-dark .main-navigation .current_page_item > a{
  color:#F2EDE2 !important;background:transparent !important;border-bottom-color:#C9AE72 !important}
html.ho-dark #site-navigation .sub-menu{
  background:#183226 !important;border:1px solid rgba(242,237,226,.14) !important;
  border-top:1px solid #C9AE72 !important;border-radius:0 0 4px 4px !important}
html.ho-dark #site-navigation .sub-menu a:hover,
html.ho-dark #site-navigation .sub-menu .current-menu-item > a{
  color:#C9AE72 !important;background:rgba(242,237,226,.05) !important}
html.ho-dark .menu-toggle,html.ho-dark button.menu-toggle{
  color:#F2EDE2 !important;border:1px solid rgba(242,237,226,.3) !important;background:transparent !important}
html.ho-dark .menu-toggle .gp-icon,html.ho-dark .menu-toggle svg{
  fill:#F2EDE2 !important;color:#F2EDE2 !important}
@media (max-width:768px){
  html.ho-dark #site-navigation.toggled > div > ul,html.ho-dark #site-navigation.toggled > ul,
  html.ho-dark .main-navigation.toggled > div > ul,html.ho-dark .main-navigation.toggled > ul{
    background:#10241B !important;border-top:1px solid #C9AE72 !important}
  html.ho-dark #site-navigation.toggled a,html.ho-dark .main-navigation.toggled a{
    border-bottom:1px solid rgba(242,237,226,.08) !important}
  html.ho-dark #site-navigation .sub-menu,html.ho-dark .main-navigation .sub-menu{
    background:rgba(0,0,0,.25) !important}
}

/* ── Footers (plugin .ho-site-footer is the visible one) ── */
html.ho-dark .ho-site-footer{
  background:#10241B !important;border-top:1px solid rgba(242,237,226,.14) !important}
html.ho-dark .ho-site-footer-inner,html.ho-dark .ho-site-footer span,
html.ho-dark .ho-site-footer-inner span{color:#B9C7B4 !important}
html.ho-dark .ho-site-footer a{color:#B9C7B4 !important;text-decoration:none}
html.ho-dark .ho-site-footer a:hover{color:#C9AE72 !important}
html.ho-dark .ho-footer-sep{color:rgba(242,237,226,.25) !important}
html.ho-dark .site-footer .site-info{background:#10241B;color:#B9C7B4}
/* (footer address line removed 2026-07-04 — redundant for members) */

/* ── Cookie banner ── */
html.ho-dark .ho-cookie-inner{
  background:#183226 !important;border:1px solid rgba(242,237,226,.2) !important}
html.ho-dark .ho-cookie-text,html.ho-dark .ho-cookie-text span{color:#C6CFBF !important}
html.ho-dark .ho-cookie-text strong{color:#F2EDE2 !important}

/* ── Content cards / panels ── */
html.ho-dark .ho-wildlife-card,
html.ho-dark article.ho-article-card,
html.ho-dark .ho-article-feature-card{
  background:var(--wl-card-bg) !important;
  border:1px solid var(--wl-card-border) !important;
  border-radius:var(--wl-card-radius) !important;
  box-shadow:none !important}
html.ho-dark .ho-wildlife-card h2,
html.ho-dark .ho-article-feature-card h2{border-bottom:1px solid rgba(201,174,114,.5);padding-bottom:10px}
html.ho-dark .ho-article-card:hover{background:var(--wl-card-bg-hover) !important;transform:none !important}
html.ho-dark .ho-article-month{color:#C9AE72 !important;letter-spacing:.24em !important}
html.ho-dark .ho-article-month::before{background:#C9AE72 !important}
html.ho-dark .ho-article-read-link,html.ho-dark .ho-article-read-link span{color:#C9AE72 !important}
html.ho-dark .ho-article-read-link:hover,html.ho-dark .ho-article-read-link:hover span{color:#D8BF85 !important}
html.ho-dark .ho-article-image-wrap{background:#183226 !important}
html.ho-dark .ho-article-placeholder{background:linear-gradient(145deg,#1C3A2C,#183226) !important}
html.ho-dark .ho-featured-photo-image{background:#183226 !important}

/* ── Wildlife page hero → Preserve editorial photo header ── */
html.ho-dark .ho-home-hero{
  width:100vw;margin:0 0 clamp(28px,4vw,44px) calc(50% - 50vw) !important;
  box-sizing:border-box;position:relative !important;overflow:hidden;
  background:#10241B url("images/bands/band-wildlife.jpg?v=2") center/cover !important;
  min-height:460px;display:flex !important;flex-direction:column;
  justify-content:flex-end;align-items:flex-start;
  padding:150px clamp(20px,4vw,48px) 52px !important;text-align:left !important}
html.ho-dark .ho-home-hero::before{
  display:block !important;content:"" !important;position:absolute !important;
  left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;
  width:auto !important;border-radius:0 !important;z-index:0;
  background:radial-gradient(ellipse 92% 88% at 0% 100%,rgba(16,36,27,.74) 0%,rgba(16,36,27,.44) 42%,rgba(16,36,27,0) 72%),linear-gradient(0deg,rgba(16,36,27,.55) 0%,rgba(16,36,27,0) 24%) !important}
html.ho-dark .ho-home-hero > *{position:relative;z-index:1}
html.ho-dark .ho-home-hero h1{
  color:#F2EDE2 !important;text-transform:none !important;font-weight:500 !important;
  font-size:clamp(34px,5vw,58px) !important;line-height:1.06 !important;
  margin:0 0 16px !important;max-width:760px}
html.ho-dark .ho-home-hero h1::before{
  content:"Natural Assets";display:block;font-family:var(--wl-font-body);
  font-size:11.5px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;
  line-height:1.4;color:#D8CBA4;margin:0 0 14px}
html.ho-dark .ho-home-hero p{
  color:#DCE2D3 !important;margin:0 0 4px !important;max-width:560px !important;
  font-size:16.5px !important;line-height:1.6 !important}
html.ho-dark .ho-home-cta-row{margin:24px 0 0 !important}
html.ho-dark .ho-home-cta,html.ho-dark .ho-home-cta span{color:#10241B !important}
html.ho-dark .ho-home-cta{
  background:#C9AE72 !important;border-radius:2px !important;box-shadow:none !important}
html.ho-dark .ho-home-cta:hover{background:#D8BF85 !important;transform:none !important}
html.ho-dark .ho-home-cta-secondary,html.ho-dark .ho-home-cta-secondary span{color:#F2EDE2 !important}
html.ho-dark .ho-home-cta-secondary{
  background:transparent !important;border:1px solid rgba(242,237,226,.5) !important;border-radius:2px !important}
html.ho-dark .ho-home-cta-secondary:hover{border-color:#F2EDE2 !important;background:transparent !important}
html.ho-dark .ho-wotm-button,html.ho-dark .ho-wildlife-button.ho-wotm-button{
  background:#C9AE72 !important;border-color:#C9AE72 !important;color:#10241B !important;
  border-radius:2px !important;box-shadow:none !important}
html.ho-dark .ho-wotm-button:hover{background:#D8BF85 !important;border-color:#D8BF85 !important;color:#10241B !important}

/* ── Wildlife Snapshot counts → Preserve stat cells ── */
html.ho-dark .ho-count-grid{gap:0}
html.ho-dark .ho-count-card{
  background:transparent !important;border:1px solid rgba(242,237,226,.14) !important;
  border-radius:0;margin:0 -1px -1px 0}
html.ho-dark .ho-count-card::before{background:none !important}
html.ho-dark .ho-count-card-link:hover .ho-count-card{background:#183226 !important}
html.ho-dark .ho-count-number{color:#C9AE72 !important}
html.ho-dark .ho-count-label{color:#B9C7B4 !important;letter-spacing:.18em !important}
html.ho-dark .ho-count-recent-badge{background:#C9AE72 !important;color:#10241B !important}
html.ho-dark .ho-active-filter-bar{background:#183226 !important;border-color:rgba(242,237,226,.14) !important}
html.ho-dark .ho-active-filter-label{color:#F2EDE2 !important}
html.ho-dark .ho-clear-filter{color:#C9AE72 !important}

/* ── Gallery grid + toolbar pills + pagination ── */
html.ho-dark .ho-wildlife-grid{gap:14px}
html.ho-dark .ho-wildlife-item{background:#183226 !important;border-radius:3px}
html.ho-dark .ho-wildlife-item:hover{box-shadow:0 12px 40px rgba(0,0,0,.5) !important}
html.ho-dark .ho-wildlife-thumb{background:#122A20 !important}
html.ho-dark .ho-wildlife-button,html.ho-dark .ho-filter-button,
html.ho-dark .ho-bulk-download-button,html.ho-dark .ho-slideshow-launch{
  background:transparent !important;border:1px solid rgba(242,237,226,.4) !important;
  color:#C6CFBF !important;border-radius:2px !important}
html.ho-dark .ho-wildlife-button:hover,html.ho-dark .ho-filter-button:hover,
html.ho-dark .ho-bulk-download-button:hover,html.ho-dark .ho-slideshow-launch:hover{
  border-color:#C9AE72 !important;color:#C9AE72 !important;background:transparent !important}
html.ho-dark .ho-filter-button.is-active{
  background:#C9AE72 !important;border-color:#C9AE72 !important;color:#10241B !important}
html.ho-dark .ho-gallery-sort-select{
  background:#183226 !important;border:1px solid rgba(242,237,226,.2) !important;color:#F2EDE2 !important;border-radius:2px}
html.ho-dark .ho-page-link{
  background:transparent !important;border:1px solid rgba(242,237,226,.25) !important;
  color:#C6CFBF !important;border-radius:2px !important}
html.ho-dark .ho-page-link:hover{border-color:#C9AE72 !important;color:#C9AE72 !important;background:transparent !important}
html.ho-dark .ho-page-link.is-active{background:#C9AE72 !important;border-color:#C9AE72 !important;color:#10241B !important}

/* ── Upload form ── */
html.ho-dark .ho-wildlife-form label{color:#B9C7B4 !important;letter-spacing:.12em !important}
html.ho-dark .ho-wildlife-form input[type="text"],html.ho-dark .ho-wildlife-form input[type="email"],
html.ho-dark .ho-wildlife-form input[type="file"],html.ho-dark .ho-wildlife-form select{
  background:#183226 !important;border:1px solid rgba(242,237,226,.2) !important;
  color:#F2EDE2 !important;border-radius:2px !important}
html.ho-dark .ho-wildlife-form input:focus,html.ho-dark .ho-wildlife-form select:focus{
  border-color:#C9AE72 !important;box-shadow:0 0 0 3px rgba(201,174,114,.18) !important}
html.ho-dark .ho-wildlife-form input::placeholder{color:rgba(198,207,191,.5) !important}
html.ho-dark .ho-wildlife-form small{color:#B9C7B4 !important}
html.ho-dark .ho-selected-property-area{color:#C9AE72 !important}
html.ho-dark .ho-wildlife-success{
  background:#183226 !important;border:1px solid rgba(201,174,114,.5) !important;color:#D8BF85 !important}
html.ho-dark .ho-wildlife-error{
  background:#2A1616 !important;border:1px solid rgba(212,120,120,.4) !important;color:#D4A8A8 !important}

/* ── Property map ── */
html.ho-dark .ho-property-map{background:#183226 !important;border-color:rgba(242,237,226,.14) !important}
html.ho-dark .ho-property-map-legend-item{
  background:transparent !important;border:1px solid rgba(242,237,226,.14) !important;color:#C6CFBF !important;border-radius:2px !important}
html.ho-dark .ho-property-map-legend-zone{color:#fff !important}
html.ho-dark .ho-property-map-legend-count{color:#C9AE72 !important}
html.ho-dark .ho-property-map-tooltip-card{
  background:rgba(16,36,27,.97) !important;border:1px solid rgba(201,174,114,.4) !important}
html.ho-dark .ho-property-map-tooltip-title{color:#F2EDE2 !important}
html.ho-dark .ho-property-map-tooltip-total{color:#B9C7B4 !important}
html.ho-dark .ho-property-map-tooltip-cat strong{color:#C9AE72 !important}
html.ho-dark .ho-property-map-modal-dialog{
  background:#10241B !important;border:1px solid rgba(242,237,226,.2) !important}
html.ho-dark .ho-property-map-close{color:#B9C7B4 !important}
html.ho-dark .ho-property-map-close:hover{color:#C9AE72 !important}
/* dark focus re-asserts for the Preserve pills (GP button:focus is grey) */
html.ho-dark button.ho-wildlife-button:focus,html.ho-dark button.ho-filter-button:focus,
html.ho-dark button.ho-bulk-download-button:focus,html.ho-dark button.ho-slideshow-launch:focus,
html.ho-dark button.ho-selection-cancel:focus{
  background:transparent !important;border-color:rgba(242,237,226,.4) !important;color:#C6CFBF !important}
html.ho-dark button.ho-filter-button.is-active:focus{
  background:#C9AE72 !important;border-color:#C9AE72 !important;color:#10241B !important}

/* (game modal styling unified for both themes — see the overlay block at end of file) */

/* ═══════════════════════════════════════════════════════════════════
   MOTION — same system as the public redesign template.
   The footer script adds [data-reveal] to section blocks and toggles
   .is-revealed; stat numbers count up; split images parallax.
   ═══════════════════════════════════════════════════════════════════ */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}
[data-reveal].is-revealed{opacity:1;transform:none}
/* hover zoom on card/split/tile imagery */
a.nh-card img,.nh-split-media img,a.nhd-card img,.nhd-tile img,
.ho-article-card-media img{transition:transform .6s ease}
a.nh-card:hover img,.nh-split-media:hover img,a.nhd-card:hover img,
.nhd-tile:hover img{transform:scale(1.05)}
/* slow Ken Burns drift on the homepage hero photos */
@keyframes ho-kb{from{transform:scale(1.05)}to{transform:scale(1.16)}}
@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  .nh-hero > img,.nhd-hero > img{animation:ho-kb 26s ease-out both}
}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  a.nh-card img,.nh-split-media img,a.nhd-card img,.nhd-tile img{transition:none}
  a.nh-card:hover img,.nh-split-media:hover img,a.nhd-card:hover img,
  .nhd-tile:hover img{transform:none}
  .nh-hero > img,.nhd-hero > img{animation:none}
}

/* ═══════════════════════════════════════════════════════════════════
   DARK MODE — Preserve interior page headers.
   Editorial photo header like the Preserve hero: full-bleed photo,
   three-stop gradient, tracked brass eyebrow, big left-aligned
   Cormorant title anchored to the bottom.
   ═══════════════════════════════════════════════════════════════════ */
html.ho-dark .entry-header{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;overflow:hidden;
  background-color:#10241B !important;
  background-size:cover !important;background-position:center !important;
  min-height:clamp(280px,34vw,400px);
  display:flex !important;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  text-align:left !important;
  padding:120px clamp(20px,4vw,48px) 44px !important;
  margin-bottom:clamp(28px,4vw,44px) !important}
html.ho-dark .entry-header::after{
  content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse 92% 88% at 0% 100%,rgba(16,36,27,.74) 0%,rgba(16,36,27,.44) 42%,rgba(16,36,27,0) 72%),linear-gradient(0deg,rgba(16,36,27,.55) 0%,rgba(16,36,27,0) 24%)}
html.ho-dark .entry-header::before,
html.ho-dark .entry-header > *{position:relative;z-index:1}
html.ho-dark .entry-header::before{
  content:"Natural Assets";display:block;font-family:var(--wl-font-body);
  font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;
  color:#D8CBA4;margin:0 0 12px}
html.ho-dark h1.entry-title,html.ho-dark .entry-title{
  color:#F2EDE2 !important;font-size:clamp(34px,4.5vw,54px) !important;
  font-weight:500 !important;line-height:1.06 !important;
  margin:0 !important;text-align:left !important;text-transform:none !important}
/* per-page header photos (same band library as light mode) */
html.ho-dark .page-id-120 .entry-header{background-image:url("images/bands/band-gallery.jpg?v=2") !important}
html.ho-dark .page-id-246 .entry-header{background-image:url("images/bands/band-map.jpg?v=2") !important}
html.ho-dark .page-id-280 .entry-header{background-image:url("images/bands/band-articles.jpg?v=2") !important}
html.ho-dark .page-id-117 .entry-header{background-image:url("images/bands/band-upload.jpg?v=2") !important}
/* bands sit flush under the header in dark too */
html.ho-dark .site-main{margin-top:0 !important}

/* Healthy Lakes head (band structure lives in the page CSS, light-scoped;
   dark gets the Preserve photo header from here) */
html.ho-dark .page-id-414 .ho-hl-head{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;position:relative;overflow:hidden;
  background:#10241B url("images/bands/band-lakes.jpg?v=2") center/cover;
  min-height:clamp(280px,34vw,400px);
  display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  text-align:left;padding:120px clamp(20px,4vw,48px) 44px;
  margin-bottom:clamp(28px,4vw,40px)}
html.ho-dark .page-id-414 .ho-hl-head::after{
  content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse 92% 88% at 0% 100%,rgba(16,36,27,.74) 0%,rgba(16,36,27,.44) 42%,rgba(16,36,27,0) 72%),linear-gradient(0deg,rgba(16,36,27,.55) 0%,rgba(16,36,27,0) 24%)}
html.ho-dark .page-id-414 .ho-hl-head > *{position:relative;z-index:1}
html.ho-dark .page-id-414 .ho-hl-head h1{
  color:#F2EDE2 !important;font-size:clamp(34px,4.5vw,54px);font-weight:500;
  line-height:1.06;margin:0;text-align:left}
html.ho-dark .page-id-414 .ho-hl-head .ho-hl-subtitle{
  order:-1;text-align:left;color:#D8CBA4;font-size:11.5px;font-weight:400;
  letter-spacing:.3em;margin:0 0 12px;padding-bottom:0;border-bottom:none}

/* Privacy head — Preserve editorial header, no photo (utility page) */
html.ho-dark .page-id-468 .ho-priv-head{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;
  background:#10241B;border-bottom:1px solid rgba(242,237,226,.14);
  display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  text-align:left;padding:90px clamp(20px,4vw,48px) 40px;margin-bottom:28px}
html.ho-dark .page-id-468 .ho-priv-head h1{
  color:#F2EDE2 !important;font-size:clamp(30px,4vw,44px);font-weight:500;
  line-height:1.06;margin:0;text-align:left}
html.ho-dark .page-id-468 .ho-priv-head .ho-privacy-subtitle{
  order:-1;text-align:left;color:#D8CBA4;font-size:11.5px;font-weight:400;
  letter-spacing:.3em;margin:0 0 12px}

/* ═══════════════════════════════════════════════════════════════════
   INTERIOR RECOMPOSITION — Wildlife page (and shared patterns).
   Light: club-redesign vocabulary (split band, contained tinted stat
   panel, dark CTA band). Dark: Preserve vocabulary (cream feature band,
   hairline stat band). Plugin markup untouched — composition via CSS.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Wildlife of the Month → split band (light) ──
   The plugin renders a boxed card (h2 label + photo/text grid); unbox it
   and style as the redesign's split: eyebrow label, media card w/ shadow,
   Copperplate species title. Also applies on the Articles page. */
html.ho-light .ho-article-feature-card{
  background:transparent !important;border:none !important;box-shadow:none !important;
  border-radius:0 !important;padding:clamp(24px,4vw,48px) 0 !important;
  max-width:1180px;margin-left:auto;margin-right:auto}
html.ho-light .ho-article-feature-card > h2{
  font-family:var(--wl-font-body) !important;font-size:13px !important;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--c-green-700) !important;
  border-bottom:none;padding-bottom:0;margin:0 0 18px;display:block}
html.ho-light .ho-article-feature-layout{gap:clamp(28px,5vw,60px)}
html.ho-light .ho-article-feature-media .ho-article-image-wrap,
html.ho-light .ho-article-feature-media{border-radius:12px;overflow:hidden;
  box-shadow:0 10px 26px rgba(32,51,38,.14)}
html.ho-light .ho-article-feature-text h3{font-size:clamp(26px,3vw,32px) !important;line-height:1.28 !important}

/* ── Wildlife of the Month → Preserve cream band (dark) ── */
html.ho-dark .ho-article-feature-card{
  width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;
  background:#F2EDE2 !important;border:none !important;border-radius:0 !important;
  box-shadow:none !important;
  padding:clamp(36px,5vw,70px) clamp(24px,4.5vw,64px) !important;margin-top:0;margin-bottom:0}
html.ho-dark .ho-article-feature-card > h2{
  font-family:var(--wl-font-body) !important;font-size:11.5px !important;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:#7d6436 !important;
  border-bottom:none !important;padding-bottom:0 !important;margin:0 0 18px;display:block}
html.ho-dark .ho-article-feature-layout{max-width:1180px;margin:0 auto;gap:clamp(28px,4vw,54px)}
html.ho-dark .ho-article-feature-media .ho-article-image-wrap,
html.ho-dark .ho-article-feature-media{border-radius:4px;overflow:hidden;box-shadow:none !important}
html.ho-dark .ho-article-feature-card .ho-article-image-wrap{background:transparent !important}
html.ho-dark .ho-article-feature-text h3{
  color:#22301F !important;font-size:clamp(34px,4vw,48px) !important;
  font-weight:500 !important;line-height:1.05 !important}
html.ho-dark .ho-article-feature-card p,
html.ho-dark .ho-article-feature-card span{color:#4A5442 !important}
html.ho-dark .ho-article-feature-card .ho-article-month{color:#7d6436 !important}
html.ho-dark .ho-article-feature-card .ho-article-month::before{background:#8A6F3C !important}
html.ho-dark .ho-article-feature-card .ho-wotm-button,
html.ho-dark .ho-article-feature-card .ho-wildlife-button.ho-wotm-button{
  background:#22301F !important;border-color:#22301F !important;color:#F2EDE2 !important}
html.ho-dark .ho-article-feature-card .ho-wotm-button:hover{
  background:#33452F !important;border-color:#33452F !important;color:#F2EDE2 !important}

/* ── Wildlife Snapshot → contained tinted stat panel (light) ── */
html.ho-light .ho-wildlife-card:has(.ho-count-grid){
  background:var(--c-tint-soft) !important;border:1px solid var(--c-border-soft) !important;
  border-radius:16px !important;box-shadow:none !important;
  padding:clamp(32px,4vw,52px) clamp(24px,4vw,56px) !important}
html.ho-light .ho-wildlife-card:has(.ho-count-grid) > h2{
  display:block;text-align:center;border-bottom:none;padding-bottom:0;
  font-size:clamp(22px,2.6vw,30px);margin:0 auto 22px}
html.ho-light .ho-count-grid{gap:clamp(16px,3vw,32px)}
html.ho-light .ho-count-card{background:transparent !important;border:none !important;border-radius:10px}
html.ho-light .ho-count-card-link:hover .ho-count-card{background:var(--c-tint) !important}
html.ho-light .ho-count-number{font-size:clamp(34px,5vw,48px)}

/* ── Wildlife Snapshot → Preserve stat band (dark): transparent, hairline cells ── */
html.ho-dark .ho-wildlife-card:has(.ho-count-grid){
  background:transparent !important;border:none !important;border-radius:0 !important;
  padding:0 !important}
html.ho-dark .ho-wildlife-card:has(.ho-count-grid) > h2{
  border-bottom:none !important;padding-bottom:0 !important;
  font-size:clamp(28px,3.5vw,38px) !important;font-weight:500;margin:0 0 26px}

/* ── Shared interior sections (used from page content markup) ── */
.nhs-cta{width:100vw;margin-left:calc(50% - 50vw);box-sizing:border-box;
  text-align:center;padding:clamp(52px,7vw,74px) clamp(24px,7vw,100px);
  display:flex;flex-direction:column;align-items:center;gap:12px;
  margin-top:clamp(32px,5vw,56px)}
.nhs-cta-body{max-width:620px;font-size:17px;line-height:1.7}
.nhs-cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:16px}
a.nhs-btn-primary,a.nhs-btn-ghost{display:inline-block;font-weight:600;font-size:15px;text-decoration:none;transition:background .15s,border-color .15s}
/* light: redesign dark CTA band */
html.ho-light .nhs-cta{background:var(--c-green-900)}
html.ho-light .nhs-cta h2{color:#fff !important;font-size:clamp(26px,3vw,32px);margin:0}
html.ho-light .nhs-cta-body{color:var(--c-on-dark) !important}
html.ho-light a.nhs-btn-primary{background:#fff;color:var(--c-green-900) !important;padding:13px 26px;border-radius:6px}
html.ho-light a.nhs-btn-primary:hover{background:var(--c-tint-soft)}
html.ho-light a.nhs-btn-ghost{border:2px solid rgba(255,255,255,.7);color:#fff !important;padding:11px 24px;border-radius:6px}
html.ho-light a.nhs-btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
/* dark: Preserve hairline band on the page bg, brass actions */
html.ho-dark .nhs-cta{background:transparent;border-top:1px solid rgba(242,237,226,.14)}
html.ho-dark .nhs-cta h2{color:#F2EDE2 !important;font-weight:500;font-size:clamp(28px,3.5vw,38px);margin:0}
html.ho-dark .nhs-cta-body{color:#C6CFBF !important}
html.ho-dark a.nhs-btn-primary{background:#C9AE72;color:#10241B !important;padding:14px 26px;border-radius:2px;font-weight:600;font-size:14px}
html.ho-dark a.nhs-btn-primary:hover{background:#D8BF85}
html.ho-dark a.nhs-btn-ghost{border:1px solid rgba(242,237,226,.5);color:#F2EDE2 !important;padding:14px 26px;border-radius:2px;font-size:14px;font-weight:400}
html.ho-dark a.nhs-btn-ghost:hover{border-color:#F2EDE2}

/* ═══════════════════════════════════════════════════════════════════
   INTERIOR RECOMPOSITION — Gallery, Map, Articles, Upload, Healthy Lakes.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Shared centered intro (used from page content) ── */
.nhs-intro{max-width:880px;margin:0 auto;text-align:center;
  padding:clamp(8px,1.5vw,16px) clamp(24px,5vw,60px) clamp(28px,4vw,44px);
  display:flex;flex-direction:column;gap:16px}
html.ho-light .nhs-intro h2{color:var(--c-green-900) !important;font-size:clamp(24px,2.8vw,32px);line-height:1.22;margin:0}
html.ho-light .nhs-intro-body{color:var(--c-ink) !important;font-size:18px;line-height:1.75}
html.ho-dark .nhs-intro h2{color:#F2EDE2 !important;font-weight:500;font-size:clamp(26px,3vw,34px);margin:0}
html.ho-dark .nhs-intro-body{color:#C6CFBF !important;font-size:16.5px;line-height:1.7}

/* ── Property map page polish ── */
/* light: the map sits in a rounded media card with the redesign shadow */
html.ho-light .ho-property-map{
  border-radius:12px !important;box-shadow:0 10px 26px rgba(32,51,38,.14) !important}
html.ho-light .ho-property-map-legend{gap:12px}
html.ho-light .ho-property-map-legend-item{
  border-radius:10px !important;transition:transform .2s,box-shadow .2s}
html.ho-light a.ho-property-map-legend-item:hover,
html.ho-light button.ho-property-map-legend-item:hover{
  transform:translateY(-2px);box-shadow:0 8px 20px rgba(32,51,38,.12)}
/* dark: Preserve section heading scale for the map heading */
html.ho-dark .page-id-246 .ho-property-map-wrap h2{
  font-size:clamp(26px,3vw,36px);font-weight:500;border-bottom:none;padding-bottom:0;margin:6px 0 20px}

/* ── Healthy Lakes briefs (handoff spec: light = white cards w/ green
   numerals · dark = hairline rows w/ brass numerals) ── */
html.ho-light .ho-hl-brief{border-left:4px solid var(--c-green-400) !important;border-radius:10px !important}
html.ho-light .ho-healthy-lakes h2{border-bottom:none;padding-bottom:0}
html.ho-dark .ho-hl-brief{
  background:transparent !important;border:none !important;
  border-bottom:1px solid rgba(242,237,226,.14) !important;
  border-radius:0 !important;box-shadow:none !important;padding:18px 6px !important}
html.ho-dark .ho-hl-brief:hover{background:rgba(242,237,226,.04) !important}
html.ho-dark .ho-hl-briefs-list{gap:0}
html.ho-dark .ho-hl-brief-number{
  background:transparent !important;border:1px solid rgba(201,174,114,.5);
  color:#C9AE72 !important}
html.ho-dark .ho-healthy-lakes h2{border-bottom-color:rgba(201,174,114,.5)}

/* ═══════════════════════════════════════════════════════════════════
   COMMITTEE DASHBOARD (/committee/ — ho-wildlife-committee plugin)
   ═══════════════════════════════════════════════════════════════════ */
.ho-cmt,.ho-cmt-gate{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,48px) clamp(40px,6vw,64px)}
.ho-cmt-gate{max-width:640px;text-align:center;padding-top:24px}
.ho-cmt-gate h2{margin:0 0 12px}
.ho-cmt-banner{padding:14px 20px;border-radius:8px;margin:0 0 24px;font-weight:600}
html.ho-light .ho-cmt-banner{background:var(--c-tint-soft);border:1px solid var(--c-green-400);color:var(--c-green-900)}
html.ho-dark .ho-cmt-banner{background:#183226;border:1px solid rgba(201,174,114,.5);color:#D8BF85}
.ho-cmt-heading{margin:36px 0 18px}
html.ho-light .ho-cmt-heading{color:var(--c-green-900) !important;font-size:clamp(22px,2.6vw,28px)}
html.ho-dark .ho-cmt-heading{color:#F2EDE2 !important;font-weight:500;font-size:clamp(24px,3vw,32px)}

/* stats strip */
.ho-cmt-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:10px 0 8px}
.ho-cmt-stat{display:flex;flex-direction:column;gap:4px;padding:20px 22px;text-align:center}
html.ho-light .ho-cmt-stat{background:var(--c-tint-soft);border:1px solid var(--c-border-soft);border-radius:12px}
html.ho-dark .ho-cmt-stat{background:transparent;border:1px solid rgba(242,237,226,.14);border-radius:2px}
.ho-cmt-stat-num{font-family:var(--wl-font-display);font-size:clamp(26px,3.4vw,40px);line-height:1.1}
.ho-cmt-stat-small{font-size:clamp(17px,2vw,22px)}
html.ho-light .ho-cmt-stat-num{color:var(--c-green-900)}
html.ho-dark .ho-cmt-stat-num{color:#C9AE72}
.ho-cmt-stat-label{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
html.ho-light .ho-cmt-stat-label{color:var(--c-ink) !important}
html.ho-dark .ho-cmt-stat-label{color:#B9C7B4 !important}

/* review cards */
.ho-cmt-card{display:grid;grid-template-columns:minmax(220px,420px) 1fr;gap:clamp(18px,3vw,32px);margin:0 0 22px;overflow:hidden}
html.ho-light .ho-cmt-card{background:#fff;border:1px solid var(--c-border);border-radius:12px;box-shadow:0 3px 10px rgba(32,51,38,.08);padding:20px}
html.ho-dark .ho-cmt-card{background:#183226;border:1px solid rgba(242,237,226,.14);border-radius:4px;padding:20px}
.ho-cmt-card-media img{display:block;width:100%;border-radius:8px}
.ho-cmt-card-body{display:flex;flex-direction:column;gap:12px;min-width:0}
.ho-cmt-meta{font-size:13.5px}
html.ho-light .ho-cmt-meta{color:var(--c-muted) !important}
html.ho-dark .ho-cmt-meta{color:#B9C7B4 !important}
.ho-cmt-field{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.ho-cmt-field > span{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
html.ho-light .ho-cmt-field > span{color:var(--c-green-900) !important}
html.ho-dark .ho-cmt-field > span{color:#B9C7B4 !important}
.ho-cmt-field input,.ho-cmt-field select{width:100%;padding:10px 12px;font-size:15px}
html.ho-light .ho-cmt-field input,html.ho-light .ho-cmt-field select{
  background:#fff !important;border:1px solid var(--c-border) !important;border-radius:8px;color:var(--c-ink) !important}
html.ho-dark .ho-cmt-field input,html.ho-dark .ho-cmt-field select{
  background:#10241B !important;border:1px solid rgba(242,237,226,.2) !important;border-radius:2px;color:#F2EDE2 !important}
.ho-cmt-field-row{display:flex;gap:14px;flex-wrap:wrap}
.ho-cmt-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:auto;padding-top:6px}
.ho-cmt-editlink{font-size:13.5px;margin-left:auto}

/* buttons (shared gate button too) */
.ho-cmt-btn-primary,.ho-cmt-btn-ghost,.ho-cmt-btn-danger,a.ho-cmt-btn-primary{
  display:inline-block;font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;
  padding:11px 20px;transition:background .15s,border-color .15s,color .15s}
html.ho-light .ho-cmt-btn-primary{background:var(--c-green-900);color:#fff !important;border:0;border-radius:8px}
html.ho-light .ho-cmt-btn-primary:hover,html.ho-light .ho-cmt-btn-primary:focus{background:var(--c-green-700);color:#fff !important}
html.ho-light .ho-cmt-btn-ghost{background:#fff;color:var(--c-green-900) !important;border:1px solid var(--c-border);border-radius:8px}
html.ho-light .ho-cmt-btn-ghost:hover,html.ho-light .ho-cmt-btn-ghost:focus{background:var(--c-tint-soft);border-color:var(--c-green-400);color:var(--c-green-900) !important}
html.ho-light .ho-cmt-btn-danger{background:#fff;color:#8a3434 !important;border:1px solid #dcaaaa;border-radius:8px}
html.ho-light .ho-cmt-btn-danger:hover,html.ho-light .ho-cmt-btn-danger:focus{background:#fbf0f0;color:#8a3434 !important}
html.ho-dark .ho-cmt-btn-primary{background:#C9AE72;color:#10241B !important;border:0;border-radius:2px}
html.ho-dark .ho-cmt-btn-primary:hover,html.ho-dark .ho-cmt-btn-primary:focus{background:#D8BF85;color:#10241B !important}
html.ho-dark .ho-cmt-btn-ghost{background:transparent;color:#C6CFBF !important;border:1px solid rgba(242,237,226,.4);border-radius:2px}
html.ho-dark .ho-cmt-btn-ghost:hover,html.ho-dark .ho-cmt-btn-ghost:focus{border-color:#C9AE72;color:#C9AE72 !important;background:transparent}
html.ho-dark .ho-cmt-btn-danger{background:transparent;color:#D4A8A8 !important;border:1px solid rgba(212,120,120,.4);border-radius:2px}
html.ho-dark .ho-cmt-btn-danger:hover,html.ho-dark .ho-cmt-btn-danger:focus{border-color:#D4A8A8;background:transparent}
.ho-cmt button:disabled{opacity:.55;cursor:default}

/* empty state */
.ho-cmt-empty{text-align:center;padding:44px 20px;font-size:16px}
html.ho-light .ho-cmt-empty{background:var(--c-tint-soft);border:1px solid var(--c-border-soft);border-radius:12px;color:var(--c-ink)}
html.ho-dark .ho-cmt-empty{border:1px solid rgba(242,237,226,.14);border-radius:2px;color:#B9C7B4}

/* WotM picker */
.ho-cmt-wotm-row{display:flex;align-items:center;gap:14px;padding:13px 4px;flex-wrap:wrap}
html.ho-light .ho-cmt-wotm-row{border-bottom:1px solid var(--c-border-soft)}
html.ho-dark .ho-cmt-wotm-row{border-bottom:1px solid rgba(242,237,226,.14)}
.ho-cmt-wotm-title{font-weight:600;flex:1;min-width:180px}
html.ho-light .ho-cmt-wotm-title{color:var(--c-ink-strong)}
html.ho-dark .ho-cmt-wotm-title{color:#F2EDE2}
.ho-cmt-wotm-month{font-size:13px}
html.ho-light .ho-cmt-wotm-month{color:var(--c-muted) !important}
html.ho-dark .ho-cmt-wotm-month{color:#B9C7B4 !important}
.ho-cmt-wotm-badge{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
html.ho-light .ho-cmt-wotm-badge{background:var(--c-green-900);color:#fff !important}
html.ho-dark .ho-cmt-wotm-badge{background:#C9AE72;color:#10241B !important;border-radius:2px}
.ho-cmt-note{margin-top:14px;font-size:14px}

@media (max-width:820px){
  .ho-cmt-card{grid-template-columns:1fr}
  .ho-cmt-stats{grid-template-columns:1fr 1fr}
}

/* committee: communication briefs manager */
.ho-cmt-brief-add{display:flex;flex-direction:column;gap:12px;padding:18px;margin:0 0 20px}
html.ho-light .ho-cmt-brief-add{background:var(--c-tint-soft);border:1px solid var(--c-border-soft);border-radius:12px}
html.ho-dark .ho-cmt-brief-add{background:#183226;border:1px solid rgba(242,237,226,.14);border-radius:4px}
.ho-cmt-brief-add-foot{align-items:flex-end}
.ho-cmt-field textarea{width:100%;padding:10px 12px;font-size:15px;resize:vertical}
html.ho-light .ho-cmt-field textarea{background:#fff !important;border:1px solid var(--c-border) !important;border-radius:8px;color:var(--c-ink) !important}
html.ho-dark .ho-cmt-field textarea{background:#10241B !important;border:1px solid rgba(242,237,226,.2) !important;border-radius:2px;color:#F2EDE2 !important}
.ho-cmt-brief{display:flex;align-items:center;gap:12px;padding:12px 10px;flex-wrap:wrap;cursor:grab}
.ho-cmt-brief.is-dragging{opacity:.5}
html.ho-light .ho-cmt-brief{border-bottom:1px solid var(--c-border-soft)}
html.ho-dark .ho-cmt-brief{border-bottom:1px solid rgba(242,237,226,.14)}
.ho-cmt-brief-grip{font-size:14px;letter-spacing:-2px;user-select:none}
html.ho-light .ho-cmt-brief-grip{color:var(--c-muted) !important}
html.ho-dark .ho-cmt-brief-grip{color:#B9C7B4 !important}
.ho-cmt-brief-num{flex:0 0 30px;height:30px;line-height:30px;text-align:center;border-radius:50%;font-size:13px;font-weight:700}
html.ho-light .ho-cmt-brief-num{background:var(--c-green-900);color:#fff !important}
html.ho-dark .ho-cmt-brief-num{background:transparent;border:1px solid rgba(201,174,114,.5);color:#C9AE72 !important}
.ho-cmt-brief-main{flex:1;min-width:220px;display:flex;flex-direction:column;gap:2px}
.ho-cmt-brief-title{font-weight:600}
html.ho-light .ho-cmt-brief-title{color:var(--c-ink-strong)}
html.ho-dark .ho-cmt-brief-title{color:#F2EDE2}
.ho-cmt-brief-desc{font-size:13.5px}
html.ho-light .ho-cmt-brief-desc{color:var(--c-muted) !important}
html.ho-dark .ho-cmt-brief-desc{color:#B9C7B4 !important}
a.ho-cmt-brief-pdf{font-size:12px;font-weight:700;letter-spacing:.06em;padding:5px 10px;border-radius:6px}
html.ho-light a.ho-cmt-brief-pdf{border:1px solid var(--c-border);color:var(--c-green-900) !important}
html.ho-dark a.ho-cmt-brief-pdf{border:1px solid rgba(242,237,226,.3);color:#C9AE72 !important;border-radius:2px}
.ho-cmt-brief-move{display:flex;flex-direction:column;gap:2px}
.ho-cmt-mini{padding:2px 8px;font-size:10px;line-height:1.4;cursor:pointer;background:transparent}
html.ho-light .ho-cmt-mini{border:1px solid var(--c-border);border-radius:6px;color:var(--c-green-900)}
html.ho-light .ho-cmt-mini:hover,html.ho-light .ho-cmt-mini:focus{background:var(--c-tint-soft);color:var(--c-green-900)}
html.ho-dark .ho-cmt-mini{border:1px solid rgba(242,237,226,.3);border-radius:2px;color:#C6CFBF}
html.ho-dark .ho-cmt-mini:hover,html.ho-dark .ho-cmt-mini:focus{border-color:#C9AE72;color:#C9AE72;background:transparent}
.ho-cmt-mini-wide{padding:8px 14px !important;font-size:13px !important}
.ho-cmt-brief-edit{flex-basis:100%;display:flex;flex-direction:column;gap:12px;padding:14px;margin-top:8px}
html.ho-light .ho-cmt-brief-edit{background:var(--c-tint-soft);border:1px solid var(--c-border-soft);border-radius:10px}
html.ho-dark .ho-cmt-brief-edit{background:#10241B;border:1px solid rgba(242,237,226,.14);border-radius:2px}

/* ═══════════════════════════════════════════════════════════════════
   MOBILE header + menu polish (≤768px)
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width:768px){
  /* light: logo + hamburger share one row — drop the wordmark, shrink the logo */
  html.ho-light .site-header .site-logo a::after{content:none}
  html.ho-light .site-header img.header-image.is-logo-image{max-height:44px !important}
  html.ho-light .inside-header{min-height:0 !important;padding-top:10px !important;padding-bottom:10px !important}
  html.ho-light button.menu-toggle{padding:9px 12px !important}
  /* dark: slightly smaller serif wordmark so it never crowds the hamburger */
  html.ho-dark .site-header .site-logo a::before{font-size:20px}
  html.ho-dark .site-header .site-logo a::after{font-size:9.5px;letter-spacing:.24em}
  html.ho-dark .inside-header{padding-top:12px !important;padding-bottom:12px !important}
  /* opened menu: consistent left edge for links, portal button, and toggle pill */
  html.ho-light #site-navigation.toggled a,html.ho-light .main-navigation.toggled a{
    padding:12px 20px !important;font-size:15px !important}
  html.ho-dark #site-navigation.toggled a,html.ho-dark .main-navigation.toggled a{
    padding:12px 20px !important}
  #site-navigation.toggled li.ho-portal-item a{
    display:inline-block !important;width:auto !important;margin:10px 20px !important}
  #site-navigation.toggled li.ho-theme-item{padding:10px 20px !important}
  #site-navigation.toggled .ho-theme-toggle{margin:0 !important}
}

@media (max-width:768px){
  /* GP's line-height:60px menu default inflates the hamburger + menu items */
  button.menu-toggle,.main-navigation .menu-toggle{line-height:1 !important;padding:12px !important}
  .menu-toggle .gp-icon svg{width:22px;height:22px}
  #site-navigation .main-nav li a,.main-navigation .main-nav li a{line-height:1.5 !important}
}

/* the dark nav underline rule (border-bottom transparent on all nav links)
   was erasing the Member Portal pill's bottom border — re-assert all four sides */
html.ho-dark #site-navigation li.ho-portal-item a{
  border:1px solid rgba(242,237,226,.35) !important;border-radius:999px !important}
html.ho-dark #site-navigation li.ho-portal-item a:hover{
  border-color:#C9AE72 !important}

/* ═══ Wildlife of the Month feature block polish (articles + wildlife pages) ═══ */
/* light: a contained tinted feature panel instead of loose content on white */
html.ho-light .ho-article-feature-card{
  background:var(--c-tint-soft) !important;border:1px solid var(--c-border-soft) !important;
  border-radius:16px !important;box-shadow:none !important;
  padding:clamp(28px,4vw,48px) !important}
html.ho-light .ho-article-feature-text h3{font-size:clamp(30px,3.4vw,40px) !important;line-height:1.1 !important}
html.ho-light .ho-article-feature-card .ho-wotm-button,
html.ho-light .ho-article-feature-card .ho-wildlife-button.ho-wotm-button{
  text-transform:none !important;letter-spacing:.01em !important;
  font-size:15px !important;border-radius:8px !important;padding:12px 24px !important}
/* both modes: portrait photos crop to a balanced block instead of towering */
.ho-article-feature-media .ho-article-image-wrap img,
.ho-article-feature-media img{width:100%;max-height:520px;object-fit:cover}
html.ho-dark .ho-article-feature-media .ho-article-image-wrap img,
html.ho-dark .ho-article-feature-media img{max-height:480px}
/* evergreen line (added by JS when an article has no description) */
.ho-wotm-evergreen{max-width:46ch}
html.ho-light .ho-article-feature-text .ho-wotm-evergreen,
html.ho-light .ho-article-feature-text .ho-wotm-desc{color:var(--c-ink) !important;font-size:17px !important;line-height:1.7 !important}
html.ho-dark .ho-article-feature-text .ho-wotm-evergreen,
html.ho-dark .ho-article-feature-text .ho-wotm-desc{font-size:16px !important;line-height:1.65 !important}
.ho-wotm-desc{max-width:46ch}

/* ═══════════════════════════════════════════════════════════════════
   OVERLAYS — unified to the Preserve palette in BOTH themes
   (the lightbox and matching game are full-screen dark surfaces; they
   keep one consistent identity regardless of the active theme)
   ═══════════════════════════════════════════════════════════════════ */
/* matching game */
.ho-game-modal{background:#183226 !important;border:1px solid rgba(242,237,226,.2) !important}
.ho-game-card-front{background:linear-gradient(135deg,#1C3A2C,#2E5240) !important}
.ho-game-card-back{border-color:#C9AE72 !important}
.ho-game-results{background:rgba(16,36,27,.95) !important}
.ho-game-name-row input{background:#10241B !important;border:1px solid rgba(242,237,226,.25) !important;color:#F2EDE2 !important}
.ho-game-name-row input:focus{border-color:#C9AE72 !important}
.ho-game-btn{background:#C9AE72 !important;color:#10241B !important;border-radius:2px !important}
.ho-game-btn:hover{background:#D8BF85 !important;color:#10241B !important}
.ho-game-btn-close{background:transparent !important;border:1px solid rgba(242,237,226,.3) !important;color:#C6CFBF !important}
.ho-game-btn-close:hover{background:rgba(242,237,226,.08) !important;color:#F2EDE2 !important}
.ho-game-hs-badge{background:#C9AE72 !important;color:#10241B !important}
.ho-game-close{color:#B9C7B4 !important}
.ho-game-close:hover{color:#F2EDE2 !important}
html.ho-light .ho-game-title,html.ho-dark .ho-game-title{color:#F2EDE2 !important}
html.ho-light .ho-game-results-inner h3,html.ho-dark .ho-game-results-inner h3{color:#C9AE72 !important}
html.ho-light .ho-game-stats,html.ho-light .ho-game-stats span,
html.ho-dark .ho-game-stats,html.ho-dark .ho-game-stats span{color:#C6CFBF !important}
html.ho-light .ho-game-stat-sep,html.ho-dark .ho-game-stat-sep{color:rgba(242,237,226,.25) !important}
html.ho-light .ho-gr-val,html.ho-dark .ho-gr-val{color:#F2EDE2 !important}
html.ho-light .ho-gr-label,html.ho-light .ho-game-lb-title,html.ho-light .ho-game-lb th,html.ho-light .ho-game-lb .ho-lb-empty,
html.ho-dark .ho-gr-label,html.ho-dark .ho-game-lb-title,html.ho-dark .ho-game-lb th,html.ho-dark .ho-game-lb .ho-lb-empty{color:#B9C7B4 !important}
html.ho-light .ho-game-lb td,html.ho-dark .ho-game-lb td{color:#C6CFBF !important}
html.ho-light .ho-game-lb tr:first-child td,html.ho-dark .ho-game-lb tr:first-child td{color:#C9AE72 !important}
/* lightbox */
html.ho-light .ho-lightbox-caption,html.ho-dark .ho-lightbox-caption{
  color:#F2EDE2 !important;font-family:'Cormorant Garamond',Georgia,serif !important;font-weight:500}
html.ho-light .ho-lightbox-credit,html.ho-dark .ho-lightbox-credit{color:#B9C7B4 !important}
html.ho-light .ho-lightbox-area,html.ho-dark .ho-lightbox-area,
html.ho-light .ho-lightbox-counter,html.ho-dark .ho-lightbox-counter{color:rgba(242,237,226,.5) !important}
.ho-lightbox-download,.ho-lightbox-copy-link{
  background:rgba(201,174,114,.12) !important;color:#C9AE72 !important;border:1px solid rgba(201,174,114,.4) !important}
.ho-lightbox-download:hover,.ho-lightbox-copy-link:hover{background:rgba(201,174,114,.22) !important;color:#D8BF85 !important}
.ho-lightbox-spinner{border-color:rgba(201,174,114,.25) !important;border-top-color:#C9AE72 !important}
.ho-lightbox-close:hover,.ho-lightbox-prev:hover,.ho-lightbox-next:hover{
  background:rgba(201,174,114,.25) !important;color:#D8BF85 !important}
@media (max-width:768px){
  .ho-lightbox-actions::before{color:rgba(242,237,226,.5) !important}
}

/* ═══ Mobile tap targets ≥44px (pills, toolbar, pagination) ═══ */
@media (max-width:768px){
  .ho-wildlife-button,.ho-filter-button,.ho-bulk-download-button,.ho-slideshow-launch,.ho-page-link{
    min-height:44px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important}
  .ho-gallery-toolbar-right .ho-bulk-download-button,.ho-gallery-toolbar-right .ho-slideshow-launch,
  .ho-gallery-toolbar-right .ho-selection-cancel{height:44px !important}
}

/* text-protection: soft wide shadows so white titles survive bright photo
   areas (the rotating daily hero can serve any photo) */
html.ho-dark .ho-home-hero h1,html.ho-dark .ho-home-hero p,
html.ho-dark h1.entry-title,html.ho-dark .entry-title,
html.ho-dark .page-id-414 .ho-hl-head h1,html.ho-dark .page-id-414 .ho-hl-subtitle,
html.ho-dark .ho-home-hero h1::before,html.ho-dark .entry-header::before{
  text-shadow:0 1px 22px rgba(16,36,27,.75),0 1px 4px rgba(16,36,27,.45)}
html.ho-light h1.entry-title,html.ho-light .entry-title,
html.ho-light .ho-home-hero h1,html.ho-light .ho-home-hero p,
html.ho-light .page-id-414 .ho-hl-head h1,html.ho-light .entry-header::before{
  text-shadow:0 2px 18px rgba(20,33,25,.55),0 1px 3px rgba(20,33,25,.35)}

/* ═══ Zone filter banner (gallery filtered from the Property Map) ═══ */
.ho-zone-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  padding:18px 22px;margin:0 0 26px}
.ho-zone-banner-text{display:flex;flex-direction:column;gap:3px;min-width:220px}
.ho-zone-banner-text strong{font-size:17px;line-height:1.35}
.ho-zone-banner-text span{font-size:14px}
.ho-zone-banner-actions{display:flex;gap:10px;flex-wrap:wrap}
.ho-zone-banner-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:8px 18px;font-family:var(--wl-font-body);font-size:14px;font-weight:600;letter-spacing:.02em;
  text-decoration:none !important;transition:background .2s ease,color .2s ease,border-color .2s ease}
/* club theme: tinted rounded panel, green actions */
html.ho-light .ho-zone-banner{background:#eef7f3;border:1px solid #d7e2d7;border-radius:16px}
html.ho-light .ho-zone-banner-text strong{color:#214734 !important}
html.ho-light .ho-zone-banner-text span{color:#3f5246 !important}
html.ho-light .ho-zone-banner a.ho-zone-banner-clear{background:#2c6e49 !important;color:#fff !important;
  border:1px solid #2c6e49 !important;border-radius:6px}
html.ho-light .ho-zone-banner a.ho-zone-banner-clear:hover{background:#214734 !important;border-color:#214734 !important}
html.ho-light .ho-zone-banner a.ho-zone-banner-map{background:transparent !important;color:#2c6e49 !important;
  border:1px solid #6fa37c !important;border-radius:6px}
html.ho-light .ho-zone-banner a.ho-zone-banner-map:hover{background:rgba(44,110,73,.08) !important;color:#214734 !important}
/* wildlife theme: Preserve surface, brass actions */
html.ho-dark .ho-zone-banner{background:#183226;border:1px solid rgba(242,237,226,.14);border-radius:4px}
html.ho-dark .ho-zone-banner-text strong{color:#F2EDE2 !important}
html.ho-dark .ho-zone-banner-text span{color:#B9C7B4 !important}
html.ho-dark .ho-zone-banner a.ho-zone-banner-clear{background:#C9AE72 !important;color:#10241B !important;
  border:1px solid #C9AE72 !important;border-radius:2px}
html.ho-dark .ho-zone-banner a.ho-zone-banner-clear:hover{background:#D8BF85 !important;border-color:#D8BF85 !important}
html.ho-dark .ho-zone-banner a.ho-zone-banner-map{background:transparent !important;color:#C9AE72 !important;
  border:1px solid rgba(201,174,114,.45) !important;border-radius:2px}
html.ho-dark .ho-zone-banner a.ho-zone-banner-map:hover{background:rgba(201,174,114,.12) !important;color:#D8BF85 !important}
@media (max-width:768px){
  .ho-zone-banner{flex-direction:column;align-items:stretch;text-align:center}
  .ho-zone-banner-text{align-items:center}
  .ho-zone-banner-actions{justify-content:center}
}

/* ═══ Mobile text protection (wildlife theme photo headers) ═══
   The desktop corner scrim assumes text sits bottom-left of a wide frame;
   on phones the title wraps taller and spans the full width, escaping the
   ellipse. Swap to a bottom-weighted wash: photo stays clean up top, the
   lower half (where all the text lives) gets solid protection. */
@media (max-width:768px){
  html.ho-dark .ho-home-hero::before,
  html.ho-dark .entry-header::after,
  html.ho-dark .page-id-414 .ho-hl-head::after{
    background:linear-gradient(180deg,rgba(16,36,27,0) 0%,rgba(16,36,27,.10) 12%,rgba(16,36,27,.45) 24%,rgba(16,36,27,.72) 45%,rgba(16,36,27,.92) 100%) !important;
  }
}