:root{--ink:#14283d;--muted:#50677c;--deep:#112742;--night:#0a152e;--teal:#72e4ff;--green:#075d9a;--paper:#fff;--wash:#f1f8ff;--line:#d7e6f1;--mono:"IBM Plex Mono",monospace;font-family:Geist,system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink)}
a{color:inherit}
a:focus-visible,summary:focus-visible{outline:3px solid #1978b3;outline-offset:5px}
img{display:block}
h1,h2,h3,p,figure{margin:0}
h2{font-size:clamp(2.15rem,4.5vw,3.65rem);font-weight:680;line-height:1.02;letter-spacing:-.065em}
h3{font-size:1.25rem;letter-spacing:-.035em}
.shell{width:min(1190px,calc(100% - 72px));margin-inline:auto}
.header{background:var(--wash);border-bottom:1px solid var(--line)}
.bar{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:1.34rem;font-weight:740;letter-spacing:-.055em}
.bar nav{display:flex;justify-content:center;gap:clamp(18px,4vw,45px)}
.bar nav a{color:var(--muted);font-weight:550;text-decoration:none;font-size:.95rem}
.bar nav a:hover,.text-link:hover,.source-link:hover{color:var(--green);text-decoration:underline;text-underline-offset:5px}
.button{min-height:49px;display:inline-flex;justify-content:center;align-items:center;gap:13px;border:1px solid transparent;border-radius:9px;padding:10px 17px;text-decoration:none;font-size:.94rem;font-weight:670;line-height:1.25;transition:background .18s,color .18s}
.button-line{border-color:#b4cce0}
.button-line:hover{background:#dbeafa}
.button-primary{background:var(--ink);color:#fff}
.button-primary:hover{background:var(--green)}
.hero{background:radial-gradient(ellipse at 84% 46%,#d0eaff 0%,transparent 57%),var(--wash);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,5vw,74px);align-items:center;padding-block:clamp(52px,8vw,106px)}
.availability{font:600 .76rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--green);display:flex;gap:9px;align-items:center;margin-bottom:19px}
.availability span,.window-foot span{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:#1e956d}
h1{font-size:clamp(3.5rem,6.9vw,6.7rem);font-weight:700;line-height:.95;letter-spacing:-.084em}
h1 em{font-style:normal;color:var(--green)}
.hero-copy{max-width:435px;font-size:1.15rem;line-height:1.65;color:var(--muted);margin-top:22px}
.actions{display:flex;align-items:center;gap:15px 23px;flex-wrap:wrap;margin-top:25px}
.text-link{text-decoration:none;font-weight:620;font-size:.94rem}
.product{position:relative;min-width:0;padding:clamp(17px,4.5vw,62px) clamp(17px,3.6vw,46px) 20px;background:radial-gradient(ellipse at 84% 22%,#263f9b,#1e3261 49%,var(--night) 86%);border-radius:22px;isolation:isolate}
.product::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:repeating-radial-gradient(ellipse at 83% 43%,transparent 0 21px,#b8dcff24 22px 23px,transparent 24px 37px);pointer-events:none}
.window{overflow:hidden;background:#fff;border-radius:13px;border:1px solid #7c9fcd;box-shadow:0 22px 60px #08182fa6}
.window-head,.window-foot{display:flex;align-items:center;gap:8px;padding:10px 13px;background:#fbfdfa}
.window-head{justify-content:space-between;border-bottom:1px solid var(--line)}
.window-brand{display:flex;align-items:center;gap:7px;font-weight:740}
.window-label{font:.68rem var(--mono);color:var(--muted)}
.window-grid{display:grid;grid-template-columns:1fr 1fr}
.window-local,.window-remote{padding:clamp(12px,2vw,24px);display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.window-local{background:#e9f4ff;border-right:1px solid var(--line)}
.window-caption{font-size:.79rem;font-weight:650}
.window-id{font:600 clamp(.77rem,1.4vw,1.17rem)/1.3 var(--mono);color:var(--green);white-space:nowrap}
.window-password{letter-spacing:.16em;color:var(--muted)}
.window-input{width:100%;padding:9px 6px;border:1px solid #bacfe4;border-radius:6px;color:var(--muted);font-size:.72rem}
.window-button{padding:7px 9px;border-radius:5px;background:var(--deep);color:#fff;font-size:.76rem}
.window-foot{font-size:.72rem;color:var(--green);border-top:1px solid var(--line)}
figcaption{margin-top:12px;color:#e0edff;font-size:.76rem;text-align:right}
.section{padding-block:clamp(55px,8vw,98px)}
.section-light{background:#fff}
.feature-grid,.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:30px}
.feature-grid article{border-top:1px solid #b4cee5;padding-top:19px}
.feature-icon{display:grid;place-items:center;width:40px;height:40px;margin-bottom:15px;border-radius:9px;background:#e4f2fc;color:var(--green);font:600 1.15rem var(--mono)}
.feature-grid p,.section-heading p,.download-grid p{color:var(--muted);line-height:1.58;margin-top:9px}
.section-plans{background:#edf5ff}
.section-heading{display:grid;grid-template-columns:1.35fr .65fr;align-items:end;gap:21px}
.plan{display:flex;flex-direction:column;align-items:flex-start;border:1px solid #bfd2e8;background:#fff;border-radius:13px;padding:24px}
.plan-live{border-color:#378ad0;background:#e0f2ff}
.plan-status{font:.74rem var(--mono);color:var(--green);margin-bottom:12px}
.plan h3{font-size:1.75rem}
.plan-summary{margin-top:7px;color:var(--muted)}
.plan ul{list-style:none;margin:16px 0;padding:12px 0 0;border-top:1px solid var(--line);width:100%}
.plan li{padding-left:20px;position:relative;margin:0 0 8px;font-size:.94rem}
.plan li::before{content:"✓";position:absolute;left:0;color:var(--green)}
.plan .button{margin-top:auto}
.section-download{background:var(--deep);color:#fff}
.download-grid,.faq-grid{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:clamp(27px,6vw,90px)}
.download-grid p{color:#d1e6f8;max-width:445px;margin:13px 0 22px}
.download-grid .button-primary{background:var(--teal);color:var(--night)}
.download-grid .button-primary:hover{background:#a1efff}
.source-link{display:block;width:fit-content;margin-top:12px;color:#a7e9ff;text-underline-offset:4px}
.download-grid .source-link:hover{color:#fff}
.setup{margin:0;padding-left:27px}
.setup li{padding:11px 0 12px 7px;border-bottom:1px solid #456180}
.setup li::marker{color:var(--teal);font:600 .94rem var(--mono)}
.setup li span{display:block;margin-top:3px;color:#cadff2;font-size:.92rem}
.faq-grid{align-items:start}
.faq details{border-top:1px solid var(--line);padding:15px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font-weight:650}
.faq details p{margin-top:9px;color:var(--muted);line-height:1.5}
footer{background:var(--wash);border-top:1px solid var(--line)}
.footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;min-height:84px;padding-block:18px}
.footer span,.footer>a:last-child{font-size:.88rem;color:var(--muted)}
@media(max-width:860px){.shell{width:calc(100% - 42px)}.hero-grid{gap:24px}.plan{padding:17px}.product{padding:19px 15px 13px}}
@media(max-width:690px){.shell{width:calc(100% - 32px)}.bar{flex-wrap:wrap;min-height:0;gap:6px 12px;padding-block:12px}.bar nav{width:100%;order:2;gap:25px;padding-top:4px}.bar .button{min-height:42px;font-size:.83rem;padding:8px 10px}.hero-grid,.feature-grid,.plan-grid,.section-heading,.download-grid,.faq-grid{grid-template-columns:1fr}.hero-grid{padding-block:44px}.hero-copy{font-size:1rem}.product{padding:22px 16px 14px}.section-heading{gap:8px}.feature-grid,.plan-grid{gap:17px}.footer{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
