@media only screen and (max-width: 1024px) {
    .duk .sidebar {
        width: 25%;
        padding-right: 24px;
    }
}
@media only screen and (max-width: 768px) {
    h1 {
        font-family: Fustat;
        font-weight: 700;
        font-size: 20px;
        line-height: 26px;
    }
    h2 {
        font-weight: 600;
        font-size: 18px;
        color: #363d4d;
    }
    .login-reg-wrapper .title {
        color: #363D4D;
        font-family: Fustat;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        text-align: center;
        width: 100%;
    }
    .login-reg-wrapper.recovery-sended {
        gap: 0;
        display: flex;
        align-items: center;
        padding: 32px 24px;
    }
    .recovery-sended h2 {
        font-weight: 600;
        font-size: 18px;
        line-height: 24px;
        text-align: center;
        color: #363d4d;
        margin-bottom: 10px;
        margin-top: 24px;
    }
    .identity-ver-suc .success-btn{
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    .block-name-wrap h3 {
        font-family: Fustat;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
    }
    .home-blocks .home-block .item-counter {
        flex-shrink: 0;
        width: 48px;
        height: 48px;
        font-family: Fustat;
        font-weight: 700;
        font-size: 20px;
        line-height: 32px;
    }
    .home-blocks .home-block {
        padding: 24px;
    }
    .home-liked-blocks {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        grid-column-gap: 16px;
        grid-row-gap: 16px;
        margin-top: 32px;
    }
    .home-liked-blocks-wrap h1{
        text-align: center;
    }
    .personal-info-row {
        display: flex;
        gap: 16px;
        flex-direction: column;
    }
    .title-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 40px;
        flex-direction: column;
        gap: 8px;
    }
    .personal-info-row .personal-info-box, .personal-info-row .password-change-box {
        border-radius: var(--border-radius-block, 16px);
        border: 1px solid var(--block-border, #EEE);
        background: var(--white, #FFF);
        box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05);
        padding: 32px 24px;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
    .personal-info-row .personal-info-box h2, .personal-info-row .password-change-box h2{
        text-align: center;
    }
    .two-cols-inputs {
        display: flex;
        gap: 0px;
        flex-direction: column;
    }
    .certificates-wrap .certificates-list .certificate {
        border-radius: var(--border-radius-block, 16px);
        border: 1px solid var(--block-border, #EEE);
        background: var(--white, #FFF);
        box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05);
        padding: 32px 24px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 15px;
        flex-direction: column;
        gap: 20px;
    }
    .certificates-wrap .title-with-btn {
        display: flex;
        gap: 20px;
        align-items: center;
        margin-bottom: 25px;
        justify-content: center;
    }
    .cert-actions {
        display: flex;
        align-items: center;
        gap: 0;
    }
    .certificate.edit .cert-actions {
        gap: 20px;
    }
    .subs-box {
        border-radius: var(--border-radius-block, 16px);
        border: 1px solid var(--block-border, #EEE);
        background: var(--white, #FFF);
        box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05);
        padding: 16px;
        width: 100%;
        margin-top: 32px;
        margin-bottom: 48px;
    }
    .subscription {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        padding-bottom: 16px;
        margin-bottom: 16px;
        border-bottom: 1px solid #E1E1E1;
    }
    .subscription .box-content .right-content {
        display: flex;
        gap: 30px;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
    .subscription .box-content {
        display: flex;
        justify-content: space-between;
        width: 100%;
        flex-direction: column;
        gap: 16px;
        align-items:flex-start;
    }
    .subscription .box-content .left-content .desc {
        font-family: Fustat;
        font-weight: 400;
        font-size: 13px;
        line-height: 100%;
        color: #6F6F73;
        margin-top: 5px;
    }
    .subscription .box-content .right-content .price {
        font-family: Fustat;
        font-weight: 700;
        font-size: 18px;
        color: #363D4D;
        line-height: 100%;
    }
    .subscription .box-content .right-content .pay-btn {
        background-color: #27C96A;
        border-radius: 8px;
        color: #fff;
        height: 100%;
        padding: 0px 14px;
        font-family: Fustat;
        font-weight: 800;
        font-size: 12px;
        line-height: 32px;
        text-transform: uppercase;
        border: 2px solid #27C96A;
    }
    .subscription-wrapper h1{
        text-align: center;
    }
    .invoices-box.subs-box {
        padding: 16px 24px;
    }
    .invoices-box .invoice .left-content {
        display: flex;
        gap: 8px;
        align-items: flex-start;
        flex-direction: column;
    }
    .invoices-box .invoice:first-child {
        padding-top: 14px;
    }
    .invoices-box .invoice {
        display: flex;
        justify-content: space-between;
        padding-bottom: 20px;
        border-bottom: 1px solid #E1E1E1;
        margin-bottom: 20px;
        align-items: center;
    }
    .duk .sidebar {
        width: 288px;
        background-color: #fff;
        height: 100vh;
        margin-top: -90px;
        padding-top: 48px;
        box-shadow: 8px 0 15px -5px rgba(0, 0, 0, 0.05);
        flex-shrink: 0;
        padding-right: 24px;
        display: flex;
        flex-direction: column;
        padding-bottom: 24px;
        justify-content: space-between;
        position: absolute;
        left: -288px;
        padding-left: 24px;
        z-index: 100;
    }
    .duk h1 {
        text-align: center;
    }
    .accordion-header {
        padding: 16px 24px;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        transition: background-color 0.2s ease;
        user-select: none;
    }
    .accordion-title {
        font-family: Fustat;
        font-weight: 600;
        font-size: 16px;
        line-height: 20px;
        color: #363D4D;
    }
    .accordion-content-inner {
        padding: 0px 24px 16px 24px;
    }
    .accordion-text {
        font-family: Fustat;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #363D4D;
    }
    .duk .mob-sidebar {
        display: block;
        padding: 13px 24px;
        background-color: #fff;
        border-radius: 8px;
        border: 1px solid #E1E1E1;
        font-family: Fustat;
        font-weight: 700;
        font-size: 15px;
        letter-spacing: 0%;
        vertical-align: middle;
        color: #363D4D;
        margin-top: 24px;
        background-image: url('/assets/icons/arrow-right.svg');
        background-size: 10px;
        background-repeat: no-repeat;
        background-position: right 24px center;
    }
    .duk .mob-sidebar img {
        margin-right: 10px;
    }
    .duk .sidebar.show {
        left: 0;
    }
    .duk .sidebar::before {
        display: none;
    }
    .duk .overlay {
        position: absolute;
        width: 100%;
        height: 100vh;
        margin-top: -89px;
        z-index: 10;
        display: none;
        background-color: #00000080;
    }
    .duk .overlay.show {
        display: block;
    }
    .duk .sidebar .close-sidebar {
        position: absolute;
        right: 20px;
        top: 20px;
        display: block;
    }
    .duk .main-content {
        width: 100%;
    }
    .contacts-form-wrap {
        max-width: 672px;
        padding: 32px 24px;
        border-radius: 10px;
        box-shadow: 0px 5px 15px 0px #0000000d;
        background-color: #fff;
        margin: auto;
    }
    .free-trial-section .buttons-wrap button {
        min-width: unset;
        justify-content: center;
        width: 100%;
        padding: 0;
    }
    .white-box-shadow {
        padding: 32px 24px;
    }
    .free-trial-section .box-header .title {
        font-family: Fustat;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        color: #363D4D;
        margin-top: 20px;
        margin-bottom: 8px;
    }
    .free-trial-section .box-header .desc {
        font-family: Fustat;
        font-weight: 500;
        font-size: 14px;
        line-height: unset;
        color: #363D4D;
    }
    .free-trial-section .box-header, .free-trial-section .box-input-wrap {
        margin-bottom: 24px;
    }
    .free-trial-section .plan-title {
        font-family: Fustat;
        font-weight: 500;
        font-size: 14px;
        letter-spacing: 0%;
        text-align: center;
        color: #363D4D;
    }
    .invitation-section {
        margin-top: 40px;
        margin-bottom: 60px;
    }
    .invitation-from .form-buttons button {
        padding: 0;
    }
    #certificatesContainer .cert-card {
        padding: 24px;
        border-radius: 10px;
        background-color: #f9f9f9;
    }
    .edz-creation .billing__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .edz-creation .plan__card {
        position: relative;
        display: block;
        background: #ffffff;
        border: 1px solid #E1E1E1;
        border-radius: 10px;
        padding: 16px 16px 16px 40px;
        transition: all .15s ease;
        min-height: 80px;
    }
    .edz-creation .plan__term {
        font-family: Fustat;
        font-weight: 600;
        font-size: 16px;
        letter-spacing: 0%;
        text-align: center;
        color: #363D4D;
    }
    .edz-creation .plan__dot {
        position: absolute;
        left: 16px;
        top: 18px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: #fff;
        transition: all .2s ease;
        border: 1px solid #E1E1E1;
    }
    .edz-creation .plan__per {
        font-family: Fustat;
        font-weight: 600;
        font-size: 14px;
        letter-spacing: 0%;
        color: #363D4D;
    }
    .edz-creation .plan__per-muted {
        font-family: Fustat;
        font-weight: 500;
        font-size: 12px;
        line-height: 100%;
        letter-spacing: 0%;
        color: #6F6F73;
        margin-left: 4px;
    }
    .edz-creation .plan__price {
        font-family: Fustat;
        font-weight: 800;
        font-size: 18px;
        letter-spacing: 0%;
        text-align: center;
        color: #363D4D;
    }
    .edz-creation .plan__old {
        color: #27C96A;
        font-family: Fustat;
        font-weight: 400;
        font-size: 12px;
        line-height: 100%;
        letter-spacing: 0%;
        text-decoration: line-through;
    }
    .edz-creation .plan__badge {
        margin-left: unset;
        background: #27C96A;
        color: #ffffff;
        padding: 4px 10px;
        border-radius: 6px;
        font-family: Fustat;
        font-weight: 700;
        font-size: 12px;
        text-transform: uppercase;
    }
    .edz-creation .plan__bottom {
        margin-top: 8px;
        display: flex;
        align-items: center;
        gap: 4px;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .edz-creation .company-row .agree {
        justify-content: center;
        margin-bottom: 0;
    }
    .edz-creation .company-fields {
        margin-top: 24px;
    }
    .successful-creation h2 {
        text-align: center;
    }
    .change-payer .two-cols-inputs {
        display: flex;
        gap: 12px;
        flex-direction: row;
    }
    .owner-change-wrap .title {
        font-family: Fustat;
        font-weight: 700;
        font-size: 20px;
        line-height: 26px;
        letter-spacing: 0%;
        color: #363D4D;
        margin-bottom: 24px;
    }
    .owner-change-wrap .recovery-sended h2{
        margin-top: 0;
    }
    .certs-table thead th:first-child {
        display: block;
        max-width: 90px;
    }
    #certificatesContainer .cert-dates {
        display: flex;
        gap: 12px;
        flex-direction: column;
    }
    .completion-section {
        margin-top: 40px;
        margin-bottom: 60px;
    }
    .completion-fields {
        display: flex;
        align-items: flex-start;
        gap: 20%;
        flex-direction: column;
    }
    .completion-section .completion-top {
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
        gap: 10px;
    }
    .flatpickr-calendar.open {
        display: inline-block !important;
        z-index: 99999 !important;
        padding: 24px 20px !important;
        border-radius: 16px !important;
        width: fit-content !important;
    }
    .certificates-wrap .certificates-list .certificate .input-wrap.number-input {
        max-width: unset;
    }
    .certificates-wrap .certificates-list .certificate .input-wrap.date-input {
        max-width: unset;
    }
}