:root{--fx-bg:#0a0a0a;--fx-card:#101213cc;--fx-text:#f2f2f2;--fx-sub:#a8b0b8;--fx-accent:#4da3ff;--fx-ok:#35d07f}
*{box-sizing:border-box}
html,body{height:100%}
body.fx-body{margin:0;background:radial-gradient(1200px 800px at 80% -10%,#0f2740 0%,transparent 60%),radial-gradient(900px 600px at -10% 20%,#132222 0%,transparent 55%),var(--fx-bg);color:var(--fx-text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji";letter-spacing:.2px}

.fx-link{color:#cfd6dd;text-decoration:none}
.fx-link:hover{color:#fff}
.fx-header .fx-logo-text{font-weight:600;color:#fff}
.fx-btn-primary{background:linear-gradient(180deg,#4da3ff,#2e77ff);border:none;border-radius:12px;padding:.625rem 1rem}
.fx-btn-primary:hover{filter:brightness(1.05)}
.fx-btn-outline{border:1px solid #2b2f33;color:#e8eef5;background:transparent;border-radius:12px;padding:.625rem 1rem}
.fx-btn-outline:hover{border-color:#4b5560;background:#161a1e}

.fx-hero{padding-top:48px;padding-bottom:24px}
.fx-hero-title{font-size:56px;line-height:1.05;margin:0 0 12px;font-weight:700;letter-spacing:-.02em}
@media (max-width:768px){.fx-hero-title{font-size:36px}}
.fx-hero-subtitle{color:var(--fx-sub);font-size:18px;max-width:520px}

.fx-hero-media{min-height:420px}
.fx-device-frame{background:linear-gradient(180deg,#0f1216,#0b0e11);border-radius:28px;padding:16px;border:1px solid #1f2730;position:relative}
.fx-app-shot{border-radius:16px}
.fx-glass{backdrop-filter:saturate(180%) blur(12px);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:16px}
.fx-card{position:absolute;right:-12px;bottom:-12px;width:260px}
.fx-card-title{font-weight:600}
.fx-chip{padding:2px 10px;border-radius:999px;font-size:12px}
.fx-chip-ok{background:rgba(53,208,127,.15);color:var(--fx-ok);border:1px solid rgba(53,208,127,.3)}
.fx-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.fx-metric{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:10px}
.fx-metric-label{display:block;color:#97a3af;font-size:12px}
.fx-metric-value{font-weight:600}

.fx-badge{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.fx-badge-value{font-weight:700}
.fx-badge-label{color:#97a3af;font-size:12px}

.fx-floating{position:absolute;border-radius:999px;filter:blur(30px);opacity:.5;animation:float 12s ease-in-out infinite}
.fx-float-1{width:240px;height:240px;background:#2e77ff;top:-40px;right:10%}
.fx-float-2{width:180px;height:180px;background:#4da3ff;bottom:40px;left:10%}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}

.fx-section{padding:64px 0}
.fx-section-title{font-size:32px;margin:0 0 8px}
.fx-section-subtitle{color:var(--fx-sub);margin:0}
.fx-feature{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:20px;height:100%}
.fx-feature-icon{font-size:24px;margin-bottom:8px}

.fx-list{margin:0;padding-left:18px;color:#d5dbe2}
.fx-list li{margin-bottom:8px}

.fx-window{border-radius:16px;overflow:hidden}
.fx-window-bar{height:36px;display:flex;align-items:center;gap:8px;padding:0 12px;background:linear-gradient(180deg,#0c0f12,#0a0c0f);border:1px solid #1f2730;border-bottom:none}
.fx-window-bar span{display:inline-block;width:10px;height:10px;border-radius:999px;background:#30363d}
.fx-window-body{border:1px solid #1f2730;border-top:none;padding:16px;background:rgba(255,255,255,.02)}
.fx-admin-shot{height:240px;border-radius:12px;background:linear-gradient(180deg,rgba(77,163,255,.15),rgba(46,119,255,.08));border:1px dashed rgba(255,255,255,.1)}

.fx-cta{padding:64px 0}
.fx-cta-box{padding:32px;border-radius:20px}

.fx-footer{border-top:1px solid rgba(255,255,255,.06);color:#9aa3ac}

/* App screens (3 phones) */
.fx-app-phones{position:relative;height:420px}
.fx-phone{position:absolute;width:200px;aspect-ratio:9/19;border-radius:28px;padding:10px;background:linear-gradient(180deg,#0f1216,#0b0e11);border:1px solid #1f2730;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.fx-phone img{width:100%;height:100%;object-fit:cover;border-radius:18px}
.fx-phone.fx-left{left:-10px;top:40px;transform:rotate(-8deg)}
.fx-phone.fx-center{left:calc(50% - 100px);top:-10px;z-index:2;transform:rotate(0)}
.fx-phone.fx-right{right:-10px;top:60px;transform:rotate(8deg)}
@media (max-width:992px){
  .fx-app-phones{height:360px}
  .fx-phone{width:160px}
  .fx-phone.fx-center{left:calc(50% - 80px)}
}