:root { --ink:#17233d; --muted:#60708f; --blue:#3976f6; --deep:#193e94; --pale:#eef4ff; --line:#dbe5f5; --green:#14a77b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
svg { width:1.25rem; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.shell { width:min(1120px,calc(100% - 40px)); margin-inline:auto; }
.nav { height:78px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:10px; font-size:17px; letter-spacing:-.3px; }
.brand strong { color:var(--blue); }
.brand-mark { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#4d8bff,#235bd2); box-shadow:0 7px 18px #3976f635; }
.brand-mark svg { width:22px; }
nav { display:flex; gap:34px; font-size:14px; color:#4f5d79; }
nav a:hover { color:var(--blue); }
.nav-cta { padding:10px 17px; border:1px solid var(--line); border-radius:10px; font-size:14px; font-weight:650; }
.hero { min-height:620px; display:grid; grid-template-columns:1.08fr .92fr; gap:80px; align-items:center; padding-block:70px 95px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:#47607f; font-size:13px; font-weight:650; letter-spacing:.01em; }
.pulse { width:8px; height:8px; background:var(--green); border-radius:50%; box-shadow:0 0 0 5px #14a77b18; }
h1 { margin:22px 0 22px; font-size:clamp(48px,5.7vw,76px); line-height:1.01; letter-spacing:-.052em; font-weight:740; }
h1 em { color:var(--blue); font-style:normal; }
.lede { max-width:610px; font-size:19px; line-height:1.65; color:var(--muted); }
.hero-actions { display:flex; gap:12px; margin-top:34px; }
.button { min-height:48px; padding:0 21px; display:inline-flex; align-items:center; justify-content:center; gap:9px; border-radius:11px; font-size:14px; font-weight:700; }
.primary { color:#fff; background:var(--blue); box-shadow:0 10px 25px #3976f638; }
.primary:hover { background:#2e68df; }
.secondary { background:#fff; border:1px solid var(--line); }
.trust-row { display:flex; flex-wrap:wrap; gap:22px; margin-top:29px; color:#77849c; font-size:12px; }
.trust-row span::before { content:"✓"; color:var(--green); margin-right:6px; font-weight:800; }
.backup-card { position:relative; padding:20px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 25px 65px #365c9b20,0 3px 12px #365c9b10; }
.backup-card::before { content:""; position:absolute; inset:-40px -45px; z-index:-1; border-radius:50%; background:radial-gradient(circle,#dfeaff 0,transparent 68%); }
.card-top { display:flex; justify-content:space-between; align-items:center; padding:2px 3px 18px; font-size:14px; font-weight:700; border-bottom:1px solid #edf1f8; }
.live { padding:5px 9px; border-radius:20px; background:#eaf9f4; color:#078862; font-size:11px; }
.device-row { display:grid; grid-template-columns:40px 1fr 28px; gap:12px; align-items:center; padding:17px 2px; border-bottom:1px solid #edf1f8; }
.device-icon { width:38px; height:38px; display:grid; place-items:center; color:#2867e8; background:#eaf1ff; border-radius:10px; font-size:12px; font-weight:800; }
.device-icon.server { color:#7553ce; background:#f0ebff; }
.device-row strong,.device-row small { display:block; }
.device-row strong { font-size:13px; }
.device-row small { margin-top:4px; color:#8a96aa; font-size:11px; }
.check { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--green); font-size:12px; font-weight:800; }
.usage { padding:18px 2px 4px; }
.usage>div:first-child { display:flex; align-items:flex-end; justify-content:space-between; font-size:12px; color:#77849c; }
.usage strong { color:var(--ink); font-size:13px; }
.usage strong small { color:#8a96aa; font-weight:500; }
.bar { height:7px; margin-top:12px; overflow:hidden; border-radius:10px; background:#e9eef7; }
.bar i { display:block; width:18.46%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#3976f6,#5e95ff); }
.card-foot { margin:18px -2px -2px; padding:12px; display:flex; align-items:center; gap:8px; border-radius:10px; color:#536783; background:#f5f8fd; font-size:11px; }
.card-foot svg { width:15px; color:var(--blue); }
.proof { background:#f7f9fd; border-block:1px solid #edf1f7; }
.proof-grid { min-height:125px; display:grid; grid-template-columns:repeat(4,1fr); align-items:center; }
.proof-grid>div { display:flex; flex-direction:column; align-items:center; gap:5px; border-right:1px solid #e1e8f2; }
.proof-grid>div:last-child { border:0; }
.proof strong { font-size:23px; letter-spacing:-.03em; }
.proof span { color:#8290a7; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.section { padding-block:110px; }
.section-heading { max-width:650px; margin:0 auto 52px; text-align:center; }
.kicker { color:var(--blue); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; }
h2 { margin:15px 0; font-size:clamp(34px,4vw,48px); line-height:1.12; letter-spacing:-.04em; }
.section-heading p,.platform-inner p { color:var(--muted); font-size:17px; line-height:1.6; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.feature-grid article { padding:31px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.feature-icon { width:45px; height:45px; display:grid; place-items:center; color:var(--blue); border-radius:12px; background:var(--pale); }
.feature-icon svg { width:24px; }
h3 { margin:23px 0 10px; font-size:18px; }
.feature-grid p { margin:0; color:var(--muted); font-size:14px; line-height:1.65; }
.platforms { padding-block:95px; color:#fff; background:#183a86; }
.platform-inner { display:grid; grid-template-columns:1.15fr .85fr; gap:90px; align-items:center; }
.platform-inner .kicker { color:#8fb2ff; }
.platform-inner h2 { max-width:520px; }
.platform-inner p { max-width:560px; color:#bed0ef; }
.platform-list { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.platform-list span { padding:20px; text-align:center; border:1px solid #ffffff24; border-radius:12px; background:#ffffff0a; font-weight:700; }
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.plan-grid article { padding:28px; border:1px solid var(--line); border-radius:17px; }
.plan-grid article>span { color:var(--blue); font-size:13px; font-weight:800; }
.plan-grid strong { display:block; margin:14px 0 12px; font-size:36px; letter-spacing:-.04em; }
.plan-grid p { margin:0; color:var(--muted); font-size:13px; line-height:1.75; }
.plan-grid .featured { border-color:#8bb0ff; background:#f7faff; box-shadow:0 14px 35px #3976f612; }
footer { padding-block:42px; border-top:1px solid #e8edf5; background:#fafbfd; }
.footer-inner { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; gap:25px; color:#7d899e; font-size:12px; }
.footer-inner p { text-align:center; }
.footer-inner>span { text-align:right; }
@media (max-width:850px) {
  nav { display:none; }
  .hero { grid-template-columns:1fr; gap:55px; padding-top:55px; }
  .backup-card { width:min(520px,100%); }
  .proof-grid { grid-template-columns:1fr 1fr; padding-block:22px; gap:24px 0; }
  .proof-grid>div:nth-child(2) { border:0; }
  .feature-grid,.plan-grid { grid-template-columns:1fr; }
  .platform-inner { grid-template-columns:1fr; gap:38px; }
}
@media (max-width:560px) {
  .shell { width:min(100% - 28px,1120px); }
  .nav-cta { display:none; }
  .hero { padding-block:38px 70px; }
  h1 { font-size:46px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .trust-row { flex-direction:column; gap:9px; }
  .proof strong { font-size:19px; }
  .proof span { font-size:9px; }
  .section { padding-block:78px; }
  .platform-list { grid-template-columns:1fr 1fr; }
  .footer-inner { grid-template-columns:1fr; text-align:left; }
  .footer-inner p,.footer-inner>span { text-align:left; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }