:root {
    --body-color: #1f1f1f;
    --background-color: #1b1b1b;
    --primary-color: #00ff8c;
    --primary-dark: #004928;
    --text-color: #535353;
    --gray-color: #918e8e;
    --ff-montserrat: "Montserrat", sans-serif;
    --ff-ubuntu: "Ubuntu";
    --fz-150px: 9.375rem;
    --fz-80px: 5rem;
    --fz-64px: 4rem;
    --fz-50px: 3.125rem;
    --fz-48px: 3rem;
    --fz-36px: 2.25rem;
    --fz-32px: 2rem;
    --fz-30px: 1.875rem;
    --fz-24px: 1.5rem;
    --fz-20px: 1.25rem;
    --fz-16px: 1rem;
    --fz-15px: 0.9375rem;
    --fz-14px: 0.875rem;
    --fz-13px: 0.8125rem;
    --fz-12px: 0.75rem;
    --fz-10px: 0.625rem;
    --fz-5px: 0.3125rem;
}

*:hover {
    transition: 0.2s;
}

html,
body {
    height: 100%;
}

body {
    background: var(--body-color);
    overflow-x: hidden;
    font-family: "Montserrat", sans-serif;
}

body.no-scroll {
    overflow: hidden;
}

img {
    max-width: 100%;
    display: block;
}

button {
    padding: 0;
    background: none;
}

main#main {
    margin-top: var(--fz-50px);
    margin-bottom: var(--fz-150px);
    flex: 1 1 auto;
}

main#main:has(.welcome) {
    margin-top: 0;
}

main#main:has(.welcome) section:not(.welcome) {
    margin-top: var(--fz-50px);
}

span.primary {
    color: var(--primary-color);
}

h1 {
    font-size: var(--fz-24px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    color: #fff;
}

h2 {
    font-size: var(--fz-24px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    color: #fff;
}

h3 {
    font-size: var(--fz-20px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    color: #fff;
}

/* h4 {
    font-size: var(--fz-24px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    letter-spacing: 0.02em;
    color: #fff;
} */

p {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    letter-spacing: 0.02em;
    /* line-height: 1.8em; */
    color: #fff;
}

.wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.container {
    max-width: 1220px;
    margin: 0 auto;
    padding: 0 20px;
}

.header {
    background: var(--background-color);
}

.header__inner {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header__logo,
.footer__logo {
    font-size: var(--fz-32px);
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.05em;
}

.header__logo p {
    font-size: var(--fz-14px);
}

.header__menu {
    display: flex;
    align-items: center;
    gap: 20px;
}

.menu__link {
    display: flex;
    align-items: center;
    gap: var(--fz-5px);
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: #fff;
}

.header__btns {
    display: flex;
    gap: var(--fz-20px);
}

.header__burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    background: var(--background-color);
    border: 1px solid var(--text-color);
    border-radius: 8px;
    cursor: pointer;
    z-index: 1001;
    transition: background 0.2s, border 0.2s;
}

.burger__line {
    display: block;
    width: 2rem;
    height: 0.14rem;
    margin: 0.18rem 0;
    background: #fff;
    border-radius: 2px;
    transition: background 0.2s;
    transition: transform 0.3s cubic-bezier(0.4, 2, 0.6, 1), opacity 0.2s;
}

.header__burger:active .burger__line {
    background: var(--primary-color);
}

.header__burger.active .burger__line:nth-child(1) {
    transform: translateY(0.5rem) rotate(45deg);
}
.header__burger.active .burger__line:nth-child(2) {
    opacity: 0;
}
.header__burger.active .burger__line:nth-child(3) {
    transform: translateY(-0.5rem) rotate(-45deg);
}

.welcome {
    padding: var(--fz-50px) 0;
    margin-bottom: var(--fz-50px);
    background: #353535;
}

.welcome__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.welcome__title {
    max-width: 1000px;
    font-size: var(--fz-64px);
    margin-bottom: var(--fz-20px);
}

.welcome__desc {
    max-width: 1100px;
    font-size: var(--fz-20px);
    margin-bottom: var(--fz-50px);
}

.btn {
    display: block;
    padding: var(--fz-15px) var(--fz-50px);
    background: var(--primary-color);
    font-size: var(--fz-20px);
    font-weight: 500;
    font-family: var(--ff-montserrat);
    color: var(--background-color);
    border-radius: 10px;
}

.btn--dark {
    background: var(--text-color);
    /* border: 1px solid var(--text-color); */
    color: var(--primary-color);
}

.news__inner {
    display: flex;
    flex-direction: column;
}

.section__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--fz-20px);
    margin-bottom: var(--fz-20px);
}

.section-header__link {
    font-size: var(--fz-16px);
    font-weight: 400;
    color: var(--primary-color);
}

.news__content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--fz-20px);
}

