/* Service page styles — shared by the service detail pages. Extracted from the pages' inline styles; loads before site.css. */

#mainNav a.nav-current { color: var(--primary); font-weight: 700; }

.page-hero { background: var(--bg); padding: 4rem 2rem 3rem; text-align: center; }

.page-hero .breadcrumb { font-size: 0.85rem; color: var(--accent); margin-bottom: 1rem; }

.page-hero .breadcrumb a { color: var(--accent); }

.page-hero h1 { font-family: 'IBM Plex Sans', sans-serif; font-size: 2.5rem; font-weight: 700; color: var(--dark); margin-bottom: 1rem; line-height: 1.2; }

.page-hero p { font-size: 1.125rem; color: var(--accent); max-width: 680px; margin: 0 auto; line-height: 1.7; }

.service-content { background: var(--white); padding: 4rem 2rem; }

.service-content h2:first-of-type { margin-top: 0; }

.price-features { list-style: none; }

.price-features li { padding: 0.6rem 0; padding-left: 1.75rem; position: relative; color: var(--dark); border-bottom: 1px solid #F0EEE9; }

.price-features li:before { content: "✓"; position: absolute; left: 0; color: var(--primary); font-weight: 700; }

.service-faq-item { margin-bottom: 1.5rem; }

.service-faq-item h3 { font-size: 1.05rem; font-weight: 700; color: var(--dark); margin-bottom: 0.4rem; }

.service-faq-item p { color: var(--accent); margin-bottom: 0; }

.service-callout p { color: var(--accent); margin-bottom: 0.75rem; }

.service-callout a { color: var(--primary); font-weight: 600; text-decoration: none; }

.service-callout a:hover { text-decoration: underline; }

@media (max-width: 768px) { .page-hero h1 { font-size: 2rem; } }

.cta { background: var(--primary); color: var(--white); padding: 4rem 2rem; text-align: center; }

.cta .btn { background: var(--white); color: var(--primary); padding: 1rem 3rem; }

.cta .btn:hover { opacity: 0.9; }

footer { background: var(--dark); color: var(--white); padding: 4rem 2rem 2rem; }