:root{
  --bg:#ffffff; --ink:#0d1b2a; --ink-2:#334155; --brand:#0a5ad0; --accent:#35a7ff;
  --muted:#eef2f7; --border:#e5e7eb; --card:#fff; --shadow:0 10px 30px rgba(2,6,23,.08); --radius:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;line-height:1.55}
img{max-width:100%;height:auto} a{color:var(--brand);text-decoration:none}
.container{max-width:1160px;margin:0 auto;padding:0 16px}
header{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.2px}
.logo-badge{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#0a5ad0,#35a7ff)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:999px;
  font-weight:800;border:1px solid transparent;transition:.2s;white-space:nowrap}
.btn.primary{background:var(--brand);color:#fff}.btn.primary:hover{filter:brightness(.95)}
.btn.outline{border-color:var(--brand);color:var(--brand);background:#fff}.btn.outline:hover{background:#f5f8ff}
.hero{padding:48px 0 24px;background:linear-gradient(180deg,#f7fbff,transparent)}
.grid{display:grid;gap:24px} @media(min-width:992px){.grid-2{grid-template-columns:1.1fr .9fr}}
.headline{font-size:clamp(28px,3.5vw,44px);line-height:1.15;font-weight:900;margin:0 0 10px}
.sub{font-size:clamp(15px,2.2vw,19px);color:var(--ink-2);margin:0 0 18px}
.hero-card,.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.pill{background:#eef3ff;color:#0a3b8f;border:1px solid #dbe6ff;border-radius:999px;padding:8px 12px;font-weight:700;font-size:13px}
.section{padding:42px 0}.section h2{font-size:clamp(22px,2.6vw,32px);margin:0 0 8px}
.tiny{font-size:12px;color:#64748b}
.cards{display:grid;gap:16px} @media(min-width:900px){.cards-3{grid-template-columns:repeat(3,1fr)}}
.feature{display:flex;gap:14px;align-items:flex-start}
.pricing{display:grid;gap:16px}@media(min-width:900px){.pricing{grid-template-columns:repeat(2,1fr)}}
.price{position:relative;border:2px solid #dbeafe}.price .tag{position:absolute;top:12px;right:12px;background:#0ea5e9;
  color:#fff;font-weight:900;padding:6px 10px;border-radius:999px;font-size:12px}
.big{font-size:34px;font-weight:900;margin:.25rem 0}
.video-frame{border-radius:16px;overflow:hidden;border:1px solid var(--border);background:#000}
.wistia_responsive_padding{padding:56.25% 0 0 0;position:relative}.wistia_responsive_wrapper{height:100%;left:0;position:absolute;top:0;width:100%}
.short-video{position:relative;aspect-ratio:16/9;background:#000;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.short-video .placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#cbd5e1;text-align:center;padding:12px}
.short-video .play{position:absolute;bottom:12px;left:12px;background:rgba(255,255,255,.9);border-radius:999px;padding:8px 12px;font-weight:900}
.reviews{display:grid;gap:16px}@media(min-width:900px){.reviews{grid-template-columns:repeat(3,1fr)}}
.review{border:1px solid var(--border);border-radius:16px;padding:16px;background:#fff;box-shadow:var(--shadow);min-height:170px}
.table{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:12px;overflow:hidden}
.table th,.table td{padding:12px;border-bottom:1px solid var(--border);text-align:left;font-size:14px}
footer{border-top:1px solid var(--border);padding:22px 0;color:#475569;background:#fff}
footer a{color:#0a5ad0;text-decoration:none} footer a:hover{text-decoration:underline}
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:50;background:#fff;border-top:1px solid var(--border);padding:10px}
.sticky-cta .bar{max-width:1160px;margin:0 auto;display:flex;gap:10px;justify-content:space-between;align-items:center}
@media(min-width:900px){.sticky-cta{display:none}}
/* Animated SVGs (home + features) */
.usp-grid{display:grid;gap:16px}@media(min-width:992px){.usp-grid{grid-template-columns:repeat(4,1fr)}}
.usp{border:1px solid var(--border);border-radius:16px;padding:16px;background:#fff;box-shadow:var(--shadow)}
.usp h3{margin:.25rem 0 .35rem;font-size:18px}
svg{max-width:100%}
.bubble{opacity:0;transform:translateY(10px);animation:pop 6s infinite}
.b1{animation-delay:.3s}.b2{animation-delay:1.2s}.b3{animation-delay:2.1s}
@keyframes pop{0%{opacity:0;transform:translateY(10px)}10%{opacity:1;transform:none}35%{opacity:1}45%{opacity:.2}46%{opacity:0}100%{opacity:0}}
.pulse{animation:pulse 2s infinite}
@keyframes pulse{0%{opacity:.5}50%{opacity:1}100%{opacity:.5}}
.glow{filter:drop-shadow(0 0 6px rgba(53,167,255,.8));animation:glow 2.5s infinite}
@keyframes glow{0%{opacity:.7}50%{opacity:1}100%{opacity:.7}}
.file{opacity:0;transform:translateY(-8px);animation:drop 4s infinite}
.f1{animation-delay:.4s}.f2{animation-delay:1.1s}.f3{animation-delay:1.8s}
@keyframes drop{0%{opacity:0;transform:translateY(-8px)}15%{opacity:1;transform:none}55%{opacity:1}70%{opacity:0}100%{opacity:0}}
