/* King's Roofing shared refinements (loaded on every page after main.css) */
:root {
  --kr-purple: #693380;
  --kr-purple-dark: #4d2561;
  --kr-cta: #b8470f;
  --kr-cta-hover: #8e3608;
  --kr-yellow: #f1d968;
  --kr-ink: #2d2d2d;
}
.button { background-color: var(--kr-cta); border-color: var(--kr-cta); }
.button:hover, .button:focus-visible { background-color: var(--kr-cta-hover); border-color: var(--kr-cta-hover); }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--kr-yellow);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px var(--kr-purple);
}
.header__item--mobile { display: flex; align-items: center; gap: 10px; }
.header-call {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; min-width: 64px; padding: 0 18px; border-radius: 23px;
  background: var(--kr-cta); color: #fff; font-weight: 700; font-size: 1.05rem; text-decoration: none; letter-spacing: .02em;
}
.header-call:hover, .header-call:focus-visible { background: var(--kr-cta-hover); color: #fff; }
@media (min-width: 1024px) { .header-call { display: none; } }