.services-directory{margin-top:8px}.service-category-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 34px;padding:7px;border:1px solid rgba(15,35,65,.12);border-radius:16px;background:rgba(255,255,255,.7)}.service-category-tab{appearance:none;border:0;background:transparent;color:inherit;padding:13px 18px;border-radius:11px;font:600 14px/1.2 Inter,system-ui,sans-serif;cursor:pointer;transition:.2s ease;min-height:44px}.service-category-tab:hover{background:rgba(20,90,150,.08)}.service-category-tab.active{background:#0a315e;color:#fff;box-shadow:0 5px 18px rgba(4,23,53,.12)}.service-category-intro{max-width:760px;margin:0 0 28px}.service-category-intro h2{margin:.35rem 0 .65rem}.service-category-panel{display:none}.service-category-panel.active{display:block}.service-category-panel .service-block{margin-bottom:22px}.service-category-panel .service-block:last-child{margin-bottom:0}
@media (max-width:700px){.service-category-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-bottom:24px}.service-category-tabs::-webkit-scrollbar{display:none}.service-category-tab{white-space:nowrap;padding:12px 15px}.service-category-intro h2{font-size:1.55rem}.service-category-intro{margin-bottom:20px}}
@media (prefers-color-scheme:dark){.service-category-tabs{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.13)}.service-category-tab:hover{background:rgba(255,255,255,.08)}.service-category-tab.active{background:#1b6ca8;color:#fff}}
body.dark-mode .service-category-tabs,.dark .service-category-tabs{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.13)}body.dark-mode .service-category-tab:hover,.dark .service-category-tab:hover{background:rgba(255,255,255,.08)}body.dark-mode .service-category-tab.active,.dark .service-category-tab.active{background:#1b6ca8;color:#fff}
/* Dark-mode readability for service category labels */
@media (prefers-color-scheme: dark){.service-category-tab{color:#f1f5f9}.service-category-tab:not(.active){color:#f1f5f9}.service-category-tab.active{color:#fff}}
body.dark-mode .service-category-tab,.dark .service-category-tab{color:#f1f5f9}body.dark-mode .service-category-tab:not(.active),.dark .service-category-tab:not(.active){color:#f1f5f9}body.dark-mode .service-category-tab.active,.dark .service-category-tab.active{color:#fff}

/* Dark-mode service controls — high-contrast, clearly clickable */
html[data-theme="dark"] .service-category-tabs{
  background:#0b1d3b;
  border-color:#29466f;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}
html[data-theme="dark"] .service-category-tab{
  color:#eaf2ff;
  background:#10284f;
  border:1px solid #36567f;
}
html[data-theme="dark"] .service-category-tab:hover{
  background:#17365f;
  color:#fff;
  border-color:#5b8ed0;
}
html[data-theme="dark"] .service-category-tab.active{
  background:linear-gradient(135deg,#1d6fb2,#258cc9);
  color:#fff;
  border-color:#5ca8e0;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
}
html[data-theme="dark"] .service-category-tab:focus-visible{
  outline:3px solid rgba(119,190,255,.7);
  outline-offset:2px;
}