:root{--dark:#163b46;--ink:#172e35;--body:#33454b;--blue:#97bbc2;--secondary:#204d58;--tertiary:#97bbc2;--paper:#f5f6f3;--line:#d4dcda}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);font-family:Arial,Helvetica,sans-serif;color:var(--ink)}
button,a{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #d3ac69;outline-offset:4px}
.wrap{max-width:1160px;padding-inline:clamp(22px,5vw,68px);margin:auto}
.eyebrow{text-transform:uppercase;letter-spacing:2.1px;font-size:11px;font-weight:800}
.btn{border:1px solid transparent;border-radius:3px;background:var(--dark);color:#fff;padding:14px 19px;font-size:13px;font-weight:700;display:inline-flex;justify-content:center;align-items:center;gap:18px;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-2px);background:#255868}
.btn-light{background:#eaf0ed;color:var(--ink)}
.btn-light:hover{background:white}
.hero{background:var(--dark);color:#fff;overflow:hidden}
.herogrid{display:grid;grid-template-columns:1.06fr .94fr;align-items:center;min-height:580px;gap:24px;padding-block:80px 65px}
.hero h1{font-size:clamp(49px,6.3vw,81px);letter-spacing:-.065em;line-height:1.03;margin:25px 0}
.hero h1 em{font-style:normal;color:#97bbc2}
.hero .lead{font-size:17px;line-height:1.67;color:#e0e9e9;margin:0 0 28px}
.hero .eyebrow{color:#c0d8dd}
.heroart{height:400px;display:flex;align-items:center;justify-content:center;position:relative}
.heroart::before{content:'';position:absolute;width:74%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#2d596477 0%,transparent 69%)}
.bigmd{font-size:clamp(110px,14vw,192px);font-weight:800;color:#c5dddd;position:relative}
.section{padding-block:90px}
.label{color:#275d69}
.section h2,.cta h2{font-size:clamp(34px,4.5vw,54px);line-height:1.08;letter-spacing:-.052em;margin:17px 0 25px}
.about{display:grid;grid-template-columns:1.15fr .85fr;gap:68px}
.about p{color:var(--body);font-size:17px;line-height:1.72;margin:0 0 8px}
.rule{width:65px;height:4px;background:#4e8793;margin:0 0 25px}
.benefits-section{background:#edf0ed}
.benefits-intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:35px}
.benefits-intro h2{margin-bottom:0}
.benefits-intro p{max-width:335px;color:var(--body);line-height:1.55;font-size:15px}
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.benefit{position:relative;min-height:248px;background:white;border:1px solid #d3ddda;padding:27px 26px;display:flex;flex-direction:column;box-shadow:0 3px 12px #1b343908;transition:transform .2s,border-color .2s,background-color .25s,color .25s}
.benefit:hover{transform:translateY(-4px);border-color:#8bb5b8}
.benefit:is(:hover,:focus-visible){background:var(--secondary);color:#fff}
.benefit .top{display:flex;align-items:center;justify-content:space-between}
.benefit .count{color:#356873;font-size:12px;font-weight:800}
.benefit:is(:hover,:focus-visible) .count{color:#c5e1e2}
.benefit .sym{font-size:25px;color:#326b78}
.benefit:is(:hover,:focus-visible) .sym{color:#e5f2f0}
.benefit h3{font-size:23px;letter-spacing:-.045em;margin:auto 0 10px;line-height:1.1}
.benefit p{font-size:14px;line-height:1.6;color:var(--body);margin:0}
.benefit:is(:hover,:focus-visible) p{color:#e2eeee}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin-top:40px}
.step{border-top:2px solid #9aafad;padding-top:24px}
.step b{font-size:13px;color:#285967}
.step h3{font-size:22px;letter-spacing:-.04em;margin:20px 0 10px}
.step p{font-size:15px;line-height:1.62;color:var(--body)}
.cta{background:var(--dark);color:white;text-align:center}
.ctainner{padding-block:85px}
.cta h2{max-width:750px;margin:18px auto 22px}
.cta p{color:#d9e6e8;font-size:16px}
.cta .btn{margin-top:22px}
@media(max-width:780px){
.herogrid{grid-template-columns:1fr;min-height:0;padding-block:58px 20px}
.heroart{height:270px}
.bigmd{font-size:135px}
.section{padding-block:60px}
.about{grid-template-columns:1fr;gap:20px}
.about p{font-size:16px}
.benefits-intro{display:block}
.benefits-intro p{max-width:540px}
.benefits{grid-template-columns:repeat(2,1fr)}
.benefit{min-height:230px}
.steps{grid-template-columns:1fr;gap:15px}
.step h3{margin-top:10px}

}
@media(max-width:480px){
.hero h1{font-size:48px}
.hero .lead{font-size:16px}
.benefits{grid-template-columns:1fr}
.benefit{min-height:195px}
.benefit h3{margin-top:33px}

}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
.btn,.benefit{transition:none}

}
.benefit h3{margin-top:22px}
.hero .lead{max-width:500px}
@media(max-width:480px){
.hero h1{font-size:clamp(39px,10.5vw,48px)}

}
.bigmd{transform:none;letter-spacing:normal;text-shadow:none;width:min(76%,270px);display:flex;align-items:center;justify-content:center}
.brand-hero{width:100%;height:auto;display:block;mix-blend-mode:normal}
.brand-extended{display:block;object-fit:contain;width:min(310px,75%);height:auto;margin:0 auto 23px;mix-blend-mode:normal}
@media(max-width:700px){
.bigmd{width:min(65%,190px)}

}
.benefit{height:100%}
.benefit p{padding-bottom:17px}
.step-label{display:flex;align-items:center;gap:12px}
.step-number{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--tertiary);color:var(--ink);font-size:16px}
.benefit-details-link{display:inline-flex;margin-top:28px;font-size:14px;font-weight:700;color:var(--dark);border-bottom:1px solid var(--tertiary);padding-bottom:5px}
.heroart .bigmd{z-index:1;pointer-events:none;position:relative}
.heroart .brand-hero{position:relative;z-index:1}
.heroart .network-stage{position:relative;display:grid;place-items:center;flex:none;width:370px;max-width:100%;height:370px}
.heroart .network-stage .connection-network{position:absolute;display:block;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;padding:0;border:0;width:370px;height:370px;pointer-events:none}
.heroart .network-stage .bigmd{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:270px;max-width:none;margin:0;z-index:1}
@media(max-width:700px){
.heroart{height:300px}
.heroart .network-stage{width:280px;height:280px}
.heroart .network-stage .bigmd{width:190px}

}
.benefit{border-color:var(--secondary)}
.benefit:is(:hover,:focus-visible){border-color:#fff}
.about{align-items:stretch;grid-template-rows:auto auto;row-gap:0}
.about-eyebrow{grid-column:1;grid-row:1}
.about-title{grid-column:1;grid-row:2}
.about > p{grid-column:2;grid-row:2;align-self:center;position:relative;top:8px}
@media(max-width:780px){
.about{grid-template-columns:1fr;grid-template-rows:auto auto auto;row-gap:0}
.about-eyebrow{grid-column:1;grid-row:1}
.about-title{grid-column:1;grid-row:2}
.about > p{grid-column:1;grid-row:3;align-self:auto;top:0}

}
@media(min-width:1200px){
.about > p{top:0}

}
@media(min-width:781px){
.herogrid{grid-template-columns:minmax(0,1.17fr) minmax(0,.83fr);gap:24px}
.herogrid>div:first-child{min-width:0;container-type:inline-size}
.hero h1{font-size:clamp(30px,12.2cqw,62px);line-height:1.03}
.hero h1 em{white-space:nowrap}
.heroart{min-width:0}
.heroart .network-stage{max-width:100%}
.heroart .network-stage .bigmd{max-width:80%}

}
.benefit .benefit-time{display:block;align-items:center;gap:8px;align-self:stretch;width:100%;flex-shrink:0;margin-top:auto;padding:12px 0 0;border:0;border-top:1px solid #cbd9d6;border-radius:0;background:transparent;color:#2b6470;font-size:11px;font-weight:800;line-height:16px;letter-spacing:.7px;text-transform:uppercase}
.benefit .benefit-time::before{content:none;display:none}
.benefit:is(:hover,:focus-visible) .benefit-time{border:0;border-top:1px solid #6e959d;color:#c5e1e2}
