@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,700;1,700&family=Roboto:wght@400;500&display=swap");
:root{
    --night:#0b1420;
    --day:#f2f5f7;
    --ink:#111b26;
    --mute:#566574;
    --glow:#a9d0f2;
    --green:#7ce0d3;
    --rule:#d3dbe2;
    --head:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
    --body:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif
}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--ink);font:400 1.125rem/1.65 var(--body)}
img{display:block;max-width:100%;height:auto}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.5rem}
p{margin:0 0 1.1em;max-width:38em}
h1,h2,h3{font-family:var(--head);margin:0;line-height:1.1}
.hero{background:var(--night);color:#e8eef4}
.hero img{width:100%;max-height:78vh;object-fit:cover;object-position:60% 40%;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.hero .wrap{padding-top:1rem;padding-bottom:5rem}
h1{font-weight:500;font-size:clamp(2.2rem,6vw,4.6rem);letter-spacing:-.02em}
h1 span{display:block}
h1 .l1{color:#8fa3b6;font-weight:400}
h1 .l2{color:#fff;font-weight:700;margin-top:.1em}
h1 em{font-style:italic;text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.12em}
.descriptor{margin-top:1.2rem;color:#8fa3b6;font-size:1rem}
.sub{margin-top:2rem;color:#b6c4d1;font-size:1.2rem}
.night{background:var(--night);color:#dfe8f0}
.day{background:var(--day);color:var(--ink)}
.dawn{height:9rem;background:linear-gradient(var(--night),var(--day))}
.gap{padding:1rem 0 4rem}
.label{font-size:1rem;font-weight:500;color:var(--glow);margin-bottom:2rem}
.gl{font:400 clamp(1.4rem,2.8vw,2rem)/1.35 var(--head);color:#fff;max-width:30em;margin-bottom:1.4em}
.gl.dash{position:relative;padding-left:1.6rem}
.gl.dash::before{content:"";position:absolute;left:0;top:.62em;width:.7rem;height:.7rem;border-radius:50%;background:var(--green);box-shadow:0 0 .9rem var(--green)}
.gl:last-child{font-weight:700;margin-bottom:0}
.pillars{padding:2rem 0 3rem}
.pillar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:3rem;padding-top:3.5rem;padding-bottom:3.5rem;border-top:1px solid var(--rule)}
.pillar:first-child{border-top:0}
.pillar h2{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:700;letter-spacing:-.01em}
.pillar .lead{font:500 1.35rem/1.4 var(--head)}
.proof{padding:4rem 0;border-top:1px solid var(--rule)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4rem}
.proof h3{font-size:1.25rem;font-weight:700;margin-bottom:1rem}
.proof p{font-size:1.05rem}
.proof .stat{font:700 clamp(2.6rem,5vw,4rem)/1 var(--head);letter-spacing:-.02em;margin:1.4rem 0 .4rem}
.proof .statlabel{font:400 .95rem/1.45 var(--head);color:var(--mute)}
.proofclose{font-weight:500}
.services{padding:4rem 0 6rem;border-top:1px solid var(--rule)}
.services h2{font-size:clamp(1.8rem,3.6vw,2.8rem);font-weight:700;max-width:18em;margin-bottom:3rem}
.ripple{list-style:none;margin:0;padding:0}
.ripple li{display:grid;grid-template-columns:4.5rem 9rem 1fr;align-items:center;gap:1rem;padding:1rem 0;border-top:1px solid var(--rule)}
.ripple li::before{content:"";justify-self:center;border:2px solid var(--ink);border-radius:50%;width:var(--s);height:var(--s);grid-row:1;grid-column:1;opacity:.85}
.ripple li:nth-child(1){--s:.7rem}.ripple li:nth-child(2){--s:1.3rem}.ripple li:nth-child(3){--s:1.9rem}
.ripple li:nth-child(4){--s:2.5rem}.ripple li:nth-child(5){--s:3.1rem}.ripple li:nth-child(6){--s:3.7rem}
.ripple strong{font:700 1.15rem var(--head);grid-column:2}
.ripple span{grid-column:3}
.close{padding:7rem 0 8rem}
.big{font:700 clamp(2rem,5.5vw,4.2rem)/1.1 var(--head);letter-spacing:-.02em;color:#fff;max-width:14em;margin-bottom:2.5rem}
.btn{display:inline-block;font:500 1.05rem var(--head);color:var(--night);background:var(--glow);padding:.9rem 1.6rem;border-radius:.3rem;text-decoration:none}
.btn:hover{background:#fff}
a:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (max-width:760px){
 body{font-size:1.05rem}
 .hero img{max-height:60vh;object-position:62% 50%}
 .pillar,.grid{grid-template-columns:1fr;gap:1.2rem}
 .grid{gap:3.5rem}
 .ripple li{grid-template-columns:3.2rem 1fr;row-gap:.2rem}
 .ripple li::before{grid-row:1/3}
 .ripple span{grid-column:2}
 .dawn{height:6rem}
}