/**
 * Responsive CSS — Crimson Lotus Theme
 */

/* ==========================================================================
   TABLET (max-width: 1024px)
   ========================================================================== */

@media (max-width: 1024px) {
    .cl-nav { display: none; }
    .cl-mobile-toggle { display: flex; }
    .cl-topbar-badges .cl-topbar-cta { display: none; }

    .cl-hero { flex-direction: column; }
    .cl-hero-left, .cl-hero-right { flex: none; width: 100%; }
    .cl-hero-left { order: 1; }
    .cl-hero-right { order: 2; min-height: 320px; }
    .cl-hero-left-inner { padding: 48px 32px; }
    .cl-hero-floats { flex-direction: row; justify-content: center; padding: 24px; gap: 1rem; }
    .cl-hero-float { width: auto; padding: 16px 24px; }
    .cl-float-num { font-size: 1.6rem; }

    .cl-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .cl-stat { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.08); }
    .cl-stat:nth-child(2n) { border-right: none; }
    .cl-stat:nth-last-child(-n+2) { border-bottom: none; }

    .cl-features-grid { grid-template-columns: repeat(2, 1fr); }
    .cl-bento { grid-template-columns: repeat(2, 1fr); }
    .cl-bento-featured { grid-column: 1 / -1; }
    .cl-articles-grid { grid-template-columns: repeat(2, 1fr); }
    .cl-about-grid { grid-template-columns: 1fr; }
    .cl-about-imgs { height: 280px; margin-top: 1rem; }
    .layout-sidebar { grid-template-columns: 1fr; }
    .sidebar { position: static; }

    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-brand { grid-column: 1 / -1; }
}

/* ==========================================================================
   MOBILE (max-width: 768px)
   ========================================================================== */

@media (max-width: 768px) {
    .cl-topbar-inner { padding: 0 1rem; }
    .cl-navbar-inner { padding: 0 1rem; }
    .cl-badge { display: none; }

    .cl-hero-left-inner { padding: 36px 20px; }
    .cl-hero-title { font-size: 1.8rem; }
    .cl-hero-floats { flex-direction: row; flex-wrap: wrap; padding: 16px; gap: 0.75rem; }
    .cl-hero-float { padding: 12px 16px; }
    .cl-hero-actions { flex-direction: column; }
    .cl-btn { width: 100%; justify-content: center; }

    .cl-features-grid { grid-template-columns: 1fr; }
    .cl-bento { grid-template-columns: 1fr; }
    .cl-bento-featured { grid-column: 1; }
    .cl-articles-grid { grid-template-columns: 1fr; }
    .cl-about-imgs { display: none; }
    .cl-about-grid { grid-template-columns: 1fr; }

    .cl-gallery-strip { height: 180px; }
    .cl-gallery-item { flex: 1 0 33%; }

    .cl-section { padding: 60px 0; }
    .cl-stats { padding: 40px 0; }
    .cl-stats-grid { grid-template-columns: repeat(2, 1fr); }

    .footer-grid { grid-template-columns: 1fr; gap: 2rem; }

    .casino-grid-new { grid-template-columns: repeat(2, 1fr); }
    .layout-sidebar { grid-template-columns: 1fr; }

    .cl-page-banner { padding: 36px 0 28px; }
    .cl-page-banner h1 { font-size: 1.5rem; }
}

/* ==========================================================================
   SMALL MOBILE (max-width: 480px)
   ========================================================================== */

@media (max-width: 480px) {
    .cl-hero-title { font-size: 1.5rem; }
    .cl-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .casino-grid-new { grid-template-columns: 1fr; }
    .cl-tags-cloud { gap: 0.5rem; }
    .cl-tag { padding: 6px 14px; font-size: 0.82rem; }
}