:root{--ink:#172235;--muted:#566477;--navy:#101c32;--accent:#60e3c0;--paper:#ffffff;--light:#f3f6fa;--border:#dce4ed}
*{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.7}
a{color:inherit}
a:focus-visible{outline:3px solid #18a889;outline-offset:4px}
.container{width:min(1100px,calc(100% - 48px));margin:0 auto}
.narrow{max-width:830px}
.site-header{background:var(--navy);color:#fff;border-bottom:1px solid #314057}
.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{text-decoration:none;font-size:1.25rem;font-weight:800;letter-spacing:2px}.logo span{color:var(--accent)}
nav{display:flex;gap:28px;flex-wrap:wrap}nav a{text-decoration:none;font-size:.92rem;color:#d6e0ee}nav a:hover{color:var(--accent)}
.hero{background:radial-gradient(circle at 85% 20%,#263f5a 0%,#101c32 55%);color:#fff;padding:105px 0 112px}
.hero-inner{max-width:1100px}.eyebrow,.section-label{font-size:.78rem;letter-spacing:2.5px;font-weight:800;text-transform:uppercase}.eyebrow{color:var(--accent)}
h1{max-width:780px;font-size:clamp(2.8rem,6vw,5rem);line-height:1.12;letter-spacing:-2px;margin:20px 0}h1 span{color:var(--accent)}
.hero-copy{font-size:1.15rem;max-width:590px;color:#d3deea;margin-bottom:32px}
.button{display:inline-block;background:var(--accent);color:#0b2730;font-weight:800;text-decoration:none;border-radius:7px;padding:13px 23px}.button:hover{background:#a5f5df}
.section{padding:86px 0}.section-label{color:#167e76;margin:0 0 13px}h2{font-size:clamp(2rem,4vw,2.9rem);letter-spacing:-1px;line-height:1.2;margin:0 0 24px}h3{font-size:1.25rem;line-height:1.35;margin:10px 0}p{margin:0 0 19px}p:last-child{margin-bottom:0}code{background:#e7edf3;padding:2px 5px;border-radius:4px;font-size:.9em;overflow-wrap:anywhere}
.text-link{color:#086d67;font-weight:700;text-underline-offset:4px}.muted{background:var(--light)}.intro{max-width:780px;color:var(--muted);font-size:1.06rem}
.cards{display:flex;flex-wrap:wrap;gap:20px;margin-top:34px}.card{flex:1 1 235px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:27px;box-shadow:0 8px 24px rgba(16,28,50,.04)}.card p{color:var(--muted);font-size:.95rem}.card-number{font-weight:800;color:#138a7d;font-size:.85rem}
.demo{margin-top:35px;padding:30px;background:#e3ecef;border-radius:12px;display:flex;flex-direction:column;gap:20px}.demo h3{font-size:1.5rem}.demo-boxes{display:flex;gap:14px;flex-wrap:wrap}.demo-boxes div{flex:1 1 120px;text-align:center;padding:28px 15px;background:#17334d;color:#fff;border-radius:9px;font-weight:800;letter-spacing:1px}.demo-boxes div:nth-child(2){background:#157e7d}.demo-boxes div:nth-child(3){background:#3872a0}
.video-frame{position:relative;aspect-ratio:16/9;background:#101c32;border-radius:12px;overflow:hidden;margin-top:28px;box-shadow:0 16px 35px rgba(16,28,50,.15)}.video-frame iframe{width:100%;height:100%;border:0;display:block}.video-note{font-size:.88rem;color:var(--muted);margin-top:13px}.video-note a{color:#086d67}
.takeaway{background:#eaf8f3}.footer{background:var(--navy);color:#c5d3e1;padding:28px 0}.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.86rem}.footer p{margin:0}
@media(max-width:600px){.container{width:min(100% - 32px,1100px)}.header-inner{align-items:flex-start;flex-direction:column;padding:18px 0;gap:10px}nav{gap:18px}.hero{padding:72px 0 82px}h1{letter-spacing:-1px}.section{padding:62px 0}.demo{padding:22px}.footer-inner{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}