/* ==========================================
   RESPONSIVE.CSS - Media Queries GACCE
   ========================================== */


/* ==========================================
   MOBILE (até 767px)
   ========================================== */

@media (max-width: 767px) {
    
    /* Hero */
    .hero__content {
        padding: 0 var(--space-sm);
    }
    
    .hero__title {
        font-size: 1.75rem;
        line-height: 1.2;
    }
    
    .hero__subtitle {
        font-size: 0.9375rem;
    }
    
    .hero__buttons {
        flex-direction: column;
        gap: var(--space-md);
    }
    
    .hero__buttons .btn {
        width: 100%;
    }
    
    .hero__info {
        font-size: 0.6875rem;
        letter-spacing: 1px;
        padding: 0 var(--space-lg);
        margin-bottom: var(--space-4xl);
        line-height: 1.5;
    }
    
    .hero__scroll {
        bottom: 1.5rem;
        font-size: 0.625rem;
    }
    
    .hero__scroll-icon {
        width: 20px;
        height: 20px;
    }
    
    /* Diferenciais */
    .diferenciais__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }
    
    /* Para Cardiologistas */
    .cardiologistas__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-3xl);
    }
    
    .cardiologistas__image-wrapper {
        order: -1;
    }
    
    .cardiologistas__buttons {
        flex-direction: column;
    }
    
    .cardiologistas__buttons .btn {
        width: 100%;
    }
    
    /* Cirurgia Vascular */
    .cirurgia-vascular__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-3xl);
        display: flex;
        flex-direction: column-reverse;
    }
    
    .cirurgia-vascular__image-wrapper {
        max-width: 100%;
        margin: 0 auto;
    }
    
    .cirurgia-vascular__buttons {
        flex-direction: column;
    }
    
    .cirurgia-vascular__buttons .btn {
        width: 100%;
    }
    
    /* Para Pacientes */
    .pacientes__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-3xl);
    }
    
    .pacientes__image-wrapper {
        order: -1;
    }
    
    /* Procedimentos */
    .procedimentos__grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }
    
    /* Equipe */
    .equipe__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }
    
    .medico-card__image-wrapper {
        height: 280px;
    }
    
    /* Hospitais */
    .hospitais__grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }
    
    /* FAQ */
    .faq-item__question {
        font-size: var(--font-size-base);
        padding: var(--space-lg);
    }
    
    .faq-item__answer.show {
        padding: 0 var(--space-lg) var(--space-lg);
    }
    
    /* Contato */
    .contato__info {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }
    
    /* WhatsApp Flutuante */
    .whatsapp-float {
        width: 56px;
        height: 56px;
        bottom: var(--space-lg);
        right: var(--space-lg);
    }
    
    .whatsapp-float__icon {
        width: 28px;
        height: 28px;
    }
    
    /* Logos hospitais coloridas no mobile */
    .hospital-logo__img {
        filter: grayscale(0%);
        opacity: 1;
    }
}


/* ==========================================
   TABLET (768px - 1023px)
   ========================================== */

@media (min-width: 768px) and (max-width: 1023px) {
    
    /* Hero */
    .hero__title {
        font-size: var(--font-size-5xl);
    }
    
    .hero__subtitle {
        font-size: var(--font-size-xl);
    }
    
    /* Diferenciais */
    .diferenciais__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }
    
    /* Para Cardiologistas */
    .cardiologistas__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-4xl);
    }
    
    /* Cirurgia Vascular */
    .cirurgia-vascular__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-4xl);
    }
    
    /* Para Pacientes */
    .pacientes__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-4xl);
    }
    
    /* Procedimentos */
    .procedimentos__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-xl);
    }
    
    /* Equipe */
    .equipe__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
        max-width: 600px;
        margin: 0 auto;
    }
    
    /* Hospitais */
    .hospitais__grid {
        max-width: 700px;
    }
    
    /* Contato */
    .contato__wrapper {
        grid-template-columns: 1fr;
        gap: var(--space-3xl);
    }
}


/* ==========================================
   DESKTOP PEQUENO (1024px - 1200px)
   ========================================== */

@media (min-width: 1024px) and (max-width: 1200px) {
    
    /* Hero */
    .hero__title {
        font-size: var(--font-size-5xl);
    }
    
    /* Equipe */
    .medico-card__image-wrapper {
        height: 280px;
    }
}


/* ==========================================
   LANDSCAPE MOBILE (até 667px altura)
   ========================================== */

@media (max-height: 667px) and (orientation: landscape) {
    
    .hero {
        min-height: auto;
        padding: var(--space-4xl) 0;
    }
    
    .hero__scroll {
        display: none;
    }
}


/* ==========================================
   MODO ESCURO (Preferência do sistema)
   ========================================== */

@media (prefers-color-scheme: dark) {
    /* Desabilitado por padrão */
    /* Pode ser implementado futuramente */
}