/* Services Pages */
.services-hero {
    text-align: center;
    background-color: var(--bg-surface);
    padding-top: calc(var(--space-4xl) + 80px);
    padding-bottom: var(--space-4xl);

    h1 {
        font-size: clamp(2.5em, 5vw, 4em);
        color: var(--primary);
        margin-bottom: var(--space-md);
    }

    p {
        font-size: 1.2em;
        color: var(--text-muted);
        max-inline-size: 700px;
        margin-inline: auto;
    }
}

.services-list {
    display: flex;
    gap: var(--space-4xl);
    flex-flow: column nowrap;
    padding-block: var(--space-4xl);
}

.service-row {
    display: grid;
    gap: var(--space-3xl);
    place-items: center;
    grid-template-columns: 1fr;

    @media (min-width: 900px) {
        grid-template-columns: 1fr 1fr;

        &:nth-child(even) .service-content {
            order: -1;
        }
    }
}

.service-image {
    overflow: hidden;
    box-shadow: var(--shadow-md);
    border-radius: var(--radius-lg);

    img {
        object-fit: cover;
        inline-size: 100%;
        block-size: auto;
    }
}

.service-content {
    h2 {
        font-size: 2em;
        color: var(--primary);
        margin-bottom: var(--space-sm);
    }

    > p {
        font-size: 1.1em;
        color: var(--text-muted);
        margin-bottom: var(--space-lg);
    }

    ul {
        color: var(--text-muted);
        list-style: disc;
        padding-left: var(--space-md);
        margin-bottom: var(--space-lg);
    }
}