/* ==========================================================================
   Techvizo — responsive.css
   Breakpoints: xl=1280, lg=1024, md=768, sm=480
   ========================================================================== */

/* ── XL — Large Desktops ──────────────────────────────────────────────────── */
@media (max-width: 1280px) {
    .tvz-highlight__slider { padding-inline: 1rem; }
    .tvz-industries__slider { padding-inline: 1rem; }
}

/* ── LG — Laptops / Small Desktops ──────────────────────────────────────── */
@media (max-width: 1024px) {
    :root { --tvz-section-pad: 60px; }

    /* Promise */
    .tvz-promise__layout { grid-template-columns: 1fr; gap: 2.5rem; }

    /* Blog layout */
    .tvz-blog__layout { grid-template-columns: 1fr; }

    /* Single post */
    .tvz-single__layout { grid-template-columns: 1fr; }

    /* Footer 5-cols → 3 */
    .tvz-footer__widgets--cols-5 { grid-template-columns: repeat(3, 1fr); }
    .tvz-footer__widgets--cols-4 { grid-template-columns: repeat(2, 1fr); }

    /* Stats */
    .tvz-stats-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── MD — Tablets ────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    :root {
        --tvz-section-pad: 48px;
        --tvz-header-h:    65px;
    }

    /* ── Header: hide desktop nav, show hamburger ── */
    .tvz-nav { display: none; }
    .tvz-hamburger { display: flex; }

    /* Mobile Nav (full-screen overlay) */
    .tvz-nav.is-open {
        display:         flex;
        position:        fixed;
        inset:           0;
        top:             var(--tvz-header-h);
        background:      var(--tvz-mobile-menu-bg, var(--tvz-header-bg));
        flex-direction:  column;
        align-items:     flex-start;
        padding:         1.5rem;
        overflow-y:      auto;
        z-index:         999;
    }
    .tvz-nav.is-open .tvz-nav__menu {
        flex-direction:  column;
        width:           100%;
        align-items:     flex-start;
        gap:             0;
    }
    .tvz-nav.is-open .tvz-nav__menu .menu-item { width: 100%; }
    .tvz-nav.is-open .tvz-nav__link {
        padding:         .875rem 0;
        font-size:       1.1rem;
        border-bottom:   1px solid rgba(255,255,255,.08);
        border-radius:   0;
        width:           100%;
    }
    .tvz-dropdown-toggle {
        display:         flex;
        align-items:     center;
        justify-content: center;
        width:           44px;
        height:          44px;
        color:           var(--tvz-white);
        position:        absolute;
        right:           0;
        top:             0;
    }
    .tvz-dropdown {
        position: static;
        opacity:  1;
        visibility: visible;
        transform: none;
        display:  none;
        background: rgba(255,255,255,.05);
        box-shadow: none;
        border-radius: 0;
        padding:  0 0 0 1rem;
    }
    .tvz-dropdown.is-open { display: block; }
    .tvz-header__cta { display: none; }

    /* ── Hero ── */
    .tvz-hero { min-height: 70vh !important; }
    .tvz-hero__heading { font-size: clamp(1.75rem, 6vw, 2.75rem); }
    .tvz-hero__overlay {
        background: linear-gradient(to bottom, rgba(0,0,0,.5) 0%, rgba(0,0,0,.35) 100%);
    }

    /* ── Promise ── */
    .tvz-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }

    /* ── Applications ── */
    .tvz-apps-grid { grid-template-columns: 1fr; }

    /* ── Categories ── */
    .tvz-cats-grid { grid-template-columns: repeat(3, 1fr); }

    /* ── Industries ── */
    .tvz-industry-card { flex: 0 0 240px; height: 260px; }

    /* ── CTA Banner ── */
    .tvz-cta-banner__inner { flex-direction: column; text-align: center; }

    /* ── Footer ── */
    .tvz-footer__widgets--cols-5,
    .tvz-footer__widgets--cols-4,
    .tvz-footer__widgets--cols-3 { grid-template-columns: repeat(2, 1fr); }
    .tvz-footer__bottom-inner { flex-direction: column; text-align: center; }
    .tvz-footer__legal-menu { justify-content: center; flex-wrap: wrap; }

    /* ── Blog ── */
    .tvz-blog-grid { grid-template-columns: repeat(2, 1fr); }
    .tvz-posts-grid { grid-template-columns: 1fr; }

    /* ── Archive header ── */
    .tvz-archive__layout { grid-template-columns: 1fr; }

    /* ── 404 ── */
    .tvz-404__code { font-size: clamp(5rem, 20vw, 8rem); }

    /* ── Post nav ── */
    .tvz-post-nav { grid-template-columns: 1fr; }
    .tvz-post-nav__next { text-align: left; }

    /* ── Trust ── */
    .tvz-trust__deco { display: none; }
}

