:root{
  --bg:#0f172a;          /* slate-900 */
  --panel:#0b1226;       /* deep panel */
  --muted:#94a3b8;       /* slate-400 */
  --text:#e2e8f0;        /* slate-200 */
  --brand:#22c55e;       /* green-500 */
  --brand-ink:#064e3b;   /* green-900 */
  --accent:#38bdf8;      /* sky-400 */
  --card:#111827;        /* gray-900 */
  --alt:#0a1722;         /* blue-ish */
  --border:#1f2937;      /* gray-800 */
  --focus:#f59e0b;       /* amber-500 */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,var(--bg),#0b1220 60%, #081018 100%);
  line-height:1.6;
}

a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img,svg{max-width:100%;height:auto}

.container{width:min(1120px,92%);margin-inline:auto}

.skip-link{
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden
}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#000;color:#fff;padding:.5rem .75rem;border-radius:.375rem;z-index:1000}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(8,16,24,.8);backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--border)
}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0}
.brand{display:flex;gap:.5rem;align-items:center;color:var(--text);font-weight:600}
.brand__logo{filter:grayscale(1)}
.nav-toggle{
  display:none;background:transparent;border:1px solid var(--border);color:var(--text);
  padding:.4rem .6rem;border-radius:.5rem;font-size:1.25rem
}
.site-nav ul{display:flex;gap:1rem;align-items:center;margin:0;padding:0;list-style:none}
.site-nav a{padding:.5rem .25rem;border-radius:.375rem}
.site-nav a:focus{outline:2px solid var(--focus);outline-offset:2px}

.btn{
  display:inline-block;border:1px solid var(--brand);color:#052e1f;background:var(--brand);
  padding:.75rem 1rem;border-radius:.6rem;font-weight:600
}
.btn:hover{filter:brightness(1.05)}
.btn--ghost{
  background:transparent;border-color:var(--accent);color:var(--accent)
}
.btn--primary{color:#051b12}
.micro{color:var(--muted);font-size:.9rem}

.hero{padding:3.5rem 0 2rem;border-bottom:1px solid var(--border)}
.hero__inner{display:grid;gap:2rem;grid-template-columns:1.1fr .9fr;align-items:center}
.lead{font-size:1.15rem;color:#dbeafe}
.cta-row{display:flex;gap:1rem;flex-wrap:wrap;margin:.75rem 0 0}
.hero__visual{text-align:center}
.hero-svg rect{fill:#091222;stroke:#1b2a43}
.hero-svg circle{fill:#0f1d34;stroke:#1e3a8a}
.hero-svg path{stroke:#38bdf8}

.trust{display:flex;gap:.75rem;align-items:center;margin-top:1.25rem}
.trust__label{color:var(--muted);font-size:.95rem}
.trust__logos{display:flex;gap:.75rem;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.trust__logos li{border:1px solid var(--border);padding:.3rem .6rem;border-radius:.5rem;background:var(--panel);color:#cbd5e1;font-size:.9rem}

.section{padding:3rem 0}
.section--alt{background:linear-gradient(180deg,var(--alt),rgba(10,23,34,0));border-block:1px solid var(--border)}
h1{font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1.2;margin:.25rem 0 .5rem}
h2{font-size:clamp(1.4rem,2.5vw,1.9rem);margin:0 0 1rem}
h3{font-size:1.15rem;margin:.25rem 0 .25rem}
p{margin:.5rem 0}

.grid{display:grid;gap:1.25rem}
.cards{grid-template-columns:repeat(3,1fr)}
.features{grid-template-columns:repeat(3,1fr)}
.list{display:grid;gap:.5rem;margin:0;padding-left:1rem}

.card{
  background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1rem 1rem;
  box-shadow:0 0 0 1px rgba(255,255,255,0.01) inset
}
.card ul{margin:.5rem 0 0;padding-left:1.1rem}
.card li{margin:.2rem 0}

.contact{
  background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1rem;max-width:760px
}
.form-row{display:flex;flex-direction:column;margin:.6rem 0}
label{font-weight:600;margin-bottom:.2rem}
input,textarea{
  background:#0b1322;color:var(--text);border:1px solid var(--border);border-radius:.5rem;padding:.65rem .7rem
}
input:focus,textarea:focus{outline:2px solid var(--focus);outline-offset:2px}

.site-footer{border-top:1px solid var(--border);padding:1.25rem 0;color:#cbd5e1}
.footer__inner{display:flex;gap:1rem;justify-content:space-between;align-items:center;flex-wrap:wrap}
.site-footer a{color:#cbd5e1}
.site-footer a:hover{text-decoration:underline}

.chatbot-fab{
  position:fixed;right:1rem;bottom:1rem;z-index:60;
  width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;
  background:var(--brand);color:#052e1f;font-size:1.4rem;box-shadow:0 10px 24px rgba(0,0,0,.35)
}
.chatbot-modal{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.5);z-index:70;
}
.chatbot-modal[aria-hidden="false"]{display:flex}
.chatbot-modal__box{
  width:min(720px,92%);min-height:320px;background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1rem;position:relative
}
.chatbot-close{
  position:absolute;right:.5rem;top:.5rem;border:none;background:transparent;color:#fff;font-size:1.5rem;cursor:pointer
}
.chatbot-embed{background:#0a1320;border:1px dashed var(--border);border-radius:.5rem;min-height:240px;display:grid;place-items:center}

/* Responsive */
@media (max-width: 960px){
  .hero__inner{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .features{grid-template-columns:1fr}
  .site-nav ul{gap:.5rem}
}
@media (max-width: 720px){
  .cards{grid-template-columns:1fr}
  .nav-toggle{display:inline-block}
  .site-nav{display:none;position:absolute;right:.5rem;top:60px;background:var(--panel);border:1px solid var(--border);border-radius:.75rem}
  .site-nav.open{display:block}
  .site-nav ul{flex-direction:column;align-items:flex-start;padding:.5rem}
  .site-nav li{width:100%}
  .site-nav a{display:block;width:100%;padding:.6rem}
}
