:root{
  --font-main: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  --blue:#0967ff;
  --blue-dark:#073a91;
  --ink:#06122b;
}
*{font-family:var(--font-main)}
html{scroll-behavior:smooth}
body{background:#fbfdff;color:var(--ink)}
.glow{background:radial-gradient(circle at 70% 18%,rgba(9,103,255,.24),transparent 34%),radial-gradient(circle at 85% 45%,rgba(20,184,166,.14),transparent 26%),linear-gradient(180deg,#fff 0%,#f7faff 100%)}
.logo-text{font-weight:800;letter-spacing:-.045em}
.hero-title{letter-spacing:-.065em;line-height:.92}
.device-shadow{box-shadow:0 35px 80px rgba(15,42,92,.18),0 12px 24px rgba(15,42,92,.13)}
.app-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.app-card:hover{transform:translateY(-7px);box-shadow:0 25px 55px rgba(13,43,93,.13);border-color:rgba(9,103,255,.25)}
.mock-row:nth-child(3n){background:#ecfdf5}.mock-row:nth-child(4n){background:#fff7ed}.mock-row:nth-child(5n){background:#eef2ff}
.scan-line{animation:scan 3.2s infinite ease-in-out}@keyframes scan{0%,100%{transform:translateY(0)}50%{transform:translateY(170px)}}
.float{animation:float 6s ease-in-out infinite}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.noise:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.35) 1px,transparent 1px);background-size:18px 18px;opacity:.28;pointer-events:none}