/*
 * NudixFun Responsive Design
 * Covers all devices: 1800px → 320px
 * Mobile-first approach with progressive enhancement
 */

/* ===== 1800px+ LARGE DESKTOP ===== */
@media (min-width: 1800px) {
  :root { --nudix-container: 1320px; }
  .nudix-hero-section { padding: 120px 0; }
  .nudix-hero-title { font-size: 48px; max-width: 900px; margin: 0 auto 35px; }
  .nudix-posts-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
  .footer-columns-4 { grid-template-columns: repeat(4, 1fr); gap: 40px; }
}

/* ===== 1400px+ DESKTOP ===== */
@media (min-width: 1400px) and (max-width: 1799px) {
  :root { --nudix-container: 1200px; }
  .nudix-hero-title { font-size: 42px; max-width: 800px; margin: 0 auto 30px; }
  .nudix-posts-grid { grid-template-columns: repeat(2, 1fr); gap: 28px; }
}

/* ===== 1200px+ SMALL DESKTOP ===== */
@media (min-width: 1200px) and (max-width: 1399px) {
  .nudix-posts-grid { grid-template-columns: repeat(2, 1fr); gap: 25px; }
  .nudix-hero-title { font-size: 38px; }
}

/* ===== 1025px-1199px TABLET LANDSCAPE ===== */
@media (max-width: 1199px) and (min-width: 1025px) {
  .nudix-container { max-width: 960px; }
  .nudix-primary { flex: 0 1 65%; max-width: 65%; }
  .nudix-secondary { flex: 0 1 33%; max-width: 33%; }
  .nudix-hero-title { font-size: 32px; }
  .footer-columns-4 { grid-template-columns: repeat(2, 1fr); }
  .nudix-posts-grid { grid-template-columns: 1fr; }
  .blaze-box-wrap { gap: 18px; padding: 18px; }
  .post-thumb-wrap { flex: 0 0 240px; }
  .post-thumb-wrap img { height: 170px; }
}

/* ===== 1024px TABLET PORTRAIT + MOBILE ===== */
@media (max-width: 1024px) {
  .nudix-row:not(.footer-grid):not(.bottom-inner-wrapper) { flex-direction: column; }
  .nudix-primary,
  .nudix-secondary { flex: 0 1 100%; max-width: 100%; padding: 0; }
  .nudix-secondary { margin-top: 35px; }
  .site-title a { font-size: 32px; }
  .site-description { font-size: 12px; }
  .nudix-hero-title { font-size: 28px; }
  .nudix-hero-section { padding: 60px 0; }
  .nudix-hero-btn { padding: 0.9rem 2.2rem; font-size: 14px; }
  .blaze-box-wrap { flex-direction: column; gap: 16px; padding: 18px; }
  .post-thumb-wrap { flex: none; }
  .post-thumb-wrap img { height: 220px; }
  .post-title { font-size: 20px; }
  .footer-columns-4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { row-gap: 35px; }
  .site-branding { flex: 1; }
  .social-icons-wrap,
  .header-actions { display: none; }
  .nudix-main-content { padding: 30px 0; }
  .page-header { margin-bottom: 25px; }
  .nudix-404-page { padding: 60px 0; }
  .error-code { font-size: 90px; }
  .widget { padding: 18px; }
  .single-post .entry-title { font-size: 28px; }
  .nudix-posts-grid { gap: 22px; }
  .entry-content table { font-size: 13px; }
  .entry-content table th,
  .entry-content table td { padding: 10px 12px; }

  /* Mobile menu transition */
  .main-navigation .nav-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--nudix-white);
    flex-direction: column;
    box-shadow: 0 12px 40px rgba(0,0,0,0.12);
    z-index: 999;
    padding: 8px 0;
    max-height: 80vh;
    overflow-y: auto;
    border-top: 2px solid var(--nudix-primary);
  }
  .main-navigation .nav-menu.active { display: flex; }
  .main-navigation .nav-menu > li > a {
    padding: 14px 22px;
    border-bottom: 1px solid var(--nudix-border);
    line-height: 1.4;
    font-size: 15px;
  }
  .sub-menu {
    position: static;
    box-shadow: none;
    padding-left: 22px;
    display: none;
    background: #f8fafc;
    border-radius: 0;
  }
  .main-navigation .nav-menu li:hover > .sub-menu,
  .main-navigation .nav-menu li.focus > .sub-menu { display: none; }
  .main-navigation .nav-menu li.menu-item-has-children.active > .sub-menu { display: block; }
  .menu-toggle { display: flex; }
  .site-footer .bottom-inner-wrapper { flex-direction: column; gap: 12px; text-align: center; }
  .bottom-menu ul { justify-content: center; }
  .scroll-to-top { width: 42px; height: 42px; bottom: 20px; right: 20px; }
  .entry-content h2 { font-size: 22px; }
  .entry-content h3 { font-size: 18px; }
}

