/* Shared SMS Services shell. Based on the current Receipts hero/nav; isolated from its catalog. */
.sms-services-hero-shell { max-width:1300px; margin:0 auto; padding:40px 24px 24px; }
.sms-page.sms-services-page { padding-top:0; }
.sms-services-hero { text-align:center; margin-bottom:0; }
.sms-services-title { font-size:42px; font-weight:900; margin-bottom:15px; display:flex; align-items:center; justify-content:center; gap:15px; color:var(--bp-text); }
.sms-services-icon { display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; background:linear-gradient(135deg, var(--bp-accent) 0%, #2d7cd6 100%); border-radius:var(--bp-radius); box-shadow:var(--bp-shadow-accent); }
.sms-services-icon svg { width:32px; height:32px; color:#fff; }
.sms-services-subtitle { color:var(--bp-text-secondary); font-size:18px; max-width:600px; margin:0 auto; line-height:1.6; }

/* Primary mode links use the Receipts underline and icon treatment. */
.sms-services-tabs {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:34px;
    width:auto;
    margin-top:30px;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
}
.sms-services-tab {
    position:relative;
    min-width:0;
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 2px 10px;
    border:0;
    border-radius:0;
    color:#777d84;
    font-size:0.9rem;
    line-height:1;
    font-weight:800;
    text-decoration:none;
    transition:color var(--bp-transition), transform var(--bp-transition);
}
.sms-services-tab::after {
    content:'';
    position:absolute;
    left:50%;
    bottom:0;
    width:0;
    height:2px;
    border-radius:999px;
    background:var(--bp-accent);
    transform:translateX(-50%);
    transition:width var(--bp-transition), opacity var(--bp-transition);
    opacity:0;
}
.sms-services-tab:hover {
    color:#dfe3e8;
    transform:translateY(-1px);
}
.sms-services-tab.active {
    color:#fff;
}
.sms-services-tab.active::after {
    width:100%;
    opacity:1;
}
.sms-services-tab-icon {
    width:18px;
    height:18px;
    flex:0 0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#6f757d;
    transition:color var(--bp-transition),transform var(--bp-transition);
}
.sms-services-tab-icon svg {
    width:18px;
    height:18px;
    display:block;
}
.sms-services-tab.active .sms-services-tab-icon,
.sms-services-tab:hover .sms-services-tab-icon {
    color:var(--bp-accent);
}
.sms-services-tab-label {
    white-space:nowrap;
}

.sms-services-tab:focus-visible { outline:2px solid var(--bp-accent); outline-offset:6px; border-radius:3px; }
@media (min-width:901px) {
    .sms-services-tabs { gap:40px; margin-top:30px; }
    .sms-services-tab { min-height:44px; font-size:.92rem; letter-spacing:.01em; }
}
@media (max-width:900px) {
    .sms-services-title { font-size:32px; }
    .sms-services-subtitle { font-size:16px; }
}
@media (max-width:600px) {
    .sms-services-hero-shell { padding:24px 16px; }
    .sms-services-title { font-size:26px; gap:10px; }
    .sms-services-icon { width:44px; height:44px; }
    .sms-services-icon svg { width:24px; height:24px; }
    .sms-services-subtitle { font-size:14px; }
    .sms-services-tabs { margin-top:22px; gap:24px; }
    .sms-services-tab { min-height:44px; padding-bottom:9px; gap:7px; font-size:.82rem; }
    .sms-services-tab-icon, .sms-services-tab-icon svg { width:17px; height:17px; flex-basis:17px; }
}

/* Same-origin route transitions keep the product hero steady. Normal links are the fallback. */
@view-transition { navigation:auto; }
.sms-services-hero { view-transition-name:sms-services-hero; }
.sms-services-workspace { view-transition-name:sms-services-workspace; }
::view-transition-old(root), ::view-transition-new(root),
::view-transition-old(sms-services-hero), ::view-transition-new(sms-services-hero) {
    animation:none; mix-blend-mode:normal;
}
::view-transition-group(sms-services-hero) { animation-duration:0s; }
::view-transition-group(sms-services-workspace) { animation-duration:160ms; }
::view-transition-old(sms-services-workspace), ::view-transition-new(sms-services-workspace) { animation-duration:160ms; }
@media (prefers-reduced-motion:reduce) {
    @view-transition { navigation:none; }
    .sms-services-tab, .sms-services-tab::after, .sms-services-tab-icon { transition:none; }
    .sms-services-tab:hover { transform:none; }
}
