body {
    font-family: 'Segoe UI', sans-serif;
}

h2 {
    color: darkred;
}

/* HERO */
.hero {
    min-height: 100vh;
    background: linear-gradient(135deg, #4f46e5, #06b6d4);
    color: white;
    padding-top: 80px; /* espaço da navbar */
}

/* Imagem do hero */
.hero-img {
    max-width: 100%;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.hero-img {
    transition: all 0.4s ease;
    border-radius: 12px;
}

.hero-img:hover {
    transform: translateY(-10px) scale(1.03);
    box-shadow: 
        0 20px 40px rgba(0,0,0,0.2),
        0 0 20px rgba(79,70,229,0.3);
}
/* Responsivo */
@media (max-width: 768px) {
    .hero {
        text-align: center;
    }
}

/* HERO com gradiente moderno 
.hero {
    height: 100vh;
    background: linear-gradient(135deg, #4f46e5, #06b6d4);
    color: white;
}*/

/* Ícones */
.icon {
    width: 40px;
    height: 40px;
    stroke-width: 2;
    color: darkred;
}

/* Animações suaves */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeIn 0.8s ease forwards;
}

.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }

@keyframes fadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}