:root {
  --bg: #0f172a;
  --card: #0b1220;
  --muted: #94a3b8;
  --accent: #60a5fa;
  --accent-2: #7c3aed;
  --text: #e6eef8;
  --max-width: 980px;
}

* { box-sizing: border-box; }
html,body { height:100%; }
body {
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background: linear-gradient(180deg, var(--bg) 0%, #071029 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:2rem 1rem;
  display:flex;
  justify-content:center;
}

.container {
  width:100%;
  max-width:var(--max-width);
}

header.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1.25rem;
}

.brand {
  display:flex;
  gap:0.75rem;
  align-items:center;
}
.logo {
  width:56px;
  height:56px;
  border-radius:8px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  color:rgba(255,255,255,0.95);
  box-shadow:0 6px 18px rgba(12,20,40,0.6);
}

h1 { margin:0; font-size:1.25rem; }
p.lead { color:var(--muted); margin-top:0.5rem; }

.grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:1rem;
  margin-top:1rem;
}

.card {
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.04);
  padding:0.9rem;
  border-radius:10px;
  display:flex;
  gap:0.8rem;
  align-items:center;
  transition:transform .18s ease, box-shadow .18s ease;
}
.card:hover { transform:translateY(-6px); box-shadow:0 12px 30px rgba(2,6,23,0.6); }

.thumb { width:160px; height:100px; object-fit:cover; border-radius:6px; border:1px solid rgba(255,255,255,0.03); }
.meta strong { display:block; font-size:1rem; }
.meta small { color:var(--muted); display:block; margin-top:0.35rem; }

.actions { margin-top:1rem; }
.link { color:var(--accent); text-decoration:none; font-weight:600; }

/* teams page specifics */
.team-item { background:var(--card); padding:1rem; border-radius:10px; border:1px solid rgba(255,255,255,0.03); }
.team-item h2 { margin:0 0 0.5rem 0; font-size:1.05rem; }
.team-item p { margin:0 0 0.75rem 0; color:var(--muted); }
.team-item img { border-radius:8px; max-width:100%; height:auto; display:block; }

footer { text-align:center; margin-top:1.25rem; color:var(--muted); font-size:0.9rem; }

@media (max-width:520px) {
  .logo { width:44px; height:44px; }
  .thumb { width:120px; height:80px; }
}