:root{--n:#052f59;--d:#001f3c;--b:#0872b9;--g:#61a92f;--l:#a4cf42;--p:#563577}
*{box-sizing:border-box}
body{margin:0;background:#edf2f5;color:#102b47;font-family:Arial,Helvetica,sans-serif}
.page{max-width:1500px;margin:auto;background:#fff;padding:18px;box-shadow:0 0 45px #062f5915}
.top{display:grid;grid-template-columns:1.08fr .92fr;gap:22px}
.brand{padding:6px 16px}
.brand img{width:min(630px,100%);height:150px;object-fit:cover;object-position:center 76%;margin:-10px 0 5px}
.brand h1{text-transform:uppercase;font-size:clamp(2rem,3.6vw,4.15rem);line-height:.97;letter-spacing:-.045em;color:var(--n);margin:5px 0 20px}
.brand h1 u{text-decoration-color:var(--g);text-decoration-thickness:7px;text-underline-offset:16px}
.brand h2{font-size:clamp(1.2rem,2vw,2.1rem);margin:29px 0 18px}
.outcomes{display:grid;grid-template-columns:repeat(4,1fr)}
.outcomes div{display:grid;place-items:center;text-align:center;border-right:1px solid #b8c6cf;padding:8px}
.outcomes div:last-child{border:0}
.outcomes b{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#eef7e9;color:var(--g);font-size:2.2rem}
.outcomes span{text-transform:uppercase;font-weight:900;font-size:.78rem;margin-top:7px}
.problem{background:linear-gradient(145deg,#073a68,var(--d));color:white;border-radius:13px;padding:36px 40px;box-shadow:0 9px 20px #001f3c2b}
.problem h2{text-transform:uppercase;color:var(--l);font-size:clamp(1.5rem,2vw,2.3rem);margin:0 0 16px}
.problem ul,.solution ul,.platform ul,.list ul{list-style:none;padding:0;margin:0}
.problem li{position:relative;padding:7px 0 7px 37px;font-size:1.04rem;line-height:1.28}
.problem li:before,.platform li:before,.list li:before{content:"✓";position:absolute;left:0;top:6px;display:grid;place-items:center;border-radius:50%;background:#82bd3d;color:white;font-weight:900}
.problem li:before{width:24px;height:24px}
.problem h3{text-align:center;text-transform:uppercase;color:var(--l);font-size:1.3rem;margin:22px 0 0}
.title,.small-title{display:flex;align-items:center;text-align:center;gap:14px}
.title{margin:26px 5px 16px}
.title i,.small-title i{height:2px;background:var(--g);flex:1}
.title h2,.small-title h2{white-space:nowrap;text-transform:uppercase;margin:0;color:var(--n);font-size:1.35rem}
.solutions{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.solution{min-height:505px;border-radius:12px;color:white;padding:18px 22px}
.s1{background:linear-gradient(145deg,#074473,#002642)}
.s2{background:linear-gradient(145deg,#147dc1,#00558d)}
.s3{background:linear-gradient(145deg,#74bd3f,#39831e)}
.s4{background:linear-gradient(145deg,#694387,#3c225c)}
.solution header{display:flex;align-items:center;gap:12px}
.solution header b{display:grid;place-items:center;width:57px;height:57px;border-radius:50%;background:white;color:var(--n);font-size:2rem;flex:none}
.solution h2{text-transform:uppercase;font-size:1.28rem}
.solution h3{color:#b9dc4a;font-size:1.35rem;margin:19px 0 7px}
.solution p{font-size:1rem;line-height:1.35}
.solution li{padding:5px 0 5px 15px;position:relative;font-size:.95rem}
.solution li:before{content:"•";position:absolute;left:0}
.middle{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:14px;margin:38px 5px}
.box{border:1.5px solid #a5c791;border-radius:10px;padding:18px}
.small-title{margin:-30px 0 18px}
.small-title h2{background:#fff;padding:0 8px;color:#4c9228;font-size:1.05rem}
.flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;align-items:center;text-align:center}
.flow div{display:grid;place-items:center;gap:6px}
.flow b{font-size:2rem;color:var(--n)}
.flow span{font-size:.69rem;font-weight:900;text-transform:uppercase}
.flow em{font-style:normal;color:var(--g);font-size:1.45rem}
.connect{display:flex;justify-content:center;align-items:center;gap:20px;background:linear-gradient(100deg,var(--n),var(--b));color:white;border-radius:7px;padding:18px;margin-top:18px;text-align:center}
.connect strong{font-size:1.35rem}
.connect span{font-size:.8rem}
.team p{line-height:1.45}
.team>div:last-child{display:flex;flex-wrap:wrap;gap:7px}
.team>div:last-child span{padding:8px 12px;border:1px solid #c5dcb7;background:#eff6eb;border-radius:999px;color:#39751d;font-size:.78rem;font-weight:800}
.bottom{display:grid;grid-template-columns:1.45fr .82fr .82fr;gap:18px;margin:42px 0 18px}
.platform{border-radius:12px;background:linear-gradient(145deg,#073a68,#001a34);color:white;padding:17px 25px}
.platform>h2{text-transform:uppercase;color:var(--l);text-align:center;font-size:1.3rem;margin:0}
.platform>h3{text-align:center;font-size:.84rem;margin:4px 0 15px}
.platform>div{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:center}
.screen{height:150px;background:#edf3f6;border:7px solid #d4e0e6;border-bottom-width:16px;border-radius:8px;padding:9px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.screen i{grid-column:1/-1;height:20px;background:#095a91}
.screen span{background:linear-gradient(#6dad39 30%,#fff 30%);border:1px solid #b7cad5}
.platform li,.list li{position:relative;padding:5px 0 5px 24px;font-size:.85rem}
.platform li:before,.list li:before{width:17px;height:17px;font-size:.68rem;top:4px}
.platform>p{text-align:center;color:var(--l);font-size:.77rem;font-weight:800}
.list{border-color:#d6e0e6}
.list li{font-size:.88rem;margin-bottom:4px}
.partner li:before{background:var(--n)}
.cta{display:grid;grid-template-columns:1.2fr 1fr .85fr;align-items:center;background:linear-gradient(100deg,var(--g) 0 35%,var(--n) 35%);color:white;border-radius:8px;overflow:hidden}
.cta>div,.cta>a,.cta>p{min-height:74px;margin:0;padding:13px 28px;display:flex;align-items:center;gap:14px}
.cta a{color:white;text-decoration:none;text-transform:uppercase;border-right:1px solid #ffffff55}
.cta b{font-size:1.6rem}
.cta span,.cta p{font-size:.88rem;line-height:1.2}
.cta p{justify-content:center}
.disclaimer{text-align:center;color:#687d8b;font-size:.7rem}
@media(max-width:1050px){.top,.middle,.bottom{grid-template-columns:1fr}
.solutions{grid-template-columns:1fr 1fr}
.cta{grid-template-columns:1fr;background:var(--n)}
.cta>div{background:var(--g)}
}
@media(max-width:650px){.page{padding:10px}
.brand{padding:2px}
.brand img{height:100px}
.brand h1{font-size:2.15rem}
.outcomes{grid-template-columns:1fr 1fr}
.problem{padding:26px 22px}
.title h2,.small-title h2{white-space:normal;font-size:1rem}
.solutions{grid-template-columns:1fr}
.solution{min-height:0}
.flow{grid-template-columns:1fr;gap:6px}
.flow em{transform:rotate(90deg)}
.connect,.platform>div{grid-template-columns:1fr;display:grid;text-align:center}
.cta>div,.cta>a,.cta>p{padding:15px 18px}
}