@media (max-width: 1024px) {
    .os-cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .os-preview-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .os-cards-grid {
        grid-template-columns: 1fr;
    }

    .os-hero {
        padding: 60px 20px 48px;
    }

    .os-hero-title {
        font-size: 26px;
    }

    .os-hero-desc {
        font-size: 15px;
        margin-bottom: 28px;
    }

    .os-hero-cta {
        flex-direction: column;
        gap: 12px;
    }

    .os-cta-btn {
        width: 100%;
        justify-content: center;
    }

    .os-services {
        padding: 48px 20px;
    }

    .os-section-title {
        font-size: 24px;
        margin-bottom: 28px;
    }

    .os-card {
        padding: 24px 20px;
    }

    .os-why {
        padding: 44px 20px;
    }

    .os-why-cards {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .os-why-card {
        padding: 20px 20px 20px 24px;
    }

    .os-why-card-title {
        font-size: 15px;
    }

    .os-why-card-desc {
        font-size: 13px;
    }

    .os-preview {
        padding: 44px 20px;
    }

    .os-preview-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .os-preview-thumb {
        height: 120px;
    }

    .os-preview-title {
        font-size: 15px;
        padding: 14px 16px 4px;
    }

    .os-preview-desc {
        padding: 0 16px 12px;
    }

    .os-preview-link {
        padding: 0 16px 16px;
    }

    .os-preview-price {
        padding: 0 16px 16px;
        font-size: 14px;
    }

    .os-preview-sub {
        font-size: 14px;
        margin-bottom: 24px;
    }

    .os-cta {
        padding: 44px 20px;
    }

    .os-cta-desc {
        margin-bottom: 24px;
    }

    .os-cta-buttons {
        flex-direction: column;
    }

    .os-cta-buttons .os-cta-btn {
        width: 100%;
        justify-content: center;
    }

    .os-faq {
        padding: 44px 20px;
    }

    .os-faq-q {
        font-size: 15px;
    }

    .os-faq-a {
        font-size: 14px;
        padding: 0 16px;
    }

    .os-faq-item.open .os-faq-a {
        padding: 16px;
    }

    .os-cta {
        padding: 60px 20px;
        margin-bottom: 0 !important;
        border-radius: 0 !important;
    }

    .os-expert-content {
        flex-direction: column;
        gap: 40px;
    }

    .os-expert-diff-card {
        padding: 32px 20px;
    }

    .os-expert-title {
        font-size: 24px;
    }
    
    .os-review-row {
        margin-bottom: 16px;
    }

    .os-review-track {
        gap: 16px;
    }

    .os-review-card {
        width: 280px;
        padding: 20px 20px;
    }

    .os-review-track-right {
        animation-duration: 45s;
    }

    .os-review-track-left {
        animation-duration: 45s;
    }
}