/* =========================================
   RETASAN RESPONSIVE BREAKPOINTS
   ========================================= */

/* ── Tablet (max 1024px) ── */
@media (max-width: 1024px) {
    :root {
        --fs-4xl: 2rem;
        --fs-3xl: 1.5rem;
    }

    .section-wrapper {
        padding: 0 var(--space-md);
    }

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

    .retas-hero-grid {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .retas-hero-main {
        min-height: 360px;
    }

    .retas-hero-side {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
    }

    .retas-side-first {
        grid-row: span 1;
    }

    .retas-cat-layout {
        grid-template-columns: 1fr;
    }

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

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

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

    .footer-brand-wrapper {
        flex-direction: column;
        gap: var(--space-lg);
        text-align: center;
    }
}

/* ── Mobile Large (max 768px) ── */
@media (max-width: 768px) {
    :root {
        --fs-4xl: 1.75rem;
        --fs-3xl: 1.375rem;
        --fs-2xl: 1.25rem;
    }

    .site-title {
        font-size: var(--fs-2xl);
    }

    /* Navigation */
    .menu-toggle {
        display: flex;
    }

    .main-navigation .navigation-area {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--bg-secondary);
        border-bottom: 2px solid var(--accent-red);
        box-shadow: var(--shadow-lg);
        z-index: var(--z-overlay);
    }

    .main-navigation .navigation-area.toggled {
        display: block;
    }

    .main-navigation ul {
        flex-direction: column;
    }

    .main-navigation ul li a {
        padding: var(--space-md) var(--space-lg);
        border-bottom: 1px solid var(--border);
    }

    .main-navigation ul li a::after {
        display: none;
    }

    .main-navigation ul li ul.sub-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        background: var(--bg-tertiary);
    }

    .main-navigation ul li ul.sub-menu li a {
        padding-left: var(--space-2xl);
    }

    /* Category Bar */
    .retas-category-nav {
        padding: var(--space-xs) 0;
    }

    /* Hero */
    .retas-hero-main {
        min-height: 280px;
    }

    .retas-hero-side {
        grid-template-columns: 1fr;
    }

    .retas-side-first .post-thumbnail,
    .retas-side-first .post-thumbnail-placeholder {
        width: 120px;
    }

    /* Popular */
    .retas-popular-grid {
        grid-template-columns: 1fr;
    }

    .retas-popular-num {
        font-size: var(--fs-2xl);
    }

    /* Archive */
    .retas-archive-grid {
        grid-template-columns: 1fr;
    }

    /* Post Navigation */
    .post-navigation {
        grid-template-columns: 1fr;
    }

    /* Related */
    .related-posts-grid {
        grid-template-columns: 1fr;
    }

    /* Footer */
    .footer-widgets-grid {
        grid-template-columns: 1fr;
    }

    .bottom-footer-content {
        flex-direction: column;
        gap: var(--space-md);
        text-align: center;
    }

    /* Author box */
    .author-box {
        flex-direction: column;
        text-align: center;
    }

    /* Header search */
    .header-search-form {
        width: calc(100vw - var(--space-2xl));
        right: -60px;
    }

    /* Branding */
    .branding-wrapper {
        flex-direction: column;
        gap: var(--space-md);
        text-align: center;
    }
}

/* ── Mobile Small (max 480px) ── */
@media (max-width: 480px) {
    :root {
        --fs-4xl: 1.5rem;
        --fs-3xl: 1.25rem;
    }

    .section-wrapper {
        padding: 0 var(--space-sm);
    }

    .retas-hero-content {
        padding: var(--space-lg);
    }

    .retas-hero-excerpt {
        display: none;
    }

    .retas-cat-feat-content {
        padding: var(--space-md);
    }

    .retas-cat-feat-excerpt {
        display: none;
    }

    .retas-cat-list-item > a {
        flex-direction: column;
    }

    .retas-cat-list-item .post-thumbnail,
    .retas-cat-list-item .post-thumbnail-placeholder {
        width: 100%;
        height: 160px;
    }

    .retas-side-post > a {
        flex-direction: column;
    }

    .retas-side-post .post-thumbnail,
    .retas-side-post .post-thumbnail-placeholder,
    .retas-side-first .post-thumbnail,
    .retas-side-first .post-thumbnail-placeholder {
        width: 100%;
        height: 140px;
    }

    .retas-ticker-label::after {
        display: none;
    }

    .topbar-wrapper {
        flex-direction: column;
        gap: var(--space-xs);
    }

    /* Single post */
    .single-post-header .entry-title {
        font-size: var(--fs-2xl);
    }

    .entry-content {
        font-size: var(--fs-base);
    }

    .pagination {
        flex-wrap: wrap;
    }
}

/* ── Print ── */
@media print {
    body {
        background: #fff;
        color: #000;
    }

    .site-header,
    .site-footer,
    .retas-ticker-wrap,
    .retas-category-bar,
    .scroll-progress-container,
    #matrix-rain,
    .post-share,
    .post-navigation,
    .related-posts,
    .comments-area,
    .sidebar {
        display: none !important;
    }

    .entry-content a {
        color: #000;
        text-decoration: underline;
    }

    .entry-content a::after {
        content: ' (' attr(href) ')';
        font-size: 0.8em;
    }
}