/* ===== 768px TABLET SMALL ===== */
@media (max-width: 768px) {
  :root { --nudix-header-padding: 10px; }
  .nudix-container { padding-right: 0.9rem; padding-left: 0.9rem; }
  .site-title a { font-size: 26px; }
  .nudix-hero-title { font-size: 24px; margin-bottom: 20px; }
  .nudix-hero-section { padding: 50px 0; }
  .nudix-hero-btn { padding: 0.8rem 1.8rem; font-size: 13px; border-radius: 50px; }
  .post-thumb-wrap img { height: 200px; }
  .post-title { font-size: 18px; }
  .post-excerpt { font-size: 14px; }
  .nudix-hero-section::before { opacity: 0.3; }
  .footer-grid { gap: 30px; }
  .footer-columns-4,
  .footer-columns-3 { grid-template-columns: repeat(2, 1fr); }
  .site-footer .main-footer { padding: 45px 0 30px; }
  .single-post .entry-title { font-size: 24px; }
  .single-post .entry-content { font-size: 16px; }
  .page-title { font-size: 24px; }
  .error-code { font-size: 70px; }
  .comment-body { flex-direction: column; gap: 10px; }
  .nudix-pagination ul { flex-wrap: wrap; }
  .nudix-pagination ul li a,
  .nudix-pagination ul li span { min-width: 36px; height: 36px; font-size: 13px; }
  .nudix-breadcrumbs { font-size: 12px; }
  .nudix-table-wrap { margin: 15px 0; }
  .nudix-features { grid-template-columns: 1fr; }
  .nudix-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .nudix-compare-grid { grid-template-columns: 1fr; }
  .nudix-keypoints { padding: 22px; }
  .nudix-keypoints h3 { font-size: 18px; }
  .nudix-keypoints ul li { font-size: 14px; }
  .ticker-title { font-size: 11px; padding: 3px 10px; }
  .ticker-item a { font-size: 13px; }
  .nudix-faq-q { font-size: 14px; padding: 13px 16px; }
  .nudix-faq-a { font-size: 13px; }
  .post-tags a { font-size: 12px; padding: 3px 10px; }
  .single-post .post-thumbnail { border-radius: 6px; }
}

