/* ПОЛНАЯ АДАПТАЦИЯ САЙТА ДЛЯ ВСЕХ ЭКРАНОВ */

/* Базовые настройки */
* {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden !important;
    margin: 0;
    padding: 0;
}

/* ===== ЛОГОТИП - АДАПТАЦИЯ ДЛЯ ВСЕХ ЭКРАНОВ ===== */

/* Маленькие ноутбуки и планшеты (1024px - 1440px) */
@media (min-width: 1024px) and (max-width: 1440px) {
    .logo {
        transform: translate(0, 10px) scale(3) !important;
        transform-origin: left center !important;
    }
}

/* Планшеты (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
    .logo {
        transform: translate(0, 10px) scale(2.5) !important;
        transform-origin: left center !important;
    }
}

/* Мобильные (до 767px) */
@media (max-width: 767px) {
    .logo {
        transform: translate(0, 5px) scale(2) !important;
        transform-origin: center center !important;
    }
}

/* ===== АДАПТАЦИЯ КОНТЕНТА ДЛЯ НОУТБУКОВ ===== */

@media (min-width: 1024px) and (max-width: 1440px) {

    /* Главный контейнер */
    .intro-container {
        max-width: 100%;
        padding: 16px;
        gap: 8px;
    }

    /* Карточки персонажей */
    .card {
        width: 130px !important;
        height: 260px !important;
    }

    .card.center {
        width: 130px !important;
        height: 260px !important;
    }

    /* Шапка */
    header {
        padding: 32px 24px 0;
        max-width: 100%;
    }

    /* Меню */
    .nav-item {
        font-size: 14px;
    }

    /* Секции */
    .container {
        max-width: 100%;
        padding: 0 24px;
    }

    .titan-news,
    .how-to-play,
    .move-with-us,
    .faq {
        padding: 48px 24px;
    }

    /* FAQ для ноутбуков */
    .faq-body {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
    }

    .faq-body .card {
        min-height: auto !important;
        overflow: visible !important;
    }

    .faq-body .card__title,
    .faq-body .card__text {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
    }

    /* Футер */
    footer {
        padding: 48px 24px 24px;
    }
}

/* ===== АДАПТАЦИЯ ДЛЯ ПЛАНШЕТОВ ===== */

@media (min-width: 768px) and (max-width: 1023px) {

    /* Карточки в сетку */
    .intro-container {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(2, 1fr);
        gap: 10px;
        padding: 16px;
        max-width: 100%;
    }

    .card {
        width: 100% !important;
        height: 200px !important;
    }

    .card.center {
        grid-column: 2 / 4;
        grid-row: 1 / 3;
        width: 100% !important;
        height: 100% !important;
    }

    /* Шапка */
    header {
        padding: 24px 20px 0;
    }

    .nav-item {
        font-size: 13px;
    }

    .donate-button {
        font-size: 13px;
        padding: 10px 16px;
    }

    /* Контент */
    .container {
        padding: 0 20px;
    }

    .titan-news,
    .how-to-play,
    .move-with-us,
    .faq {
        padding: 40px 20px;
    }

    /* FAQ для планшетов */
    .faq-body {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    .faq-body .card {
        min-height: auto !important;
        overflow: visible !important;
    }

    .faq-body .card__title,
    .faq-body .card__text {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
    }

    /* Футер */
    footer {
        padding: 40px 20px 20px;
    }

    footer nav ul {
        flex-wrap: wrap;
        gap: 20px;
    }
}

/* ===== АДАПТАЦИЯ ДЛЯ МОБИЛЬНЫХ ===== */

@media (max-width: 767px) {

    /* Шапка */
    header {
        padding: 16px !important;
        background: rgba(10, 10, 10, 0.98);
    }

    .left {
        gap: 12px;
        margin-right: 16px;
    }

    .nav-item-wrapper {
        display: none !important;
    }

    .burger {
        display: flex !important;
    }

    .donate-button {
        font-size: 12px;
        padding: 8px 14px;
    }

    /* СКРЫВАЕМ карточки персонажей на мобильных */
    .intro-container {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }

    .intro-container .card {
        display: none !important;
    }

    /* Скрываем фон интро секции */
    .intro {
        min-height: auto !important;
        padding: 80px 0 40px 0 !important;
    }

    /* Показываем только кнопку "Начать играть" */
    .intro-play-container {
        display: flex !important;
        margin-top: 0 !important;
        padding-top: 20px !important;
    }

    /* Контент */
    .container {
        padding: 0 16px;
    }

    .titan-news,
    .how-to-play,
    .move-with-us,
    .faq {
        padding: 32px 16px;
    }

    /* Новости */
    .titan-news__card {
        flex-direction: column;
    }

    .titan-news__media {
        width: 100%;
        height: 180px;
    }

    .titan-news__grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* Как начать играть */
    .how-to-play .row {
        flex-direction: column;
        gap: 12px;
    }

    /* Социальные сети */
    .move-with-us .row-container {
        flex-direction: column;
        gap: 12px;
    }

    .social-card {
        width: 100%;
    }

    /* FAQ - ОПТИМИЗАЦИЯ ДЛЯ МОБИЛЬНЫХ */
    .faq-body {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .faq-body .card {
        width: 100% !important;
        min-height: auto !important;
        padding: 16px !important;
        overflow: visible !important;
    }

    .faq-body .card__title {
        font-size: 15px !important;
        margin-bottom: 10px !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .faq-body .card__text {
        font-size: 13px !important;
        line-height: 1.5 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    /* Футер */
    footer {
        padding: 32px 16px 16px;
    }

    footer nav ul {
        flex-direction: column;
        gap: 20px;
    }

    .nav-block {
        width: 100%;
    }

    .payment-method-list {
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }
}

/* ===== ОЧЕНЬ МАЛЕНЬКИЕ ЭКРАНЫ ===== */

@media (max-width: 480px) {
    header {
        padding: 12px !important;
    }

    .logo {
        transform: translate(0, 5px) scale(1.8) !important;
    }

    .donate-button {
        font-size: 11px;
        padding: 6px 12px;
    }

    .card {
        height: 160px !important;
    }

    .card.center {
        height: 200px !important;
    }

    .titan-news,
    .how-to-play,
    .move-with-us,
    .faq {
        padding: 24px 12px;
    }

    footer {
        padding: 24px 12px 12px;
    }
}

/* ===== ИСПРАВЛЕНИЕ ПЕРЕПОЛНЕНИЯ ===== */

.intro-back,
.intro-overlay,
.intro-back-biker,
.app,
main,
section,
.container {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}