
:root{
  --brand:#0c3d5b;
  --accent:#1b7f5f;
  --bg:#f7fbfd;
  --txt:#0b1c26;
  --muted:#5e7483;
  --card:#ffffff;
  --border:#e6eef3;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--txt);background:var(--bg)}
img{max-width:100%;display:block}
.container{width:min(1100px,92%);margin-inline:auto}
.row{display:flex;gap:16px;align-items:center}
.row.between{justify-content:space-between}
a{color:inherit;text-decoration:none}

/* Header */
.topbar{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.topbar .brand{display:flex;align-items:center;gap:12px;padding:10px 0}
.topbar img{width:56px;height:auto;border-radius:6px}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text strong{font-weight:800;letter-spacing:.5px}
.brand-text span{font-size:12px;color:var(--muted)}
.cta-group{margin-left:auto;display:flex;gap:10px}

.btn{padding:.65rem 1rem;border-radius:12px;border:1px solid var(--border);font-weight:600;transition:.2s}
.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn.outline{background:transparent;color:var(--brand);border-color:var(--brand)}
.btn.ghost{background:#fff}
.btn.lg{padding:.9rem 1.2rem;font-size:1.05rem}

/* Hero */
.hero{padding:60px 0;background:linear-gradient(180deg,#eaf4fb,transparent)}
.hero h1{font-size:clamp(28px,4.5vw,44px);margin:0 0 10px}
.hero p{color:var(--muted);max-width:800px;font-size:1.05rem}
.hero-cta{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.badges{list-style:none;display:flex;gap:12px;padding:0;margin:20px 0 0}
.badges li{background:#fff;border:1px solid var(--border);padding:.5rem .75rem;border-radius:999px;font-size:.9rem}

/* Sections */
.section{padding:60px 0}
.section.alt{background:#fff}
.section h2{font-size:clamp(22px,3.5vw,32px);margin:0 0 22px}

/* Grid */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.grid.two{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.grid.two{grid-template-columns:1fr}}
@media(max-width:560px){.grid{grid-template-columns:1fr}}

.card{background:var(--card);border:1px solid var(--border);padding:16px;border-radius:16px;box-shadow:0 4px 14px rgba(6,35,61,.04)}
.card h3{margin:0 0 8px;font-size:1.1rem}
.card p{margin:0;color:var(--muted)}

.more summary{cursor:pointer;font-weight:600;margin-top:20px}
.listcols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px}
@media(max-width:800px){.listcols{grid-template-columns:1fr}}
.listcols ul{margin:0;padding-left:18px}

/* Why/CTA */
.tick{list-style: none;padding:0;margin:0}
.tick li{margin:10px 0;position:relative;padding-left:24px}
.tick li:before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:800}
.cta-box{background:#f0f8f4;border:1px solid #d8eee4;padding:18px;border-radius:16px}

/* Map iframe */
iframe{width:100%;height:280px;border:0;border-radius:12px}

/* Footer */
.footer{background:#0b2330;color:#e6eef3;padding:20px 0;margin-top:20px}
.footer .to-top{color:#b9d6ff}

/* WhatsApp FAB */
.whatsapp-fab{position:fixed;right:16px;bottom:16px;width:56px;height:56px;background:#25d366;border-radius:50%;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.whatsapp-fab svg{width:28px;height:28px;fill:#fff}

figure{margin:0}
figcaption{margin-top:8px;font-size:.9rem;color:var(--muted)}
