﻿@media (max-width: 1200px) {
.page-layout {
    padding: 20px 20px 36px;
    gap: 18px;
}
}

@media (max-width: 1024px) {
:root {
    --sidebar-left-width: 188px;
    --sidebar-right-width: 240px;
}

.page-layout {
    grid-template-columns: var(--sidebar-left-width) 1fr;
    gap: 16px;
}

.sidebar--left { top: calc(var(--header-height) + 16px); }

.sidebar--right {
    grid-column: 1 / -1;
    position: static;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.sidebar__nav-link {
    padding: 10px 12px;
    font-size: 13px;
    gap: 10px;
}

.sidebar__nav-text { font-size: 13px; }

.hero__slider-main { min-height: 240px; }

.popular-games__grid { grid-template-columns: repeat(3, 1fr); }

.site-footer__top {
    grid-template-columns: 1fr;
    gap: 36px;
}

html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

.page-layout, .page-layout__main, .hero, .featured-games, .popular-games, .faq, .seo-article, .site-footer, .site-footer__inner {
    max-width: 100%;
    overflow-x: hidden;
}

.featured-games__track, .popular-games__grid { max-width: 100%; }

img, video, svg {
    max-width: 100%;
    height: auto;
}
}

@media (max-width: 992px) {
:root { --header-height: 68px; }

.site-header__inner {
    padding: 0 16px;
    gap: 12px;
}

.site-header__menu-toggle {
    display: flex;
    min-width: 44px;
    min-height: 44px;
}

.site-header__menu-toggle-icon {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 5px;
    width: 42%;
    max-width: 20px;
    min-width: 16px;
}

.site-header__menu-toggle-line {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 1px;
    background-color: var(--color-text-secondary);
}

.site-header__auth-button {
    min-height: 44px;
    padding: 0 16px;
    font-size: 13px;
}

.site-header__logo-image { height: calc(32px * 1.3); }

.page-layout {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
    padding: 14px 16px 32px;
    gap: 20px;
    overflow-x: hidden;
}

.page-layout__main { display: contents; }

.sidebar--left {
    position: fixed;
    top: var(--header-height);
    left: 0;
    bottom: 0;
    z-index: 900;
    width: min(280px, 88vw);
    transform: translateX(-105%);
    transition: transform 0.38s var(--ease-out);
    order: 0;
    border-radius: 0 var(--radius) var(--radius) 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.sidebar--left.is-open { transform: translateX(0); }

.sidebar__nav { padding: 16px 12px; }

.sidebar__nav-list {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 4px;
}

.sidebar__nav-link {
    min-height: 44px;
    padding: 12px 14px;
    font-size: 14px;
    transform: none;
}

.sidebar__nav-link:hover { transform: none; }

.sidebar__nav-text { display: inline; }

.hero { order: 1; }

.sidebar--right {
    order: 2;
    position: static;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    width: 100%;
}

.popular-games { order: 3; }

.seo-article { order: 4; }

.faq { order: 5; }

.featured-games { order: 6; }

.hero {
    margin-bottom: 0;
    width: 100%;
}

.hero__inner { gap: 16px; }

.hero__slider {
    grid-template-columns: 1fr;
    width: 100%;
}

.hero__slider-main {
    aspect-ratio: 1920 / 840;
    width: 100%;
    min-height: unset;
    height: auto;
}

.hero__thumbnails {
    flex-direction: row;
    padding: 0 10px 10px;
}

.hero__thumbnail-list {
    flex-direction: row;
    gap: 8px;
}

.hero__thumbnail {
    flex: 1;
    min-height: 52px;
    max-height: 52px;
}

.hero__nav {
    opacity: 1;
    width: 44px;
    height: 44px;
    min-height: 44px;
    min-width: 44px;
}

.featured-games__track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    overflow-x: visible;
    scroll-snap-type: none;
    padding: 0 0 8px;
}

.featured-games__card {
    flex: none;
    width: 100%;
    scroll-snap-align: unset;
}

.featured-games__controls { display: none; }

.popular-games__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.faq, .seo-article, .site-footer { width: 100%; }

.faq__question {
    min-height: 44px;
    padding: 14px 18px;
    font-size: 14px;
}

.site-footer__nav { grid-template-columns: repeat(2, 1fr); }

button, .site-header__auth-button, .popular-games__more-link, .featured-games__nav, .site-footer__social-link, .sidebar__nav-link, .hero__thumbnail, .hero__nav { min-height: 44px; }

.featured-games__nav, .site-footer__social-link, .hero__nav, .hero__thumbnail { min-width: 44px; }

.site-header, .sidebar--left, .widget {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.widget:hover, .game-card__link:hover, .faq__item:hover, .hero__slider:hover, .featured-games__card.is-card-active .game-card__link { transform: none; }

.featured-games, .popular-games, .faq { margin-bottom: 28px; }

.featured-games__title, .popular-games__title, .faq__title { font-size: 1.15rem; }
}

@media (max-width: 768px) {
.sidebar--right { grid-template-columns: repeat(2, 1fr); }

.site-footer__inner { padding: 36px 16px 20px; }
}

@media (max-width: 576px) {
:root { --header-height: 64px; }

body { font-size: 14px; }

.sidebar--right { grid-template-columns: 1fr; }

.site-footer__nav {
    grid-template-columns: 1fr;
    gap: 24px;
}

.site-footer__bottom {
    flex-direction: column;
    text-align: center;
    gap: 12px;
}

.site-footer__legal {
    justify-content: center;
    flex-wrap: wrap;
}
}

@media (max-width: 992px) {
.popular-games, .faq, .seo-article {
    content-visibility: auto;
    contain-intrinsic-size: auto 480px;
}

.site-header__inner, .page-layout, .hero__inner, .featured-games__inner, .popular-games__inner, .faq__inner, .seo-article__inner, .site-footer__inner {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.featured-games__card, .popular-games__card, .game-card__link, .widget, .faq__item, .sidebar__nav-link {
    min-width: 0;
    max-width: 100%;
}

.site-header { overflow: hidden; }

.site-header__brand {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 42%;
}

.site-header__logo-image {
    max-width: 100%;
    object-fit: contain;
}

.site-header__actions {
    flex: 0 0 auto;
    gap: 8px;
    margin-left: auto;
}

.site-header__auth-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}

.site-header__menu-toggle {
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}

.sidebar--left {
    padding-bottom: env(safe-area-inset-bottom, 16px);
    overscroll-behavior: contain;
    box-shadow: 4px 0 32px rgba(0, 0, 0, 0.45);
}

.sidebar__nav-list { gap: 6px; }

.sidebar__nav-link {
    gap: 14px;
    line-height: 1.35;
}

.sidebar__nav-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar--right { gap: 14px; }

.widget__body { overflow: hidden; }

.widget__list-name, .widget__list-value, .widget__status-name, .widget__rtp-game {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.widget__jackpot-value {
    font-size: clamp(0.95rem, 4.5vw, 1.25rem);
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.35;
}

.widget__stat-value { font-size: clamp(1.35rem, 6vw, 1.75rem); }

.widget__bonus-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 0;
}

.hero, .hero__slider, .hero__slider-main, .hero__slides {
    max-width: 100%;
    overflow: hidden;
}

.hero__slide--active .hero__slide-image {
    animation: none;
    transform: none;
}

.hero__slide-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.hero__thumbnails {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.hero__thumbnails::-webkit-scrollbar { display: none; }

.hero__thumbnail-list {
    flex-wrap: nowrap;
    gap: 8px;
    padding-bottom: 2px;
}

.hero__thumbnail {
    flex: 0 0 56px;
    min-width: 56px;
    max-width: 56px;
    min-height: 44px;
    max-height: 44px;
}

.hero__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero__dots {
    max-width: calc(100% - 32px);
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    bottom: 12px;
}

.hero__dot {
    min-height: unset;
    min-width: unset;
    width: 8px;
    height: 8px;
}

.hero__dot--active {
    width: 20px;
    height: 8px;
}

.hero__nav--prev { left: 10px; }

.hero__nav--next { right: 10px; }

.featured-games__track, .popular-games__grid {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.game-card__link { overflow: hidden; }

.game-card__media {
    display: block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    width: 100%;
    border-radius: var(--radius) var(--radius) 0 0;
    line-height: 0;
}

.featured-games .game-card__media { aspect-ratio: 16 / 10; }

.game-card__image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    object-fit: cover;
    object-position: center center;
}

.popular-games .game-card__media { aspect-ratio: 4 / 5; }

.popular-games .game-card__image {
    object-fit: cover;
    object-position: center center;
    transform-origin: center center;
}

.game-card__link:hover .game-card__image, .featured-games__card.is-card-active .game-card__image { transform: none; }

.game-card__body {
    min-width: 0;
    padding: 12px 12px 14px;
}

.game-card__title, .game-card__provider, .game-card__players {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.featured-games .game-card__title {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: unset;
}

.featured-games .game-card__link { min-height: 0; }

.featured-games .game-card__body { padding: 12px; }

.review-card__content {
    font-size: 11px;
    -webkit-line-clamp: 4;
}

.game-card__badge {
    max-width: calc(100% - 20px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    top: 8px;
    left: 8px;
}

.faq__accordion { gap: 10px; }

.faq__question {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: break-word;
    align-items: flex-start;
    line-height: 1.5;
    padding: 14px 16px;
    gap: 12px;
    min-height: 48px;
}

.faq__question::after {
    flex-shrink: 0;
    margin-top: 2px;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    font-size: 18px;
}

.faq__answer { padding: 0 16px 16px; }

.faq__answer p {
    word-break: break-word;
    overflow-wrap: break-word;
    line-height: 1.65;
}

.site-footer { overflow: hidden; }

.site-footer__inner {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
}

.site-footer__nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 0;
    word-break: break-word;
    overflow-wrap: break-word;
    line-height: 1.45;
}

.site-footer__social-link {
    width: 48px;
    height: 48px;
}

.site-footer__copyright {
    line-height: 1.55;
    word-break: break-word;
}

.site-footer__legal {
    gap: 16px;
    row-gap: 8px;
}

.site-footer__legal-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 0;
}

.featured-games, .popular-games, .faq { margin-bottom: 32px; }

.featured-games__header, .popular-games__header, .faq__header { margin-bottom: 16px; }

.popular-games__more { margin-top: 20px; }

.popular-games__more-link {
    min-height: 48px;
    padding: 12px 24px;
    width: 100%;
    max-width: 320px;
    justify-content: center;
}

.seo-article h3 { margin-top: 1.75rem; }

.seo-article p { word-break: break-word; }

.scroll-to-top {
    right: max(16px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
}

button, a, .sidebar__nav-link, .game-card__link, .faq__question { touch-action: manipulation; }
}

@media (max-width: 414px) {
.site-header__inner {
    padding: 0 12px;
    gap: 8px;
}

.site-header__brand { max-width: 38%; }

.site-header__auth-button {
    padding: 0 12px;
    font-size: 12px;
}

.page-layout {
    padding: 12px 14px 28px;
    gap: 18px;
}

.featured-games__track, .popular-games__grid { gap: 12px; }
}

@media (max-width: 430px) {
.sidebar--right { gap: 12px; }

.widget__body { padding: 14px; }
}

@media (max-width: 390px) {
.site-header__auth-button {
    padding: 0 10px;
    font-size: 11px;
    min-height: 44px;
}

.site-header__logo-image {
    height: calc(26px * 1.3);
    max-width: 100%;
    object-fit: contain;
}

.game-card__body { padding: 10px 10px 12px; }

.game-card__title { font-size: 0.8125rem; }
}

@media (max-width: 375px) {
.site-header__actions { gap: 6px; }
}

@media (max-width: 360px) {
.page-layout {
    padding: 10px 12px 24px;
    gap: 16px;
}

.featured-games__track, .popular-games__grid { gap: 12px; }

.faq__question {
    font-size: 13px;
    padding: 13px 14px;
}

.site-footer__inner { padding: 32px 12px 18px; }
}

@media (max-width: 320px) {
.site-header__brand { max-width: 34%; }

.site-header__auth-button {
    font-size: 10px;
    padding: 0 8px;
    letter-spacing: -0.02em;
}

.site-header__menu-toggle { width: 44px; }

.hero__thumbnail {
    flex: 0 0 50px;
    min-width: 50px;
    max-width: 50px;
}

.widget__jackpot-value { font-size: 0.9rem; }

.game-card__title { font-size: 0.75rem; }

.game-card__provider, .game-card__players { font-size: 0.6875rem; }

.scroll-to-top {
    right: 12px;
    bottom: 12px;
}
}
