/* Local service page, using the existing SILIQ palette and shared navigation. */
.local-hero { padding: 120px 0 80px; background: var(--surface); }
.local-breadcrumb { display: flex; flex-wrap: wrap; gap: 12px; font-size: 13px; color: var(--text-light); margin-bottom: 40px; }
.local-breadcrumb a { text-decoration: underline; text-underline-offset: 4px; }
.local-hero-grid { display: grid; grid-template-columns: 1.3fr .7fr; align-items: center; gap: 80px; }
.local-service-page h1 { font-size: clamp(32px, 3.6vw, 54px); line-height: 1.35; letter-spacing: -.04em; color: var(--ink); margin: 20px 0 26px; }
.local-service-page h1 span { color: var(--accent-dark); }
.local-lead { font-size: 17px; line-height: 1.95; color: var(--text-light); max-width: 640px; }
.local-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 30px; }
.local-hero-photo { background: var(--ink); border-radius: 16px; overflow: hidden; transform: rotate(2deg); }
.local-hero-photo img { display: block; width: 100%; height: 410px; object-fit: cover; object-position: center 38%; }
.local-hero-photo figcaption { padding: 22px; color: white; font-size: 14px; line-height: 1.8; }
.local-hero-photo figcaption span { color: var(--accent-light); font-size: 12px; }
.local-section { padding: 88px 0; }
.local-tint { background: var(--surface); }
.local-service-page h2 { font-size: clamp(26px, 2.6vw, 38px); line-height: 1.5; letter-spacing: -.03em; color: var(--ink); margin: 12px 0 24px; }
.local-service-page h3 { color: var(--ink); font-size: 21px; margin-bottom: 12px; }
.local-section p, .local-section li { line-height: 1.9; }
.local-split { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; }
.local-list { list-style: none; }
.local-list li { padding: 20px 0; border-bottom: 1px solid var(--hairline); }
.local-service-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 48px; }
.local-service-grid article { padding: 28px 0; border-top: 1px solid var(--hairline); }
.local-number { display: block; font-family: var(--font-en); color: var(--accent); margin-bottom: 12px; }
.local-note { color: var(--text-light); font-size: 14px; margin-top: 26px; }
.local-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 24px; }
.local-work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.local-work { min-width: 0; }
.local-work img { width: 100%; height: 340px; object-fit: cover; object-position: center 35%; border-radius: 12px; }
.local-work .eyebrow { display: block; font-size: 12px; margin: 20px 0 8px; }
.local-work p { color: var(--text-light); margin-bottom: 18px; }
.local-work a:hover h3 { text-decoration: underline; text-underline-offset: 5px; }
.local-steps { list-style: decimal-leading-zero; padding-left: 30px; }
.local-steps li { padding: 0 0 28px 14px; }
.local-steps li::marker { color: var(--accent); font-family: var(--font-en); }
.local-faq { max-width: 1000px; }
.local-faq details { border-bottom: 1px solid var(--hairline); padding: 22px 0; }
.local-faq summary { cursor: pointer; font-weight: 500; color: var(--ink); font-size: 18px; padding-right: 16px; }
.local-faq details p { padding-top: 16px; color: var(--text-light); }
.local-faq details a { text-decoration: underline; }
.local-contact { text-align: center; }
.local-contact .btn { margin-top: 26px; }
.local-work-grid { grid-template-columns: 1fr; gap: 32px; }
.local-work { display: grid; grid-template-columns: .9fr 1.1fr; gap: 40px; padding-bottom: 32px; border-bottom: 1px solid var(--hairline); }
.local-work .work-analysis { align-self: center; }
.local-work img { object-fit: contain; background: var(--surface); }
@media (max-width: 1000px) {
  .local-hero-grid, .local-split { gap: 40px; }
  .local-work-grid { gap: 20px; }
}
@media (max-width: 700px) {
  .local-hero { padding: 96px 0 48px; }
  .local-breadcrumb { margin-bottom: 28px; }
  .local-hero-grid, .local-split, .local-service-grid, .local-work-grid { grid-template-columns: 1fr; gap: 24px; }
  .local-hero-photo { transform: none; margin-top: 12px; }
  .local-hero-photo img { height: 310px; }
  .local-section { padding: 52px 0; }
  .local-lead { font-size: 16px; }
  .local-service-grid { gap: 0; }
  .local-work-grid { gap: 38px; }
  .local-work { grid-template-columns: 1fr; gap: 0; }
  .local-work img { height: 360px; }
  .local-actions { gap: 20px; }
  .local-actions .btn { padding-inline: 18px; }
}
