/* ============================================================
   G&C Consultoria — Media Queries / Responsividade
   Arquivo: css/responsive.css
   ============================================================ */

/* ── Large desktop (> 1280px) ──────────────────────────────── */
@media (min-width: 1281px) {
    :root { --section-py: 6rem; }
}

/* ── Desktop (1025px – 1280px) ─────────────────────────────── */
@media (max-width: 1280px) {
    .segments-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .segments-grid .segment-card:nth-child(4),
    .segments-grid .segment-card:nth-child(5) {
        grid-column: span 1;
    }
    .footer-grid {
        grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
        gap: var(--sp-8);
    }
}

/* ── Tablet grande (769px – 1024px) ────────────────────────── */
@media (max-width: 1024px) {
    :root {
        --section-py: 4rem;
        --header-h: 64px;
    }

    /* Header: oculta nav, mostra hamburger */
    .header-nav { display: none; }
    .hamburger  { display: flex; }
    .header-actions .btn--sm { display: none; }

    /* Hero */
    .hero-grid {
        grid-template-columns: 1fr;
        padding-block: var(--sp-16);
        text-align: center;
    }
    .hero-subtitle { margin-inline: auto; }
    .btn-group { justify-content: center; }
    .hero-visual { display: none; }

    /* Stats */
    .stats-bar .container {
        grid-template-columns: repeat(2, 1fr);
    }
    .stat-item:nth-child(2) { border-right: none; }

    /* Segments */
    .segments-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Services */
    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Highlights */
    .highlight-grid,
    .highlight-grid--reverse {
        grid-template-columns: 1fr;
        direction: ltr;
    }
    .highlight-visual { display: none; }

    /* Diferenciais */
    .differentials-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    /* Problemas */
    .problems-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Sistema em ação */
    .product-showcase-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Tecnologias */
    .tech-strip {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Vídeos em par */
    .video-pair-grid {
        grid-template-columns: 1fr;
        gap: var(--sp-8);
    }

    /* Planos */
    .plans-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Depoimentos */
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Logo cloud */
    .logo-cloud {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Cases */
    .cases-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    /* Contact */
    .contact-grid {
        grid-template-columns: 1fr;
    }

    /* Article */
    .article-layout {
        grid-template-columns: 1fr;
    }
    .article-sidebar {
        position: static;
    }

    /* Footer */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--sp-10);
    }
    .footer-brand {
        grid-column: 1 / -1;
    }
}

/* ── Tablet pequeno / Mobile grande (481px – 768px) ─────────── */
@media (max-width: 768px) {
    :root {
        --section-py: 3.5rem;
        --gutter: 1.25rem;
    }

    /* Section headers */
    .section-title {
        font-size: var(--text-3xl);
    }

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

    /* Segments */
    .segments-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--sp-3);
    }

    /* Services */
    .services-grid {
        grid-template-columns: 1fr;
    }

    /* Diferenciais */
    .differentials-grid {
        grid-template-columns: 1fr;
    }

    /* Problemas */
    .problems-grid {
        grid-template-columns: 1fr;
    }

    .problem-rows {
        grid-template-columns: 1fr;
        gap: var(--sp-6);
    }

    .solutions-list {
        grid-template-columns: 1fr;
        gap: var(--sp-8);
    }

    /* Sistema em ação */
    .product-showcase-grid {
        grid-template-columns: 1fr;
    }

    /* Planos */
    .plans-grid {
        grid-template-columns: 1fr;
    }

    /* Depoimentos */
    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    /* Logo cloud */
    .logo-cloud {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Contato rápido */
    .contact-quick {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
    .contact-quick .btn {
        width: 100%;
        justify-content: center;
    }

    /* Cases */
    .cases-grid {
        grid-template-columns: 1fr;
    }

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

    /* Hero */
    .hero-title {
        font-size: var(--text-4xl);
    }

    /* Form */
    .form-row {
        grid-template-columns: 1fr;
    }
    .contact-form {
        padding: var(--sp-6);
    }

    /* Blog header bar */
    .blog-header-bar {
        flex-direction: column;
        align-items: stretch;
    }
    .blog-search {
        max-width: 100%;
    }

    /* Footer */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: var(--sp-8);
    }
    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    /* CTA section */
    .cta-section {
        padding-block: var(--sp-16);
    }

    /* Highlight features */
    .highlight-features {
        grid-template-columns: 1fr;
    }

    /* Checklist */
    .checklist {
        grid-template-columns: 1fr;
        gap: var(--sp-5);
    }
}

/* ── Mobile pequeno (< 480px) ──────────────────────────────── */
@media (max-width: 480px) {
    :root {
        --section-py: 3rem;
        --gutter: 1rem;
    }

    .section-title {
        font-size: var(--text-2xl);
    }

    .hero-title {
        font-size: var(--text-3xl);
    }

    .page-hero-title {
        font-size: var(--text-2xl);
    }

    .segments-grid {
        grid-template-columns: 1fr;
    }

    .tech-strip {
        grid-template-columns: 1fr;
    }

    .btn--lg {
        width: 100%;
        justify-content: center;
    }

    .btn-group {
        flex-direction: column;
    }
    .btn-group .btn {
        width: 100%;
        justify-content: center;
    }

    .stats-bar .container {
        grid-template-columns: 1fr 1fr;
    }

    .footer-socials {
        flex-wrap: wrap;
    }

    .whatsapp-fab {
        bottom: 1.25rem;
        right: 1.25rem;
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    /* Article */
    .article-content h2 { font-size: var(--text-xl); }
    .article-content h3 { font-size: var(--text-lg); }

    .timeline-step {
        grid-template-columns: 32px 1fr;
        gap: var(--sp-4);
    }

    .timeline-marker {
        width: 32px;
        height: 32px;
        font-size: var(--text-xs);
    }

    .timeline::before {
        left: 15px;
    }
}

/* ── Print ──────────────────────────────────────────────────── */
@media print {
    .site-header,
    .site-footer,
    .whatsapp-fab,
    .mobile-menu {
        display: none !important;
    }

    body {
        font-size: 12pt;
        color: #000;
    }

    a {
        text-decoration: underline;
    }

    .section {
        padding-block: 2rem;
    }
}
