/* Copperline Electric skin: near-black charcoal + safety yellow.
     Only the palette, fonts, weights and radii differ from base.css;
     structure, spacing and components all come from base.css. */
  :root{
    --brand:#191c22; --brand-deep:#101216; --brand-soft:#e9ebee;
    --accent:#f5b800; --accent-deep:#dda600; --accent-soft:#fbf4dc;
    --paper:#ffffff; --paper-2:#f6f5f1; --ink:#1d2025; --muted:#5c6470; --line:#e7e5df;
    /* AA-safe amber for accent-coloured TEXT/marks on light surfaces
       (safety yellow fails contrast as text on white). */
    --accent-ink:#8a6a00;
    --font-display:"Big Shoulders Display",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    --font-text:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    /* Big Shoulders Display is a condensed industrial display face (steel-town
       signage register) loaded at 600;700;800 - use 800 for h1, 700 elsewhere. */
    --wt-head:700; --wt-h1:800; --radius:16px; --radius-sm:10px;
  }

  /* Yellow-accent adjustments base.css cannot derive from tokens alone.
     base.css assumes the accent is dark enough to carry white text; safety
     yellow is not, so accent fills take dark brand text, ghost buttons are
     re-asserted white for the dark bands, and accent used as small text or a
     mark on a light surface switches to the AA-safe --accent-ink. */
  .btn{color:var(--brand)}
  .hero-call{color:var(--brand)}
  .final .btn-call{color:var(--brand)}
  .btn-ghost,.final .btn-ghost{color:#fff}
  .eyebrow,.svc-card .idx,.cost-price .from,.stat .num em{color:var(--accent-ink)}
  .faq-list summary::after{color:var(--accent-ink)}
  .offer-list li::before{background:var(--accent-ink)}
  /* A plain link inside the dark hero copy stays white. */
  .hero.on-dark .hero-line a{color:#fff;text-decoration-color:rgba(255,255,255,.5);text-underline-offset:3px}

/* ------------------------------------------------------------------
   SUBPAGE HELPERS (added during the subpage conversion)
   base.css scopes .cta-row to .hero / .final, and has no compact-hero
   reassurance line or end-of-article CTA block. These three selectors
   are the only additions beyond the homepage skin; they let the
   canonical .page-hero and .article-body carry the town/blog-page
   call-to-action row, the "we reply within a day" note, and the
   closing nudge at the foot of a post. */
.page-hero .cta-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;margin-top:var(--space-5)}
.page-hero .hero-note{margin-top:var(--space-4);font-size:var(--step--1);color:var(--muted)}
.post-cta{margin-top:var(--space-6);border-top:1px solid var(--line);padding-top:var(--space-5)}