:root {
  --primary:#2563eb;--secondary:#00b8d4;--accent:#7c3aed;--bg:#0b1220;--surface:#111827;
  --text:#f8fbff;--muted:#a7bbdd;--border:rgba(255,255,255,.16);--glass:rgba(255,255,255,.08);
  --shadow:0 20px 50px rgba(0,0,0,.35);--r-lg:22px;--r-md:16px;--r-sm:12px;--tr:240ms cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Poppins,Segoe UI,Roboto,sans-serif;color:var(--text);line-height:1.6;
background:radial-gradient(1100px 600px at 5% -15%,rgba(37,99,235,.28),transparent 60%),radial-gradient(900px 520px at 92% 2%,rgba(124,58,237,.24),transparent 58%),linear-gradient(140deg,#090f1f 0%,#101a33 45%,#0b1220 100%)}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.site-shell{width:min(1180px,calc(100% - 28px));margin:16px auto 28px;border:1px solid var(--border);border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));box-shadow:var(--shadow);overflow:hidden;backdrop-filter:blur(10px)}
.navbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-bottom:1px solid var(--border);background:rgba(8,13,30,.88);backdrop-filter:blur(8px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700}.brand-badge{width:12px;height:12px;border-radius:50%;background:linear-gradient(130deg,var(--secondary),var(--accent));box-shadow:0 0 16px rgba(0,184,212,.9)}
.nav-links{display:flex;gap:8px;align-items:center}.nav-links a{color:var(--muted);padding:8px 12px;border:1px solid transparent;border-radius:10px;font-weight:600;transition:all var(--tr)}
.nav-links a:hover,.nav-links a.active{color:var(--text);background:rgba(255,255,255,.09);border-color:var(--border)}
.menu-toggle{display:none;border:1px solid var(--border);background:rgba(255,255,255,.06);color:var(--text);padding:7px 10px;border-radius:10px}
.section{padding:32px 24px}.section-title{margin:0 0 10px;font-size:clamp(1.45rem,3vw,2rem);line-height:1.2}.section-subtitle{color:var(--muted);margin:0 0 20px}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;padding:38px 24px 30px;position:relative;overflow:hidden}
.hero h1{margin:0 0 12px;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.15}.hero p{margin:0;color:var(--muted);font-size:1.04rem;max-width:66ch}
.hero-visual{border:1px solid var(--border);background:linear-gradient(145deg,rgba(37,99,235,.22),rgba(17,24,39,.5));border-radius:var(--r-lg);position:relative;overflow:hidden;display:block;padding:0}
.hero-visual::before{z-index:2;pointer-events:none;content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 20% 30%,rgba(0,184,212,.5),transparent 35%),radial-gradient(circle at 80% 40%,rgba(124,58,237,.45),transparent 30%),linear-gradient(120deg,rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(0deg,rgba(255,255,255,.14) 1px,transparent 1px);background-size:auto,auto,34px 34px,34px 34px;animation:pulse 8s linear infinite}
.button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:10px 14px;font-weight:700;border:1px solid var(--border);transition:all var(--tr)}
.btn.primary{background:linear-gradient(90deg,var(--primary),var(--secondary));border:none;color:#031833}.btn.ghost{background:rgba(255,255,255,.05);color:var(--text)}.btn:hover{transform:translateY(-2px)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.card{background:var(--glass);border:1px solid var(--border);border-radius:var(--r-md);padding:16px;transition:all var(--tr)}
.card:hover{transform:translateY(-4px);border-color:rgba(0,184,212,.8);background:rgba(255,255,255,.12)}.card h3{margin:0 0 8px}.card p{margin:0;color:var(--muted)}
.icon-tile{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-bottom:12px;background:linear-gradient(135deg,rgba(37,99,235,.35),rgba(124,58,237,.35));border:1px solid var(--border)}
.badge{display:inline-flex;padding:5px 10px;border-radius:999px;font-size:.78rem;font-weight:700;margin-top:12px;color:#051d28;background:linear-gradient(90deg,#8ee9ff,#7fd6ff)}
.timeline{display:grid;gap:10px}.timeline-item{padding:14px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.06)}
.stack{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.08);font-size:.85rem}
.workflow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.workflow-step{text-align:center;padding:14px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.07);font-weight:600}
.architecture{border-radius:var(--r-md);padding:16px;border:1px solid var(--border);background:rgba(255,255,255,.06)}.architecture-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.architecture-node{padding:12px;border-radius:12px;text-align:center;border:1px solid var(--border);background:rgba(37,99,235,.2)}
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}form{display:grid;gap:10px}label{font-weight:600;font-size:.94rem}input,textarea{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:12px;padding:11px 12px;color:var(--text)}textarea{min-height:130px;resize:vertical}
.faq-item{border:1px solid var(--border);border-radius:12px;padding:12px;background:rgba(255,255,255,.05)}.faq-item summary{cursor:pointer;font-weight:600}
.footer{margin-top:6px;border-top:1px solid var(--border);padding:24px;background:rgba(4,10,24,.85)}.footer-grid{display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:14px}.footer h4{margin:0 0 8px}.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px;color:var(--muted)}.footer-note{margin-top:14px;color:var(--muted);font-size:.92rem}
.reveal{opacity:0;transform:translateY(16px);transition:all .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.95}50%{transform:scale(1.03);opacity:1}}
@media (max-width:980px){.hero-visual{padding:0}.hero,.contact-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.hero-visual{padding:0}.menu-toggle{display:inline-flex}.nav-links{display:none;position:absolute;top:58px;right:14px;flex-direction:column;background:rgba(8,13,30,.97);border:1px solid var(--border);border-radius:12px;padding:8px}.nav-links.show{display:flex}.workflow{grid-template-columns:repeat(2,1fr)}.architecture-row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}}


.hero-visual img{width:100%;height:auto;object-fit:contain;object-position:center center;display:block;position:relative;z-index:1;opacity:1}