/* Basic reset and theme */
:root{
  --bg:#0b0d10;
  --panel:#111418;
  --text:#e9eef5;
  --muted:#97a3b6;
  --brand:#6fd1ff;
  --accent:#9cff6f;
  --card:#141820;
  --border:#1f2630;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:var(--text);
  background:radial-gradient(1200px 600px at 70% -10%, rgba(111,209,255,0.15), transparent 60%), var(--bg);
  line-height:1.6;
}

.container{width:min(1100px, 92vw); margin:0 auto;}

.site-header{
  position:sticky; top:0; z-index:100;
  backdrop-filter:saturate(160%) blur(10px);
  background:linear-gradient(to bottom, rgba(11,13,16,0.9), rgba(11,13,16,0.5));
  border-bottom:1px solid var(--border);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:12px 0;}
.brand{display:flex; gap:10px; align-items:center; text-decoration:none; color:var(--text); font-weight:700; letter-spacing:0.2px;}
.brand img{filter:drop-shadow(0 0 10px rgba(111,209,255,0.25));}

.site-header nav a{margin-left:18px; text-decoration:none; color:var(--text); opacity:0.9;}
.site-header nav a:hover{opacity:1;}
.btn{
  display:inline-block; padding:12px 18px; border-radius:10px; background:var(--brand);
  color:#0b0d10; text-decoration:none; font-weight:700; border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 10px 30px rgba(111,209,255,0.2); transition:transform .05s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn.small{padding:8px 12px; font-weight:600;}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--border); box-shadow:none;}

.hero{display:grid; grid-template-columns: 1.1fr 0.9fr; gap:40px; padding:80px 0 40px;}
h1{font-size:clamp(28px, 4vw, 48px); line-height:1.1; margin:0 0 14px;}
.lead{font-size:1.1rem; color:#dbe6f5; opacity:0.95;}
.accent{background:linear-gradient(90deg, var(--brand), var(--accent)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.cta{display:flex; gap:12px; margin:18px 0 8px;}
.proof{margin:14px 0 0; padding:0; list-style:none; display:flex; gap:16px; flex-wrap:wrap;}
.proof li{background:rgba(159,255,111,0.08); border:1px solid rgba(159,255,111,0.2); padding:6px 10px; border-radius:999px; font-size:0.9rem; color:#d2ffbd;}

.hero-art{position:relative; min-height:320px; border-radius:16px; background: #f9fafb; overflow:hidden; border:1px solid var(--border);}
.hero-art .orb{position:absolute; width:420px; height:420px; background:radial-gradient(circle at 30% 30%, rgba(111,209,255,0.5), transparent 60%); filter:blur(20px); top:-60px; right:-60px;}
.hero-art .grid{position:absolute; inset:0; background-image:linear-gradient(to right, rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,0.04) 1px, transparent 1px); background-size:40px 40px; opacity:0.7;}

.section{padding:56px 0;}
h2{margin:0 0 18px; font-size:clamp(22px, 3vw, 32px);}
.cards{display:grid; gap:18px;}
.cards.three{grid-template-columns:repeat(3,minmax(0,1fr));}
.card{background:var(--card); border:1px solid var(--border); border-radius:14px; padding:18px;}
.card h3{margin-top:0}
.card ul{margin:10px 0 0 18px; padding:0}
.card.mini p{margin:8px 0 0}

.badges{display:flex; gap:12px; flex-wrap:wrap; margin:8px 0 16px;}
.badge{background:#10161f; border:1px dashed var(--border); padding:8px 12px; border-radius:999px; font-size:0.9rem;}

.about p{margin:8px 0;}
.muted{color:var(--muted);}
.small{font-size:0.92rem;}

.form{max-width:720px;}
.form label{display:block; font-weight:600; margin:10px 0 6px;}
.form input, .form textarea{
  width:100%; padding:12px 14px; border-radius:10px; background:#0f1216; color:var(--text); border:1px solid var(--border);
}
.form .grid2{display:grid; gap:12px; grid-template-columns:1fr 1fr;}
.form-note{margin:8px 0 0;}
.form-status{margin:10px 0 0; min-height:1em;}

.site-footer{border-top:1px solid var(--border); padding:24px 0 36px; margin-top:24px; background:linear-gradient(to top, rgba(17,20,24,0.7), transparent);}
.footer-inner{display:flex; align-items:center; gap:18px; justify-content:space-between; flex-wrap:wrap;}
.brandline{display:flex; align-items:center; gap:10px;}
.footernav a{margin-right:14px; text-decoration:none; color:var(--text); opacity:0.85;}
.footernav a:hover{opacity:1;}

@media (max-width:900px){
  .hero{grid-template-columns:1fr; padding-top:40px;}
  .form .grid2{grid-template-columns:1fr;}
}


/* Hero logo sizing for landing page */
.hero-art{
  position:relative;
  min-height:320px;
  border-radius:16px;
  background: #f9fafb;
  overflow:hidden;
  border:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-logo-large{
  max-width: 360px;
  width: 70%;
  height:auto;
  filter: drop-shadow(0 10px 30px rgba(111,209,255,0.25));
}