/* RESPONSIVE DESIGN - Preparado para futuras expansiones */
@media (max-width: 992px) {
    .hero-content {
        flex-direction: column;
        text-align: center;
    }
    
    .hero-actions {
        justify-content: center;
    }
    
    .hero-image {
        margin-top: 3rem;
    }
}

@media (max-width: 768px) {
    .grid-3 {
        grid-template-columns: 1fr;
    }
    
    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .nav-menu, .header-actions {
        display: none; /* Aquí entraría el JS para el menú hamburguesa */
    }
    
    .mobile-menu-btn {
        display: flex;
        flex-direction: column;
        gap: 5px;
        background: none;
        border: none;
        cursor: pointer;
    }
    
    .mobile-menu-btn span {
        width: 25px;
        height: 3px;
        background-color: var(--brand-purple-dark);
        transition: 0.3s;
    }
    
    .hero-text h1 {
        font-size: 2.5rem;
    }
}