/* LCHWM Design System — shared tokens for all 4 sites */
:root {
  /* shared type + space scale */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Inter', -apple-system, system-ui, sans-serif;
  --space-1: 0.5rem; --space-2: 1rem; --space-3: 2rem; --space-4: 4rem;
  --radius: 12px;
}

/* per-site accent palettes */
[data-site="lifecyclehemp"] {
  --accent: #2d5a27;        /* deep green */
  --accent-soft: #e8f0e6;   /* cream-green */
  --ink: #1a2b17;
}
[data-site="grea"] {
  --accent: #f97316;        /* signal orange */
  --accent-soft: #fef3e7;
  --ink: #18181b;           /* graphite */
}
[data-site="superiorchem"] {
  --accent: #1e3a5f;        /* navy */
  --accent-soft: #e7edf5;
  --safety: #fbbf24;        /* safety yellow */
  --ink: #0f172a;
}
[data-site="gasbrk"] {
  --accent: #059669;        /* emerald */
  --accent-soft: #ecfdf5;
  --ink: #022c22;           /* dark slate */
}

* { box-sizing: border-box; margin: 0; }
body {
  font-family: var(--font-body);
  color: var(--ink);
  background: #fff;
  line-height: 1.6;
}
.wrap { max-width: 1100px; margin: 0 auto; padding: 0 var(--space-2); }

/* components */
.hero {
  padding: var(--space-4) 0;
  background: linear-gradient(135deg, var(--accent-soft), #fff);
}
.hero h1 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 3.5rem);
  color: var(--accent);
  max-width: 18ch;
}
.tagline { font-size: 1.25rem; opacity: .8; max-width: 50ch; margin-top: var(--space-1); }
.cta {
  display: inline-block; margin-top: var(--space-2);
  background: var(--accent); color: #fff;
  padding: .9em 1.8em; border-radius: var(--radius);
  text-decoration: none; font-weight: 600;
}
.trust {
  display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: var(--space-2); padding: var(--space-3) 0;
}
.trust-card {
  border: 1px solid #e5e7eb; border-radius: var(--radius);
  padding: var(--space-2);
}
.trust-card h3 { color: var(--accent); font-size: 1rem; }
.trust-card p { font-size: .925rem; opacity: .75; }
section { padding: var(--space-3) 0; }
h2 { font-family: var(--font-display); color: var(--accent); font-size: 1.75rem; margin-bottom: var(--space-2); }
footer { border-top: 1px solid #eee; padding: var(--space-3) 0; font-size: .875rem; opacity: .6; }