
:root {
  --bg: #07162d;
  --bg-2: #0b2448;
  --surface: rgba(255,255,255,.07);
  --surface-strong: rgba(255,255,255,.11);
  --border: rgba(255,255,255,.14);
  --text: #f7f9fc;
  --muted: #aebdd0;
  --blue: #1688ff;
  --gold: #f4b536;
  --cyan: #52e0d1;
  --pink: #ff4fa2;
  --shadow: 0 24px 70px rgba(0,0,0,.28);
  --radius: 28px;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 15% 10%, rgba(22,136,255,.17), transparent 32rem),
    radial-gradient(circle at 88% 38%, rgba(82,224,209,.08), transparent 28rem),
    linear-gradient(160deg, #061225 0%, #091a34 52%, #061225 100%);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }
.nav {
  position: sticky; top: 0; z-index: 30;
  backdrop-filter: blur(18px);
  background: rgba(5,15,31,.78);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.nav-inner { height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display:flex; align-items:center; gap:10px; font-size: 1.05rem; font-weight: 800; letter-spacing:.03em; }
.brand-mark {
  width: 34px; height: 34px; border-radius: 10px;
  display:grid; place-items:center;
  background: linear-gradient(145deg, var(--blue), #0b5ccb);
  box-shadow: 0 9px 25px rgba(22,136,255,.3);
  font-weight: 900;
}
.nav-links { display:flex; align-items:center; gap:24px; font-size:.88rem; color:#d8e2ef; }
.nav-links a:hover { color:#fff; }
.hero { min-height: 710px; display:grid; align-items:center; padding: 90px 0 80px; position:relative; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns: 1.15fr .85fr; gap:64px; align-items:center; }
.eyebrow {
  display:inline-flex; gap:9px; align-items:center; padding:8px 12px; border:1px solid var(--border);
  border-radius:999px; background:rgba(255,255,255,.05); color:#c7d7eb; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase;
}
.dot { width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 18px var(--cyan); }
h1 { font-size: clamp(3.2rem, 8vw, 6.8rem); line-height:.94; letter-spacing:-.055em; margin: 24px 0 26px; max-width: 850px; }
.gradient-text {
  background: linear-gradient(90deg,#fff 0%,#cfe4ff 34%,#73b7ff 64%,#f5bd49 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p { max-width: 700px; color:var(--muted); font-size:1.16rem; margin:0 0 32px; }
.cta-row { display:flex; flex-wrap:wrap; gap:12px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px;
  border-radius:14px; border:1px solid var(--border); font-weight:700; font-size:.94rem;
}
.btn-primary { background:#fff; color:#07162d; border-color:#fff; }
.btn-secondary { background:rgba(255,255,255,.05); }
.orb-stage { position:relative; min-height:500px; }
.orb {
  position:absolute; border-radius:34px; overflow:hidden; box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.12); background:#fff;
}
.orb img { width:100%; height:100%; object-fit:cover; }
.orb.one { width:280px; height:280px; top:20px; left:0; transform:rotate(-6deg); }
.orb.two { width:250px; height:250px; right:0; bottom:30px; transform:rotate(7deg); }
.glow { position:absolute; width:360px; height:360px; right:15%; top:18%; border-radius:50%; background:rgba(22,136,255,.16); filter:blur(60px); }
section { padding: 96px 0; }
.section-kicker { color:#7fbaff; font-weight:800; font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; }
h2 { font-size:clamp(2.2rem,4vw,4rem); line-height:1.02; letter-spacing:-.04em; margin:10px 0 18px; }
.section-intro { max-width:760px; color:var(--muted); font-size:1.05rem; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:42px; }
.panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:32px; box-shadow:0 15px 45px rgba(0,0,0,.13); }
.panel h3 { margin:0 0 12px; font-size:1.35rem; }
.panel p { color:var(--muted); margin:0; }
.apps { border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); }
.app-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:44px; }
.app-card {
  background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
  border:1px solid var(--border); border-radius:32px; padding:24px; overflow:hidden;
}
.app-visual {
  height:340px; border-radius:23px; display:grid; place-items:center; overflow:hidden;
  background:rgba(255,255,255,.94); margin-bottom:26px;
}
.app-visual img { width:100%; height:100%; object-fit:cover; }
.app-meta { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.badge { font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; border:1px solid var(--border); border-radius:999px; padding:6px 10px; color:#c8d7e9; }
.app-card h3 { font-size:2rem; letter-spacing:-.03em; margin:15px 0 8px; }
.app-card p { color:var(--muted); margin:0 0 21px; min-height:76px; }
.text-link { color:#fff; font-weight:750; display:inline-flex; gap:8px; align-items:center; }
.contact-wrap {
  display:grid; grid-template-columns: 1fr .9fr; gap:48px; align-items:start;
  padding:52px; border-radius:36px; border:1px solid var(--border); background:rgba(255,255,255,.055);
}
.contact-card { display:grid; gap:14px; }
.contact-item { padding:18px 20px; border-radius:18px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); }
.contact-label { display:block; color:#8da5bf; font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:4px; }
footer { padding:34px 0 46px; color:#8ea2b8; font-size:.88rem; }
.footer-inner { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,.08); padding-top:24px; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; }
.privacy-page { min-height:100vh; }
.privacy-hero { padding:74px 0 30px; }
.privacy-shell { max-width:900px; padding-bottom:90px; }
.privacy-doc {
  background:#fff; color:#172235; border-radius:30px; padding:clamp(28px,6vw,58px);
  box-shadow:var(--shadow);
}
.privacy-doc h1 { color:#0a1830; font-size:clamp(2.3rem,6vw,4.3rem); margin:0 0 8px; line-height:1; }
.privacy-doc h2 { color:#10213a; font-size:1.35rem; margin:34px 0 10px; letter-spacing:-.015em; }
.privacy-doc h3 { color:#10213a; font-size:1.05rem; margin:22px 0 7px; }
.privacy-doc p, .privacy-doc li { color:#48566a; }
.privacy-doc ul { padding-left:22px; }
.effective { color:#6b788a !important; font-weight:650; margin-bottom:26px !important; }
.back { display:inline-flex; margin-bottom:18px; color:#c5d5e8; font-weight:700; }
.mobile-toggle { display:none; }
@media (max-width: 820px) {
  .nav-links { display:none; }
  .hero { min-height:auto; padding-top:68px; }
  .hero-grid, .about-grid, .app-grid, .contact-wrap { grid-template-columns:1fr; }
  .orb-stage { min-height:390px; }
  .orb.one { width:230px; height:230px; left:3%; }
  .orb.two { width:210px; height:210px; right:4%; }
  section { padding:72px 0; }
  .contact-wrap { padding:28px; }
  .app-visual { height:auto; aspect-ratio:1/1; }
}
@media (max-width: 520px) {
  .container { width:min(calc(100% - 28px), var(--max)); }
  h1 { font-size:3.55rem; }
  .hero p { font-size:1.02rem; }
  .orb-stage { min-height:325px; }
  .orb.one { width:190px; height:190px; }
  .orb.two { width:175px; height:175px; }
  .panel, .app-card { padding:20px; }
}
