/* Importando fontes modernas: 'Plus Jakarta Sans' para UI e 'Playfair Display' para Títulos elegantes */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=Playfair+Display:wght@400;600;700&display=swap');

:root {
    --primary-dark: #022c22;  /* Verde Floresta Profundo */
    --accent-lime: #d9f99d;   /* Lime Suave */
    --glass-border: rgba(255, 255, 255, 0.1);
    --glass-bg: rgba(255, 255, 255, 0.05);
}

* {
    font-family: 'Plus Jakarta Sans', sans-serif;
    scroll-behavior: smooth;
}

h1, h2, h3 {
    /* font-family: 'Playfair Display', serif;  */
    font-family: 'Plus Jakarta Sans', sans-serif;

    /* Toque de sofisticação */
}

body {
    background-color: var(--primary-dark);
    color: #e2e8f0;
    overflow-x: hidden;
}   

/* --- GLASSMORPHISM (Efeito Vidro) --- */
.glass-panel {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.glass-header {
    background: rgba(2, 44, 34, 0.8);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--glass-border);
}

/* --- MAPA & PINOS --- */
/* Otimizei a animação para ser mais fluida */
.pin-wrapper {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.pin-wrapper:hover {
    transform: translateY(-8px) scale(1.1);
    z-index: 20;
}

.hover-label {
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s ease;
    pointer-events: none;
}

.pin-wrapper:hover .hover-label {
    opacity: 1;
    transform: translateY(0);
}

svg path {
    transition: fill 0.3s ease;
}

/* --- ANIMAÇÕES DE ENTRADA (Performance Optimized) --- */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* --- FORMULÁRIO MODERNO --- */
.input-modern {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.input-modern:focus {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--accent-lime);
    outline: none;
    box-shadow: 0 0 0 4px rgba(217, 249, 157, 0.1);
}

/* Correção para o pino ficar centralizado na coordenada */
.map-pin {
    /* O translate-x/y garante que a ponta do alfinete esteja exatamente na coordenada */
    transform-origin: bottom center; 
}

/* Estado inicial da aba ativa */
.map-tab.active {
    background-color: #d9f99d; /* brand-accent */
    color: #022c22; /* brand-dark */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}