@layer service {
  .service-page { background: var(--sab-color-ivory); }
  .service-hero { background: var(--sab-color-blush); padding-block: clamp(3rem, 8vw, 6rem); text-align: center; }
  .service-hero p { color: var(--sab-color-mauve); font-size: .72rem; font-weight: 750; letter-spacing: .15em; }
  .service-hero h1 { max-inline-size: 52rem; margin: 0 auto; font-family: Georgia, var(--sab-font-arabic), serif; font-weight: 500; }
  .service-layout { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: clamp(2rem, 7vw, 7rem); padding-block: var(--sab-space-6); }
  .service-content { max-inline-size: var(--sab-reading); }
  .service-content .service-lead { color: var(--sab-color-aubergine); font-size: var(--sab-step-1); line-height: 1.45; }
  .service-content h2 { margin-block-start: var(--sab-space-5); font-size: var(--sab-step-1); }
  .service-content a { overflow-wrap: anywhere; }
  .service-content details { border-block-end: 1px solid rgb(50 26 61 / 13%); padding-block: var(--sab-space-3); }
  .service-content summary { color: var(--sab-color-aubergine); font-weight: 700; cursor: pointer; }
  .service-content details p { padding-block-start: .7rem; color: var(--sab-color-muted); }
  .service-table-wrap { overflow-x: auto; }
  .service-content table { inline-size: 100%; border-collapse: collapse; }
  .service-content th, .service-content td { border-block-end: 1px solid rgb(50 26 61 / 12%); padding: .75rem; text-align: start; }
  .service-contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
  .service-contact-grid > div { background: white; padding: var(--sab-space-3); }
  .service-contact-grid h2 { margin-block-start: 0; font-size: 1rem; }
  .service-review-notice { border-inline-start: 4px solid #b4935a; background: #fff8e8; padding: var(--sab-space-3); }
  .service-aside { align-self: start; position: sticky; inset-block-start: 7.5rem; background: white; box-shadow: var(--sab-shadow-soft); padding: var(--sab-space-4); }
  .service-aside h2 { font-size: var(--sab-step-1); }
  .service-aside p, .service-aside address { color: var(--sab-color-muted); font-size: .82rem; }
  .service-aside .button { display: block; margin-block: var(--sab-space-3); text-align: center; }
  .service-aside address { border-block-start: 1px solid rgb(50 26 61 / 10%); padding-block-start: var(--sab-space-3); font-style: normal; }
}
@media (max-width: 50rem) {
  .service-layout { grid-template-columns: 1fr; }
  .service-aside { position: static; }
  .service-contact-grid { grid-template-columns: 1fr; }
}
