:root{
  --bg:#0b0e13; --ink:#0e1116; --text:#1b1f24; --muted:#5a6473; --brand:#0c7bdc; --brand-2:#16a085; --paper:#ffffff; --card:#f7f9fc; --accent:#02d5ff;
  --radius:14px; --space:clamp(16px,2vw,24px); --wide:1200px; --shadow:0 6px 20px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#111;background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--wide);margin:0 auto;padding:0 var(--space)}
.btn{display:inline-block;padding:.75rem 1.05rem;border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border:0;box-shadow:var(--shadow);font-weight:700}
.btn:hover{opacity:.95;text-decoration:none}
.btn-outline{background:transparent;border:1px solid var(--brand);color:var(--brand)}
.chip{display:inline-block;padding:.35rem .7rem;border:1px solid #e8edf5;border-radius:999px;color:#334155;background:#f8fafc}
.hidden{display:none}

/* Header */
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid #eef1f5;z-index:20}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.6rem;color:#111;font-weight:800;letter-spacing:.2px}
.brand .logo{width:38px;height:38px;border-radius:10px;background:radial-gradient(400px 200px at 50% -40%, #d9f3ff 0, #fff 70%);display:grid;place-items:center;font-weight:900;color:var(--brand)}
.nav-toggle{display:inline-flex;gap:.5rem;border:1px solid #e3e7ee;background:#fff;padding:.5rem .8rem;border-radius:10px}
.nav-menu{list-style:none;margin:0;padding:0;display:none}
.nav-menu li{display:block}
.nav-menu a{display:block;padding:.8rem 0}
.nav .btn{padding:.55rem .9rem}
@media (min-width:900px){
  .nav-toggle{display:none}
  .nav-menu{display:flex;gap:1.2rem;align-items:center}
  .nav-menu a{padding:0}
}

/* Hero */
.hero{background:radial-gradient(1100px 420px at 50% -10%, #eaf6ff 0, #fff 70%);padding:clamp(40px,8vw,96px) 0;border-bottom:1px solid #eef1f5}
.hero-inner{display:grid;gap:1.2rem}
.eyebrow{font-weight:800;letter-spacing:.12em;color:var(--brand);text-transform:uppercase;font-size:.82rem}
.hero h1{font-size:clamp(28px,4.2vw,48px);line-height:1.1;margin:.2rem 0 .6rem}
.punch{font-weight:800;color:var(--brand)}
.hero-ctas{display:flex;gap:.8rem;flex-wrap:wrap}
.trust{display:flex;gap:.6rem;flex-wrap:wrap;color:#475569;margin-top:.8rem}

/* Sections */
section{scroll-margin-top:80px}
.section{padding:clamp(32px,6vw,68px) 0}
.section h2{margin:0 0 1rem;font-size:clamp(22px,3vw,34px)}
.grid{display:grid;gap:1rem}
.cards .card{background:var(--card);border:1px solid #eef1f5;border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow)}
.card h3{margin-top:0}
.link{font-weight:600}
@media (min-width:900px){ .grid-2{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .grid-3{grid-template-columns:repeat(3,1fr)} .grid-4{grid-template-columns:repeat(4,1fr)} }

/* Two-col */
.two-col{display:grid;gap:2rem;align-items:center}
@media (min-width:900px){ .two-col{grid-template-columns:1.2fr .8fr} }
.frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}

/* Footer */
.site-footer{background:#0f1320;color:#c9d3e0;margin-top:2rem}
.footer-grid{display:grid;gap:1.4rem;padding:clamp(24px,4vw,36px) 0}
@media (min-width:900px){ .footer-grid{grid-template-columns:1fr 1fr 1fr} }
.footer-nav{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}
.legal{text-align:center;border-top:1px solid #1b2132;padding:.8rem;color:#8fa3bf}

/* Mobile sticky call bar */
.mobile-callbar{position:fixed;left:0;right:0;bottom:0;display:flex;gap:.6rem;justify-content:space-between;align-items:center;padding:.6rem .9rem;background:rgba(15,19,32,.96);backdrop-filter:blur(6px);z-index:50}
.mobile-callbar a{flex:1;text-align:center;border-radius:999px;padding:.7rem .9rem;box-shadow:var(--shadow)}
.mobile-callbar .call{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff}
.mobile-callbar .email{background:transparent;border:1px solid #395072;color:#e6edf7}
@media (min-width:800px){.mobile-callbar{display:none}}
body{padding-bottom:72px} /* ensure content not hidden behind callbar on mobile */

:root{
  --bg:#0b0e13; --ink:#0e1116; --text:#1b1f24; --muted:#5a6473; --brand:#1f7a8c; --brand-2:#18a999; --paper:#ffffff; --card:#f7f9fc;
  --radius:14px; --space:clamp(16px,2vw,24px); --wide:1200px;
  --shadow:0 6px 20px rgba(0,0,0,.08);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#1a1f2b;background:#fff;}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
.container{max-width:var(--wide);margin:0 auto;padding:0 var(--space)}
.btn{display:inline-block;padding:.7rem 1rem;border-radius:999px;background:var(--brand);color:#fff;border:0;box-shadow:var(--shadow)}
.btn:hover{opacity:.92;text-decoration:none}
.btn-outline{background:transparent;border:1px solid var(--brand);color:var(--brand)}
.btn-primary{background:linear-gradient(90deg,var(--brand),var(--brand-2))}

.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid #eef1f5;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.logo{height:36px;width:auto;margin-right:.6rem}
.brand{display:flex;align-items:center;font-weight:700;color:#111}
.nav-toggle{display:inline-flex;gap:.5rem;border:1px solid #e3e7ee;background:#fff;padding:.5rem .8rem;border-radius:10px}
.nav-menu{list-style:none;margin:0;padding:0;display:none}
.nav-menu li{display:block}
.nav-menu a{display:block;padding:.8rem 0}
.nav .btn{padding:.55rem .9rem}

@media (min-width:900px){
  .nav-toggle{display:none}
  .nav-menu{display:flex;gap:1.2rem;align-items:center}
  .nav-menu a{padding:0}
}

.hero{background:radial-gradient(1200px 400px at 50% -10%, #e9f6f7 0, #fff 70%);padding:clamp(40px,8vw,90px) 0;border-bottom:1px solid #eef1f5}
.hero-inner{display:grid;gap:1.2rem}
.hero h1{font-size:clamp(28px,4vw,44px);line-height:1.1;margin:0}
.hero-ctas{display:flex;gap:.8rem;flex-wrap:wrap}
.trust-badges{display:flex;gap:1rem;flex-wrap:wrap;color:var(--muted);padding:0;margin:.8rem 0 0;list-style: "✓ "}

.services{padding:clamp(32px,6vw,64px) 0}
.services h2{margin:0 0 1rem}
.grid{display:grid;gap:1rem}
.cards .card{background:var(--card);border:1px solid #eef1f5;border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow)}
.card h3{margin-top:0}
.link{font-weight:600}

@media (min-width:800px){ .grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .grid{grid-template-columns:repeat(4,1fr)} }

.proof{background:#fff;border-top:1px solid #eef1f5;border-bottom:1px solid #eef1f5}
.proof-inner{display:grid;gap:2rem;align-items:center;padding:clamp(32px,6vw,64px) 0}
.frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.bullets{margin:.6rem 0 1.2rem;padding-left:1.2rem}

.cta{padding:clamp(28px,5vw,56px) 0;text-align:center}

.site-footer{background:#0f1320;color:#c9d3e0;margin-top:2rem}
.footer-grid{display:grid;gap:1.4rem;padding:clamp(24px,4vw,36px) 0}
.footer-nav{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}
.mini-form .row{display:flex;gap:.5rem;margin:.5rem 0}
.mini-form input{flex:1;padding:.6rem;border-radius:10px;border:1px solid #2a3142;background:#121729;color:#e6edf7}
.mini-form .btn{background:#2a86ff}
.legal{text-align:center;border-top:1px solid #1b2132;padding:.8rem;color:#8fa3bf}


/* FAQ Accordion (Details/Summary) */
.faq-item {
  border-bottom: 1px solid #ddd;
  padding: 1rem 0;
}

.faq-item details {
  width: 100%;
}

.faq-item summary {
  cursor: pointer;
  font-weight: 600;
  list-style: none;
  position: relative;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::after {
  content: "+";
  position: absolute;
  right: 0;
  font-weight: bold;
}

.faq-item details[open] summary::after {
  content: "−";
}

.faq-answer {
  margin-top: 0.5rem;
  color: #444;
}
