:root{
  --navy:#071f46;
  --navy-2:#0c315f;
  --cyan:#16baf1;
  --ink:#10213c;
  --muted:#5f6c7f;
  --line:#dfe5ec;
  --paper:#ffffff;
  --soft:#f5f8fb;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);line-height:1.45}
a{color:inherit;text-decoration:none}
.topbar{height:88px;display:flex;align-items:center;gap:36px;padding:0 6vw;border-bottom:1px solid #edf0f3;position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);z-index:10}
.brand{margin-right:auto;display:flex;align-items:center;gap:12px}
.brand-mark{width:34px;height:34px;border:4px solid var(--cyan);border-right-color:var(--navy);border-radius:50%;position:relative;display:inline-block}
.brand-mark:after{content:"";position:absolute;left:13px;top:-9px;width:4px;height:46px;background:var(--navy)}
.brand strong{display:block;font-size:28px;line-height:.9;color:var(--navy);letter-spacing:-1px}
.brand small{display:block;font-size:8px;letter-spacing:.14em;color:var(--navy);margin-top:5px}
nav{display:flex;gap:34px;font-size:14px}
nav a:hover{color:var(--navy-2)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:48px;padding:0 24px;border:1px solid var(--navy);font-weight:700;font-size:14px}
.button-dark{background:var(--navy);color:#fff}
.button-light{background:#fff}
.button-cyan{background:var(--cyan);border-color:var(--cyan);color:var(--navy)}
.hero{display:grid;grid-template-columns:1fr 1.05fr;min-height:610px}
.hero-copy{padding:72px 6vw 64px 7vw;display:flex;flex-direction:column;justify-content:center}
.accent{display:block;width:36px;height:4px;background:var(--cyan);margin-bottom:22px}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(52px,6vw,86px);line-height:.95;letter-spacing:-3px;margin-bottom:28px;max-width:650px;color:var(--navy)}
.hero-copy>p{font-size:21px;max-width:650px;color:#586474}
.actions{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.hero-visual{background:#edf2f5;display:flex;align-items:center;justify-content:center;padding:56px}
.system-frame{width:min(720px,100%);background:#fff;border:1px solid #cfd7df;box-shadow:0 24px 60px rgba(7,31,70,.15)}
.system-top{height:56px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-size:12px;letter-spacing:.08em}
.system-top span:first-child{font-size:18px;font-weight:800}
.system-body{display:grid;grid-template-columns:150px 1fr;min-height:360px}
.system-body aside{background:#102846;color:#fff;padding:28px 18px;display:flex;flex-direction:column;gap:18px;font-size:12px}
.system-body aside b{font-size:10px;color:#77d8fb;letter-spacing:.14em}
.system-body section{padding:34px}
.kicker{font-size:10px;letter-spacing:.14em;color:#6c7785;margin-bottom:8px}
.system-body h3{font-size:25px;color:var(--navy);margin-bottom:24px}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.metrics div{border-top:3px solid var(--cyan);padding:14px 10px;background:#f7f9fb}
.metrics strong{display:block;font-size:24px;color:var(--navy)}
.metrics small{font-size:10px;color:#66717f}
.chartline{height:110px;margin-top:24px;background:
  linear-gradient(135deg,transparent 0 12%,rgba(22,186,241,.2) 12% 13%,transparent 13% 34%,rgba(7,31,70,.18) 34% 35%,transparent 35% 56%,rgba(22,186,241,.25) 56% 57%,transparent 57% 78%,rgba(7,31,70,.18) 78% 79%,transparent 79%),
  repeating-linear-gradient(to right,#eef2f6 0 1px,transparent 1px 70px),
  repeating-linear-gradient(to bottom,#eef2f6 0 1px,transparent 1px 28px)}
.split{display:grid;grid-template-columns:.95fr 1.05fr;min-height:420px}
.visual-strip{position:relative;overflow:hidden;background:#111a25;display:flex;align-items:center;justify-content:center;padding:54px 7vw}
.visual-strip:before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/60px 60px,
  linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/60px 60px}
.process-panel{position:relative;z-index:1;width:min(560px,100%);color:#fff}
.process-kicker{font-size:11px;letter-spacing:.18em;font-weight:700;color:#8edfff;margin-bottom:28px}
.process-row{display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start}
.process-index{font-size:16px;font-weight:800;color:#6d7f91;padding-top:2px}
.process-row strong{display:block;font-size:24px;line-height:1;color:#fff;margin-bottom:7px}
.process-row small{display:block;font-size:14px;line-height:1.45;color:#b7c0ca;max-width:360px}
.process-line{height:34px;border-left:1px solid #485868;margin:8px 0 8px 25px}
.process-row-accent .process-index,.process-row-accent strong{color:var(--cyan)}
.process-row-accent{padding:16px 0 0;border-top:1px solid #324252}
.problem-copy{padding:64px 7vw 54px 6vw;background:#fbfcfd}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:11px;font-weight:700;color:#556275;margin-bottom:16px}
.eyebrow:before{content:"";display:inline-block;width:28px;height:3px;background:var(--cyan);vertical-align:middle;margin-right:12px}
.problem h2,.section-head h2,.method h2{font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-1.5px;color:var(--navy)}
.problem-copy>p:not(.eyebrow){font-size:18px;color:#697485;max-width:680px}
.areas{display:flex;gap:0;margin-top:34px;font-weight:700;flex-wrap:wrap}
.areas span{padding:0 24px;border-right:1px solid #cdd4dc}
.areas span:first-child{padding-left:0}
.areas span:last-child{border-right:0}
.solutions{padding:58px 7vw 64px}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}
.section-head h2{max-width:820px;margin-bottom:0}
.solution-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.solution-grid article{padding:34px 30px 36px 0;border-right:1px solid var(--line);margin-right:30px}
.solution-grid article:last-child{border-right:none;margin-right:0}
.num{font-size:31px;font-weight:800;color:var(--cyan);margin-bottom:10px}
.solution-grid h3,.steps h3{font-size:21px;color:var(--navy);margin-bottom:10px}
.solution-grid p,.steps p{color:#5f6978;margin-bottom:0}
.method{display:grid;grid-template-columns:.85fr 1.6fr;gap:70px;padding:58px 7vw 72px;background:var(--soft)}
.method-lead h2{margin-bottom:2px}
.method-sub{font-size:32px;line-height:1.05;color:#606b79}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;align-items:start}
.steps article{padding-top:22px;border-top:1px solid #9aa7b7;min-height:190px}
.steps .num{font-size:21px}
.cta{background:var(--navy);color:#fff;padding:56px 7vw;display:flex;align-items:center;justify-content:space-between;gap:40px}
.cta h2{font-size:clamp(34px,4vw,52px);line-height:1.08;margin:0;color:#fff}
.cta em{font-style:normal;color:var(--cyan)}
footer{display:flex;align-items:center;justify-content:space-between;padding:26px 7vw;border-top:1px solid #e7ebef}
.footer-brand{margin-right:20px}
.footer-links{display:flex;gap:24px;align-items:center;font-size:13px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:1000px){
  nav{display:none}
  .hero,.split,.method{grid-template-columns:1fr}
  .hero-visual{order:-1}
  .solution-grid,.steps{grid-template-columns:1fr 1fr}
  .solution-grid article:nth-child(2){border-right:none}
}
@media(max-width:650px){
  .topbar{height:74px;padding:0 20px}
  .brand strong{font-size:23px}
  .brand small{font-size:7px}
  .brand-mark{width:29px;height:29px}
  .topbar>.button{display:none}
  .hero-copy,.problem-copy,.solutions,.method,.cta{padding-left:22px;padding-right:22px}
  .hero-visual{padding:24px}
  .system-body{grid-template-columns:1fr}
  .system-body aside{display:none}
  .metrics{grid-template-columns:1fr}
  h1{font-size:54px}
  .solution-grid,.steps{grid-template-columns:1fr}
  .solution-grid article{border-right:none;border-bottom:1px solid var(--line);margin-right:0}
  .cta{align-items:flex-start;flex-direction:column}
  footer{flex-direction:column;align-items:flex-start;gap:22px;padding:24px 22px}
  .footer-links{justify-content:flex-start}
}
.solution-card{display:block;color:inherit}
.solution-card article{height:100%;transition:background .18s ease,transform .18s ease}
.solution-card:hover article{background:#f8fbfd}
.card-link{display:inline-block;margin-top:24px;font-size:13px;font-weight:700;color:var(--navy)}
.detail-page{background:#fff}
.detail-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;padding:72px 7vw 68px;border-bottom:1px solid var(--line)}
.detail-hero h1{font-size:clamp(48px,6vw,82px);margin-bottom:26px}
.detail-lead{font-size:21px;line-height:1.5;color:#5c6877;max-width:760px;margin-bottom:30px}
.back-link{display:inline-block;font-size:13px;font-weight:700;color:#607087;margin-bottom:34px}
.detail-principle{align-self:end;background:var(--navy);color:#fff;padding:38px}
.detail-principle span{display:block;font-size:10px;letter-spacing:.18em;color:#84dcfa;margin-bottom:14px}
.detail-principle strong{display:block;font-size:28px;line-height:1.1;margin-bottom:18px}
.detail-principle p{color:#d7e0ea;margin-bottom:0}
.detail-deliver{padding:64px 7vw 70px}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.detail-card{padding:30px;min-height:230px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.detail-card>span{display:block;font-size:18px;font-weight:800;color:var(--cyan);margin-bottom:22px}
.detail-card h3{font-size:22px;color:var(--navy);margin-bottom:12px}
.detail-card p{color:#5f6b79;margin-bottom:0}
.detail-two{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.detail-two>div{padding:64px 7vw}
.detail-results{background:#f5f8fb}
.detail-two h2{font-size:clamp(32px,3.6vw,48px);line-height:1.05;color:var(--navy);margin-bottom:30px}
.clean-list{list-style:none;padding:0;margin:0}
.clean-list li{position:relative;padding:16px 0 16px 28px;border-top:1px solid #d9e0e7;color:#465567}
.clean-list li:before{content:"";position:absolute;left:0;top:23px;width:8px;height:8px;background:var(--cyan)}
.detail-note{font-size:13px;color:#6d7987;margin-top:28px}
.detail-method{padding:58px 7vw 70px}
.detail-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:28px}
.detail-steps>div{border-top:1px solid #aeb8c3;padding-top:20px}
.detail-steps span{display:block;color:var(--cyan);font-size:19px;font-weight:800;margin-bottom:12px}
.detail-steps strong{display:block;color:var(--navy);font-size:20px;margin-bottom:8px}
.detail-steps p{color:#657180;margin-bottom:0}
@media(max-width:900px){
  .detail-hero,.detail-two{grid-template-columns:1fr}
  .detail-grid{grid-template-columns:1fr 1fr}
  .detail-steps{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .detail-hero,.detail-deliver,.detail-two>div,.detail-method{padding-left:22px;padding-right:22px}
  .detail-grid,.detail-steps{grid-template-columns:1fr}
  .detail-card{min-height:auto}
}