/* Shared service switch: both services use the membership identity and shell. */
.service-bar { max-width: 1270px; margin: 0 auto; padding: 24px 42px 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.service-tabs { display: inline-flex; gap: 5px; padding: 5px; border: 1px solid #e0e7f3; border-radius: 18px; background: #fff; }
.service-tabs > button { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; min-width: 146px; padding: 10px 24px; border: 0; border-radius: 13px; background: transparent; color: #72819a; font-size: 14px; font-weight: 650; }
.service-tabs > button[aria-selected="true"] { background: var(--blue); color: #fff; box-shadow: 0 3px 8px #2455f51a; }
.service-tabs > button[aria-selected="false"]:hover { background: var(--blue-soft); color: var(--blue); }
.service-tabs > button:focus-visible { outline: 2px solid #2455f5; outline-offset: 3px; }
.service-tabs svg { width: 19px; height: 19px; }
.service-caption { color: #8996ab; font-size: 10px; letter-spacing: .16em; }
#service-panel:focus-visible { outline: 2px solid #91afff; outline-offset: 8px; border-radius: 12px; }
@media (max-width: 1050px) and (min-width: 768px) { .service-bar { padding-right: 28px; padding-left: 28px; } }
@media (max-width: 767px) {
 .service-bar { padding: 18px 22px 0; }
 .service-tabs { width: 100%; border-radius: 17px; }
 .service-tabs > button { flex: 1; min-width: 0; min-height: 44px; padding: 10px 12px; font-size: 14px; }
 .service-caption { display: none; }
 .node-service .bottom-nav { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 360px) { .service-bar { padding-left: 16px; padding-right: 16px; } }
