/* Responsive */
@media (min-width: 768px) {
    .container {
        padding: 0 24px;
    }

    section {
        padding: 80px 0;
    }

    .grid {
        gap: 32px;
    }

    .grid-2 {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }

    .grid-3 {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .site-nav {
        padding: 20px 0;
    }

    .nav-inner {
        flex-direction: row;
        justify-content: space-between;
    }

    .nav-inner > div {
        gap: 8px 24px;
    }

    .nav-link {
        padding: 10px 18px;
    }

    .section-title {
        margin-bottom: 60px;
    }

    .section-heading {
        margin-top: 16px;
    }

    .section-subtitle {
        margin: 16px auto;
    }

    .hero {
        padding: 120px 0 80px;
    }

    .hero h1 {
        font-size: clamp(2.5rem, 5vw, 2rem);
        margin-bottom: 24px;
    }

    .hero p {
        font-size: 1.25rem;
        margin: 0 auto 40px;
    }

    .hero-cta {
        margin-top: 32px;
    }

    .case-metrics {
        flex-direction: row;
        gap: 24px;
    }

    .case-panel {
        padding: 24px;
    }

    .case-row {
        font-size: 0.9rem;
    }

    .roi-table {
        display: table;
        overflow-x: visible;
    }

    .roi-table th, .roi-table td {
        padding: 20px;
    }

    .roi-packages {
        margin-top: 60px;
    }

    .package-title {
        margin-bottom: 30px;
    }

    .list-unstyled {
        margin-top: 20px;
    }

    .pricing-card {
        padding: 48px;
    }

    .price {
        font-size: 3.5rem;
    }

    .pricing-guarantee {
        flex-direction: row;
        gap: 12px;
    }

    .pricing-caption {
        margin-top: 24px;
        font-size: 0.9rem;
    }

    .bio-box {
        flex-direction: row;
        gap: 32px;
    }

    summary {
        padding: 20px;
    }

    .faq-content {
        padding: 20px 20px 20px;
    }

    footer {
        padding: 60px 0;
    }

    .cookie-banner__inner {
        padding: 24px;
    }

    .cookie-banner__actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