/* ── SM — Mobile Phones ──────────────────────────────────────────────────── */
@media (max-width: 480px) {
    :root { --tvz-section-pad: 36px; }

    .tvz-container { width: calc(100% - 1.5rem); }

    /* ── Categories ── */
    .tvz-cats-grid { grid-template-columns: repeat(2, 1fr); }

    /* ── Stats ── */
    .tvz-stats-grid { grid-template-columns: repeat(2, 1fr); }

    /* ── Blog ── */
    .tvz-blog-grid { grid-template-columns: 1fr; }

    /* ── Highlight ── */
    .tvz-highlight__slider { grid-template-columns: 1fr; }

    /* ── Industries ── */
    .tvz-industry-card { flex: 0 0 calc(100vw - 2rem); }

    /* ── Footer ── */
    .tvz-footer__widgets--cols-5,
    .tvz-footer__widgets--cols-4,
    .tvz-footer__widgets--cols-3,
    .tvz-footer__widgets--cols-2 { grid-template-columns: 1fr; }

    /* ── Header ── */
    .tvz-header__logo img { height: 40px; }

    /* ── Hero ── */
    .tvz-hero { min-height: 60vh !important; padding-bottom: 2.5rem; }

    /* ── Section title ── */
    .tvz-section-title { margin-bottom: 2rem; }

    /* ── CTA ── */
    .tvz-cta-banner { padding-block: 2.5rem; }
    .tvz-cta-banner__heading { font-size: 1.375rem; }

    /* ── Trust heading ── */
    .tvz-trust__heading { font-size: clamp(1.8rem, 7vw, 3rem); }

    /* ── Buttons ── */
    .tvz-btn { padding: .65rem 1.25rem; font-size: .875rem; }

    /* ── Single post ── */
    .tvz-single-post__title { font-size: clamp(1.5rem, 6vw, 2rem); }

    /* ── Search popup ── */
    .tvz-search-popup__inner { width: calc(100% - 2rem); }

    /* ── Admin bar ── */
    .admin-bar .tvz-header { top: 46px; }
}

/* ── Hover-capable devices only (no :hover on touch) ─────────────────────── */
@media (hover: none) {
    .tvz-cat-card:hover,
    .tvz-blog-card:hover,
    .tvz-highlight-card:hover,
    .tvz-btn:hover { transform: none; box-shadow: none; }
}

/* ── High contrast mode ─────────────────────────────────────────────────── */
@media (prefers-contrast: high) {
    :root { --tvz-border: #000; }
    .tvz-btn--outline { border-width: 3px; }
}

/* ── Reduced motion ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
    html { scroll-behavior: auto; }
}

/* ── Print ───────────────────────────────────────────────────────────────── */
@media print {
    .tvz-header, .tvz-footer, .tvz-cta-banner, .tvz-sidebar, .tvz-video-trigger, .tvz-search-popup { display: none !important; }
    body { font-size: 12pt; color: #000; }
    a { color: #000; text-decoration: underline; }
    .tvz-container { max-width: 100%; }
    .tvz-single-post__content { max-width: 100%; }
}

/* ── TVZ Page Banner responsive ─────────────────────────────────────────── */
@media (max-width: 1024px) {
    .tvz-page-banner { min-height: var(--tvz-banner-h, 300px); }
    .tvz-page-banner__title { font-size: clamp(1.5rem, 3.5vw, 2.2rem); }
}
@media (max-width: 767px) {
    .tvz-page-banner { min-height: var(--tvz-banner-h, 220px); }
    .tvz-page-banner__title { font-size: 1.5rem; }
    .tvz-page-banner__subtitle { font-size: 1rem; }
    .tvz-page-banner__description { font-size: .9rem; }
}
