
:root{
  --bg:#0b0b0c;
  --panel:#0f1115;
  --text:#f4f6f8;
  --sub:#c6c9d3;
  --accent:#00c2d0; /* cyan from brand */
  --accent-2:#ff7a3d; /* neon orange accent */
  --muted:#1a1c22;
  --card:#101218;
  --border:#232532;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:#fff;
  color:#0b0b0c;
  line-height:1.6;
}

/* Containers */
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* Nav */
.nav{
  position:sticky;top:0;z-index:50;
  background:#fff;
  border-bottom:1px solid #eee;
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand img{height:36px;display:block;object-fit:contain}
.menu{display:flex;gap:20px;align-items:center}
.menu a{color:#111;text-decoration:none;font-weight:500}
.menu a:hover{color:var(--accent)}
.hamburger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.hamburger span{display:block;width:24px;height:2px;background:#111;margin:5px 0}

/* Mobile nav */
.mobile-nav{display:none;flex-direction:column;padding:0 24px 16px 24px;background:#fff;border-bottom:1px solid #eee}
.mobile-nav a{padding:12px 0;color:#111;text-decoration:none;border-top:1px solid #f3f3f3}
.mobile-nav .btn{margin-top:12px}

/* Hero */
.hero{padding:64px 0 40px 0;background:linear-gradient(180deg,#fff 0%,#f7fbfc 100%)}
.hero-inner{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center}
.hero-copy h1{font-size:48px;line-height:1.15;margin:0 0 12px 0;letter-spacing:-0.02em}
.accent{color:var(--accent)}
.hero-copy p{font-size:18px;color:#333;max-width:56ch}
.hero-cta{display:flex;gap:16px;align-items:center;margin-top:20px}
.trust{display:flex;gap:28px;margin-top:28px}
.kpi{display:flex;flex-direction:column}
.kpi .num{font-size:28px;font-weight:700}
.kpi .label{font-size:12px;color:#666}
.hero-media img{width:100%;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.12)}

/* Buttons & links */
.btn{background:var(--accent);color:#00363b;border:1px solid var(--accent);padding:10px 16px;border-radius:10px;font-weight:600;text-decoration:none;display:inline-block}
.btn:hover{filter:brightness(0.95)}
.btn--outline{background:#fff;color:#111;border:1px solid #ddd}
.btn--lg{padding:14px 20px;border-radius:12px}
.link{color:#111;text-decoration:none;font-weight:600;border-bottom:2px solid rgba(0,0,0,0.12);padding-bottom:2px}
.link:hover{color:var(--accent);border-color:var(--accent)}

/* Sections */
.section{padding:72px 0}
.section.alt{background:#fafafa}
.section-head{margin-bottom:28px}
.section-head h2{font-size:32px;margin:0 0 8px 0}
.section-head p{color:#555}

/* Cards */
.grid{display:grid;gap:20px}
.cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:#fff;border:1px solid #eee;border-radius:14px;padding:20px;box-shadow:0 6px 20px rgba(0,0,0,.04)}
.card h3{margin:6px 0 6px 0}
.card p{color:#444}

/* Badges */
.badges{grid-template-columns:repeat(3,minmax(0,1fr))}
.badge{background:#fff;border:1px solid #eee;border-radius:999px;padding:12px 16px;text-align:center;font-weight:600}

/* Posts */
.posts{grid-template-columns:repeat(3,minmax(0,1fr))}
.post{background:#fff;border:1px solid #eee;border-radius:14px;padding:20px}
.post .pill{display:inline-block;background:rgba(0,194,208,.12);color:#00666e;font-weight:700;border-radius:999px;padding:4px 10px;font-size:12px}
.post h3{margin:10px 0 6px 0}

/* Contact */
.contact{background:linear-gradient(180deg,#fff 0%,#f7fbfc 100%)}
.contact-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:start}
.form{display:flex;flex-direction:column;gap:14px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{display:flex;flex-direction:column;gap:6px}
.form input,.form textarea{padding:12px 14px;border:1px solid #ddd;border-radius:12px;font:inherit}
.form input:focus,.form textarea:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.aside-card{background:#fff;border:1px solid #eee;border-radius:14px;padding:20px;position:sticky;top:96px}
.aside-card ul{margin:12px 0 0 18px}

/* Footer */
.footer{border-top:1px solid #eee;background:#fff}
.footer-inner{display:flex;align-items:center;justify-content:space-between;padding:28px 0}
.foot-brand{display:flex;align-items:center;gap:16px}
.foot-brand img{height:28px}
.foot-brand p{margin:0;color:#555}
.foot-nav{display:flex;gap:16px}
.foot-nav a{color:#444;text-decoration:none}
.foot-nav a:hover{color:var(--accent)}

/* Responsive */
@media (max-width: 1000px){
  .hero-inner{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .posts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-inner{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .menu{display:none}
  .hamburger{display:block}
  .cards{grid-template-columns:1fr}
  .posts{grid-template-columns:1fr}
  .badges{grid-template-columns:1fr 1fr}
  .form .row{grid-template-columns:1fr}
  .hero-copy h1{font-size:36px}
}
