:root{
  --bg:#0b1220; --panel:#0f172a; --ink:#e6edf3; --muted:#aeb6c1; --accent:#f5ac38; --line:#233044;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif}
a{color:#7cc7ff;text-decoration:none} a:hover{text-decoration:underline}
.wrap{max-width:1100px;margin:auto;padding:1.25rem}
.skip{position:absolute;left:-9999px;top:auto} .skip:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.5rem}
.site-header{position:sticky;top:0;background:rgba(11,18,32,.8);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line);z-index:20}
.logo{font-weight:700;letter-spacing:.3px} .logo span{color:var(--accent)}
.site-nav{display:flex;align-items:center;gap:1rem} .site-nav ul{display:flex;gap:1rem;list-style:none;margin:0;padding:0}
.nav-toggle{display:none}
.hero{padding:6rem 0;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent)}
.hero h1{font-size:clamp(2rem,6vw,3rem);margin:.25rem 0 0}
.hero .tag{color:var(--muted);max-width:60ch}
.cta-row{display:flex;gap:.8rem;margin-top:1rem;flex-wrap:wrap}
.cta{display:inline-block;background:var(--accent);color:#1a1a1a;padding:.65rem 1rem;border-radius:.5rem;font-weight:600}
.cta.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.section{padding:3rem 0;border-top:1px solid var(--line)}
.section.alt{background:var(--panel)}
.narrow{max-width:68ch}
.card{background:var(--panel);border:1px solid var(--line);border-radius:.8rem;padding:1rem}
.card .meta{color:var(--muted);margin:.5rem 0 0}
.site-footer{padding:2rem 0;border-top:1px solid var(--line);font-size:.95rem;color:var(--muted)}
.site-footer .cols{display:grid;grid-template-columns:1fr;gap:1rem}
.badge{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:.1rem .5rem;font-size:.75rem;margin-left:.4rem}
.contact-form{display:grid;gap:.6rem;margin-top:.8rem}
input,textarea{background:#0b1220;border:1px solid var(--line);color:var(--ink);padding:.65rem;border-radius:.5rem}
label{font-size:.9rem;color:var(--muted)}
@media (max-width:820px){
  .site-nav ul{display:none}
  .nav-toggle{display:inline-block;background:transparent;color:var(--ink);border:1px solid var(--line);padding:.4rem .6rem;border-radius:.4rem}
  .site-nav[aria-expanded="true"] ul{display:flex;flex-direction:column;background:var(--panel);padding:1rem;border:1px solid var(--line);border-radius:.6rem;position:absolute;right:1rem;top:3rem}
}

/* active nav link */
.site-nav a.active{position:relative}
.site-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--accent);border-radius:2px}

/* global type scaling */
body{font-size:clamp(15px, 1.6vw, 18px)}
.hero h1{font-size:clamp(1.9rem, 6vw, 3rem)}
.tag{font-size:clamp(.95rem, 2.2vw, 1.15rem)}

/* tighter phones */
@media (max-width:480px){
  .wrap{padding:1rem}
  .cta-row{flex-direction:column;align-items:flex-start}
  .site-header .wrap{gap:.5rem}
}

/* large tablets / small laptops */
@media (min-width:821px) and (max-width:1100px){
  .wrap{padding:1rem 1.25rem}
}


/* cards grid for Info */
.cards{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:1rem}
@media (min-width:720px){ .cards{grid-template-columns:1fr 1fr} }
@media (min-width:1100px){ .cards{grid-template-columns:1fr 1fr 1fr} }
.cards .card h3{margin-top:.2rem;margin-bottom:.4rem}


/* --- Silicon Valley style polish --- */
:root{
  --bg:#070b14;
  --panel:rgba(13,18,31,0.7);
  --ink:#e8eef6;
  --muted:#a8b2c3;
  --accent:#6ee7ff;
  --accent2:#f59e0b;
  --line:rgba(120,140,170,0.22);
}

/* gradient canvas */
body{
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(110,231,255,0.10), transparent 60%),
    radial-gradient(900px 500px at 110% 20%, rgba(245,158,11,0.09), transparent 60%),
    linear-gradient(180deg, #0a0f1d 0%, #0b1220 100%);
}

/* hero gradient blob */
.hero{position:relative;overflow:hidden;padding:7rem 0}
.hero::before{
  content:""; position:absolute; inset:auto -20% -30% -20%; height:60%;
  background: radial-gradient(closest-side at 50% 50%, rgba(110,231,255,0.18), rgba(245,158,11,0.16), transparent 70%);
  filter: blur(40px) saturate(120%);
  animation: floatBlob 14s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes floatBlob{
  from{ transform: translateY(0) scale(1)}
  to{ transform: translateY(-16px) scale(1.05)}
}

/* glassy cards */
.card{
  background:var(--panel);
  backdrop-filter: blur(8px) saturate(140%);
  border:1px solid var(--line);
  box-shadow: 0 10px 24px rgba(3,8,20,0.35);
  transition: transform .22s ease, box-shadow .22s ease;
}
.card:hover{ transform: translateY(-2px); box-shadow:0 16px 34px rgba(3,8,20,0.45)}

/* pill CTAs */
.cta{border-radius:999px; padding:.72rem 1.15rem; box-shadow:0 10px 20px rgba(111,231,255,0.15)}
.cta.ghost{border-radius:999px}

/* badges with gradient ring */
.badge{
  border:1px solid transparent;
  background:
    linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(135deg, rgba(110,231,255,0.8), rgba(245,158,11,0.8)) border-box;
  color:var(--ink);
}

/* active nav chip */
.site-nav a.active{position:relative;padding-bottom:.35rem}
.site-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:3px;
  background:linear-gradient(90deg, var(--accent), var(--accent2));border-radius:2px}

/* headings & spacing */
h1,h2,h3{letter-spacing:.2px}
.hero h1{font-weight:800}
.section{padding:3.2rem 0}

/* light mode */
@media (prefers-color-scheme: light){
  :root{ --bg:#f7f9fc; --panel:rgba(255,255,255,0.8); --ink:#0a0f1d; --muted:#4a5568; --line:rgba(10,15,29,0.12) }
  body{ background: radial-gradient(900px 480px at -10% -10%, rgba(110,231,255,0.18), transparent 60%),
                   radial-gradient(700px 420px at 110% 0%, rgba(245,158,11,0.12), transparent 60%),
                   linear-gradient(#eef3fa, #fafcff); }
  .site-header{background:rgba(255,255,255,.8);}
  input,textarea{background:#ffffff}
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important}
}

/* info card icons */
.card .icon{width:28px;height:28px;vertical-align:-6px;margin-right:.5rem;opacity:.9}
.cards .card h3{display:flex;align-items:center;gap:.5rem}


/* touch targets & focus states */
.site-nav a{padding:.35rem .25rem}
@media (max-width:820px){
  .site-nav a{padding:.55rem .35rem}
}

a:focus-visible, button:focus-visible, .cta:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-radius:6px;
}

/* ensure minimum tappable height for CTAs */
.cta{min-height:44px; display:inline-flex; align-items:center; justify-content:center}