:root{
  --bg-teal:#0E3B3B;
  --bg-violet:#1E1238;
  --surface:#0A2224;
  --text:#EAF2F2;
  --muted:#A9B4B4;
  --accent:#66D1C7;
  --accent-2:#8C7AE6;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg-teal);color:var(--text);}
body.theme-teal{background:var(--bg-teal)}
body.theme-violet{background:var(--bg-violet)}

.sidebar{
  position:fixed;left:0;top:0;bottom:0;width:300px;
  background:rgba(0,0,0,.35);backdrop-filter: blur(8px);
  border-right:1px solid rgba(255,255,255,.08);
  padding:24px 18px;display:flex;flex-direction:column;gap:18px;z-index:10;
}
.brand .logo{font-weight:800;font-size:28px;letter-spacing:1px}
.brand .tagline{font-size:12px;color:var(--muted)}

.menu{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.menu a{color:var(--text);text-decoration:none;padding:10px 12px;border-radius:8px;opacity:.9}
.menu a:hover{background:rgba(255,255,255,.08)}

.actions{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.btn{display:inline-block;padding:10px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.25);text-decoration:none;color:var(--text);}
.btn.primary{background:linear-gradient(90deg,var(--accent),#55b2aa);border:0;color:#04221F;font-weight:700}
.btn.ghost{background:transparent}
.row{display:flex;gap:10px}
.select{padding:10px;border-radius:8px;background:#0b1c1c;border:1px solid rgba(255,255,255,.15);color:var(--text)}

.legal{font-size:11px;color:var(--muted);margin-top:8px}
.legal .muted{opacity:.7;margin-top:6px}

.content{margin-left:300px;position:relative;padding:32px;overflow-x:hidden}
.hero{min-height:50vh;display:flex;flex-direction:column;justify-content:center;gap:16px}
.hero h1{font-size:40px;line-height:1.1;margin:0;max-width:900px}
.hero h1 .mini{font-weight:800;margin-right:.35em;opacity:.9}
.hero .lead{max-width:880px;color:#E5F0EF;opacity:.95}
.cta{display:flex;gap:12px;margin-top:8px}

section{padding:48px 0;border-top:1px dashed rgba(255,255,255,.15)}
h2{margin:0 0 16px 0;font-size:28px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid.small{grid-template-columns:repeat(3,1fr)}
.card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:16px}
.bullets{padding-left:18px}
.bullets li{margin:8px 0}

.bullets.cols{columns:2}

.bg-slider{
  position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.35;mix-blend-mode:screen;
  background-repeat:no-repeat;background-position:center;background-size:cover;
  transition: background-image 800ms linear;
}
/* Ensure content over bg */
main, .sidebar{position:relative;z-index:2}

@media (max-width: 980px){
  .sidebar{position:static;width:auto;border-right:0}
  .content{margin-left:0}
  .grid{grid-template-columns:1fr}
  .bullets.cols{columns:1}
}