/* ─── SERVICES PAGE ───────────────────────────────────────────── */
.page-hero {
    /* height: 100dvh; */
    background-image: url('/imgs/bg/servers.jpg');
}

.service-bullets {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.service-bullets li {
    font-size: 14px;
    color: #4a5060;
    padding-left: 20px;
    position: relative;
    line-height: 1.5;
}

.service-bullets li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 8px;
    height: 2px;
    background: var(--c-cyan);
}

/* ─── SERVICE CATEGORY PAGES (/services/<slug>) ───────────────── */
.svc-intro {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 56px;
    align-items: start;
}

.svc-intro .section-body { font-size: 17px; margin: 0; }

.svc-toc {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 28px;
    border-left: 1px solid var(--border-dark);
}

.svc-toc a {
    font-size: 15px;
    font-weight: 600;
    color: #0f1923;
    transition: color 160ms ease;
}

.svc-toc a:hover { color: var(--c-blue); }

/* Anchor targets sit below the fixed topbar */
.svc-sub { padding: 64px 0; scroll-margin-top: 64px; }

.svc-sub-inner {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 56px;
    align-items: start;
}

.svc-sub .section-heading { margin: 0; }
.svc-sub .section-body { margin: 0; }

.svc-others {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.svc-other {
    padding: 12px 18px;
    border: 1px solid var(--border-dark);
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    color: #0f1923;
    transition: border-color 160ms ease, color 160ms ease;
}

.svc-other:hover { border-color: var(--c-blue); color: var(--c-blue); }

.read-more {
    display: inline-block;
    margin-top: 24px;
    font-size: 14px;
    font-weight: 650;
    color: var(--c-blue);
}

.read-more:hover { color: var(--c-blue-dark); }

@media (max-width: 900px) {
    .svc-intro,
    .svc-sub-inner { grid-template-columns: 1fr; gap: 20px; }
    .svc-toc { padding-left: 0; border-left: none; }
    .svc-sub { padding: 48px 0; }
}