:root{
  --bg1:#071a33;        /* midnight blue */
  --bg2:#0b2a4f;        /* deeper blue */
  --accent:#7a1f1f;     /* FAIMA burgundy (ajustăm după hex-ul tău) */
  --accent2:#b03a2e;    /* burgundy mai deschis pt hover */
  --text:#f3f6ff;
  --muted:#c7d2ea;
  --line:rgba(255,255,255,.16);
  --card:rgba(255,255,255,.06);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  font-family:system-ui, Segoe UI, Roboto, Arial;
  color:var(--text);
  background:
    radial-gradient(900px 520px at 18% 12%, rgba(176,58,46,.22), transparent 55%),
    radial-gradient(820px 520px at 85% 18%, rgba(140,180,255,.16), transparent 60%),
    linear-gradient(180deg, var(--bg1), var(--bg2));
}

a{color:inherit;text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 18px}

/* TOP BAR */
.topbar{
  position:sticky; top:0; z-index:50;
  border-bottom:1px solid var(--line);
  background:rgba(7,26,51,.72);
  backdrop-filter:blur(10px);
}
.topbarInner{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; padding:12px 0;
}

.brand{display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.2px}
.brandLogo{
  width:34px; height:34px; object-fit:contain;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
}
.brandText{opacity:.95}

.nav{display:flex; gap:10px; flex-wrap:wrap; justify-content:center}
.navlink{
  padding:8px 12px; border-radius:12px;
  color:var(--muted);
  border:1px solid transparent;
  transition:background .15s ease, transform .15s ease, border-color .15s ease, color .15s ease;
}
.navlink:hover{
  background:rgba(176,58,46,.18);
  border-color:rgba(176,58,46,.35);
  color:var(--text);
  transform:translateY(-1px);
}
.navlink.active{
  background:rgba(122,31,31,.22);
  border:1px solid rgba(122,31,31,.45);
  color:var(--text);
}

/* SECTIONS */
.hero{padding:34px 0 18px; text-align:center}
.hero h1{margin:10px 0 8px; font-size:clamp(1.9rem,2vw + 1rem,3.2rem); line-height:1.05}
.hero p{margin:0 auto; max-width:75ch; color:var(--muted); line-height:1.6}

.section{
  margin:26px 0; padding:18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.04);
}

.btnGrid{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin:18px 0 6px}
@media (max-width: 980px){ .btnGrid{grid-template-columns:repeat(2,1fr)} }
@media (max-width: 520px){ .btnGrid{grid-template-columns:1fr} }

.btnCard{
  display:flex; align-items:center; justify-content:center;
  padding:14px 12px; border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  color:var(--text); font-weight:650;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.btnCard:hover{
  transform:translateY(-1px);
  background:rgba(176,58,46,.16);
  border-color:rgba(176,58,46,.35);
}

.footer{margin-top:40px;border-top:1px solid var(--line);padding:22px 0;color:var(--muted)}
.footerrow{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.muted{color:var(--muted)}