
:root{
  --bg:#0b0f17;            /* deep night blue */
  --fg:#0f172a;
  --accent:#00ff66;        /* Guardlumen green */
  --muted:#e8eefc;
  --text:#0f172a;
  --card:#ffffff;
  --radius:16px;
  --shadow:0 8px 24px rgba(0,0,0,.18);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:#f8fafc}

/* layout */
.container{max-width:1120px;margin:0 auto;padding:0 20px}

/* NAVBAR (replace your current navbar block) */
.navbar{
  position: sticky; top: 0; z-index: 10; background: var(--bg); color:#e5e7eb;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.navbar .inner{
  display:flex; align-items:center; gap:24px;       /* no space-between */
  height: 84px; padding: 0 12px;
}
.navbar .brand{ flex:0 0 auto; display:flex; align-items:center; }
.navbar .menu{ margin-left:auto; display:flex; gap:24px; }  /* menu locked to the right */

/* Bigger logo (works even if <img> has width/height attrs) */
.navbar .brand img{
  height: 56px !important;    /* adjust 52–64px */
  width: auto !important; display:block;
}

/* menu links */
.navbar .menu a{ color:#cbd5e1; font-weight:600; }
.navbar .menu a:hover,
.navbar .menu a[aria-current="page"]{ color:#ffffff; }

/* mobile */
@media (max-width: 640px){
  .navbar .inner{ height: 72px; }
  .navbar .brand img{ height: 40px !important; }
  .navbar .menu{ gap:16px; }
}


/* keep it tidy on small screens */
@media (max-width: 640px){
  .navbar .inner{ height: 76px; }
  .navbar .brand img{ height: 42px !important; }
}

/* hero */
.hero{
  background:linear-gradient(180deg,#0b0f17 0%,#0b0f17 55%,#f8fafc 55%,#f8fafc 100%);
  color:#fff;text-align:center;padding:70px 0 36px
}
.hero .card{
  background:#e9f2ff33; backdrop-filter:saturate(130%) blur(2px);
  border:1px solid #ffffff24;color:var(--fg);
  border-radius:var(--radius);padding:40px 28px;margin-top:24px;box-shadow:var(--shadow)
}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:16px}
.kpi{background:#fff;border-radius:14px;padding:14px;text-align:center;box-shadow:var(--shadow)}
.kpi .n{font-size:28px;font-weight:800;color:var(--accent)}

.cta-btn{
  background:var(--accent);color:#06110a;font-weight:800;border:0;border-radius:999px;
  padding:14px 22px;cursor:pointer;box-shadow:var(--shadow)
}
.cta-btn:hover{filter:brightness(1.05);transform:translateY(-1px)}

/* sections & cards */
.section{padding:64px 0;background:#f8fafc}
.section.dark{background:#fff}
.grid{display:grid;gap:20px}
.grid.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--card);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.card h3{margin:0 0 4px}

/* form */
.form{display:grid;gap:12px;max-width:620px;margin:0 auto}
.input,textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #e2e8f0}
textarea{min-height:140px;resize:vertical}
.notice{font-size:12px;color:#64748b}

/* footer */
.footer{background:var(--bg);color:#cbd5e1;padding:28px 0;margin-top:40px}
.badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.badge{padding:8px 12px;border-radius:999px;background:#00ff661a;border:1px dashed #00ff66;font-size:12px;color:#b6ffcf}
