/* --- CONFIGURAÇÃO GLOBAL --- */
:root {
    --font-title: 'Lilita One', cursive;
    --font-body: 'Nunito', sans-serif;
    --purple-footer: #C5A3CB; /* Cor da barra inferior */
    --pink-btn: #EFB1C8; /* Cor do botão do form */
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); background: #000; color: white; overflow: hidden; }

/* --- SCROLL SNAP CONTAINER --- */
.scroll-container {
    height: 100vh; overflow-y: scroll; scroll-snap-type: y mandatory; scroll-behavior: smooth;
}
.slide-section {
    position: relative; width: 100%; height: 100vh; scroll-snap-align: start;
    overflow: hidden; display: flex; align-items: center; justify-content: center;
}

/* --- MENU PRINCIPAL GLASS --- */
.glass-nav {
    position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 1000;
    background: rgba(255, 255, 255, 0.25); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.4); padding: 8px 15px; border-radius: 50px;
    display: flex; gap: 5px; align-items: center; box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.nav-link, .dropbtn {
    text-decoration: none; color: #3E2723; font-weight: 800; font-size: 0.85rem;
    padding: 8px 16px; border-radius: 20px; transition: 0.3s; background: transparent; border: none; font-family: var(--font-body); cursor: pointer;
}
.nav-link:hover, .dropbtn:hover, .dropdown:hover .dropbtn { background: rgba(255,255,255,0.4); color: #d63384; }

/* --- SUBMENU GLASS (CORRIGIDO) --- */
.dropdown { position: relative; display: inline-block; }
.dropdown-content {
    display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
    /* Efeito Glass aplicado aqui */
    background: rgba(255, 255, 255, 0.3); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255,255,255,0.4);
    min-width: 200px; box-shadow: 0px 8px 25px rgba(0,0,0,0.15);
    border-radius: 20px; padding: 10px; margin-top: 15px; text-align: left;
}
/* Triângulo de vidro */
.dropdown-content::before {
    content: ""; position: absolute; bottom: 100%; left: 50%; margin-left: -8px;
    border-width: 8px; border-style: solid; border-color: transparent transparent rgba(255,255,255,0.3) transparent;
}
.dropdown-content a {
    color: #3E2723; padding: 10px 15px; text-decoration: none; display: block;
    font-size: 0.9rem; font-weight: 700; transition: 0.2s; border-radius: 12px;
}
.dropdown-content a:hover { background-color: rgba(255,255,255,0.5); color: #d63384; }
.dropdown:hover .dropdown-content { display: block; animation: fadeInUp 0.3s ease; }
@keyframes fadeInUp { from { opacity: 0; transform: translate(-50%, 20px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* --- NAVEGAÇÃO LATERAL --- */
.side-dots { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 15px; z-index: 1000; }
.dot { width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.5); transition: all 0.3s ease; position: relative; cursor: pointer; }
.dot:hover { transform: scale(1.3); border-color: white; }
.dot-hero { background: #E91E63; } .dot-choco { background: #5D4037; } .dot-morango { background: #D32F2F; } .dot-ninho { background: #FBC02D; } .dot-limao { background: #76FF03; } .dot-contato { background: #C5A3CB; }
.dot::after { content: attr(data-tooltip); position: absolute; right: 25px; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.8); color: white; padding: 4px 8px; border-radius: 4px; font-size: 0.75rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: 0.3s; }
.dot:hover::after { opacity: 1; right: 30px; }
.dot.active { transform: scale(1.5); border: 2px solid white; box-shadow: 0 0 10px rgba(255,255,255,0.8); }

/* --- ESTILOS DE VÍDEO E TEXTO --- */
.video-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }
.video-bg video { width: 100%; height: 100%; object-fit: cover; }
.overlay-dark { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); }
.overlay-color { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.content-overlay { position: relative; z-index: 10; width: 100%; max-width: 1200px; padding: 0 40px; }
.centered { text-align: center; }
/* CORREÇÃO: Força alinhamento à esquerda */
.align-left { text-align: left; align-items: flex-start; } 

.title-lg { font-family: var(--font-title); font-size: 5rem; line-height: 0.9; margin-bottom: 20px; text-transform: uppercase; text-shadow: 0 5px 15px rgba(0,0,0,0.5); }
.desc-glass { background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(5px); padding: 15px 25px; border-radius: 15px; font-size: 1.2rem; line-height: 1.5; max-width: 450px; margin-bottom: 25px; border-left: 4px solid rgba(255,255,255,0.5); }
.price-tag { font-family: var(--font-title); font-size: 3rem; margin-bottom: 30px; text-shadow: 0 4px 10px rgba(0,0,0,0.6); }

.btn-hero-glass { display: inline-block; padding: 15px 40px; background: rgba(255,255,255,0.25); border: 2px solid rgba(255,255,255,0.5); backdrop-filter: blur(10px); border-radius: 50px; color: white; font-weight: 900; text-decoration: none; letter-spacing: 2px; transition: 0.3s; }
.btn-hero-glass:hover { background: white; color: black; }
.btn-whatsapp { display: inline-flex; align-items: center; gap: 10px; padding: 12px 35px; border-radius: 50px; text-decoration: none; color: white; font-weight: 800; font-size: 1rem; transition: transform 0.3s; box-shadow: 0 10px 20px rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.4); }
.btn-whatsapp:hover { transform: scale(1.05); }
.btn-coffee { background: linear-gradient(135deg, #795548, #4E342E); }
.btn-strawberry { background: linear-gradient(135deg, #e53935, #b71c1c); }
.btn-ninho { background: linear-gradient(135deg, #FFD54F, #FBC02D); color: #3E2723; } .btn-ninho svg { fill: #3E2723; }
.btn-lemon { background: linear-gradient(135deg, #76FF03, #33691E); color: #1B5E20; } .btn-lemon svg { fill: #1B5E20; }


/* --- RODAPÉ FINAL (ESTRUTURA SPLIT) --- */
.contact-section {
    background-size: cover; background-position: center;
    display: flex; flex-direction: column; justify-content: space-between;
    height: 100vh; padding-top: 80px;
}

/* Painel de Vidro Duplo (Wrapper) */
.glass-panel-wrapper {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.4); border-radius: 30px;
    width: 90%; max-width: 1000px; margin: auto; /* Centraliza na tela */
    display: grid; grid-template-columns: 1fr 1fr; /* Duas colunas iguais */
    overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

/* Colunas Internas */
.panel-col { padding: 40px; display: flex; flex-direction: column; justify-content: center; }

/* --- COLUNA ESQUERDA: FORMULÁRIO --- */
.form-col { border-right: 1px solid rgba(255,255,255,0.2); }
.contact-title { font-family: var(--font-title); font-size: 2rem; margin-bottom: 20px; color: #3E2723; }

.glass-inputs { display: flex; flex-direction: column; gap: 15px; }
.glass-inputs input, .glass-inputs textarea {
    padding: 15px; border-radius: 12px; border: 2px solid rgba(255,255,255,0.4);
    background: rgba(255, 255, 255, 0.5);
    color: #3E2723; font-family: var(--font-body); font-size: 1rem; outline: none; font-weight: 700;
    width: 100%; transition: 0.3s;
}
.glass-inputs input:focus, .glass-inputs textarea:focus { background: rgba(255, 255, 255, 0.8); border-color: #EFB1C8; }
.glass-inputs input::placeholder, .glass-inputs textarea::placeholder { color: #5D4037; opacity: 0.7; }

.btn-contact-submit {
    padding: 15px; background: #EFB1C8; color: white; border: none; border-radius: 12px;
    font-weight: 900; cursor: pointer; transition: 0.3s; box-shadow: 0 5px 15px rgba(239, 177, 200, 0.4);
}
.btn-contact-submit:hover { filter: brightness(1.1); transform: translateY(-2px); }

/* --- COLUNA DIREITA: INFO E BOTÕES --- */
.info-col { gap: 30px; background: rgba(255,255,255,0.05); }

.info-text h3 { font-family: var(--font-title); font-size: 1.8rem; color: #3E2723; margin-bottom: 10px; line-height: 1.1; }
.info-text p { font-size: 1.1rem; color: #3E2723; opacity: 0.9; }

.action-buttons { display: flex; flex-direction: column; gap: 15px; }

.btn-action {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 15px; border-radius: 50px; text-decoration: none;
    font-weight: 800; color: white; font-size: 1rem; transition: all 0.4s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.btn-action svg { width: 24px; height: 24px; }

/* Botão WhatsApp Degradê */
.btn-whats-gradient {
    background: linear-gradient(45deg, #25D366, #128C7E);
    border: 1px solid rgba(255,255,255,0.3);
}
.btn-whats-gradient:hover { transform: scale(1.03); box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4); }

/* Botão Instagram Liquid Glass (Com Animação de Cor) */
.btn-insta-liquid {
    /* Fundo degradê animado */
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    background-size: 200% 200%; /* Permite mover o background */
    border: 1px solid rgba(255,255,255,0.5);
    position: relative; overflow: hidden;
    animation: gradientShift 5s ease infinite; /* Animação constante sutil */
}
.btn-insta-liquid:hover {
    background-position: right center; /* Muda a cor ao passar o mouse */
    transform: scale(1.03);
    box-shadow: 0 10px 25px rgba(220, 39, 67, 0.4);
}
/* Overlay de vidro por cima */
.btn-insta-liquid::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 50%;
    background: linear-gradient(to bottom, rgba(255,255,255,0.4), transparent);
    border-radius: 50px 50px 0 0;
}

@keyframes gradientShift { 
    0% { background-position: 0% 50%; } 
    50% { background-position: 100% 50%; } 
    100% { background-position: 0% 50%; } 
}

.address-box { 
    margin-top: 10px; padding-top: 20px; border-top: 1px solid rgba(62, 39, 35, 0.1); 
    font-size: 0.95rem; color: #3E2723; 
}

/* --- BARRA ROXA INFERIOR (CRÉDITOS) --- */
.purple-footer-bar {
    width: 100%; background: #C5A3CB; padding: 20px 5%;
    display: flex; justify-content: space-between; align-items: center;
    color: #3E2723; border-top: 1px solid rgba(255,255,255,0.3);
}

.brand-area h3 { font-family: var(--font-title); font-size: 1.4rem; }
.brand-area p { font-size: 0.8rem; opacity: 0.8; }

.lks-area { display: flex; align-items: center; gap: 20px; font-size: 0.9rem; }

/* Botão LKS Final */
.btn-lks-final {
    background: #b1d3f5; color: #5a4654; text-decoration: none;
    padding: 8px 15px; border-radius: 6px; font-size: 0.8rem; font-weight: 700;
    transition: 0.3s; border: 3px solid rgba(255,255,255,0.2);
    display: inline-flex; flex-direction: column; align-items: center; line-height: 1.2;
}
.btn-lks-final:hover { background: black; color: white; transform: translateY(-2px); }

/* --- RESPONSIVO --- */
@media (max-width: 900px) {
    .glass-panel-wrapper { grid-template-columns: 1fr; width: 95%; margin-top: 20px; }
    .form-col { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.2); padding: 30px; }
    .info-col { padding: 30px; text-align: center; }
    .contact-section { height: auto; min-height: 100vh; padding-bottom: 0; }
    
    .purple-footer-bar { flex-direction: column; gap: 20px; text-align: center; padding: 30px 5%; }
    .lks-area { flex-direction: column; gap: 10px; }
}