/* Offbeat Home Services — subpages (city pages, cost guide, about, 404) */
.page-hero { background: radial-gradient(800px 400px at 90% 120%, rgba(233,164,59,.28), transparent 60%), var(--ink); color: var(--white); padding: 40px 0 64px; }
.page-hero h1 { font-size: clamp(32px, 5vw, 54px); font-weight: 900; font-stretch: 92%; text-transform: uppercase; margin: 18px 0 16px; }
.page-hero .lede { max-width: 680px; }
.byline { margin-top: 18px; font-size: 14px; color: #a9a9b3; }
.byline a { color: var(--copper); }

.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 6px; font-size: 14px; color: #a9a9b3; }
.breadcrumbs li + li::before { content: "/"; margin-right: 6px; color: #6b6b74; }
.breadcrumbs a { color: #d8d8de; text-decoration: none; }
.breadcrumbs a:hover { color: var(--copper); }
.breadcrumbs [aria-current] { color: var(--copper); }

.prose-section { padding: 64px 0; }
.prose { max-width: 760px; }
.prose h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 900; margin: 40px 0 12px; }
.prose h2:first-child { margin-top: 0; }
.prose p { color: var(--ink-3); font-size: 17px; }
.prose p + p { margin-top: 14px; }
.prose a { color: var(--copper-dark); font-weight: 600; }
.num-list { list-style: decimal; padding-left: 22px; display: grid; gap: 10px; color: var(--ink-3); }
.tick-list { display: grid; gap: 10px; margin: 10px 0 18px; }
.tick-list li { position: relative; padding-left: 28px; color: var(--ink-3); }
.tick-list li::before { content: ""; position: absolute; left: 2px; top: 8px; width: 14px; height: 8px; border-left: 2.5px solid var(--copper); border-bottom: 2.5px solid var(--copper); transform: rotate(-45deg); }
.other-areas { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--line); }

.faq { display: grid; gap: 10px; }
.faq details { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 14px 18px; background: var(--white); }
.faq summary { cursor: pointer; font-family: var(--display); font-weight: 800; font-size: 17px; }
.faq details p { margin-top: 10px; font-size: 16px; }

.author-card { display: flex; gap: 20px; align-items: flex-start; background: var(--sand); border-radius: var(--radius); padding: 24px; }
.author-card img { border-radius: 50%; flex-shrink: 0; }
.author-card h2 { margin-top: 0; }

.cta-band { background: var(--ink); color: var(--white); padding: 56px 0; }
.cta-inner { display: flex; gap: 28px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cta-inner h2 { font-size: clamp(26px, 3.4vw, 36px); font-weight: 900; margin-bottom: 8px; }
.cta-inner p { color: #b9b9c2; max-width: 520px; }
.cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.footer-h { font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--white); margin-bottom: 14px; font-weight: 800; }

@media (max-width: 600px) {
  .author-card { flex-direction: column; }
  .cta-actions .btn { width: 100%; }
}

.city-link { display: flex; align-items: center; gap: 10px; width: 100%; text-decoration: none; }
.city-link:hover { color: var(--copper-dark); }
.city-grid li:has(.city-link) { padding: 0; }
.city-grid .city-link { padding: 18px 16px; }
