﻿/* Additional content shares the main site's type, surfaces and accent colour. */
.service-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-block: 0;
}
.service-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 17px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--bg);
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  transition: background .25s, color .25s, border-color .25s;
}
.service-links a:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.service-links a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 5px;
}
.service-directory {
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.service-page h2 {
  font-size: clamp(26px, 4vw, 38px);
  letter-spacing: -.025em;
  line-height: 1.15;
  margin: 0 0 24px;
}
.service-page {
  padding-top: 80px;
  background: radial-gradient(ellipse at top right, rgba(255,87,90,.09), transparent 55%);
}
.service-page .intro-copy { margin-inline: auto; }
.service-page h1 { overflow-wrap: break-word; }
.service-page .eyebrow { margin-top: 36px; }
.service-page .intro-copy > .text-link { color: var(--accent); }
.service-page .intro-copy > p:not(.lead) { line-height: 1.85; }
.service-page h2 {
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}
.service-page .hero-actions { margin-top: 32px; }
.hero-card-main img { height: auto; }
/* Keep longer descriptions clear of the Explore link. */
.service-card { padding-bottom: 75px; }
@media (max-width: 700px) {
  .service-links a { max-width: 100%; font-size: 12px; padding: 10px 14px; }
  .service-page { padding-top: 40px; }
  .service-page h1 { font-size: clamp(40px, 11vw, 68px); }
}
