:root{
--bg:#f5f7f9;
--text:#0e1113;
--muted:#506067;
--petroleo:#0E5E6F;
--cinza:#e9edf2;
--card:#ffffff;
--line:#d6e0e7;
--accent:#1697a8;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Montserrat,sans-serif;background:linear-gradient(180deg,#ffffff,var(--bg));color:var(--text)}
.container{max-width:1120px;margin:0 auto;padding:0 24px}

.topbar{position:fixed;top:0;left:0;right:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line);z-index:50}
.nav-container{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{color:var(--text);text-decoration:none;font-weight:700;letter-spacing:.4px}
.nav{display:flex;gap:18px}
.nav a{color:var(--muted);text-decoration:none;padding:10px;border-radius:6px}
.nav a:hover{color:var(--text);background:rgba(19,132,150,.12)}
.burger{width:40px;height:40px;display:none;align-items:center;justify-content:center;background:transparent;border:1px solid var(--line);border-radius:8px;color:var(--text)}
.burger span{display:block;width:20px;height:2px;background:var(--text);margin:2px 0}

.hero{padding-top:120px;padding-bottom:80px;background:
linear-gradient(135deg,transparent 60%, rgba(19,132,150,.06) 60%),
linear-gradient(180deg,transparent 70%, rgba(19,132,150,.05) 70%),
radial-gradient(60% 80% at 80% 20%, rgba(19,132,150,.12), transparent 60%)}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.hero-copy h1{font-size:38px;line-height:1.15;margin:0 0 12px;color:#0c1214}
.hero-copy p{font-size:17px;color:var(--muted);max-width:640px}
.hero-cta{margin-top:24px;display:flex;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;border-radius:10px;text-decoration:none;border:1px solid var(--line);color:var(--text);transition:transform .2s ease,background .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--petroleo);border-color:transparent;color:#fff}
.btn.primary:hover{background:var(--accent)}
.btn.ghost{background:transparent}

.hero-visual{position:relative;height:300px}
.shape{position:absolute;border:1px solid var(--line);border-radius:18px}
.shape-a{width:160px;height:160px;top:20px;right:40px;background:linear-gradient(135deg,transparent,rgba(19,132,150,.09))}
.shape-b{width:220px;height:120px;bottom:10px;right:10px;transform:rotate(8deg)}
.shape-c{width:80px;height:80px;top:90px;right:210px}

.section{padding:72px 0;border-top:1px solid var(--line);position:relative}
.section h2{margin:0 0 24px;color:#0c1214}
.section.alt{background:linear-gradient(180deg,rgba(19,132,150,.04),rgba(255,255,255,.6))}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 6px 18px rgba(16,24,40,.08);transition:transform .2s ease,box-shadow .2s ease}
.card h3{margin:0 0 10px;color:#0c1214;font-size:18px}
.card p{margin:0;color:var(--muted)}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(16,24,40,.12)}

.why{display:grid;grid-template-columns:1fr}
.why-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.why-list li{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;color:#2b3438}

.map h2{margin-bottom:16px}
.map-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:16px;border:1px solid var(--line)}
.map-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.contacts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.contact-item{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px}
.contact-item a{color:#0E5E6F;text-decoration:none}
.contact-item a.inline{margin-left:10px}

.form{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}
.form .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.form label{display:flex;flex-direction:column;color:#2b3438;font-size:14px}
.form input,.form textarea{margin-top:6px;background:#f7fafc;border:1px solid var(--line);color:var(--text);border-radius:10px;height:42px;padding:0 12px}
.form textarea{height:auto;padding:12px}
.form button{margin-top:18px}

.footer{border-top:1px solid var(--line);padding:28px 0;background:#f2f5f7}
.footer-inner{display:grid;grid-template-columns:1.2fr .8fr .6fr;gap:12px;align-items:center}
.footer a{color:#0E5E6F;text-decoration:none}
.registry div{color:#2b3438}

.cookie-banner{position:fixed;left:24px;right:24px;bottom:24px;background:#ffffff;border:1px solid var(--line);border-radius:16px;display:flex;gap:16px;align-items:center;padding:14px;z-index:60}
.cookie-text{flex:1;color:#2b3438}

.whatsapp{position:fixed;right:24px;bottom:24px;width:56px;height:56px;background:linear-gradient(135deg,var(--petroleo),var(--accent));color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 10px 24px rgba(0,0,0,.35);z-index:55}
.whatsapp:hover{transform:translateY(-2px)}

.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

@media (max-width:980px){
.hero-inner{grid-template-columns:1fr}
.cards{grid-template-columns:repeat(2,1fr)}
.contacts{grid-template-columns:1fr}
.footer-inner{grid-template-columns:1fr}
.nav{position:fixed;top:64px;right:14px;left:14px;background:#ffffff;border:1px solid var(--line);border-radius:14px;padding:12px;flex-direction:column;display:none}
.nav.open{display:flex}
.burger{display:flex}
}

@media (max-width:640px){
.cards{grid-template-columns:1fr}
.form .grid{grid-template-columns:1fr}
}