/*-------media-------*/

@media (max-width: 1200px) {

    .section {
        padding-top: var(--section-padding-y-40);
        padding-bottom: var(--section-padding-y-40);
    }

}

@media (max-width: 768px) {

    .section {
        padding-top: var(--section-padding-y-30);
        padding-bottom: var(--section-padding-y-30);
    }

    .header__inner {
        padding: 20px 0;
    }

    .card {
        grid-template-columns: 100%;
        grid-template-rows: auto auto;
    }

    .portfolio-card__img-box {
        grid-row: 1;
        height: 250px;
    }

    .portfolio__title {
        scroll-margin-top: 20px;
    }

}

@media (max-width: 576px) {

    .hidden-mobile {
        display: none !important;
    }

    .cross-button:focus-visible {
        outline: none;
    }

}

@media (min-width: 577px) {

    .visible-mobile {
        display: none !important;
    }
}


@media (max-width: 576px) {

    .section {
        padding-top: var(--section-padding-y-20);
        padding-bottom: var(--section-padding-y-20);
    }

    .card {
        padding: 15px;
    }

    .portfolio-card__img-container {
        height: 250px;
    }

}