:root{
  --bg:#07101d;
  --bg-soft:#0d1830;
  --panel:rgba(15,23,42,.74);
  --panel-strong:#0f172a;
  --line:rgba(148,163,184,.18);
  --line-strong:rgba(148,163,184,.3);
  --text:#ecf2ff;
  --muted:#9fb0d3;
  --brand:#5eead4;
  --brand-2:#60a5fa;
  --brand-3:#c084fc;
  --shadow:0 24px 80px rgba(2,8,23,.45);
  --radius:22px;
  --radius-sm:16px;
  --container:1180px;
  --narrow:860px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 15% 10%, rgba(96,165,250,.18), transparent 22%),
    radial-gradient(circle at 85% 20%, rgba(94,234,212,.12), transparent 20%),
    linear-gradient(180deg, #06101d 0%, #081323 48%, #050a13 100%);
  font:400 17px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
img{max-width:100%}
a{color:inherit;text-decoration:none}
p{margin:0 0 1rem}
h1,h2,h3{line-height:1.1;letter-spacing:-.03em;margin:0 0 1rem}
h1{font-size:clamp(2.4rem,6vw,4.9rem)}
h2{font-size:clamp(1.8rem,3vw,3rem)}
h3{font-size:1.2rem}
small{font-size:.88rem}
code{
  background:rgba(15,23,42,.7);
  border:1px solid var(--line);
  padding:.15rem .45rem;
  border-radius:8px;
}
.container{width:min(var(--container), calc(100% - 2rem)); margin:0 auto}
.narrow{width:min(var(--narrow), 100%)}
.section{padding:5.5rem 0}
.section-alt{background:linear-gradient(180deg, rgba(9,15,28,.28), rgba(9,15,28,.64))}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--brand);
  font-size:.8rem;
  font-weight:700;
  margin-bottom:1.1rem;
}
.eyebrow::before{
  content:"";
  width:28px;height:1px;
  background:linear-gradient(90deg,var(--brand),transparent);
}
.lead{
  color:var(--muted);
  font-size:clamp(1.08rem,1.6vw,1.28rem);
  max-width:72ch;
}
.site-header{
  position:sticky;top:0;z-index:40;
  backdrop-filter:blur(18px);
  background:rgba(4,10,20,.66);
  border-bottom:1px solid rgba(148,163,184,.12);
}
.nav-row{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:80px;
}
.brand{display:flex;align-items:center;gap:.9rem}
.brand-mark{
  width:46px;height:46px;
  display:grid;place-items:center;
  border-radius:14px;
  font-weight:800;
  background:linear-gradient(135deg, rgba(96,165,250,.32), rgba(94,234,212,.22));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 10px 35px rgba(2,8,23,.26);
}
.brand-text{display:flex;flex-direction:column}
.brand-text small{color:var(--muted)}
.site-nav{display:flex;align-items:center;gap:1.1rem}
.site-nav a{
  color:#d5def1;
  font-size:.96rem;
}
.site-nav a:hover{color:white}
.nav-cta{
  padding:.75rem 1rem;
  border:1px solid rgba(94,234,212,.35);
  border-radius:999px;
  background:rgba(94,234,212,.08);
}
.menu-toggle{
  display:none;
  border:1px solid var(--line);
  background:rgba(15,23,42,.9);
  color:var(--text);
  padding:.7rem .9rem;
  border-radius:12px;
}
.hero{
  padding:6.6rem 0 4.5rem;
}
.hero-grid,.split{
  display:grid;
  grid-template-columns:1.2fr .95fr;
  gap:2rem;
  align-items:center;
}
.hero-home{min-height:calc(100vh - 80px); display:flex; align-items:center}
.hero-panel,.glass,.contact-card{
  background:linear-gradient(180deg, rgba(15,23,42,.85), rgba(7,16,29,.72));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
}
.hero-panel{padding:1.6rem}
.panel-top{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  margin-bottom:1rem;
}
.badge,.chip,.label{
  display:inline-flex;align-items:center;
  padding:.45rem .72rem;
  border-radius:999px;
  font-size:.86rem;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);
}
.badge{color:var(--brand)}
.mini-stat{color:var(--muted);font-size:.9rem}
.timeline-mini{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1.4rem;
}
.timeline-mini div,.metric,.stack-card,.preview-card{
  padding:1rem;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
}
.timeline-mini strong,.metric strong{display:block;font-size:1.2rem;margin-bottom:.25rem}
.timeline-mini span,.metric span,.stack-card span{color:var(--muted);font-size:.95rem}
.button-row,.chip-row{
  display:flex;flex-wrap:wrap;gap:.9rem;
  margin-top:1.5rem;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  padding:1rem 1.25rem;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}