.news__item {
    width: 380px;
    height: 230px;
    display: flex;
    flex-direction: column;
    padding: var(--fz-20px) var(--fz-15px);
    border-radius: 10px;
}

.news-item__title {
    display: block;
    font-size: var(--fz-20px);
    font-weight: 700;
    color: #fff;
    margin-bottom: var(--fz-10px);
}

.news-item__desc {
    display: block;
    font-size: var(--fz-14px);
    font-weight: 400;
}

.news-item__btn {
    width: max-content;
    font-size: var(--fz-14px);
    padding: var(--fz-5px) var(--fz-50px);
    margin-top: auto;
}

.games__content,
.apps__content,
.mods__content {
    display: flex;
    /* justify-content: space-between; */
    flex-wrap: wrap;
    gap: var(--fz-20px);
}

/* .games__item,
.apps__item,
.mods__item {
    width: 270px;
    height: 105px;
    display: flex;
    gap: var(--fz-10px);
    padding: var(--fz-10px);
    border: 1px solid var(--text-color);
    border-radius: 10px;
} */

.games__item,
.apps__item,
.mods__item {
    width: 380px;
    height: 115px;
    display: flex;
    align-items: center;
    gap: var(--fz-10px);
    padding: var(--fz-15px);
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.games-item__wrapper,
.apps-item__wrapper,
.mods-item__wrapper {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.games-item__img,
.apps-item__img,
.mods-item__img {
    width: 80px;
    height: 80px;
    border-radius: 10px;
}

.games-item__title,
.apps-item__title,
.mods-item__title {
    font-size: var(--fz-16px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    margin-bottom: var(--fz-5px);
}

.mods-item__info {
    display: flex;
    gap: var(--fz-10px);
}

.mods-item__category {
    font-size: var(--fz-14px);
    color: var(--text-color);
}

.mods-item__size {
    font-size: var(--fz-14px);
    color: var(--text-color);
}

.mods-item-size__num {
    color: #fff;
}

.mods-item__info:last-child {
    margin-top: auto;
}

.mods-item__version {
    font-size: var(--fz-14px);
}

.mods-item__mod {
    font-size: var(--fz-14px);
    color: var(--primary-color);
}

.games-item__author,
.apps-item__author,
.mods-item__author {
    font-size: var(--fz-12px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    letter-spacing: 0;
    color: var(--text-color);
    margin-bottom: var(--fz-10px);
}

.games-item__rating,
.apps-item__rating,
.mods-item__rating {
    display: flex;
    align-items: center;
    margin-top: auto;
    gap: var(--fz-5px);
    font-size: var(--fz-12px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    letter-spacing: 0;
    color: #fff;
}

.categories-content__list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between; */
    gap: var(--fz-10px);
}

.categories-content__link {
    width: 160px;
    height: 40px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: var(--fz-16px);
    font-weight: 500;
    font-family: var(--ff-montserrat);
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.footer {
    padding: var(--fz-50px) 0;
    background: #353535;
    /* background: linear-gradient(
        300deg,
        rgba(53, 53, 53, 1) 55%,
        rgba(12, 204, 118, 1) 150%
    ); */
}

.footer__inner {
    display: flex;
    flex-direction: column;
    gap: var(--fz-150px);
}

.footer__row {
    display: flex;
    justify-content: space-between;
}

.footer__row:has(.footer__copyright) {
    align-items: center;
    gap: var(--fz-50px);
}

.footer__nav {
    display: flex;
    gap: var(--fz-50px);
}

.footer-nav__col {
    display: flex;
    flex-direction: column;
    gap: var(--fz-15px);
}

.footer-nav__title {
    font-size: var(--fz-20px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
}

.footer__menu {
    display: flex;
    flex-direction: column;
    gap: var(--fz-10px);
}

.footer__menu .menu__link {
    color: var(--gray-color);
}

.footer__copyright {
    color: var(--gray-color);
}

.page__header {
    display: flex;
    flex-direction: column;
    gap: var(--fz-15px);
    margin-bottom: var(--fz-50px);
}

.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fz-10px);
    font-size: var(--fz-16px);
    font-weight: 500;
    font-family: var(--ff-montserrat);
    color: var(--gray-color);
}

.breadcrumbs__link {
    color: var(--primary-color);
}

.page__content {
    margin-bottom: var(--fz-80px);
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--fz-15px);
}

.pagination__number {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: var(--fz-20px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: var(--text-color);
    background: none;
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.pagination__number--current {
    color: #fff;
    background: var(--primary-color);
}

.single .breadcrumbs {
    margin-bottom: var(--fz-30px);
}

.single__img {
    width: 180px;
    height: 180px;
    border-radius: 10px;
}

.single__main {
    display: flex;
    gap: var(--fz-20px);
    margin-bottom: var(--fz-30px);
    /* align-items: center; */
}

.single__title {
    margin-bottom: var(--fz-10px);
}

.single__info {
    display: flex;
    gap: var(--fz-15px);
    margin-bottom: var(--fz-20px);
}

.single__version,
.single__date,
.single__dev {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: var(--text-color);
}

.single__views {
    color: var(--gray-color);
}

.single__date {
    color: var(--gray-color);
}

.single__dev {
    color: #fff;
}

.single__developer {
    color: var(--text-color);
}

.single__rating {
    display: flex;
    align-items: center;
    gap: var(--fz-10px);
    font-size: var(--fz-16px);
    font-weight: 400;
    color: #fff;
    margin-bottom: var(--fz-20px);
}

.single__desc {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: var(--text-color);
}

.single__cols {
    display: flex;
    gap: var(--fz-20px);
}

.sidebar {
    width: 380px;
    position: sticky;
    top: 20px;
    align-self: flex-start;
}

.sidebar-group__title {
    font-size: var(--fz-20px);
    font-weight: 700;
    font-family: var(--ff-montserrat);
    margin-bottom: var(--fz-20px);
}

.sidebar-group__content {
    display: flex;
    flex-direction: column;
    gap: var(--fz-20px);
}

.single__ad {
    margin-bottom: var(--fz-30px);
}

.single__btns {
    width: 100%;
    display: flex;
    gap: var(--fz-10px);
}

.single .btn {
    width: 50%;
    height: var(--fz-50px);
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: inherit;
    margin-bottom: var(--fz-30px);
}

.single__table {
    margin-bottom: var(--fz-30px);
}

.table {
    width: 100%;
    border-spacing: 0;
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.table td {
    padding: var(--fz-10px);
    font-size: var(--fz-16px);
    font-weight: 500;
    color: #fff;
}

.table td:nth-child(1) {
    display: flex;
    align-items: center;
    gap: var(--fz-10px);
}

.table td:nth-child(2) {
    font-weight: 700;
}

.table tr:nth-child(even) {
    background: var(--text-color);
}

.slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

.single__slider {
    display: block;
    margin-bottom: var(--fz-30px);
}

.slider__slides {
    display: flex;
    transition: transform 0.5s ease-in-out;
    gap: 0;
}

.slider__slide {
    flex: 0 0 100%;
    /* width: 100%;
    height: auto; */
    width: 300px;
    height: 180px;
    object-fit: cover;
    border-radius: 10px;
}

.slider__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    z-index: 10;
}

.slider__prev {
    left: 10px;
}

.slider__next {
    right: 10px;
}

.single__functions {
    display: flex;
    flex-direction: column;
    gap: var(--fz-20px);
    padding: var(--fz-20px) var(--fz-30px);
    background: var(--background-color);
    margin-bottom: var(--fz-30px);
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.functions__list {
    display: flex;
    flex-direction: column;
    gap: var(--fz-5px);
}

.functions__item {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: #fff;
    list-style-type: disc;
    margin-left: var(--fz-15px);
}

.single__text h2 {
    font-size: var(--fz-24px);
    margin-bottom: var(--fz-20px);
    margin-top: var(--fz-50px);
    color: #fff;
}

.single__text h3 {
    font-size: var(--fz-20px);
    font-weight: 700;
    margin-bottom: var(--fz-20px);
    margin-top: var(--fz-30px);
    color: #fff;
}

.single__text p {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--montserrat);
    letter-spacing: 0.02em;
    line-height: 1.8em;
    color: var(--secondary-color);
    margin-bottom: var(--fz-20px);
    color: #fff;
}

.single__text ul {
    display: flex;
    flex-direction: column;
    gap: var(--fz-10px);
    margin-bottom: var(--fz-20px);
    padding: var(--fz-20px) var(--fz-30px);
    background: var(--background-color);
    border: 1px solid var(--text-color);
    border-radius: 10px;
}

.single__text ol {
    display: flex;
    flex-direction: column;
    gap: var(--fz-10px);
    margin-bottom: var(--fz-20px);
    padding: var(--fz-20px) var(--fz-30px);
}

.single__text li {
    list-style-type: unset;
    font-size: var(--fz-16px);
    line-height: 1.7em;
    color: #fff;
}

.single__text a {
    color: var(--primary-color);
}

.single__text hr {
    margin: var(--fz-80px) 0;
}

.single__text table {
    margin-bottom: var(--fz-20px);
    margin-top: var(--fz-30px);
    border-color: var(--text-color);
}

.single__text thead {
    border-bottom: 1px;
    border-color: var(--text-color);
}

.single__text th,
.single__text td {
    color: #fff;
    padding: var(--fz-15px);
    border-color: var(--text-color);
}

.single__text th {
    font-size: var(--fz-20px);
    font-weight: 700;
    font-family: var(--ubuntu);
}

.single__text td {
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--montserrat);
    letter-spacing: 0.02em;
}

.single__text img {
    max-width: 100%;
    object-fit: cover;
}

.single__text code {
    word-break: break-all;
}

figure.size-large img,
figure.size-full img {
    width: inherit;
    height: inherit;
}

.single__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fz-10px);
    margin-top: var(--fz-50px);
    margin-bottom: var(--fz-50px);
}

.tags__link {
    display: flex;
    padding: var(--fz-5px) var(--fz-20px);
    font-size: var(--fz-16px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    border-radius: 10px;
}

.download__title {
    margin-bottom: var(--fz-30px);
}

.download__list {
    display: flex;
    flex-direction: column;
    gap: var(--fz-15px);
}

.download__item {
    width: 100%;
    display: flex;
    flex-direction: column;
    border-left: 15px solid var(--primary-color);
    border-radius: 10px;
}

.download-item__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--fz-15px) var(--fz-20px);
    background: var(--background-color);
    border: 1px solid var(--text-color);
    border-radius: 0px 10px 0 0;
}

.download-item__title {
    font-size: var(--fz-16px);
    font-weight: 500;
    color: #fff;
}

.download .single__version {
    color: #fff;
}

.download-item__info {
    background: var(--primary-dark);
    padding: var(--fz-5px) var(--fz-20px);
    border: none;
    border-radius: 0px 0px 10px 0px;
}

.download-item__ext {
    font-size: var(--fz-14px);
    font-weight: 400;
    font-family: var(--ff-montserrat);
    color: #fff;
}

.single .download {
    margin-bottom: var(--fz-50px);
}

.rmp-widgets-container.rmp-wp-plugin.rmp-main-container {
    margin: 0;
}

.rmp-rating-widget {
    display: flex;
    align-items: center;
    gap: var(--fz-5px);
}

.js-rmp-vote-count {
    display: none !important;
}

.categories__page {
    display: flex;
    flex-direction: column;
    gap: var(--fz-50px);
}

.categories__block {
    display: flex;
    flex-direction: column;
    gap: var(--fz-20px);
}

.download.section .btn {
    width: max-content;
    margin-top: var(--fz-80px);
}

/* --- Yoast FAQ Styling --- */

.wp-block-yoast-faq-block {
    max-width: 800px; /* Ограничиваем ширину для читаемости */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 15px; /* Отступ между вопросами */
}

.schema-faq-section {
    background: #252525; /* Чуть светлее фона body (#1f1f1f) чтобы выделить блок */
    border: 1px solid transparent;
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 0.3s ease, background 0.3s ease;
}

/* Ховер эффект на всю карточку */
.schema-faq-section:hover {
    border-color: var(--text-color); /* Или используй #535353 */
}

/* Активная карточка (открытая) */
.schema-faq-section.active {
    border-color: var(--primary-color);
    background: #2a2a2a;
}

/* --- Вопрос (Заголовок) --- */
.schema-faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--fz-20px) var(--fz-20px);
    margin: 0;
    font-family: var(--ff-montserrat);
    font-size: var(--fz-16px); /* Чуть крупнее текста */
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    user-select: none;
    transition: color 0.3s ease;
    position: relative;
}