/* ===== 610px MOBILE MEDIUM ===== */
@media (max-width: 610px) {
  :root { --nudix-header-padding: 5px; }
  .nudix-container { padding-right: 0.75rem; padding-left: 0.75rem; }
  .site-title a { font-size: 22px; }
  .site-description { font-size: 11px; padding: 3px 5px 0; }
  .nudix-hero-title { font-size: 20px; }
  .nudix-hero-section { padding: 40px 0; }
  .nudix-hero-btn { padding: 0.7rem 1.5rem; font-size: 12px; }
  .nudix-main-content { padding: 20px 0; }
  .post-title { font-size: 16px; }
  .blaze-box-wrap { padding: 14px; gap: 12px; }
  .post-thumb-wrap img { height: 200px; }
  .post-meta { font-size: 11px; gap: 10px; flex-wrap: wrap; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-columns-4,
  .footer-columns-3,
  .footer-columns-2 { grid-template-columns: 1fr; }
  .site-footer .main-footer { padding: 35px 0 20px; }
  .error-code { font-size: 56px; }
  .nudix-404-page { padding: 40px 0; }
  .nudix-404-content h2 { font-size: 22px; }
  .scroll-to-top { width: 38px; height: 38px; bottom: 16px; right: 16px; }
  .scroll-to-top svg { width: 15px; height: 15px; }
  h2.widget-title { font-size: 13px; }
  .widget { padding: 15px; margin-bottom: 22px; }
  .single-post .entry-title { font-size: 20px; }
  .single-post .entry-meta { font-size: 12px; gap: 10px; }
  .single-post .entry-content { font-size: 15px; }
  .page-title { font-size: 20px; }
  .search-form { flex-direction: column; gap: 8px; }
  .search-form .search-submit { width: 100%; justify-content: center; }
  .nudix-main-content table { font-size: 12px; }
  .nudix-main-content table th,
  .nudix-main-content table td { padding: 8px 10px; }
  .nudix-cat-grid { grid-template-columns: 1fr; }
  .ticker-news-wrap { flex-wrap: wrap; gap: 8px; }
  .ticker-title { margin-bottom: 4px; }
  .post-categories a { font-size: 10px; padding: 2px 8px; }
  .nudix-posts-grid { gap: 16px; }
  .main-navigation .nav-menu > li > a { padding: 12px 16px; font-size: 14px; }
  .sub-menu { padding-left: 16px; }
  .sub-menu a { padding: 10px 16px; font-size: 13px; }
}

/* ===== 480px MOBILE SMALL ===== */
@media (max-width: 480px) {
  .nudix-container { padding-right: 0.65rem; padding-left: 0.65rem; }
  .site-title a { font-size: 19px; }
  .site-branding-section { padding: 5px 0; }
  .nudix-hero-title { font-size: 17px; }
  .nudix-hero-section { padding: 30px 0; }
  .nudix-hero-btn { padding: 0.6rem 1.2rem; font-size: 11px; }
  .post-thumb-wrap img { height: 180px; }
  .post-title { font-size: 15px; line-height: 1.3; }
  .post-excerpt { font-size: 13px; }
  .blaze-box-wrap { padding: 12px; gap: 10px; }
  .post-meta { font-size: 10px; gap: 8px; }
  .post-link-button { font-size: 12px; }
  .single-post .entry-title { font-size: 18px; }
  .single-post .entry-meta { font-size: 11px; }
  .single-post .entry-content { font-size: 14px; }
  .single-post .entry-content h2 { font-size: 18px; }
  .single-post .entry-content h3 { font-size: 16px; }
  .page-title { font-size: 18px; }
  .error-code { font-size: 48px; }
  .nudix-404-content h2 { font-size: 18px; }
  .nudix-404-content p { font-size: 14px; }
  .nudix-pagination { margin-top: 25px; }
  .nudix-pagination ul li a,
  .nudix-pagination ul li span { min-width: 32px; height: 32px; font-size: 12px; padding: 0 7px; }
  .widget { padding: 12px; }
  .footer-widget-title { font-size: 15px; }
  .menu-toggle .menu-txt { font-size: 12px; }
  .nudix-menu-burger span { width: 18px; }
  .ticker-news-wrap { padding: 6px 10px; }
  .comments-area { margin-top: 25px; padding-top: 20px; }
  .comment { padding: 14px 0; }
  .nudix-feature-item { padding: 12px; font-size: 13px; }
  .nudix-card { padding: 15px; }
  .nudix-keypoints ul li::before { width: 20px; height: 20px; background-size: 10px; }
  .nudix-highlight { padding: 18px; }
  .nudix-highlight h3 { font-size: 17px; }
}

/* ===== 375px MOBILE X-SMALL ===== */
@media (max-width: 375px) {
  .site-title a { font-size: 17px; }
  .nudix-hero-title { font-size: 15px; }
  .nudix-hero-section { padding: 25px 0; }
  .nudix-hero-btn { padding: 0.5rem 1rem; font-size: 10px; gap: 6px; }
  .post-thumb-wrap img { height: 160px; }
  .post-title { font-size: 14px; }
  .blaze-box-wrap { padding: 10px; }
  .single-post .entry-title { font-size: 16px; }
  .page-title { font-size: 16px; }
  .error-code { font-size: 40px; }
  .nudix-cat-card { padding: 18px 14px; }
  .nudix-cat-card h4 { font-size: 14px; }
  .nudix-tab-btn { padding: 10px 14px; font-size: 12px; }
}

/* ===== 320px VERY SMALL DEVICES ===== */
@media (max-width: 320px) {
  .nudix-container { padding-right: 0.5rem; padding-left: 0.5rem; }
  .site-title a { font-size: 15px; }
  .nudix-hero-title { font-size: 13px; }
  .nudix-hero-section { padding: 20px 0; }
  .post-thumb-wrap img { height: 140px; }
  .post-title { font-size: 13px; }
  .post-excerpt { font-size: 12px; }
  .post-meta { font-size: 9px; gap: 5px; }
  .blaze-box-wrap { padding: 8px; gap: 8px; }
  .single-post .entry-title { font-size: 15px; }
  .widget { padding: 10px; }
  .nudix-cat-card { padding: 14px 10px; }
}

/* ===== HEIGHT-BASED BREAKPOINTS ===== */
@media (max-height: 600px) {
  .nudix-hero-section { padding: 30px 0; }
  .nudix-hero-title { font-size: 20px; margin-bottom: 15px; }
  .nudix-hero-btn { padding: 0.6rem 1.5rem; }
  .main-navigation .nav-menu { max-height: 70vh; }
}

/* ===== LANDSCAPE MOBILE ===== */
@media (max-width: 900px) and (orientation: landscape) {
  .nudix-hero-section { padding: 35px 0; }
  .nudix-hero-title { font-size: 22px; margin-bottom: 18px; }
  .nudix-hero-btn { padding: 0.6rem 1.8rem; }
  .blaze-box-wrap { flex-direction: row; }
  .post-thumb-wrap { flex: 0 0 200px; }
  .post-thumb-wrap img { height: 140px; }
  .nudix-posts-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
}

/* ===== PRINT STYLES ===== */
@media print {
  .site-header,
  .site-footer,
  .after-header,
  .scroll-to-top,
  .search-form-wrap,
  .menu-toggle,
  .nudix-sidebar,
  #secondary,
  .nudix-hero-section,
  .nudix-breadcrumbs,
  .post-categories,
  .post-meta,
  .post-link-button,
  .comments-area,
  .nudix-pagination,
  .post-tags { display: none !important; }
  .nudix-primary { flex: 0 1 100% !important; max-width: 100% !important; }
  body { font-size: 12pt; color: #000; background: #fff; }
  a { color: #000 !important; text-decoration: underline; }
  .nudix-container { max-width: 100%; padding: 0; }
  .nudix-main-content { padding: 0; }
  img { max-width: 100%; page-break-inside: avoid; }
  h1, h2, h3, h4 { page-break-after: avoid; }
  .entry-content a[href^="http"]:after { content: " (" attr(href) ")"; font-size: 10pt; }
}

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

/* ===== DARK MODE SUPPORT ===== */
@media (prefers-color-scheme: dark) {
  body.nudix-main-body:not(.nudix-light-mode) {
    --nudix-bg: #0f172a;
    --nudix-white: #1e293b;
    --nudix-text: #e2e8f0;
    --nudix-text-light: #94a3b8;
    --nudix-border: #334155;
    --nudix-menu-bg: #1e293b;
    --nudix-shadow: 0 1px 3px rgba(0,0,0,0.3);
    --nudix-shadow-lg: 0 10px 40px rgba(0,0,0,0.4);
  }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-main-content { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .widget { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .post-categories a { background: var(--nudix-primary); }
  body.nudix-main-body:not(.nudix-light-mode) .ticker-news-wrap { background: #1e293b; }
  body.nudix-main-body:not(.nudix-light-mode) .ticker-item a { color: var(--nudix-text); }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-post-item { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .sub-menu { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .main-navigation .nav-menu { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .search-form-wrap { background: var(--nudix-white); }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-faq-q { background: #334155; color: var(--nudix-text); }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-table tr:nth-child(even) td { background: #1e293b; }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-note { background: #422006; }
  body.nudix-main-body:not(.nudix-light-mode) .nudix-reminder { background: #172554; }
}