:root {
      --bg:#061427;
      --bg-soft:#0b1f3a;
      --bg-card:rgba(255,255,255,0.08);
      --bg-card-strong:rgba(255,255,255,0.14);
      --text:#f8fbff;
      --muted:#b8c8de;
      --line:rgba(255,255,255,0.16);
      --blue:#123C69;
      --purple:#7D00FF;
      --cyan:#38BDF8;
      --magenta:#FF00A8;
      --gold:#F59E0B;
      --green:#10B981;
      --shadow:0 24px 70px rgba(0,0,0,0.35);
      --radius:28px;
    }

    * { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body {
      font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      background:
        radial-gradient(circle at 18% 10%,rgba(125,0,255,.23),transparent 32%),
        radial-gradient(circle at 85% 18%,rgba(56,189,248,.18),transparent 34%),
        radial-gradient(circle at 55% 75%,rgba(255,0,168,.12),transparent 32%),
        linear-gradient(145deg,#04101f 0%,#061427 48%,#0b1f3a 100%);
      color:var(--text);
      overflow-x:hidden;
    }

    a { color:inherit; text-decoration:none; }
    img { max-width:100%; display:block; }
    section { padding:110px 4vw; position:relative; }
    .container { width:100%; margin:0 auto; }

    .topbar {
      position:fixed;
      top:0;
      left:0;
      right:0;
      z-index:1000;
      padding:14px 6vw;
      background:rgba(6,20,39,.74);
      backdrop-filter:blur(18px);
      border-bottom:1px solid rgba(255,255,255,.1);
      transition:.25s;
    }
    .topbar.scrolled { padding:10px 6vw; background:rgba(6,20,39,.94); }
    .nav { width:100%; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:20px; }

    .brand { display:flex; align-items:center; }
    .brand-vertical { flex-direction:column; align-items:flex-start; gap:0; line-height:1; }
    .brand-logo { display:flex; align-items:center; justify-content:center; background:transparent; box-shadow:none; padding:0; margin:0; line-height:0; }
    .brand-logo img { max-height:82px; max-width:185px; width:auto; height:auto; object-fit:contain; display:block; }
    .brand-tagline {
      margin-top:-10px;
      padding-left:3px;
      font-size:.68rem;
      color:var(--muted);
      letter-spacing:.08em;
      text-transform:uppercase;
      font-weight:750;
      white-space:nowrap;
    }

    .nav-links { display:flex; align-items:center; gap:18px; color:var(--muted); font-size:.93rem; }
    .nav-links a:hover { color:white; }
    .nav-cta {
      padding:11px 18px;
      border-radius:999px;
      background:linear-gradient(135deg,var(--purple),var(--cyan));
      color:white!important;
      font-weight:900;
      box-shadow:0 12px 32px rgba(56,189,248,.18);
    }
    .menu-btn { display:none; border:1px solid var(--line); background:var(--bg-card); color:white; padding:10px 13px; border-radius:14px; cursor:pointer; }

    .lang-toggle {
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:5px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.07);
      border-radius:999px;
    }
    .lang-toggle button {
      border:0;
      background:transparent;
      color:var(--muted);
      font-weight:900;
      padding:7px 9px;
      border-radius:999px;
      cursor:pointer;
      font-size:.78rem;
      transition:.2s;
    }
    .lang-toggle button.active { background:linear-gradient(135deg,var(--purple),var(--cyan)); color:white; }

    .hero { min-height:82vh; display:flex; align-items:center; padding-top:150px; }
    .hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; }
    .eyebrow {
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:9px 14px;
      border:1px solid var(--line);
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:#dceaff;
      font-weight:800;
      font-size:.88rem;
      margin-bottom:24px;
    }
    .pulse { width:9px; height:9px; background:var(--green); border-radius:50%; box-shadow:0 0 0 8px rgba(16,185,129,.12); }
    h1 { font-size:clamp(3.2rem,7vw,6.2rem); line-height:.92; letter-spacing:-.075em; margin-bottom:28px; }
    h2 { font-size:clamp(2.1rem,4.5vw,4rem); line-height:1.03; letter-spacing:-.06em; margin-bottom:18px; }
    .gradient-text { background:linear-gradient(135deg,#fff,var(--cyan),var(--magenta)); -webkit-background-clip:text; color:transparent; }
    .hero p,.section-head p,.card p,.story p,.value p,.timeline p,footer p,footer a,.platform-card p,.stat span { color:var(--muted); line-height:1.8; }
    .hero p { font-size:clamp(1.05rem,2vw,1.28rem); max-width:760px; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:16px; margin-top:34px; }
    .btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 22px; border-radius:999px; font-weight:900; transition:.2s; cursor:pointer; }
    .btn:hover { transform:translateY(-3px); }
    .btn-primary { background:linear-gradient(135deg,var(--purple),var(--cyan)); color:white; box-shadow:0 18px 42px rgba(56,189,248,.18); }
    .btn-secondary { background:rgba(255,255,255,.08); border:1px solid var(--line); color:white; }

    .hero-card {
      border-radius:var(--radius);
      padding:28px;
      background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.06));
      border:1px solid var(--line);
      box-shadow:var(--shadow);
      animation:floatCard 6s ease-in-out infinite;
    }
    .hero-card h3 { font-size:1.55rem; margin-bottom:16px; }
    .stat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
    .stat { padding:18px; border-radius:18px; background:rgba(255,255,255,.08); border:1px solid var(--line); }
    .stat strong { display:block; font-size:1.6rem; margin-bottom:4px; }

    .section-head { max-width:860px; margin-bottom:44px; }
    .section-kicker { color:var(--cyan); font-weight:950; text-transform:uppercase; letter-spacing:.16em; font-size:.78rem; margin-bottom:13px; }
    .card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
    .card,.story,.value,.timeline {
      background:var(--bg-card);
      border:1px solid var(--line);
      border-radius:24px;
      padding:26px;
      box-shadow:0 16px 42px rgba(0,0,0,.16);
      transition:.2s;
    }
    .card:hover,.value:hover { transform:translateY(-7px); background:var(--bg-card-strong); border-color:rgba(56,189,248,.42); }
    .icon { width:52px; height:52px; border-radius:17px; display:grid; place-items:center; background:linear-gradient(135deg,rgba(56,189,248,.23),rgba(125,0,255,.35)); margin-bottom:20px; font-size:1.45rem; }
    .card h3,.value h3,.timeline h3 { font-size:1.25rem; margin-bottom:12px; letter-spacing:-.03em; }

    .platform-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
    .platform-card { background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.06)); border:1px solid var(--line); border-radius:28px; padding:30px; box-shadow:var(--shadow); transition:.2s; }
    .platform-card:hover { transform:translateY(-7px); border-color:rgba(56,189,248,.42); }
    .platform-card h3 { font-size:1.7rem; margin-bottom:12px; }
    .platform-list { display:grid; gap:10px; margin:18px 0 24px; }
    .platform-list span { color:#e8f1ff; }

    .story-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:28px; align-items:stretch; }
    .story-feature {
      border-radius:var(--radius);
      padding:34px;
      min-height:420px;
      display:flex;
      flex-direction:column;
      justify-content:flex-end;
      background:linear-gradient(135deg,rgba(6,20,39,.25),rgba(6,20,39,.92)),url("https://images.unsplash.com/photo-1522199710521-72d69614c702?auto=format&fit=crop&w=1200&q=80") center/cover;
      border:1px solid var(--line);
      box-shadow:var(--shadow);
    }
    .story-feature p { color:#e4edff; }
    .values { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }

    .timeline-wrap { display:grid; gap:18px; position:relative; }
    .timeline-wrap:before { content:""; position:absolute; left:23px; top:10px; bottom:10px; width:2px; background:linear-gradient(var(--cyan),var(--magenta)); opacity:.55; }
    .timeline-row { display:grid; grid-template-columns:50px 1fr; gap:18px; align-items:start; }
    .timeline-no { width:48px; height:48px; border-radius:16px; background:rgba(255,255,255,.12); border:1px solid var(--line); display:grid; place-items:center; font-weight:950; z-index:1; }

    .cta-band { border-radius:36px; padding:52px; background:linear-gradient(135deg,rgba(125,0,255,.25),rgba(18,60,105,.65),rgba(56,189,248,.16)); border:1px solid var(--line); box-shadow:var(--shadow); display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center; }

    footer { padding:55px 6vw 36px; border-top:1px solid var(--line); background:rgba(0,0,0,.18); }
    .footer-grid { width:min(1180px,100%); margin:0 auto; display:grid; grid-template-columns:1fr 1fr 1fr; gap:28px; align-items:start; }
    .footer-logo { display:flex; flex-direction:column; gap:0; align-items:flex-start; font-weight:950; font-size:1.25rem; margin-bottom:14px; }
    .footer-links { display:grid; gap:9px; }
    .brainiq { color:white; font-weight:950; }
    .copyright { width:min(1180px,100%); margin:34px auto 0; color:#8fa0b8; font-size:.9rem; display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }

    #backToTop { position:fixed; bottom:28px; right:28px; width:56px; height:56px; border-radius:50%; border:2px solid rgba(255,255,255,.35); background:linear-gradient(135deg,var(--purple),var(--cyan)); color:white; font-size:26px; font-weight:950; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 16px 45px rgba(0,0,0,.55); z-index:9999; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(18px) scale(.92); transition:.25s; }
    #backToTop.show { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1); }

    .reveal,.reveal-left,.reveal-right,.reveal-zoom { opacity:0; transition:opacity .85s ease,transform .85s cubic-bezier(.2,.8,.2,1); }
    .reveal { transform:translateY(34px); }
    .reveal-left { transform:translateX(-56px); }
    .reveal-right { transform:translateX(56px); }
    .reveal-zoom { transform:scale(.92) translateY(24px); }
    .visible { opacity:1!important; transform:translate(0,0) scale(1)!important; }
    @keyframes floatCard { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }

    @media(max-width:980px){
      .hero-grid,.story-grid,.cta-band,.platform-grid { grid-template-columns:1fr; }
      .card-grid,.footer-grid,.values { grid-template-columns:1fr 1fr; }
      .nav-links { display:none; position:absolute; top:96px; left:6vw; right:6vw; padding:18px; background:rgba(6,20,39,.97); border:1px solid var(--line); border-radius:22px; flex-direction:column; align-items:flex-start; }
      .nav-links.open { display:flex; }
      .menu-btn { display:inline-flex; }
    }
    @media(max-width:640px){
      section { padding:82px 5vw; }
      .topbar { padding-left:5vw; padding-right:5vw; }
      .hero { padding-top:145px; }
      .brand-logo img { max-height:72px; max-width:160px; }
      .brand-tagline { margin-top:-8px; font-size:.61rem; }
      .card-grid,.footer-grid,.values,.stat-grid { grid-template-columns:1fr; }
      .cta-band { padding:32px; }
      h1 { font-size:3.45rem; }
    }