.schema-faq-section.active .schema-faq-question {
    color: var(--primary-color);
}

/* --- Иконка (Плюс / Минус) --- */
.schema-faq-question::after {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    margin-left: var(--fz-15px);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.3s ease, filter 0.3s ease;
    opacity: 0.7;
}

/* При наведении иконка становится ярче */
.schema-faq-question:hover::after {
    opacity: 1;
}

/* При открытии иконка красится в зеленый и поворачивается */
.schema-faq-section.active .schema-faq-question::after {
    transform: rotate(45deg); /* Плюс превращается в крестик */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300ff8c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
}


/* --- Ответ (Скрытый текст) --- */
.schema-faq-answer {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    margin: 0!important; 
    padding: 0 var(--fz-20px); /* Боковые паддинги можно оставить, они на высоту не влияют, если box-sizing: border-box */
    padding-top: 0;
    padding-bottom: 0;
    font-family: var(--ff-montserrat);
    font-size: var(--fz-14px);
    color: #d1d1d1;
    line-height: 1.6;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease, margin 0.3s ease;
}

/* Состояние ответа при открытии */
.schema-faq-section.active .schema-faq-answer {
    opacity: 1;
    margin-bottom: var(--fz-20px)!important;
}

.comments {
    margin-top: var(--fz-50px);
}

