:root { --ink:#142019; --muted:#5d6a63; --line:#d7dfd9; --paper:#fff; --soft:#edf2ec; --green:#116b5f; --blue:#284d8f; --red:#d94f30; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#f7f9f6; }
a { color:inherit; text-decoration:none; }
.site-header { position:sticky; top:0; z-index:10; display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:76px; padding:12px clamp(20px,5vw,72px); border-bottom:1px solid var(--line); background:rgba(247,249,246,.94); backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:11px; }
.brand-mark { display:grid; width:40px; height:40px; place-items:center; border-radius:7px; background:var(--ink); color:white; font-weight:850; }
.brand strong,.brand small { display:block; }.brand small { color:var(--muted); font-size:12px; }
nav { display:flex; gap:26px; color:var(--muted); font-size:14px; font-weight:650; }
nav a:hover,.text-link:hover,.product-block a:hover { color:var(--green); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; border:1px solid var(--ink); border-radius:7px; padding:9px 15px; font-weight:760; }
.button.primary { border-color:var(--green); background:var(--green); color:white; }.button.secondary { background:white; }
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,.92fr); align-items:center; gap:clamp(40px,7vw,100px); min-height:calc(100vh - 150px); max-height:800px; padding:clamp(56px,8vw,112px) clamp(20px,5vw,72px); overflow:hidden; background:#f7f9f6; }
.hero h1 { max-width:780px; margin:10px 0 22px; font-size:clamp(42px,5.5vw,78px); line-height:1.02; letter-spacing:0; }
.lead { max-width:680px; color:var(--muted); font-size:19px; line-height:1.65; }.eyebrow { margin:0; color:var(--green); font-size:12px; font-weight:850; text-transform:uppercase; }
.hero-actions { display:flex; align-items:center; gap:22px; margin-top:32px; }.text-link,.product-block a { font-weight:780; }
.trust-line { display:flex; gap:24px; margin-top:38px; color:var(--muted); font-size:13px; }.trust-line span::before { content:""; display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:var(--green); }
.product-window { transform:rotate(1deg); overflow:hidden; border:1px solid #cad5cd; border-radius:8px; background:white; box-shadow:0 30px 80px rgba(20,32,25,.18); }
.window-bar { display:flex; align-items:center; gap:6px; min-height:42px; padding:10px 14px; border-bottom:1px solid var(--line); background:#f4f6f3; }.window-bar span { width:9px; height:9px; border-radius:50%; background:#bbc6be; }.window-bar strong { margin-left:8px; font-size:12px; }
.window-layout { display:grid; grid-template-columns:145px 1fr; min-height:390px; }.window-layout aside { display:grid; align-content:start; gap:20px; padding:26px 18px; background:#101713; color:#c9d2cc; font-size:12px; }.window-layout aside b { padding:9px; border-radius:5px; background:#eaf5ef; color:#143d34; }
.window-main { padding:30px; }.window-main>p { font-size:22px; font-weight:800; }.mini-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.mini-metrics b { padding:15px 10px; border:1px solid var(--line); border-radius:6px; font-size:18px; }.mini-metrics small { display:block; margin-top:4px; color:var(--muted); font-size:10px; font-weight:500; }.mini-table { display:grid; margin-top:22px; border:1px solid var(--line); border-radius:6px; }.mini-table span { display:flex; justify-content:space-between; gap:8px; padding:15px; border-bottom:1px solid var(--line); font-size:12px; font-weight:750; }.mini-table span:last-child { border:0; }.mini-table i { color:var(--muted); font-style:normal; font-weight:500; }
.section { padding:100px clamp(20px,5vw,72px); }.section-heading { max-width:760px; margin-bottom:48px; }.section-heading h2 { margin:10px 0 15px; font-size:clamp(32px,4vw,52px); line-height:1.08; }.section-heading>p:last-child { color:var(--muted); font-size:18px; }
.app-proof { padding:24px clamp(20px,5vw,72px) 100px; background:#e6ece7; }.app-proof>div { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }.app-proof h2 { max-width:650px; margin:8px 0 0; font-size:clamp(30px,4vw,48px); }.app-proof img { display:block; width:100%; height:auto; border:1px solid #c8d2ca; border-radius:8px; box-shadow:0 24px 70px rgba(20,32,25,.14); }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.product-block { position:relative; min-height:430px; padding:30px; border:1px solid var(--line); border-top:5px solid var(--green); border-radius:8px; background:white; }.product-block.ao { border-top-color:var(--blue); }.product-block.reserve { border-top-color:var(--red); }.product-number { color:#a6b2aa; font-size:13px; font-weight:800; }.product-block h3 { margin:70px 0 12px; font-size:25px; }.product-block p,.product-block li { color:var(--muted); line-height:1.6; }.product-block ul { padding-left:18px; }.product-block a { position:absolute; right:30px; bottom:28px; left:30px; }
.dark-band { background:#121b16; color:white; }.dark-band .eyebrow { color:#72c3ad; }.dark-band .section-heading { max-width:850px; }.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }.steps article { border-top:1px solid #536159; padding-top:22px; }.steps strong { color:#72c3ad; }.steps h3 { font-size:22px; }.steps p { color:#afbbb3; line-height:1.6; }
.pricing { background:white; }.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.price-grid article { display:grid; gap:12px; min-height:190px; padding:28px; border:1px solid var(--line); border-radius:8px; }.price-grid article.featured { border:2px solid var(--green); }.price-grid p { margin:0; font-weight:800; }.price-grid strong { font-size:30px; }.price-grid strong small { color:var(--muted); font-size:13px; }.price-grid span { color:var(--muted); }.center { margin-top:34px; text-align:center; }
footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px clamp(20px,5vw,72px); border-top:1px solid var(--line); background:#f7f9f6; color:var(--muted); font-size:13px; }
.product-hero { min-height:560px; max-height:none; }.product-hero h1 { font-size:clamp(40px,5vw,68px); }.feature-list { display:grid; gap:12px; }.feature-row { display:grid; grid-template-columns:50px 1fr; gap:18px; padding:24px 0; border-bottom:1px solid var(--line); }.feature-row strong { display:grid; width:42px; height:42px; place-items:center; border-radius:50%; background:var(--soft); color:var(--green); }.feature-row h3 { margin:0 0 7px; }.feature-row p { margin:0; color:var(--muted); line-height:1.55; }
@media (max-width:900px) { nav { display:none; }.hero { grid-template-columns:1fr; max-height:none; }.product-window { transform:none; }.product-grid,.steps,.price-grid { grid-template-columns:1fr; }.product-block { min-height:330px; }.product-block h3 { margin-top:35px; } }
@media (max-width:600px) { .site-header .button { display:none; }.hero { min-height:auto; }.hero h1 { font-size:42px; }.hero-actions,.trust-line,footer { align-items:flex-start; flex-direction:column; }.window-layout { grid-template-columns:92px 1fr; }.window-layout aside { padding:18px 9px; }.window-main { padding:18px 12px; }.mini-metrics { grid-template-columns:1fr; }.mini-table i { display:none; }.section { padding-top:70px; padding-bottom:70px; }.app-proof { padding-top:46px; padding-bottom:70px; } }