/* Only /services/ loads this stylesheet. */
.services-ui { display: block; padding-top: 12px; }
.services-ui [hidden] { display: none !important; }
.services-ui h1 { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.35; margin: 12px 0 8px; }
.services-ui .service-intro { margin: 0 0 8px; }
.services-ui .service-policy { font-size: .8rem; color: var(--muted); margin: 6px 0; }
.services-ui .service-policy b { color: var(--cyan); }
.services-ui .compare-tabs { margin: 14px 0 8px; }
.services-ui .compare-tabs button { min-height: 44px; }
.services-ui .service-counts { font-size: .76rem; color: var(--muted); margin: 0 0 10px; }
.services-ui .service-diagnosis { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; margin-bottom: 16px; }
.services-ui .service-diagnosis p { margin: 0; font-size: .8rem; flex: 1 1 220px; }
.services-ui .service-diagnosis a { min-height: 44px; display: inline-flex; align-items: center; color: var(--cyan); }
.services-ui .comparison-row small { display: block; }
.services-ui .comparison-row em { font-style: normal; }
.services-ui .comparison-row a { color: var(--cyan); }
.services-ui .comparison-row details { margin-top: 6px; font-size: .8rem; }
.services-ui summary { cursor: pointer; }
.services-ui .comparison-row summary { min-height: 44px; display: grid; align-content: center; }
.services-ui .comparison-row.actions span { padding: 4px; }
.services-ui .comparison-row.actions a { padding: 8px; min-height: 44px; display: grid; align-content: center; }
.services-ui .service-scroll-hint { font-size: .75rem; color: var(--muted); margin: 12px 0 8px; }
.services-ui .service-catalog { margin: 18px 0; }
.services-ui .service-catalog a { color: var(--cyan); min-height: 44px; display: grid; align-content: center; }
.services-ui .service-catalog small { overflow-wrap: anywhere; }
.services-ui .catalog-category { color: var(--cyan); font-size: .75rem; }
.services-ui .catalog-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.services-ui .catalog-more { margin-top: 12px; }
.services-ui .catalog-more summary { padding: 12px 0; min-height: 44px; }
.services-ui .service-related { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 7px; }
.services-ui .service-related h2 { font-size: 1.15rem; }
.services-ui .service-related p { font-size: .85rem; }
.services-ui .service-related a { color: var(--cyan); }
.services-ui .service-related ul { padding-left: 20px; }
.services-ui:not(.service-ready) .compare-tabs { display: none; }
.services-ui .service-candidates { display: none; margin: 16px 0; }
.services-ui .service-candidates.is-open { display: block; }
.services-ui .service-candidates h2, .services-ui .service-pair h2 { font-size: 1.2rem; margin: 0 0 8px; }
.services-ui .candidate-guidance, .services-ui .candidate-owner-note { font-size: .8rem; color: var(--muted); margin: 6px 0 12px; }
.services-ui .candidate-owner-note { border-left: 2px solid var(--cyan); padding-left: 10px; }
.services-ui .candidate-coverage { font-size: .75rem; color: var(--muted); line-height: 1.6; margin: 6px 0 12px; }
.services-ui .candidate-grid { display: grid; gap: 10px; }
.services-ui .service-candidate { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: rgba(8,19,32,.9); }
.services-ui .service-candidate.is-selected { border-color: var(--cyan); }
.services-ui .candidate-title { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.services-ui .candidate-title h3 { font-size: 1.05rem; margin: 0; }
.services-ui .candidate-title span { font-size: .7rem; color: var(--magenta); }
.services-ui .candidate-focus { font-size: .75rem; color: var(--muted); margin: 4px 0 8px; }
.services-ui .service-candidate dl { margin: 0; font-size: .82rem; }
.services-ui .service-candidate dl > div { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 8px; margin: 4px 0; }
.services-ui .service-candidate dt { color: var(--muted); }
.services-ui .service-candidate dd { margin: 0; overflow-wrap: anywhere; }
.services-ui .service-candidate dd small { color: var(--muted); }
.services-ui .candidate-actions, .services-ui .selection-actions, .services-ui .pair-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.services-ui button:not([role=tab]), .services-ui .candidate-actions a, .services-ui .pair-actions a { min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 5px; color: var(--cyan); background: #081320; font: inherit; font-size: .85rem; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.services-ui button[aria-pressed=true] { border-color: var(--cyan); background: rgba(35,227,223,.12); }
.services-ui button:disabled { opacity: .5; cursor: default; }
.services-ui button:focus-visible, .services-ui a:focus-visible, .services-ui summary:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
.services-ui .candidate-more { margin-top: 12px; width: 100%; }
.services-ui .comparison-selection { margin-top: 12px; border: 1px solid var(--line); padding: 12px; border-radius: 7px; }
.services-ui .comparison-selection p { font-size: .85rem; margin: 0 0 6px; }
.services-ui [data-selection-list] { display: flex; flex-wrap: wrap; gap: 6px; }
.services-ui .service-pair { border: 1px solid var(--cyan); border-radius: 7px; padding: 12px; margin: 16px 0; scroll-margin-top: 12px; }
.services-ui [data-pair-region] h2 { scroll-margin-top: 100px; }
.services-ui .pair-coverage { color: var(--muted); font-size: .75rem; line-height: 1.6; }
.services-ui .pair-table { border-collapse: collapse; table-layout: fixed; width: 100%; min-width: 0; margin-top: 10px; font-size: .85rem; }
.services-ui .pair-table th, .services-ui .pair-table td { border: 1px solid var(--line); padding: 8px; overflow-wrap: anywhere; vertical-align: top; }
.services-ui .pair-table th:first-child { width: 20%; }
.services-ui .pair-table thead th { color: var(--cyan); background: #081320; }
.services-ui .pair-table thead small, .services-ui .pair-table td small { display: block; font-size: .75rem; color: var(--muted); margin-top: 4px; }
.services-ui .pair-table a { color: var(--cyan); display: inline-flex; align-items: center; min-height: 44px; }
.services-ui .pair-table details summary { min-height: 44px; padding: 8px 0; }
.services-ui [data-pair-extra] > summary, .services-ui .all-services > summary { padding: 12px 0; min-height: 44px; color: var(--cyan); }
.services-ui .all-services { margin: 16px 0; }
.services-ui .all-services > summary { font-weight: 800; }
.services-ui .all-services .comparison-table-panel { margin-top: 8px; }
@media(min-width:721px) {
  .services-ui .all-services > summary { display: none; }
}
@media(max-width: 720px) {
  .services-ui .service-candidates { display: block; }
  .services-ui .pair-table { font-size: .8rem; }
  .services-ui .pair-table th, .services-ui .pair-table td { padding: 6px; }
  .services-ui .pair-table th:first-child { width: 23%; }
  .services-ui .comparison-table-panel { padding: 10px; }
  .services-ui .comparison-table { --comparison-label-width: 100px; }
  .services-ui .comparison-row > * { padding: 8px; font-size: .85rem; }
  .services-ui .catalog-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .services-ui .service-diagnosis { padding: 8px 10px; margin-bottom: 12px; }
}