/* Detailing uses the shared typography, bands, rules and service actions. */
.detailing-page section[id] { scroll-margin-top: 24px; }
.detailing-page em { color: var(--gold); font-style: normal; }
.detail-head h1 { font-size: var(--t-3xl); max-width: 24ch; }
.detail-head .label { font: 500 var(--t-xs)/1.5 var(--f-mono); letter-spacing: .14em; color: var(--gold); }
.detailing-page .actions { align-items: center; }
.detail-head .actions { margin-top: 12px; }
.detail-index { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 32px; border-top: 1px solid var(--band-rule); }
.detail-index a { display: flex; align-items: center; gap: 16px; padding: 18px 0; min-height: 56px; border-bottom: 1px solid var(--band-rule); text-decoration: none; font-size: var(--t-sm); }
.detail-index a:hover { color: var(--gold); }
.detail-index span { color: var(--gold); font: 400 var(--t-xs)/1 var(--f-mono); }
.detail-services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; margin-top: 36px; }
.detail-services article { border-top: 1px solid var(--rule); padding-block: 24px; }
.detail-services h3 { font-size: var(--t-lg); }
.detail-services p { color: var(--muted); font-size: var(--t-md); margin-top: 12px; }
.detail-services .detail-fit { color: var(--gold-ink); font-size: var(--t-xs); line-height: 1.6; }
.detail-services a { text-underline-offset: 4px; }
.detailing-page .band .intro { color: var(--band-muted); }
.detailing-page .band .link-arrow { color: var(--band-ink); }
.detailing-page .band .link-arrow:hover { color: var(--gold); }
.detail-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; list-style: none; margin: 36px 0 0; padding: 0; }
.detail-steps li { display: grid; min-width: 0; align-content: start; gap: 16px; padding-block: 24px; border-top: 1px solid var(--band-rule); }
.detail-steps span { font: 400 var(--t-xs)/1 var(--f-mono); color: var(--gold); }
.detail-steps h3 { font-size: var(--t-lg); line-height: 1.25; overflow-wrap: anywhere; }
.detail-note { color: var(--band-muted); font-size: var(--t-sm); margin-top: 24px; max-width: 68ch; }
.detail-list { margin-top: 28px; }
.detail-close { border-bottom: 1px solid var(--band-rule); }
@media (max-width: 760px) {
  .detail-index { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
}
@media (max-width: 560px) {
  .detail-services { grid-template-columns: 1fr; }
  .detail-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
  .detailing-page .actions { align-items: flex-start; flex-direction: column; }
  .detailing-page .actions .link-arrow { padding-block: 10px; }
}
@media (max-width: 360px) {
  .detail-steps { grid-template-columns: 1fr; }
}