@media only screen and (min-width: 768px) {
    .container {
        width: 768px;
    }

    .mobile-menu {
        display: none;
    }
    /* #region Header */
    .head .container {
    }
    .header {
        min-height: 72px;
    }
    .burger-nav {
        display: none;
    }
    .nav-modal {
        display: flex;

        gap: 120px;
    }
    .col {
        position: relative;
        color: #404bbf;
        transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* #endregion Header */

    /* #region Hero */

    .hero .container {
        gap: 0;
    }

    .hero-title {
        max-width: 496px;
        font-weight: 700;
        font-size: 56px;
        line-height: 1.07143;
        letter-spacing: 0.02em;
        margin-bottom: 36px;
    } /* #endregion Hero */

    /* #region Benefits */
    .benefits-list {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 72px 24px;
    }
    .benefits-item {
        max-width: 356px;
    }

    .benefits-h {
        text-align: start;
    }

    /* #endregion Benefits */

    /* #region Team  */

    .team-list {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 64px 24px;
        margin: 0;
        justify-content: center;
    }
    /* #endregion Team  */

    /* #region PORTFOLIO */
    .portfolio-list {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        gap: 74px 22px;
    }

    .portfolio-item {
        width: 356px;
        height: 420px;
        transition: box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .porfolio .card {
        width: 356px;
    }
    /* #endregion PORTFOLIO */

    /* #region FOOTER */
    .footer {
        padding: 96px 0 96px 108px;
    }

    .footer .container {
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: flex-start;

        gap: 24px;
    }
    .footer-logo {
        text-align: start;
    }

    .box {
        width: 264px;
    }

    .social-title {
        text-align: start;
    }
    .label-text {
        text-align: start;
    }
    .subscribe-form {
        display: flex;
        flex-direction: row;
        gap: 24px;
    }
    /* #endregion FOOTER */

    /* #region Modal */
    .modal-overlay {
        width: 408px;
        padding: 72px 24px 24px 24px;
    }
    .privacy-policy-span {
        width: 338px;
    }
    /* #endregion Modal */

    .media-list {
        margin-bottom: 72px;
    }
}