.button:hover{transform:translateY(-1px)}
.primary{
  background:linear-gradient(135deg, var(--brand), var(--brand-2));
  color:#08111f;
}
.secondary{
  background:transparent;
  border-color:rgba(148,163,184,.35);
}
.tertiary{
  margin-top:1.6rem;
  border-color:rgba(148,163,184,.25);
  background:rgba(255,255,255,.03);
}
.chip{
  color:#dbe9ff;
  backdrop-filter: blur(8px);
}
.section-head{
  margin-bottom:2rem;
  max-width:820px;
}
.card-grid{
  display:grid;
  gap:1.2rem;
}
.card-grid.two{grid-template-columns:repeat(2,1fr)}
.card-grid.three{grid-template-columns:repeat(3,1fr)}
.card-grid.four{grid-template-columns:repeat(4,1fr)}
.card{
  padding:1.35rem;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(15,23,42,.78), rgba(7,16,29,.65));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(2,8,23,.14);
}
.card p,.muted{color:var(--muted)}
.project,.article{min-height:230px}
.text-link{
  font-weight:700;
  color:var(--brand);
}
.feature-list{
  padding-left:1.1rem;
  color:#dfe7f6;
}
.feature-list li{margin-bottom:.6rem}
.metrics{
  display:grid;
  gap:1rem;
}
.metric strong{font-size:2rem}
.software-preview{padding:1.2rem}
.preview-window{
  border-radius:18px;
  background:#08111f;
  border:1px solid var(--line-strong);
  overflow:hidden;
}
.preview-dots{
  display:flex;gap:.4rem;padding:.8rem 1rem;border-bottom:1px solid var(--line);
}
.preview-dots span{
  width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.2);
}
.preview-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:1rem;
}
.preview-flow{
  display:grid;gap:.85rem;padding:1rem;
}
.preview-flow div{
  padding:1rem;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.04);
}
.card-stack{
  display:grid; gap:1rem;
}
.stack-card{
  position:relative;
  overflow:hidden;
}
.stack-card::after{
  content:"";
  position:absolute; inset:auto -10% -50% auto;
  width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, rgba(94,234,212,.14), transparent 60%);
}
.cta-section{padding-top:2rem}
.cta-box{
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;
  padding:2rem;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(135deg, rgba(96,165,250,.14), rgba(94,234,212,.08));
}
.page-hero{
  padding:5rem 0 2rem;
}
.private-hero{
  background:linear-gradient(180deg, rgba(192,132,252,.12), transparent);
}
.timeline{
  display:grid;
  gap:1rem;
}
.timeline-item{
  display:grid;
  grid-template-columns:110px 1fr;
  gap:1rem;
  padding:1.4rem;
  border-radius:22px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
}
.timeline-item strong{
  font-size:1.15rem;
  color:var(--brand);
}
.faq-grid{
  display:grid;
  grid-template-columns: .95fr 1.05fr;
  gap:2rem;
}
.accordion details{
  margin-bottom:1rem;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.03);
  padding:1rem 1.1rem;
}
.accordion summary{
  cursor:pointer;
  font-weight:700;
}
.contact-form{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1rem;
  padding:1.4rem;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(15,23,42,.84), rgba(7,16,29,.7));
  box-shadow:var(--shadow);
}
.contact-card{padding:1.4rem}
.field{display:flex;flex-direction:column;gap:.5rem}
.field-full{grid-column:1/-1}
label{font-size:.92rem;color:#cdd8ef}
input,textarea,select{
  width:100%;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  color:var(--text);
  padding:1rem 1rem;
  border-radius:16px;
  outline:none;
}
input:focus,textarea:focus,select:focus{
  border-color:rgba(94,234,212,.45);
  box-shadow:0 0 0 4px rgba(94,234,212,.12);
}
.form-note{font-size:.94rem;color:var(--muted);margin-top:.8rem}
.site-footer{
  padding:4rem 0 1.5rem;
  border-top:1px solid rgba(148,163,184,.12);
  background:rgba(3,8,15,.76);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.1fr .8fr .9fr;
  gap:2rem;
}
.footer-brand{
  display:flex; align-items:flex-start; gap:1rem;
}
.footer-links{
  list-style:none; padding:0; margin:0;
}
.footer-links li{margin-bottom:.55rem}
.footer-links a{color:var(--muted)}
.footer-links a:hover{color:var(--text)}
.footer-bottom{
  margin-top:2rem;padding-top:1.2rem;
  border-top:1px solid rgba(148,163,184,.12);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  color:var(--muted);
}
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .65s ease, transform .65s ease;
}
.reveal.in-view{
  opacity:1;
  transform:none;
}
@media (max-width: 1024px){
  .hero-grid,.split,.faq-grid,.footer-grid{grid-template-columns:1fr}
  .card-grid.four{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 820px){
  .site-nav{
    position:absolute;left:1rem;right:1rem;top:88px;
    display:none;flex-direction:column;align-items:stretch;
    padding:1rem;
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    background:rgba(4,10,20,.97);
    box-shadow:var(--shadow);
  }
  .site-nav.open{display:flex}
  .menu-toggle{display:inline-flex}
  .hero{padding-top:4.5rem}
  .card-grid.three,.card-grid.two,.card-grid.four,.contact-form{grid-template-columns:1fr}
  .timeline-item{grid-template-columns:1fr}
  .cta-box{align-items:flex-start;flex-direction:column}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .button:hover{transform:none}
}