.services-menu { position: relative; }
.services-menu summary { cursor: pointer; padding: 12px 0; }
.services-panel { position: absolute; right: 0; top: 100%; width: 350px; background: white; box-shadow: 0 8px 24px #0002; padding: 18px; z-index: 30; }
.services-panel a { display: block; padding: 11px 8px; text-decoration: none; }
.services-panel a:hover { background: var(--tint); }
.page-heading { padding-block: 70px 35px; }
.page-heading h1 { font-size: clamp(2.5rem, 5vw, 5rem); }
.page-heading p { max-width: 640px; margin-top: 25px; }
.service-directory { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px 50px; }
.service-directory a { text-decoration: none; padding-block: 20px; border-bottom: 1px solid var(--line); }
.service-directory h2 { font-size: 2rem; }
.service-directory p { margin-top: 12px; color: var(--muted); }
.service-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.service-detail h2 { font-size: 2.5rem; margin-bottom: 24px; }
.service-detail li { margin-bottom: 15px; line-height: 1.6; }
.page-cta { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.prose { max-width: 760px; }
.prose p { margin-bottom: 24px; }
.prose h2 { margin-bottom: 25px; font-size: 2.5rem; }
.calculator-layout { display: grid; grid-template-columns: 1.3fr 1fr; gap: 60px; align-items: start; }
#price-form { display: grid; gap: 28px; }
#price-form legend { margin-bottom: 15px; font-weight: 600; }
#price-form input[type=range] { accent-color: var(--ink); }
.price-result { background: var(--tint); padding: 32px; }
.price-result h2 { font-size: 2.3rem; }
#price-total { display: block; font-size: 2.2rem; font-weight: 700; margin: 25px 0; }
.price-result p { font-size: .85rem; margin-bottom: 20px; }
@media(max-width:800px) {
  .header-inner { flex-wrap: nowrap; }
  .services-panel { position: static; width: 100%; box-shadow: none; padding: 0 12px; }
  .calculator-layout, .service-detail { grid-template-columns: 1fr; gap: 30px; }
  .price-result { position: static; }
}
@media(max-width:600px) {
  .service-directory { grid-template-columns: 1fr; }
  .page-cta { display: block; }
  .page-cta .button { margin-top: 25px; }
}
.header-inner { height: 90px; min-height: 0; flex-wrap: nowrap; padding-block: 0; }
html { scroll-padding-top: 110px; }
#site-navigation { width: auto; justify-content: flex-end; }
#site-navigation a[aria-current=page] { text-decoration: underline; text-underline-offset: 6px; }
#price-form label:has(input:disabled) { background: var(--tint); }
@media (max-width:800px) {
  html { scroll-padding-top: 110px; }
  .header-inner { flex-wrap: nowrap; min-height: 78px; padding-block: 12px; }
  #site-navigation { max-height: calc(100dvh - 110px); overflow-y: auto; }
}
@media (min-width:801px) and (max-width:1100px) {
  .header-inner { height: auto; min-height: 110px; flex-wrap: wrap; padding-block: 12px; }
  #site-navigation { width: 100%; justify-content: center; }
  html { scroll-padding-top: 140px; }
}
.page-heading + .section { padding-top: 35px; }
.service-directory img { width: 100%; height: 260px; object-fit: cover; margin-bottom: 22px; }
.subpage-hero { position: relative; isolation: isolate; min-height: 420px; display: flex; align-items: center; color: white; background: #23282b; }
.subpage-hero > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.subpage-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#182126e8,#18212630); }
.subpage-hero h1 { font-size: clamp(2.5rem,5vw,5rem); max-width: 800px; }
.subpage-hero p { max-width: 500px; margin-top: 22px; }
