
:root{
  --green:#087a16;
  --green2:#14a829;
  --dark:#0f172a;
  --ink:#111827;
  --muted:#4b5563;
  --line:#d7ded7;
  --soft:#f6faf6;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.45}
a{text-decoration:none;color:inherit}
.container{max-width:1220px;margin:0 auto;padding:0 32px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:18px 38px;background:white;border-bottom:1px solid #e5e7eb}
.logo{height:78px;max-width:430px;object-fit:contain}
.nav{display:flex;gap:42px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.nav a{padding:10px 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a.active{color:var(--green);border-bottom-color:var(--green)}
.email{display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:16px}
.email svg{width:24px;height:24px;color:var(--green)}
.hero{position:relative;color:white;min-height:355px;background:
linear-gradient(90deg,rgba(5,12,16,.96),rgba(5,12,16,.88) 34%,rgba(5,12,16,.35) 67%,rgba(5,12,16,.12)),
radial-gradient(circle at 76% 20%,rgba(60,155,255,.65),transparent 18%),
linear-gradient(135deg,#061016,#061827 45%,#0d3556 78%,#061016);}
.hero:before{content:"";position:absolute;inset:0;background-image:
linear-gradient(118deg,transparent 0 48%,rgba(255,255,255,.38) 49%,rgba(255,255,255,.38) 50%,transparent 51%),
linear-gradient(48deg,transparent 0 48%,rgba(83,174,255,.36) 49%,rgba(83,174,255,.36) 50%,transparent 51%);
background-size:420px 220px,520px 260px;background-position:45% 26%,64% 8%;opacity:.55}
.hero:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.9) 0 2px,transparent 3px);background-size:140px 75px;background-position:50% 30%;opacity:.42}
.hero-content{position:relative;z-index:2;padding:38px 0}
.hero h1{max-width:650px;margin:0;font-size:38px;line-height:1.14;text-transform:uppercase;letter-spacing:.035em}
.hero h1 span{color:var(--green2)}
.underline{width:95px;height:3px;background:var(--green2);margin:14px 0 16px}
.hero p{max-width:640px;font-size:18px;margin:0}
.proof{background:linear-gradient(90deg,#005712,#0b7f18,#196f29);color:white}
.proof-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.proof-item{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:center;padding:20px 18px;border-right:1px solid rgba(255,255,255,.24)}
.proof-item:last-child{border-right:0}
.proof-item svg{width:42px;height:42px;opacity:.9}
.proof-item strong{display:block;font-size:14px;text-transform:uppercase;letter-spacing:.04em}
.proof-item span{font-size:15px}
main{padding:26px 0 32px}
.three{display:grid;grid-template-columns:1.05fr .72fr 1.1fr;gap:30px}
.panel + .panel{border-left:1px solid #d8d8d8;padding-left:30px}
h2{margin:0 0 14px;padding-bottom:7px;font-size:18px;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--green)}
h3{margin:0 0 8px;color:var(--green);font-size:16px}
p{font-size:15px;margin:0 0 13px}
.mini-card,.quote{border:1px solid #7eba7e;background:#fbfffb;padding:14px;display:flex;gap:16px;align-items:center}
.mini-card svg,.quote svg{width:44px;min-width:44px;color:var(--green)}
.mini-card strong{display:block;color:var(--green);font-size:13px;text-transform:uppercase}
.domains{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}
.domains div{font-size:14px}
.domains div:before{content:"✓";color:var(--green);font-weight:800;border:1px solid var(--green);border-radius:50%;padding:0 3px;margin-right:10px;font-size:11px}
.quote{margin-top:18px}
.capabilities{margin-top:18px;border-top:1px solid #c8d7c8;border-bottom:1px solid #c8d7c8;padding:13px 0;display:grid;grid-template-columns:repeat(7,1fr)}
.cap{display:flex;gap:12px;align-items:center;padding:0 12px;border-right:1px solid #ccc;font-size:13px;font-weight:700}
.cap:last-child{border-right:0}
.cap svg{width:34px;min-width:34px;color:var(--green)}
.bottom{display:grid;grid-template-columns:1fr 1.25fr 1.25fr;gap:30px;margin-top:16px;border-top:1px solid #ddd;padding-top:16px}
.bottom .panel + .panel{border-left:1px solid #d8d8d8;padding-left:30px}
.bullets{columns:2;margin:0;padding-left:18px;font-size:14px}
.bullets li{break-inside:avoid;margin:0 0 7px}
.bullets li::marker{color:var(--green)}
.learn{display:inline-block;margin-top:12px;color:var(--green);font-weight:800;font-size:12px;text-decoration:underline;text-transform:uppercase}
.leader strong{color:var(--green);font-size:17px}
.leader em{display:block;font-size:13px}
.page-title{background:#0f172a;color:white;padding:48px 0}
.page-title h1{margin:0;font-size:34px;text-transform:uppercase;letter-spacing:.04em}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;box-shadow:0 5px 18px rgba(15,23,42,.06)}
.card h3{color:#111;border-bottom:1px solid var(--green);padding-bottom:8px}
.contact-box{background:var(--soft);border:1px solid #9ccc9c;padding:22px;border-radius:8px}
.footer-top{background:#171717;color:white}
.footer-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr 1.35fr 1.2fr;align-items:center}
.footer-grid div{border-right:1px solid #777;padding:18px 22px;min-height:58px;display:flex;align-items:center;gap:10px;font-size:14px}
.footer-grid div:last-child{border-right:0}
.footer-bottom{background:linear-gradient(90deg,#005b13,#0b7f18);color:white;font-size:13px}
.footer-bottom .container{display:flex;justify-content:space-between;gap:20px;padding-top:13px;padding-bottom:13px}
.footer-bottom a{margin-left:20px}
@media(max-width:1050px){
  .topbar{align-items:flex-start;flex-direction:column}
  .nav{gap:22px;flex-wrap:wrap}
  .proof-grid{grid-template-columns:1fr 1fr}
  .proof-item{border-right:0}
  .three,.bottom,.cards{grid-template-columns:1fr}
  .panel + .panel,.bottom .panel + .panel{border-left:0;padding-left:0}
  .capabilities{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-grid div{border-right:0;border-bottom:1px solid #555}
}
@media(max-width:600px){
  .container{padding:0 22px}
  .logo{height:auto;width:100%;max-width:100%}
  .email{font-size:14px}
  .hero h1{font-size:28px}
  .hero p{font-size:16px}
  .proof-grid,.capabilities,.domains{grid-template-columns:1fr}
  .footer-bottom .container{flex-direction:column}
}
