/* Services responsive overrides */
body.services-page {
    overflow-x: hidden;
}

body.services-page img,
body.services-page svg {
    max-width: 100%;
    height: auto;
}

/* Campaign page overrides */
@media (max-width: 1024px) {
    .campaign-hero {
        padding: 72px 32px;
    }

    .campaign-hero .hero-description {
        width: 100%;
        max-width: 720px;
    }

    .campaign-info-section {
        padding: 56px 32px;
        flex-direction: column;
        align-items: stretch;
    }

    .campaign-info-card {
        min-width: 0;
        width: 100%;
    }

    .campaign-who-section,
    .campaign-content-section,
    .campaign-process-section,
    .campaign-deliverables-section,
    .campaign-why-section,
    .campaign-pricing-section {
        padding: 72px 32px;
    }

    .campaign-content-section .content-columns {
        gap: 28px;
    }

    .campaign-content-section .content-column,
    .campaign-deliverables-section .deliverables-list,
    .campaign-deliverables-section .deliverables-info {
        width: 100%;
    }

    .campaign-deliverables-section .deliverables-container,
    .campaign-process-section .process-timeline {
        flex-direction: column;
        align-items: stretch;
    }

    .campaign-process-section .process-step {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .campaign-hero {
        padding: 56px 20px;
        gap: 16px;
    }

    .campaign-hero .hero-title {
        font-size: 30px;
        line-height: 1.25;
    }

    .campaign-hero .hero-description {
        font-size: 18px;
        line-height: 1.6;
    }

    .campaign-info-card h3 {
        font-size: 24px;
    }

    .campaign-info-card p,
    .campaign-info-list-item span {
        font-size: 16px;
    }

    .campaign-who-section,
    .campaign-content-section,
    .campaign-process-section,
    .campaign-deliverables-section,
    .campaign-why-section,
    .campaign-pricing-section {
        padding: 64px 20px;
    }

    .campaign-content-section .content-columns {
        flex-direction: column;
    }

    .campaign-content-section .content-column {
        padding: 24px;
    }

    .campaign-content-section .content-column-title {
        font-size: 22px;
    }

    .campaign-content-section .content-item-text {
        font-size: 16px;
    }

    .campaign-process-section .process-title,
    .campaign-deliverables-section .deliverables-title,
    .campaign-pricing-section .pricing-title,
    .campaign-why-section .why-title {
        font-size: 26px;
    }

    .campaign-pricing-section .pricing-cta-link {
        max-width: 100%;
        text-align: center;
        white-space: normal;
        line-height: 1.4;
        padding: 12px 18px;
        display: inline-flex;
        justify-content: center;
    }

    .campaign-who-section .who-card-icon {
        width: 52px;
        height: 52px;
    }

    .campaign-who-section .who-item-icon {
        width: 18px;
        height: 18px;
        border-right-width: 2px;
        border-bottom-width: 2px;
    }
}

@media (max-width: 576px) {
    .campaign-hero .hero-title {
        font-size: 26px;
    }

    .campaign-info-section {
        padding: 48px 16px;
    }

    .campaign-info-card {
        padding: 24px;
    }

    .campaign-content-section .content-column {
        padding: 20px;
    }

    .campaign-info-list-item .icon,
    .campaign-content-section .content-item-icon,
    .campaign-process-section .step-icon,
    .campaign-deliverables-section .deliverable-icon,
    .campaign-who-section .who-item-icon,
    .campaign-why-section .why-item-icon {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }

    .campaign-who-section .who-item-icon {
        width: 16px;
        height: 16px;
        border-right-width: 2px;
        border-bottom-width: 2px;
    }

    .campaign-who-section .who-card-icon {
        width: 44px;
        height: 44px;
    }

    .campaign-pricing-section .pricing-item {
        align-items: flex-start;
    }

    .campaign-pricing-section .pricing-item-text {
        font-size: 15px;
    }

    .campaign-pricing-section .pricing-cta-link {
        width: 100%;
    }
}

/* Bundles page overrides */
@media (max-width: 992px) {
    .bundles-page .bundles-container {
        padding: 0 20px;
    }

    .bundles-page .bundle-comparison__grid,
    .bundles-page .bundle-benefits__grid,
    .bundles-page .bundle-benefits__marketing-grid,
    .bundles-page .bundle-receives__grid,
    .bundles-page .bundle-performance__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {

    .bundles-page .bundle-overview__title,
    .bundles-page .bundle-comparison__title,
    .bundles-page .bundle-receives__title,
    .bundles-page .bundle-benefits__title,
    .bundles-page .bundle-performance__title,
    .bundles-page .bundle-why__title {
        font-size: 28px;
    }

    .bundles-page .bundle-overview__subtitle,
    .bundles-page .bundle-overview__description,
    .bundles-page .bundle-comparison__subtitle,
    .bundles-page .bundle-receives__subtitle,
    .bundles-page .bundle-performance__subtitle {
        font-size: 16px;
    }

    .bundles-page .bundle-overview__grid,
    .bundles-page .bundle-receives__grid,
    .bundles-page .bundle-benefits__panel {
        grid-template-columns: 1fr;
    }

    .bundles-page .bundle-why__card,
    .bundles-page .bundle-cta__card {
        padding: 28px 20px;
    }
}

@media (max-width: 576px) {

    .bundles-page .bundle-card__icon,
    .bundles-page .bundle-extra__icon,
    .bundles-page .bundle-receive-card__icon,
    .bundles-page .bundle-benefit-item__icon,
    .bundles-page .bundle-marketing-card__icon,
    .bundles-page .bundle-why__icon {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
}

/* Packages (service-template) overrides */
@media (max-width: 768px) {
    .service-template section.section {
        padding: 32px 0;
    }

    .package-pricing__card {
        padding: 28px 20px !important;
    }

    .package-pricing__right-card {
        padding: 32px 20px !important;
    }

    .package-pricing__card a,
    .package-pricing__right-card a {
        display: inline-flex;
        justify-content: center;
        text-align: center;
        white-space: normal;
        line-height: 1.4;
        max-width: 100%;
    }
}

@media (max-width: 576px) {

    .package-pricing__card a,
    .package-pricing__right-card a {
        width: 100%;
    }
}

/* =======================
   Services Typography Scale
   ======================= */
body.services-page {
    --svc-hero: clamp(30px, 4.8vw, 46px);
    --svc-h1: clamp(28px, 4.2vw, 40px);
    --svc-h2: clamp(24px, 3.4vw, 34px);
    --svc-h3: clamp(18px, 2.6vw, 24px);
    --svc-subtitle: clamp(16px, 2.2vw, 20px);
    --svc-body: clamp(14px, 2vw, 18px);
    --svc-small: clamp(12px, 1.6vw, 14px);
    --svc-line: 1.55;
    --svc-heading-weight: 700;
    --svc-subtitle-weight: 600;
    --svc-body-weight: 400;
}

body.services-page .campaign-service,
body.services-page .bundles-page,
body.services-page .service-template {
    font-family: var(--services-font-en) !important;
}

html[lang="ar"] body.services-page .campaign-service,
html[lang="ar"] body.services-page .bundles-page,
html[lang="ar"] body.services-page .service-template {
    font-family: var(--services-font-ar) !important;
}

body.services-page h1,
body.services-page h2,
body.services-page h3,
body.services-page h4,
body.services-page .section-title {
    font-weight: var(--svc-heading-weight) !important;
    line-height: var(--svc-line) !important;
    letter-spacing: -0.2px;
}

body.services-page p,
body.services-page li,
body.services-page span,
body.services-page small {
    font-size: var(--svc-body);
    line-height: 1.7;
}

body.services-page .svc-hero {
    font-size: var(--svc-hero) !important;
    font-weight: var(--svc-heading-weight) !important;
    line-height: 1.2 !important;
}

body.services-page .svc-title {
    font-size: var(--svc-h2) !important;
    font-weight: var(--svc-heading-weight) !important;
    line-height: 1.25 !important;
}

body.services-page .svc-subtitle {
    font-size: var(--svc-subtitle) !important;
    font-weight: var(--svc-subtitle-weight) !important;
    line-height: 1.5 !important;
}

body.services-page .svc-body {
    font-size: var(--svc-body) !important;
    font-weight: var(--svc-body-weight) !important;
    line-height: 1.7 !important;
}

body.services-page .svc-small {
    font-size: var(--svc-small) !important;
    font-weight: var(--svc-body-weight) !important;
    line-height: 1.6 !important;
}

body.services-page .svc-subtitle-strong {
    font-weight: 700 !important;
}

/* Campaign page typography overrides */
body.services-page .campaign-service .hero-title {
    font-size: var(--svc-hero) !important;
    line-height: 1.2 !important;
}

body.services-page .campaign-service .hero-description {
    font-size: var(--svc-subtitle) !important;
}

body.services-page .campaign-service .content-section-title,
body.services-page .campaign-service .process-title,
body.services-page .campaign-service .deliverables-title,
body.services-page .campaign-service .pricing-title,
body.services-page .campaign-service .why-title,
body.services-page .campaign-service .who-section-title {
    font-size: var(--svc-h2) !important;
    line-height: 1.25 !important;
}

body.services-page .campaign-service .campaign-info-card h3,
body.services-page .campaign-service .content-column-title,
body.services-page .campaign-service .step-label,
body.services-page .campaign-service .deliverables-badge-text {
    font-size: var(--svc-h3) !important;
}

body.services-page .campaign-service .campaign-info-card p,
body.services-page .campaign-service .campaign-info-list-item span,
body.services-page .campaign-service .content-item-text,
body.services-page .campaign-service .step-description,
body.services-page .campaign-service .deliverables-description,
body.services-page .campaign-service .pricing-item-text,
body.services-page .campaign-service .why-item-description {
    font-size: var(--svc-body) !important;
}

body.services-page .campaign-service .deliverable-title,
body.services-page .campaign-service .why-item-title,
body.services-page .campaign-service .content-section-label {
    font-size: var(--svc-h3) !important;
    line-height: 1.4 !important;
}

body.services-page .campaign-service .deliverable-subtitle,
body.services-page .campaign-service .why-description,
body.services-page .campaign-service .why-trust-badge-text,
body.services-page .campaign-service .pricing-item-highlight {
    font-size: var(--svc-body) !important;
}

body.services-page .campaign-service .who-item-text {
    font-size: var(--svc-body) !important;
    line-height: 1.6 !important;
}

body.services-page .campaign-service .who-item-text .highlight {
    font-size: var(--svc-h3) !important;
    font-weight: 700 !important;
}

body.services-page .campaign-service .transparency-percent {
    font-size: var(--svc-h1) !important;
    line-height: 1.1 !important;
}

body.services-page .campaign-service .transparency-title {
    font-size: var(--svc-h3) !important;
}

body.services-page .campaign-service .transparency-desc,
body.services-page .campaign-service .pricing-cta-link {
    font-size: var(--svc-body) !important;
}

body.services-page .campaign-service h1 {
    font-size: var(--svc-hero) !important;
    line-height: 1.2 !important;
}

body.services-page .campaign-service h2 {
    font-size: var(--svc-h2) !important;
    line-height: 1.25 !important;
}

body.services-page .campaign-service h3,
body.services-page .campaign-service h4 {
    font-size: var(--svc-h3) !important;
    line-height: 1.4 !important;
}

body.services-page .campaign-service p {
    font-size: var(--svc-body) !important;
    line-height: 1.7 !important;
}

/* Bundles page typography overrides */
body.services-page .bundles-page .bundle-overview__title,
body.services-page .bundles-page .bundle-comparison__title,
body.services-page .bundles-page .bundle-receives__title,
body.services-page .bundles-page .bundle-benefits__title,
body.services-page .bundles-page .bundle-performance__title,
body.services-page .bundles-page .bundle-why__title,
body.services-page .bundles-page .bundle-cta__title {
    font-size: var(--svc-h2) !important;
    line-height: 1.25 !important;
}

body.services-page .bundles-page .bundle-overview__subtitle,
body.services-page .bundles-page .bundle-comparison__subtitle,
body.services-page .bundles-page .bundle-receives__subtitle,
body.services-page .bundles-page .bundle-performance__subtitle,
body.services-page .bundles-page .bundle-cta__subtitle {
    font-size: var(--svc-subtitle) !important;
}

body.services-page .bundles-page .bundle-overview__description,
body.services-page .bundles-page .bundle-card__text,
body.services-page .bundles-page .bundle-extra__text,
body.services-page .bundles-page .bundle-benefit-item__text,
body.services-page .bundles-page .bundle-performance__item-text,
body.services-page .bundles-page .bundle-why__item,
body.services-page .bundles-page .bundle-cta__description {
    font-size: var(--svc-body) !important;
}

body.services-page .bundles-page .comparison-card__title,
body.services-page .bundles-page .bundle-performance__card-title,
body.services-page .bundles-page .bundle-cta__subtitle,
body.services-page .bundles-page .bundle-benefits__marketing-title {
    font-size: var(--svc-h3) !important;
    line-height: 1.3 !important;
}

body.services-page .bundles-page .comparison-card__subtitle,
body.services-page .bundles-page .comparison-list,
body.services-page .bundles-page .bundle-receive-card div,
body.services-page .bundles-page .bundle-benefit-item div,
body.services-page .bundles-page .bundle-marketing-card div,
body.services-page .bundles-page .bundle-why__item span,
body.services-page .bundles-page .bundle-performance__item span,
body.services-page .bundles-page .bundle-cta__button {
    font-size: var(--svc-body) !important;
}

body.services-page .bundles-page h1 {
    font-size: var(--svc-hero) !important;
}

body.services-page .bundles-page h2 {
    font-size: var(--svc-h2) !important;
}

body.services-page .bundles-page h3,
body.services-page .bundles-page h4 {
    font-size: var(--svc-h3) !important;
}

/* Service template (packages) fallback typography for any remaining headings */
body.services-page .service-template h1 {
    font-size: var(--svc-hero) !important;
}

body.services-page .service-template h2 {
    font-size: var(--svc-h2) !important;
}

body.services-page .service-template h3,
body.services-page .service-template h4 {
    font-size: var(--svc-h3) !important;
}

body.services-page .service-template p {
    font-size: var(--svc-body) !important;
}

/* Service template (packages) typography */
body.services-page .service-template .svc-hero,
body.services-page .service-template .svc-title,
body.services-page .service-template .svc-subtitle,
body.services-page .service-template .svc-body,
body.services-page .service-template .svc-small {
    font-family: inherit !important;
}