#comments, #respond, .comments-area, #wpdcom.wpd-dark {
    background: var(--background-color)!important;
    border-radius: 10px;
}

#comments {
    max-width: inherit!important;
    margin: 0px auto!important;
}

.comments #wpdcom {
    max-width: 80%;
}

.single__comments.comments .comments-area#comments a {
    color: var(--primary-color)
}

.single.article .single__img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 10px;
}

.single.article .single__main {
    flex-direction: column-reverse;
}

@media (min-width: 1024px) {
    .slider__slides {
        gap: 20px;
    }
    .slider__slide {
        flex: 0 0 calc(40% - 20px / 2.5);
    }
}

@media screen and (max-width: 1220px) {
    .section__header {
        flex-direction: column;
        gap: var(--fz-10px);
    }

    .games__content,
    .apps__content,
    .mods__content,
    .news__content {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: var(--fz-20px);
    }

    .categories-content__list {
        justify-content: center;
    }
}

@media screen and (max-width: 991px) {
    html {
        font-size: 90%;
    }
}

@media screen and (max-width: 881px) {
    .header__burger {
        display: flex;
    }

    .header__menu {
        display: none;
    }

    .header__menu.active {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: var(--fz-30px);
        background: var(--background-color);
    }

    .header__menu .menu__link {
        font-size: var(--fz-32px);
        gap: var(--fz-10px);
    }

    .header__menu .menu__link svg {
        transform: scale(1.5);
    }

    .welcome__title {
        font-size: var(--fz-48px);
    }

    .welcome__desc {
        font-size: var(--fz-16px);
    }

    .btn {
        font-size: var(--fz-16px);
    }

    .single__cols {
        flex-direction: column;
        gap: var(--fz-80px);
    }

    .sidebar {
        width: 100%;
    }

    .sidebar .mods__item,
    .sidebar .apps__item {
        width: 100%;
    }

    .footer__inner {
        gap: var(--fz-80px);
    }

    .footer__row:has(.footer__logo) {
        flex-direction: column;
        align-items: center;
        gap: var(--fz-80px);
    }

    .footer__menu,
    .footer-nav__col {
        align-items: center;
        text-align: center;
    }
}

@media screen and (max-width: 589px) {
    .single__main {
        flex-direction: column;
        align-items: center;
    }

    .single__img {
        width: 220px;
        height: 100%;
    }

    .download.section .btn {
        width: 100%;
        justify-content: center;
    }
}

@media screen and (max-width: 489px) {
    html {
        font-size: 80%;
    }

    .welcome__title {
        font-size: var(--fz-36px);
    }

    .games__item,
    .apps__item,
    .mods__item {
        width: 270px;
        height: 90px;
    }

    .games-item__img,
    .apps-item__img,
    .mods-item__img {
        width: 72px;
        height: 72px;
    }

    .footer__nav {
        flex-wrap: wrap;
        justify-content: center;
    }

    .games-item__title,
    .apps-item__title,
    .mods-item__title {
        font-size: var(--fz-14px);
    }
}

@media screen and (max-width: 429px) {
    .welcome__desc {
        font-size: var(--fz-14px);
    }

    .news__item {
        width: 350px;
        height: 180px;
    }
}
