body {
    padding: 0;
    margin: 0;
    background-color: var(--bg);
    font-family: var(--font);
    overflow-x: hidden;
}


.container {
    padding: 0 20px;
    display: block;
    max-width: 1520px;
    box-sizing: border-box;
    margin: auto;
    width: calc(100% - 40px);
}


.js-hide {
    display: none!important;
}

a {
    color: black;
    text-decoration: none;
}

a:hover {
    opacity: 0.8;
}




/* === FLEX BASIC === */
.flex {
    display: flex;
}
.inline-flex {
    display: inline-flex;
}

/* === FLEX DIRECTION === */
.flex-row {
    flex-direction: row;
}
.flex-row-reverse {
    flex-direction: row-reverse;
}
.flex-column {
    flex-direction: column;
}
.flex-column-reverse {
    flex-direction: column-reverse;
}

/* === FLEX WRAP === */
.flex-wrap {
    flex-wrap: wrap;
}
.flex-nowrap {
    flex-wrap: nowrap;
}
.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}

/* === JUSTIFY CONTENT === */
.justify-start {
    justify-content: flex-start;
}
.justify-end {
    justify-content: flex-end;
}
.justify-center {
    justify-content: center;
}
.justify-between {
    justify-content: space-between;
}
.justify-around {
    justify-content: space-around;
}
.justify-evenly {
    justify-content: space-evenly;
}

/* === ALIGN ITEMS === */
.items-start {
    align-items: flex-start;
}
.items-end {
    align-items: flex-end;
}
.items-center {
    align-items: center;
}
.items-baseline {
    align-items: baseline;
}
.items-stretch {
    align-items: stretch;
}

/* === ALIGN CONTENT === */
.content-start {
    align-content: flex-start;
}
.content-end {
    align-content: flex-end;
}
.content-center {
    align-content: center;
}
.content-between {
    align-content: space-between;
}
.content-around {
    align-content: space-around;
}
.content-stretch {
    align-content: stretch;
}

/* === ALIGN SELF === */
.self-auto {
    align-self: auto;
}
.self-start {
    align-self: flex-start;
}
.self-end {
    align-self: flex-end;
}
.self-center {
    align-self: center;
}
.self-baseline {
    align-self: baseline;
}
.self-stretch {
    align-self: stretch;
}

/* === FLEX GROW / SHRINK === */
.flex-grow {
    flex-grow: 1;
}
.flex-grow-0 {
    flex-grow: 0;
}
.flex-shrink {
    flex-shrink: 1;
}
.flex-shrink-0 {
    flex-shrink: 0;
}

/* === GAP === */
.gap-0 { gap: 0; }
.gap-5 { gap: 5px; }
.gap-10 { gap: 10px; }
.gap-15 { gap: 15px; }
.gap-20 { gap: 20px; }
.gap-30 { gap: 30px; }
.gap-40 { gap: 40px; }
.gap-50 { gap: 50px; }
.gap-60 { gap: 60px; }

/* === RESPONSIVE (пример для 768px) === */
@media (max-width: 768px) {
    .md-flex-column {
        flex-direction: column !important;
    }
    .md-flex-row {
        flex-direction: row !important;
    }
    .md-justify-center {
        justify-content: center !important;
    }
    .md-items-center {
        align-items: center !important;
    }
    .md-gap-10 {
        gap: 10px !important;
    }

    .main .container .wrapper .left .card .text-block {
        flex-direction: column-reverse;
    }
}