/**
 * Responsive CSS — Mobile Fixes
 * Compact sections, no horizontal overflow, proper breakpoints
 */

/* ====== GLOBAL DEFENSIVE RULES (no media query) ====== */
html {
    overflow-x: hidden;
}
body {
    overflow-x: hidden;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.prose pre,
.prose code,
.art-content pre,
.art-content code {
    overflow-x: auto;
    max-width: 100%;
}
.prose table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.prose img,
.prose iframe,
.prose video {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   TABLET (max-width: 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
    /* ---- Reduce section vertical spacing ---- */
    .ln-articles,
    .ln-cats,
    .ln-gallery,
    .ln-about,
    .ln-features,
    .ln-cta {
        padding: 3rem 0;
    }
    .ln-carousel,
    .ln-tags {
        padding: 2.5rem 0;
    }
    .ln-stats-band {
        padding: 2.5rem 0;
    }

    /* Section headers */
    .ln-section-hd,
    .ln-section-hd-center {
        margin-bottom: 2rem;
    }
    .ln-features-grid {
        margin-top: 2rem;
    }

    /* Article page layout — single column */
    .article-layout {
        grid-template-columns: 1fr;
    }
    .article-sidebar {
        order: 2;
    }

    /* Article inline layout */
    .art-layout {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .art-sidebar {
        position: static;
    }

    /* Grid auto: prevent overflow with large minmax */
    .grid-auto {
        grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    }
    .grid-auto-sm {
        grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
    }

    /* Related articles grid */
    .articles-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ==========================================================================
   TABLET PORTRAIT (max-width: 768px)
   ========================================================================== */
@media (max-width: 768px) {
    /* ---- Reduce section vertical spacing further ---- */
    .ln-articles,
    .ln-cats,
    .ln-gallery,
    .ln-about,
    .ln-features,
    .ln-cta {
        padding: 2rem 0;
    }
    .ln-carousel,
    .ln-tags {
        padding: 1.5rem 0;
    }
    .ln-stats-band {
        padding: 1.5rem 0;
    }

    /* Section headers */
    .ln-section-hd,
    .ln-section-hd-center {
        margin-bottom: 1.25rem;
    }
    .ln-features-grid {
        margin-top: 1.25rem;
    }

    /* Hero compact */
    .ln-hero {
        min-height: auto;
    }
    .ln-hero-content {
        padding: 3.5rem var(--container-padding) 2rem;
    }
    .ln-hero-badge {
        margin-bottom: 1rem;
        font-size: 0.72rem;
        padding: 0.3rem 0.75rem;
    }
    .ln-hero-title {
        margin-bottom: 1rem;
    }
    .ln-hero-subtitle {
        margin-bottom: 1.25rem;
    }
    .ln-hero-actions {
        margin-bottom: 1.5rem;
    }
    .ln-hero-stat-num {
        font-size: 1.5rem;
    }

    /* Stats band compact */
    .ln-stat-num {
        font-size: clamp(1.8rem, 1.5rem + 2vw, 2.5rem);
    }

    /* About section compact */
    .ln-about-inner {
        gap: 1.5rem;
    }
    .ln-about-img-main img {
        height: 250px;
    }
    .ln-about-big-stats {
        gap: 0.75rem;
    }

    /* Categories: tabs wrap compact */
    .ln-cat-tab {
        padding: 0.75rem 1rem;
        min-width: 120px;
    }
    .ln-cat-tab-icon {
        width: 32px;
        height: 32px;
    }
    .ln-cat-tab-icon svg {
        width: 14px;
        height: 14px;
    }
    .ln-cat-panel-img {
        height: 180px;
    }
    .ln-cat-panel-body {
        padding: 1rem;
    }

    /* Feature cards compact */
    .ln-feat-card {
        padding: 1.25rem;
    }
    .ln-feat-icon {
        width: 42px;
        height: 42px;
        margin-bottom: 0.75rem;
    }

    /* Footer compact */
    .footer {
        padding: 2rem 0 1rem;
    }
    .footer-grid {
        margin-bottom: 1.5rem;
        padding-bottom: 1.5rem;
        gap: 1.5rem;
    }

    /* Article page compact */
    .article-body-content {
        padding: 1.25rem;
    }
    .page-hero {
        padding: 2rem 0 1.5rem;
    }

    /* Article content inline styles */
    .art-wrapper {
        padding: 2rem 0;
    }
    .art-toc {
        padding: 1.25rem;
    }
    .art-toc-list {
        grid-template-columns: 1fr;
        gap: 0.3rem;
    }
    .art-takeaways {
        padding: 1.25rem;
    }
    .art-takeaways-list {
        grid-template-columns: 1fr;
    }
    .art-author {
        flex-direction: column;
        padding: 1.25rem;
        gap: 1rem;
    }
    .art-pullquote {
        padding: 1.25rem 1.25rem 1.25rem 1.5rem;
        margin: 1.5rem 0;
    }
    .art-stats-band {
        grid-template-columns: repeat(2, 1fr);
        padding: 1.5rem 1rem;
        gap: 1rem;
    }
    .art-section {
        margin-bottom: 2rem;
    }

    /* Float images — clear on mobile */
    .art-img-right,
    .art-img-left {
        float: none;
        width: 100%;
        margin: 1rem 0;
    }

    /* Casino grid — 2 columns on tablet portrait */
    .casino-grid-new {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 16px;
        padding-top: 44px;
    }

    /* Related articles */
    .articles-grid-3 {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    /* Category cards */
    .cats-magazine {
        grid-template-columns: repeat(auto-fill, minmax(min(180px, 100%), 1fr));
    }

    /* CTA compact */
    .ln-cta-inner {
        padding: 0 var(--container-padding);
    }
    .ln-cta-sub {
        margin-bottom: 1.25rem;
    }
}

/* ==========================================================================
   MOBILE (max-width: 640px)
   ========================================================================== */
@media (max-width: 640px) {
    :root {
        --container-padding: 1rem;
    }

    /* ---- Even more compact sections ---- */
    .ln-articles,
    .ln-cats,
    .ln-gallery,
    .ln-about,
    .ln-features,
    .ln-cta {
        padding: 1.5rem 0;
    }
    .ln-carousel,
    .ln-tags {
        padding: 1.25rem 0;
    }
    .ln-stats-band {
        padding: 1.25rem 0;
    }

    /* Section headers */
    .ln-section-hd,
    .ln-section-hd-center {
        margin-bottom: 1rem;
    }
    .ln-features-grid {
        margin-top: 1rem;
    }

    /* Hero very compact */
    .ln-hero-content {
        padding: 2.5rem var(--container-padding) 1.5rem;
    }
    .ln-hero-badge {
        margin-bottom: 0.75rem;
    }
    .ln-hero-title {
        font-size: clamp(1.8rem, 1.5rem + 2vw, 2.5rem);
        margin-bottom: 0.75rem;
    }
    .ln-hero-subtitle {
        margin-bottom: 1rem;
        font-size: 0.9rem;
    }
    .ln-hero-actions {
        margin-bottom: 1.25rem;
        gap: 0.75rem;
    }
    .ln-btn-primary,
    .ln-btn-ghost {
        padding: 0.7rem 1.5rem;
        font-size: 0.88rem;
    }
    .ln-hero-stat-num {
        font-size: 1.3rem;
    }
    .ln-hero-stat-label {
        font-size: 0.68rem;
    }

    /* Stats band compact */
    .ln-stat-num {
        font-size: clamp(1.5rem, 1.2rem + 1.5vw, 2rem);
    }
    .ln-stat-label {
        font-size: 0.72rem;
    }

    /* About section */
    .ln-about-img-main img {
        height: 200px;
    }

    /* Gallery */
    .ln-gallery-item img {
        min-height: 120px;
    }

    /* Article page */
    .art-wrapper {
        padding: 1.5rem 0;
    }
    .art-container {
        padding: 0 1rem;
    }
    .art-content {
        font-size: 1rem;
    }
    .art-section {
        margin-bottom: 1.5rem;
    }
    .art-toc {
        padding: 1rem;
    }
    .art-takeaways {
        padding: 1rem;
        margin: 1.5rem 0;
    }
    .art-author {
        padding: 1rem;
        margin: 1.5rem 0 0 0;
    }
    .art-author-avatar {
        width: 60px;
        height: 60px;
        font-size: 1.3rem;
    }
    .art-stats-band {
        padding: 1.25rem 0.75rem;
        margin: 1.5rem 0;
        border-radius: 12px;
    }
    .art-callout {
        padding: 1rem;
        margin: 1rem 0;
    }
    .art-pullquote {
        margin: 1rem 0;
        padding: 1rem 1rem 1rem 1.25rem;
    }
    .art-pullquote::before {
        font-size: 3rem;
        top: -0.25rem;
        left: 0.5rem;
    }

    /* Casino grid — single column on mobile */
    .casino-grid-new {
        grid-template-columns: 1fr;
        gap: 36px 0;
        padding-top: 44px;
    }

    /* Page hero compact */
    .page-hero {
        padding: 1.5rem 0 1rem;
    }
    .page-hero-title {
        font-size: clamp(1.3rem, 1rem + 2vw, 2rem);
    }
    .page-breadcrumb {
        font-size: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Article body */
    .article-body-content {
        padding: 1rem;
    }
    .article-layout {
        padding: 1.5rem 0;
        gap: 1.5rem;
    }

    /* Footer compact */
    .footer {
        padding: 1.5rem 0 1rem;
    }
    .footer-grid {
        gap: 1.25rem;
        margin-bottom: 1rem;
        padding-bottom: 1rem;
    }

    /* CTA section */
    .ln-cta-title {
        font-size: clamp(1.3rem, 1rem + 2vw, 2rem);
    }
    .ln-cta-sub {
        font-size: 0.88rem;
        margin-bottom: 1rem;
    }

    /* Cat listing */
    .cat-listing {
        padding: 1.5rem 0 2rem;
    }
    .cat-card {
        padding: 1rem;
        min-height: 140px;
    }
    .subcat-listing {
        padding: 1.5rem 0 2rem;
    }
}

/* ==========================================================================
   SMALL MOBILE (max-width: 480px)
   ========================================================================== */
@media (max-width: 480px) {
    /* Sections minimal */
    .ln-articles,
    .ln-cats,
    .ln-gallery,
    .ln-about,
    .ln-features,
    .ln-cta {
        padding: 1.25rem 0;
    }
    .ln-carousel,
    .ln-tags {
        padding: 1rem 0;
    }
    .ln-stats-band {
        padding: 1rem 0;
    }

    /* Hero */
    .ln-hero-content {
        padding: 2rem var(--container-padding) 1.25rem;
    }
    .ln-hero-title {
        font-size: 1.7rem;
    }
    .ln-hero-stats {
        gap: 1rem;
    }

    /* Stats */
    .ln-stats-grid {
        gap: 0.75rem;
    }

    /* About */
    .ln-about-big-stats {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }
    .ln-about-big-stat {
        padding: 0.75rem;
    }
    .ln-about-big-stat-num {
        font-size: 1.3rem;
    }

    /* Art stats */
    .art-stats-band {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
        padding: 1rem 0.5rem;
    }

    /* Gallery minimal height */
    .ln-gallery-mosaic {
        gap: 0.5rem;
    }

    /* Feature cards */
    .ln-feat-card {
        padding: 1rem;
    }
    .ln-feat-num {
        font-size: 2rem;
        top: 0.75rem;
        right: 0.75rem;
    }
}

/* ==========================================================================
   VERY SMALL SCREENS (max-width: 380px)
   ========================================================================== */
@media (max-width: 380px) {
    :root {
        --container-padding: 0.75rem;
    }

    .ln-hero-content {
        padding: 1.75rem var(--container-padding) 1rem;
    }
    .ln-hero-title {
        font-size: 1.5rem;
    }
    .ln-hero-subtitle {
        font-size: 0.82rem;
    }
    .ln-hero-badge {
        font-size: 0.65rem;
        padding: 0.25rem 0.6rem;
    }
    .ln-btn-primary,
    .ln-btn-ghost {
        padding: 0.6rem 1.25rem;
        font-size: 0.82rem;
    }

    .ln-section-title {
        font-size: clamp(1.15rem, 1rem + 1vw, 1.6rem);
    }

    .ln-stat-num {
        font-size: 1.3rem;
    }

    /* About stats single column */
    .ln-about-big-stats {
        grid-template-columns: 1fr;
    }

    .art-stats-band {
        grid-template-columns: 1fr;
    }

    .page-hero-title {
        font-size: 1.2rem;
    }

    .article-body-content {
        padding: 0.75rem;
    }

    /* Cat tab compact */
    .ln-cat-tab {
        padding: 0.6rem 0.75rem;
        min-width: 100px;
    }
    .ln-cat-tab-name {
        font-size: 0.78rem;
    }
}

/* ==========================================================================
   TOUCH DEVICE ADJUSTMENTS
   ========================================================================== */
@media (hover: none) {
    .ln-art-card:hover {
        transform: none;
    }
    .ln-feat-card:hover {
        transform: none;
    }
    .cat-card:hover {
        transform: none;
    }
    .article-grid-card:hover {
        transform: none;
    }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    html {
        scroll-behavior: auto;
    }
    .carousel-row {
        animation: none;
    }
    .ln-marquee-track {
        animation: none;
    }
}