/*
  Residencial Lagoa Dourada — camada visual clean e sofisticada
  Como usar: inclua este arquivo DEPOIS do bloco <style> original:
  <link rel="stylesheet" href="lagoa-dourada-clean.css">

  Esta camada altera somente aparência e responsividade.
  Não altera URLs, pixels, tags, mapa, scripts ou o funcionamento do formulário.
*/

:root {
  --green-900: #17382f;
  --green-800: #245044;
  --green-700: #37685a;
  --green-600: #4f806e;
  --green-200: #dce9e2;
  --gold-500: #b99552;
  --gold-400: #c9ad72;
  --gold-300: #e1cf9e;
  --gold-dark: #806638;
  --gold-mid: #a58349;
  --cream: #faf9f5;
  --cream-dark: #f0f2ed;
  --text-body: #29423a;
  --text-muted: #687a71;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --shadow-glass: 0 16px 48px rgba(23, 56, 47, .12), inset 0 1px 0 rgba(255,255,255,.32);
  --transition: all .55s cubic-bezier(.22,1,.36,1);
}

body { background: var(--cream); color: var(--text-body); }

/* Movimento mais orgânico e discreto */
.reveal { transform: translateY(20px); transition-duration: .85s; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* Header */
header { padding: 16px 48px; background: rgba(23,56,47,.10); }
header.scrolled { background: rgba(250,249,245,.94); box-shadow: 0 4px 24px rgba(23,56,47,.10); }
.logo { color: var(--green-900); }
.logo span { color: var(--gold-dark); }
header nav a { color: rgba(250,249,245,.92); }
header.scrolled nav a { color: var(--green-800); }
header nav a:hover { color: var(--gold-400); }
.btn-header { background: var(--gold-400); color: var(--green-900) !important; box-shadow: 0 6px 18px rgba(185,149,82,.22); }
header.scrolled .btn-header { background: var(--green-800); color: var(--cream) !important; }

/* Hero: clareza maior, sem remover as imagens */
#hero { background: var(--green-800); }
.hero-slide { filter: brightness(.62) saturate(.82); }
.hero-overlay { background: linear-gradient(to top, rgba(23,56,47,.88) 0%, rgba(23,56,47,.48) 46%, rgba(23,56,47,.20) 100%); }
.hero-headline { text-shadow: 0 3px 24px rgba(10,30,24,.22); }
.hero-sub { color: rgba(250,249,245,.90); }
.hero-bullet { color: rgba(250,249,245,.88); }
.hero-card { background: rgba(250,249,245,.15); border-color: rgba(250,249,245,.34); box-shadow: 0 18px 56px rgba(10,30,24,.18); }
.hero-float-badge { background: rgba(250,249,245,.16); border-color: rgba(250,249,245,.30); }
.orn-ring { border-color: rgba(225,207,158,.32); }
.orn-hline { background: linear-gradient(90deg, transparent, rgba(225,207,158,.45), transparent); }

/* Fundos escuros ficam mais suaves */
#video-section, #proximity, #impacto, #diferencial, #escassez { background: var(--green-800); }
#video-section::before, #proximity::before { background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(79,128,110,.28), transparent 72%); }
#impacto::before { background: repeating-linear-gradient(45deg, rgba(220,233,226,.08) 0 1px, transparent 1px 52px); }
#escassez::after { background: repeating-linear-gradient(90deg, rgba(220,233,226,.07) 0 1px, transparent 1px 90px); }

/* Formulário: mantém IDs, campos e submit intactos */
#form-topo { background: linear-gradient(135deg, #e8eee8, #f8f7f1) !important; border-bottom: 1px solid rgba(55,104,90,.18) !important; }
#form-topo > div:first-child { background: linear-gradient(135deg, rgba(55,104,90,.06), transparent) !important; }
#form-topo .form-texto h2 { color: var(--green-900) !important; }
#form-topo .form-texto p,
#form-topo .form-texto div[style*="color:oklch"] { color: var(--text-muted) !important; }
#form-topo .form-texto > div:first-child,
#form-topo .form-box > div:first-child { color: var(--gold-dark) !important; }
#form-topo .form-box { background: rgba(255,255,255,.76) !important; border: 1px solid rgba(55,104,90,.16) !important; box-shadow: 0 18px 48px rgba(23,56,47,.10); }
#form-topo label { color: var(--green-700) !important; }
#form-topo input { background: #fff !important; color: var(--green-900) !important; border-color: rgba(55,104,90,.24) !important; }
#form-topo input::placeholder { color: #8b9a92 !important; }
#form-topo input:focus { border-color: var(--gold-500) !important; box-shadow: 0 0 0 3px rgba(185,149,82,.14); }
#form-topo button { background: var(--green-800) !important; color: #fff !important; box-shadow: 0 8px 24px rgba(36,80,68,.22) !important; }
#form-topo button:hover { background: var(--green-700) !important; }
#form-topo p { color: var(--text-muted) !important; }
#msgSucesso p { color: var(--green-800) !important; }

/* Seções claras */
#localizacao { background: #fbfaf6; }
#infraestrutura, #prova { background: var(--cream-dark); }
.section-title { color: var(--green-900); }
.section-title em { color: var(--green-600); }
.loc-dist, .infra-card, .proof-card { background: rgba(255,255,255,.78); border-color: rgba(55,104,90,.16); box-shadow: 0 8px 28px rgba(23,56,47,.04); }
.loc-dist:hover, .infra-card:hover, .proof-card:hover { border-color: rgba(185,149,82,.62); box-shadow: 0 16px 38px rgba(23,56,47,.10); }
.infra-icon { background: var(--green-800); }

/* Cards escuros e mapa */
.impact-card { background: rgba(250,249,245,.10); border-color: rgba(250,249,245,.20); }
.impact-card:first-child { background: linear-gradient(135deg, #c9ad72, #ad8847); }
.prox-legend-item { background: rgba(250,249,245,.10); border-color: rgba(250,249,245,.22); }
.prox-map-container { box-shadow: 0 0 0 1px rgba(201,173,114,.34), 0 20px 56px rgba(10,30,24,.24); }
.video-frame-wrap { box-shadow: 0 0 0 1px rgba(201,173,114,.30), 0 24px 64px rgba(10,30,24,.28); }

/* Galeria: preserva todas as imagens, melhora o respiro visual */
#galeria { background: var(--green-800) !important; }
#carrossel-track { gap: 24px !important; }
.car-slide { border-radius: 18px !important; box-shadow: 0 16px 40px rgba(10,30,24,.24) !important; }
#galeria button { background: var(--gold-400) !important; }

/* Botões */
.btn-primary { background: var(--green-800); color: #fff; box-shadow: 0 8px 24px rgba(36,80,68,.24); }
.btn-primary:hover { background: var(--green-700); }
.btn-secondary { border-color: var(--gold-500); color: var(--gold-dark); }
.btn-secondary:hover { background: var(--gold-500); color: var(--green-900); }
.btn-whatsapp { box-shadow: 0 8px 28px rgba(37,211,102,.24); }

/* Planta e footer */
#diferencial img { border-radius: 18px; }
#diferencial .planta-badge > div { background: rgba(36,80,68,.88) !important; border-color: rgba(225,207,158,.42) !important; }
footer { background: #17382f; }

/* Responsividade real para desktop, tablet e mobile */
@media (max-width: 1100px) {
  header { padding-left: 28px; padding-right: 28px; }
  section, #form-topo, #video-section, #proximity, #impacto, #localizacao, #infraestrutura, #diferencial, #financiamento, #prova, #escassez, #cta { padding-left: 28px; padding-right: 28px; }
  .hero-content { padding-left: 28px; padding-right: 28px; }
  .hero-card { right: 28px; width: 350px; padding: 28px; }
  .infra-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  header { background: rgba(23,56,47,.78); backdrop-filter: blur(14px); }
  header.scrolled { background: rgba(250,249,245,.94); }
  .hero-slide { filter: brightness(.70) saturate(.78); }
  .hero-overlay { background: linear-gradient(to top, rgba(23,56,47,.88), rgba(23,56,47,.28) 70%, rgba(23,56,47,.12)); }
  .hero-headline { font-size: clamp(2.15rem, 9vw, 3.25rem); }
  .hero-sub { font-size: 1.05rem; max-width: 620px; }
  .hero-content { padding-bottom: 56px; }
  .loc-map { min-height: 300px; }
  .infra-grid, .proof-inner { grid-template-columns: repeat(2, 1fr) !important; }
  .prox-legend { grid-template-columns: repeat(2, 1fr); }
  #diferencial img { width: 80% !important; }
}

@media (max-width: 640px) {
  html { font-size: 15px; }
  header { padding: 12px 18px; }
  header img { height: 40px !important; }
  section, #form-topo, #video-section, #proximity, #impacto, #localizacao, #infraestrutura, #diferencial, #financiamento, #prova, #escassez, #cta { padding: 64px 18px; }
  .hero-content { padding: 0 18px 48px; }
  .hero-headline { font-size: clamp(2rem, 10vw, 2.8rem); }
  .hero-sub { line-height: 1.55; }
  .btn-primary, .btn-whatsapp { width: 100%; justify-content: center; padding-left: 20px; padding-right: 20px; }
  #form-topo { padding-top: 48px !important; padding-bottom: 48px !important; }
  #form-topo .form-box { padding: 28px 20px !important; border-radius: 18px; }
  .infra-grid, .proof-inner, .prox-legend { grid-template-columns: 1fr !important; }
  .impact-card { padding: 28px 24px; }
  .impact-card:last-child { display: block !important; }
  .impact-card:last-child > div:nth-child(2) { width: 100% !important; height: 1px !important; margin: 24px 0; }
  .prox-map-container { height: 320px; }
  .video-meta { flex-direction: column; align-items: flex-start; gap: 18px; }
  #carrossel-track { padding: 0 18px !important; }
  .car-slide { min-width: calc(100vw - 36px) !important; height: 260px !important; }
  #diferencial img { width: 100% !important; }
  #diferencial .planta-badge { display: none; }
  .float-wa { width: 54px; height: 54px; bottom: 18px; right: 18px; }
  .footer-top, .footer-bottom { align-items: flex-start; }
}

@media (max-width: 380px) {
  .hero-headline { font-size: 1.85rem; }
  .hero-label { letter-spacing: .12em; font-size: .64rem; }
  #form-topo .form-box { padding-left: 16px !important; padding-right: 16px !important; }

  /* Mais espaço entre o menu superior e o formulário */
  #form-topo { padding-top: 130px !important; }
}

/* Espaçamento adequado em tablets */
@media (max-width: 900px) {
  #form-topo { padding-top: 105px !important; }
}

/* Espaçamento adequado em celulares */
@media (max-width: 640px) {
  #form-topo { padding-top: 85px !important; }
}

/* MENU PRINCIPAL - LAGOA DOURADA (fora de qualquer media query: vale em todas as larguras) */

#mainHeader {
  background: #F2C94C !important;
  background-color: #F2C94C !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  transition: background 0.4s ease, box-shadow 0.4s ease;
}

#mainHeader nav a {
  color: #ffffff !important;
}

#mainHeader nav a:hover {
  color: #17382f !important;
}

#mainHeader .btn-header {
  background: #17382f !important;
  color: #ffffff !important;
}

/* Estado depois do scroll */
#mainHeader.is-scrolled,
#mainHeader.scrolled {
  background: #174f3d !important;
  background-color: #174f3d !important;
  opacity: 1 !important;
  box-shadow: 0 4px 20px rgba(23, 56, 47, 0.18) !important;
}

#mainHeader.is-scrolled nav a,
#mainHeader.scrolled nav a {
  color: #ffffff !important;
}

#mainHeader.is-scrolled nav a:hover,
#mainHeader.scrolled nav a:hover {
  color: #e1cf9e !important;
}

#mainHeader.is-scrolled .btn-header,
#mainHeader.scrolled .btn-header {
  background: #c9ad72 !important;
  color: #17382f !important;
}