/* Candidate-only additions for generated service-area pages.
   Generated pages reuse service-pages.css for the corrected shared contract:
   62px desktop hero H1, centered eyebrow/heading blocks with centered text,
   centered-block left-aligned decks at the 52rem measure, contained
   high-contrast cards, and no full-bleed stripe rows.
   Nothing here applies to retained pages: every rule is scoped to
   body.service-area-page, which only generated service-area routes carry. */

/* Matrix card contract for these routes is 2 columns at desktop and tablet,
   1 at mobile, inside the centered 52rem measure. service-pages.css widens to
   3 columns at 64rem, so it is narrowed here rather than forked. */
body.service-area-page .service-card-grid { width: min(100%, 52rem); margin-inline: auto; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 42rem) {
  body.service-area-page .service-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 64rem) {
  body.service-area-page .service-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Service cards on these routes carry a linked heading; keep the link legible
   on the off-white card surface in every section tone. */
body.service-area-page .service-card h3 a { color: #11145c; text-decoration-thickness: 2px; text-underline-offset: .2rem; }
body.service-area-page .service-card h3 a:hover { color: #c90000; }
body.service-area-page .service-card h3 a:focus-visible { outline: 4px solid rgb(0 0 255 / .3); outline-offset: 4px; }

/* Coverage block: contained chips plus a readable availability note.
   Contained inside the 52rem measure, never a full-bleed stripe row. */
body.service-area-page .service-area-coverage { width: min(100%, 52rem); margin-inline: auto; }
body.service-area-page .service-area-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
body.service-area-page .service-area-chips li { border: 1px solid #d9d7ba; border-radius: 999px; background: #fffdf2; color: #20243a; padding: .45rem .85rem; font-family: 'Public Sans', sans-serif; font-size: .875rem; font-weight: 700; line-height: 1.3; }
body.service-area-page .service-section--ink .service-area-chips li { border-color: #343884; background: #171a42; color: #fffdf2; }
body.service-area-page .service-area-availability { max-width: 52rem; margin: 1.25rem auto 0; border-left: .25rem solid #ff0000; padding-left: 1.25rem; font-family: 'Public Sans', sans-serif; line-height: 1.7; text-align: left; }
body.service-area-page .service-section--ink .service-area-availability { color: #d8daf5; }

/* Industry cross-links: a contained labelled block, not an extra brief section. */
body.service-area-page .service-area-crosslinks { width: min(100%, 52rem); margin: 2rem auto 0; }
body.service-area-page .service-area-crosslinks h3 { margin: 0 0 .85rem; color: inherit; font-family: Sora, sans-serif; font-size: 1.1rem; line-height: 1.25; text-align: center; }
body.service-area-page .service-area-crosslinks ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem .9rem; margin: 0; padding: 0; list-style: none; }
body.service-area-page .service-area-crosslinks a { color: inherit; font: 700 .9375rem/1.4 'Public Sans', sans-serif; text-decoration-thickness: 2px; text-underline-offset: .25rem; }
body.service-area-page .service-area-crosslinks a:focus-visible { outline: 4px solid rgb(0 0 255 / .3); outline-offset: 4px; }

/* Generated-page-only route hooks. These render solely inside generated
   service-area pages; retained header, mobile navigation, footer, and the
   sitemap stay unchanged until a separate approved integration task. */
body.service-area-page .service-area-route-hook { width: min(100% - 2.5rem, 72rem); margin: 0 auto; }
body.service-area-page .service-area-route-hook ul { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin: 0; padding: 1rem 0; list-style: none; }
body.service-area-page .service-area-route-hook a { color: inherit; font: 700 .8125rem/1.35 'Public Sans', sans-serif; text-decoration-thickness: 2px; text-underline-offset: .25rem; }
body.service-area-page .service-area-route-hook a:focus-visible { outline: 4px solid rgb(0 0 255 / .3); outline-offset: 4px; }
body.service-area-page .service-area-route-hook--header { border-top: 1px solid #d9d7ba; background: #fff9cc; color: #171a42; }
body.service-area-page .service-area-route-hook--footer { border-top: 1px solid #343884; color: #d8daf5; }
body.service-area-page .service-area-route-hook--mobile { display: none; }
@media (max-width: 63.999rem) {
  body.service-area-page .service-area-route-hook--header { display: none; }
  body.service-area-page .service-area-route-hook--mobile { display: block; border-top: 1px solid #343884; background: #11145c; color: #fffdf2; }
}