* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', sans-serif;
    -webkit-tap-highlight-color: transparent;
}

body {
    background-color: #f0f2f5;
    overflow: hidden; /* Travado pelo preloader inicialmente */
}

/* --- PRELOADER --- */
/* --- NOVO PRELOADER (Atualizado) --- */
#preloader {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: #1a252f; /* Cor de fundo mantida */
    display: flex; justify-content: center; align-items: center;
    z-index: 9999;
    transition: opacity 0.8s ease, visibility 0.8s ease;
}

.preloader-content {
    text-align: center;
    color: white;
    padding: 20px;
}

/* Base para todas as frases do preloader */
.fade-text {
    opacity: 0; /* Começa invisível */
    animation: fadeInPoetic 1s forwards; /* Nova animação */
    margin-bottom: 15px; /* Espaçamento entre as frases */
    font-weight: 300;
    line-height: 1.4;
}

/* Tamanhos específicos */
.preloader-content p {
    font-size: 1.2rem;
    font-style: italic;
    color: #ecf0f1; /* Branco levemente acinzentado */
}

.preloader-content h1 {
    font-size: 2.8rem;
    font-weight: bold;
    color: #3498db; /* Cor de destaque mantida */
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-top: 20px;
}

/* --- Tempos de Entrada (Delays) --- */
.delay-1 { animation-delay: 0.5s; } /* Primeira frase */
.delay-2 { animation-delay: 1.8s; } /* Segunda frase */
.delay-3 { animation-delay: 3.0s; } /* "Semeai!" */

/* Nova animação: surge e sobe levemente */
@keyframes fadeInPoetic {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* O código do .spinner foi removido pois não é mais usado */

#preloader.fade-out {
    opacity: 0;
    visibility: hidden;
}

/* --- HEADER & MENU --- */
header { background-color: #2c3e50; color: white; padding: 15px 20px; display: flex; justify-content: space-between; align-items: center; }
.logo span { color: #3498db; font-weight: bold; }
.menu-icon { width: 25px; cursor: pointer; }
.bar { height: 3px; width: 100%; background-color: white; margin: 4px 0; border-radius: 2px; }
.nav-overlay { height: 100%; width: 0; position: fixed; top: 0; right: 0; background-color: #2c3e50; z-index: 200; overflow-x: hidden; transition: 0.3s; padding-top: 80px; }
.nav-overlay ul { list-style: none; text-align: center; }
.nav-overlay a { color: white; text-decoration: none; font-size: 1.3rem; display: block; padding: 15px; }
.close-btn { position: absolute; top: 20px; right: 25px; font-size: 35px; color: white; cursor: pointer; }

/* --- CONTEÚDO PRINCIPAL --- */
.hero { padding: 40px 20px; text-align: center; }
.welcome h2 { color: #2c3e50; margin-bottom: 8px; }
.welcome p { color: #7f8c8d; margin-bottom: 35px; }
.button-group { display: flex; flex-direction: column; gap: 15px; }
.main-btn { padding: 20px; border: none; border-radius: 15px; font-size: 1.1rem; font-weight: 600; color: white; background-color: #3498db; display: flex; align-items: center; justify-content: center; gap: 10px; box-shadow: 0 4px 12px rgba(52, 152, 219, 0.2); }
.btn-secondary { background-color: #34495e; }
.main-btn:active { transform: scale(0.96); }

/* --- MODAL --- */
.modal { display: none; position: fixed; z-index: 2000; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); align-items: center; justify-content: center; padding: 20px; }
.modal-content { background: white; padding: 30px 20px; border-radius: 20px; width: 100%; max-width: 400px; position: relative; animation: slideUp 0.3s ease; }
@keyframes slideUp { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.close-modal { position: absolute; right: 20px; top: 10px; font-size: 30px; color: #bbb; cursor: pointer; }

.input-field, .textarea-field {
    width: 100%; padding: 12px; margin-top: 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 1rem; outline: none;
}
.input-field:focus, .textarea-field:focus { border-color: #3498db; }
.textarea-field { height: 120px; resize: none; }

.btn-enviar { width: 100%; padding: 15px; background-color: #27ae60; color: white; border: none; border-radius: 10px; font-size: 1.1rem; font-weight: bold; margin-top: 15px; }