/* Services page — layout & visual rhythm */

body.page-services {
    --svc-gap: 20px;
    --svc-radius: 18px;
}

body.page-services .section {
    padding: 88px 24px;
    position: relative;
}

body.page-services .page-hero {
    padding: 152px 24px 80px;
    text-align: center;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.page-services .page-hero-glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 70% 55% at 50% 0%, rgba(0, 153, 153, 0.18), transparent 52%),
        radial-gradient(ellipse 55% 45% at 85% 70%, rgba(51, 184, 184, 0.08), transparent 48%);
}

body.page-services .page-hero .section-container {
    position: relative;
    z-index: 1;
}

body.page-services .page-hero h1 {
    font-size: clamp(34px, 5vw, 56px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -0.03em;
}

body.page-services .page-hero-desc {
    font-size: 16px;
    line-height: 1.75;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

body.page-services .service-row {
    gap: 48px;
    align-items: center;
}

body.page-services .sr-img img {
    border-radius: var(--svc-radius);
}

@media (max-width: 768px) {
    body.page-services .section {
        padding: 64px 20px;
    }

    body.page-services .page-hero {
        padding: 128px 20px 56px;
    }

    body.page-services .service-row {
        gap: 28px;
    }
}