/* ==========================================================================
   Content Hype — shared design system  (refresh 2026-06-30)
   Applies the approved homepage look (Space Grotesk + Inter, warm paper,
   polished atoms) across every custom page template.
   Scoped to .ch-home / .ch-service wrappers so the Divi header/footer are
   left untouched. Brand red/charcoal already match, so this layer is mostly
   typography + surface + component polish.
   ========================================================================== */

:root{
  --chx-red:#D50000; --chx-red-dark:#b00000;
  --chx-charcoal:#263238; --chx-slate:#37474F; --chx-ink:#1a2226;
  --chx-paper:#FAFAF8; --chx-mist:#F2F2F2; --chx-line:#E2E4E6; --chx-muted:#6b767c;
  --chx-disp:'Space Grotesk',system-ui,-apple-system,sans-serif;
  --chx-body:'Inter',system-ui,-apple-system,sans-serif;
}

/* ---- typography swap (Raleway -> Space Grotesk / Inter) ---- */
.ch-home, .ch-service{
  font-family:var(--chx-body) !important;
  background-color:var(--chx-paper);
  color:#1f2a2f;
}
.ch-home h1,.ch-home h2,.ch-home h3,.ch-home h4,.ch-home h5,
.ch-service h1,.ch-service h2,.ch-service h3,.ch-service h4,.ch-service h5{
  font-family:var(--chx-disp) !important;
  letter-spacing:-.02em;
}
.ch-home strong,.ch-service strong{font-weight:600}

/* ---- warm the flat light-gray surfaces to mist ---- */
.ch-section--gray,
.ch-cta-section,
.ch-use-case,
.ch-equipment-item,
.ch-testimonial-item,
.ch-grid__item{
  background-color:var(--chx-mist) !important;
}

/* ---- button polish (consistent radius + Inter) ---- */
.ch-home .ch-btn,.ch-service .ch-btn{
  font-family:var(--chx-body) !important;
  border-radius:5px !important;
  letter-spacing:.01em;
  font-weight:600 !important;
}

/* ---- eyebrows / labels: tighten the uppercase tracking ---- */
.ch-hub-card__meta,
.ch-special-offer__badge,
.ch-service-hero__eyebrow{
  letter-spacing:.14em !important;
}

/* ---- card hairlines to the brand line colour ---- */
.ch-pricing-card,
.ch-hub-card,
.ch-grid__item{
  border-color:var(--chx-line) !important;
}

/* ---- links inside body copy ---- */
.ch-home a:not(.ch-btn),.ch-service a:not(.ch-btn){color:var(--chx-red)}

/* ---- balance a lone pricing card (studio now has one) ---- */
.ch-pricing-cards:has(> .ch-pricing-card:only-child){
  grid-template-columns:minmax(0,520px) !important;
}

/* ==========================================================================
   Shared lead-capture form component (.ch-lead-form)
   Used site-wide (Home Ground, Contact, footer band, pro-web pages) via
   template-parts/lead-form.php + assets/lead-form.js. Self-contained hex so
   it renders identically inside .ch-home / .ch-service / the raw footer.
   ========================================================================== */
.ch-lead-form{background:#fff;border-radius:14px;padding:1.6rem;text-align:left;font-family:var(--chx-body);max-width:620px;margin:1.4rem auto 0;position:relative}
.ch-lead-form .clf-row{display:grid;gap:1rem}
@media(min-width:560px){.ch-lead-form .clf-row{grid-template-columns:1fr 1fr}}
.ch-lead-form .clf-field{margin-bottom:1rem}
.ch-lead-form label{display:block;font-size:.82rem;font-weight:600;color:#263238;margin-bottom:.35rem;font-family:var(--chx-body)}
.ch-lead-form input,.ch-lead-form select,.ch-lead-form textarea{width:100%;padding:.7rem .8rem;border:1px solid #E2E4E6;border-radius:7px;font-size:1rem;font-family:var(--chx-body);color:#1f2a2f;background:#fff;box-sizing:border-box}
.ch-lead-form textarea{min-height:88px;resize:vertical}
.ch-lead-form input:focus,.ch-lead-form select:focus,.ch-lead-form textarea:focus{outline:none;border-color:#D50000}
.ch-lead-form button{width:100%;margin-top:.4rem;cursor:pointer;font-family:var(--chx-body);font-weight:600;background:#D50000;color:#fff;border:2px solid #D50000;border-radius:5px;padding:.9rem 1.5rem;font-size:1rem;transition:.18s}
.ch-lead-form button:hover{background:#b00000;border-color:#b00000}
.ch-lead-form button:disabled{opacity:.6;cursor:default}
.ch-lead-form .clf-note{margin:.9rem 0 0;font-size:.95rem;color:#263238;text-align:center}
.ch-lead-form .clf-note.err{color:#D50000}
.ch-lead-form .clf-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ch-lead-form .clf-done{text-align:center;padding:1rem 0}
.ch-lead-form .clf-done h3{font-family:var(--chx-disp);color:#263238;font-size:1.4rem;margin-bottom:.5rem}
.ch-lead-form .clf-done p{color:#6b767c;margin:0}
/* compact footer variant */
.ch-lead-footer{background:#263238;color:#fff;padding:3rem 1.5rem;text-align:center}
.ch-lead-footer__inner{max-width:620px;margin:0 auto}
.ch-lead-footer .clf-eyebrow{display:block;font:700 12px/1 var(--chx-body);letter-spacing:.16em;text-transform:uppercase;color:#ff6b6b;margin-bottom:.5rem}
.ch-lead-footer h2{font-family:var(--chx-disp);color:#fff;font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 .5rem}
.ch-lead-footer p.clf-sub{color:rgba(255,255,255,.85);margin:0 auto 1.2rem;max-width:480px}