/* CODFIX v5.12.1 HF4 — Service detail hero typography + seamless homepage services */

/* Service detail pages: smaller, calmer hero title. */
.cfx510-detail-copy h1 {
    max-width: 19ch !important;
    margin-block: 14px 16px !important;
    font-size: clamp(2.15rem, 2.75vw, 2.85rem) !important;
    line-height: 1.42 !important;
    letter-spacing: -0.02em !important;
    text-wrap: balance;
}

[dir="rtl"] .cfx510-detail-copy h1,
[lang="ar"] .cfx510-detail-copy h1 {
    max-width: 21ch !important;
    font-size: clamp(2.05rem, 2.6vw, 2.7rem) !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
    word-spacing: .035em;
}

/* Service hero description: intentionally larger and easier to read. */
.cfx510-detail-copy > p {
    max-width: 62ch !important;
    margin-top: 0 !important;
    font-size: clamp(1.12rem, 1.28vw, 1.28rem) !important;
    line-height: 2.05 !important;
    color: var(--cfx5120-text-color, #344054) !important;
}

html[data-theme="dark"] .cfx510-detail-copy > p {
    color: #c2ccda !important;
}

/* Homepage services: inherit the page background instead of creating a separate panel. */
.cfx33-services-section,
html[data-theme="dark"] .cfx33-services-section {
    background: transparent !important;
}

.cfx33-services-section::before {
    display: none !important;
    content: none !important;
}

/* Remove large section-only decorative shapes so the block blends into the homepage. */
.cfx33-services-decoration {
    display: none !important;
}

.cfx33-services-section {
    padding-block: 88px !important;
}

.cfx33-services-heading {
    margin-bottom: 38px !important;
}

.cfx33-services-heading p {
    max-width: 720px !important;
    font-size: 1.04rem !important;
    line-height: 2 !important;
}

.cfx33-service-description {
    font-size: .94rem !important;
    line-height: 1.95 !important;
}

.cfx33-service-link {
    font-size: .82rem !important;
}

/* Keep cards readable while the section itself remains visually seamless. */
html:not([data-theme="dark"]) .cfx33-service-card {
    background: #ffffff !important;
}

html[data-theme="dark"] .cfx33-service-card {
    background: #101827 !important;
}

@media (max-width: 760px) {
    .cfx510-detail-copy h1,
    [dir="rtl"] .cfx510-detail-copy h1,
    [lang="ar"] .cfx510-detail-copy h1 {
        max-width: 100% !important;
        font-size: clamp(1.85rem, 7.4vw, 2.35rem) !important;
        line-height: 1.55 !important;
    }

    .cfx510-detail-copy > p {
        font-size: 1.06rem !important;
        line-height: 2 !important;
    }

    .cfx33-services-section {
        padding-block: 68px !important;
    }

    .cfx33-services-heading p {
        font-size: 1rem !important;
    }
}