/* ==========================================================================
   ZUPOLY PROJETOS LTDA — responsive.css
   Ajustes específicos por breakpoint. O layout base usa utilitários do
   Tailwind; aqui ficam apenas refinamentos de componentes customizados.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Desktop grande: Timeline horizontal
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
    .timeline {
        display: flex;
        gap: 0;
    }
    .timeline::before {
        left: 0;
        right: 0;
        top: 28px;
        bottom: auto;
        width: 100%;
        height: 2px;
        background: linear-gradient(to right, transparent, var(--brand-500), transparent);
    }
    .timeline-step {
        flex: 1;
        text-align: center;
        padding-top: 0;
        padding-left: 0;
    }
    .timeline-step .timeline-dot {
        margin: 0 auto 1.5rem;
    }
}

/* --------------------------------------------------------------------------
   ALTERAÇÃO: as regras @media (max-width: 1023px) e (max-width: 640px)
   (parallax do hero, tipografia/espaçamento mobile, timeline vertical e
   lightbox) foram MOVIDAS para o arquivo mobile.css.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Telas muito largas: limita a largura das colunas de texto
   -------------------------------------------------------------------------- */
@media (min-width: 1536px) {
    .prose-limit {
        max-width: 42rem;
    }
}