/*
 * GrowActuary shared color system.
 *
 * Page-specific styles still own layout. This file keeps the recurring
 * surfaces predictable across editorial pages, tools, and immersive modes.
 */

:root {
  --ga-chrome: #192c27;
  --ga-forest: #193d29;
  --ga-night: #17241b;
  --ga-ink: #142326;
  --ga-paper: #fffce9;
  --ga-surface: #fbfaf6;
  --ga-card: #ffffff;
  --ga-sage: #e8f0e9;
  --ga-mint: #f4f7f5;
  --ga-accent: #7ec67f;
  --ga-accent-strong: #41834b;
  --ga-charcoal: #202125;
  --ga-warm-accent: #d69b45;
}

body:not(.page-id-486) {
  background-color: var(--ga-paper);
}

#header,
#footer,
#header [data-row="middle"],
#footer [data-row="bottom"] {
  background-color: var(--ga-chrome);
}

#footer,
#footer [data-row="bottom"] {
  color: var(--ga-accent);
}

#header .ct-menu-link,
#footer a {
  color: var(--ga-accent);
}

#footer a {
  color: var(--ga-accent) !important;
}

#header .ct-menu-link:hover,
#header .ct-menu-link:focus-visible,
#footer a:hover,
#footer a:focus-visible {
  color: #ffffff;
}

/* Let the mark use the available header row without increasing row height. */
@media (min-width: 1000px) {
  [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
    --logo-max-height: min(104px, calc(var(--header-height, 120px) - 4px));
  }

  [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container img {
    width: auto;
    max-height: min(104px, calc(var(--header-height, 120px) - 4px));
  }
}

@media (max-width: 999.98px) {
  [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
    --logo-max-height: min(66px, calc(var(--header-height, 70px) - 4px));
  }

  [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container img {
    width: auto;
    max-height: min(66px, calc(var(--header-height, 70px) - 4px));
  }
}

/* Equipment: editorial hero, quiet canvas, white cards. */
.eq-wrap {
  --eq-ink: var(--ga-ink);
  --eq-forest: var(--ga-forest);
  --eq-sage: var(--ga-accent-strong);
  --eq-accent: var(--ga-accent);
  --eq-cream: var(--ga-surface);
  --eq-mist: var(--ga-sage);
  --eq-white: var(--ga-card);
}

/* Tools hub and DLI reference page are one visual family. */
.ga-tools-hub {
  --ink: var(--ga-ink);
  --paper: var(--ga-surface);
  --panel: var(--ga-card);
  --green: var(--ga-accent-strong);
  --deep: var(--ga-forest);
}

.ga-tools-hub .ga-tools-inner,
.ga-dli-tool .ga-dli-inner {
  max-width: 980px;
}

.ga-dli-tool {
  --ink: var(--ga-ink);
  --surface: var(--ga-card);
  --soft: var(--ga-mint);
  --green: var(--ga-accent-strong);
  --deep: var(--ga-forest);
}

/* VPD stays a wide control surface, but shares the same tool neutrals. */
.ga-vpd-tool {
  --ink: var(--ga-ink);
  --surface: var(--ga-card);
  --soft: var(--ga-mint);
  --green: var(--ga-accent-strong);
  --green-dark: var(--ga-forest);
}

.ga-vpd-tool .ga-vpd-header {
  background: linear-gradient(90deg, var(--ga-sage), var(--ga-mint));
}

/* Tail Factor remains app-like while using the shared palette. */
body.page-id-478 {
  --ink: var(--ga-ink);
  --paper: var(--ga-surface);
  --panel: var(--ga-card);
  --wash: var(--ga-sage);
  --green: var(--ga-accent-strong);
  --deep: var(--ga-forest);
  --gold: var(--ga-warm-accent);
  background-color: var(--ga-surface);
}

/* Older archives inherit Blocksy's lime-heavy defaults without this pass. */
body.archive:not(.category-2026-pink-banana-runtz) .page-title,
body.archive:not(.category-2026-pink-banana-runtz) .entry-title,
body.archive:not(.category-2026-pink-banana-runtz) .entry-title a {
  color: var(--ga-forest);
}

body.archive:not(.category-2026-pink-banana-runtz) .entry-excerpt {
  color: var(--ga-ink);
}

body.archive:not(.category-2026-pink-banana-runtz) .entry-meta,
body.archive:not(.category-2026-pink-banana-runtz) .entry-meta a {
  color: var(--ga-accent-strong);
}

/* Standard article sheets use the same editorial language as the landing pages. */
body.single-post #main > .ct-container-full {
  padding: clamp(28px, 5vw, 64px) 20px;
}

body.single-post #main article {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  background: var(--ga-card);
  border: 1px solid rgba(25, 61, 41, 0.12);
  border-radius: 14px;
  box-shadow: 0 20px 48px rgba(20, 35, 38, 0.1);
}

body.single-post article > .hero-section {
  width: auto;
  max-width: none;
  margin: 0;
  padding: clamp(30px, 5vw, 48px) clamp(24px, 6vw, 56px) 32px;
  background:
    radial-gradient(circle at 90% 10%, rgba(126, 198, 127, 0.16), transparent 32%),
    var(--ga-forest);
}

body.single-post article .entry-header {
  width: auto;
  max-width: none;
}

body.single-post article .page-title,
body.single-post article .entry-title,
body.single-post article .entry-title a {
  color: #ffffff !important;
  font-size: clamp(2rem, 5vw, 3.15rem);
  line-height: 1.06;
  letter-spacing: -0.035em;
}

body.single-post article .entry-meta,
body.single-post article .entry-meta a {
  color: rgba(255, 255, 255, 0.72) !important;
}

body.single-post article .entry-meta {
  margin-top: 18px;
}

body.single-post article .entry-content {
  width: auto;
  max-width: none;
  margin: 0;
  padding: clamp(30px, 5vw, 48px) clamp(24px, 6vw, 56px) clamp(38px, 6vw, 56px);
  color: var(--ga-ink) !important;
  font-size: 1.04rem;
  line-height: 1.78;
}

body.single-post article .entry-content :where(h1, h2, h3, h4) {
  color: var(--ga-forest) !important;
  letter-spacing: -0.02em;
}

body.single-post article .entry-content :where(h2, h3) {
  margin-top: 1.8em;
}

body.single-post article .entry-content a {
  color: var(--ga-accent-strong) !important;
}

body.single-post article .entry-content :where(img, .wp-block-image img) {
  border-radius: 8px;
}

body.single-post article .entry-content blockquote {
  padding: 18px 22px;
  background: var(--ga-mint);
  border-inline-start: 4px solid var(--ga-accent-strong);
  color: var(--ga-ink);
}

body.single-post .ct-comments-container {
  padding-bottom: clamp(34px, 6vw, 72px);
}

body.single-post .ct-comments {
  max-width: 880px;
  margin: 0 auto;
  padding: clamp(24px, 5vw, 40px);
  background: var(--ga-card);
  border: 1px solid rgba(25, 61, 41, 0.12);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(20, 35, 38, 0.07);
}

body.single-post .ct-comments h2 {
  color: var(--ga-forest);
}

body.single-post .ct-comments :where(input, textarea) {
  background: var(--ga-mint);
  border-color: rgba(25, 61, 41, 0.16);
}

body.single-post .ct-comments button[type="submit"] {
  background: var(--ga-accent-strong);
}

@media (max-width: 600px) {
  body.single-post #main > .ct-container-full {
    padding: 18px 12px 28px;
  }

  body.single-post #main article,
  body.single-post .ct-comments {
    border-radius: 10px;
  }
}
