/* Адаптация для планшетов и смартфонов */
@media (max-width: 768px) {

    /* 1. Общие настройки */
    h1 {
        font-size: 2.5rem !important;
        /* Уменьшаем название группы */
        letter-spacing: 5px;
    }

    /* 2. Навигация (меню) */
    nav {
        display: flex;
        flex-direction: column;
        /* Ссылки друг под другом */
        gap: 15px;
        margin-top: 20px;
    }

    nav a {
        font-size: 1.2rem;
        padding: 10px;
        border: 1px solid rgba(255, 255, 255, 0.1);
        /* Добавляем контур для кликабельности */
    }

    /* 3. Плеер */
    .player-box {
        width: 90%;
        /* Плеер на почти всю ширину экрана */
        bottom: 20px;
        left: 5%;
        transform: none;

    }

    .player-controls {
        flex-wrap: wrap;
        /* Кнопки могут переноситься */
        justify-content: center;

    }

    /* 4. Оверлеи (текст биографии и манифеста) */
    .overlay {
        padding: 40px 15px;
        /* Меньше отступов по бокам */
    }

    .manifesto-content,
    .rider-content {
        width: 95%;
        font-size: 1rem;
    }

    /* 5. Видео и Релизы */
    .video-grid,
    .releases-container {
        grid-template-columns: 1fr;
        /* Всё в одну колонку */
        gap: 30px;
        /* Добавляем отступ между альбомами */
    }

    .album-card {
        display: flex !important;
        flex-direction: column !important;
        /* Форсируем вертикальный стек */
        align-items: center;
        text-align: center;
        gap: 20px;
        /* Отступ между обложкой и списком */
    }

    /* Если в HTML обложка идет ПОСЛЕ текста, 
       мы можем принудительно поднять её наверх через order */
    .album-card img {
        order: 1;
        /* Обложка первая */
        width: 100%;
        max-width: 300px;
        height: auto;
        filter: grayscale(100%) contrast(120%);
        /* Поддерживаем DSBM вайб */
    }

    .album-info,
    .song-list {
        order: 2;
        /* Список песен второй */
        width: 90%;
        text-align: left;
    }
}