/* The labgroup.app page: same LAB Group brand as web/style.css (navy, blue, gold; General Sans). */
@font-face {
  font-family: "General Sans";
  src: url("/fonts/GeneralSans-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "General Sans";
  src: url("/fonts/GeneralSans-Medium.woff2") format("woff2");
  font-weight: 500 600;
  font-display: swap;
}

:root {
  --navy: #002b40;
  --blue-dark: #00506e;
  --gold: #f1b828;
  --muted: #5b6770;
  --line: #e1e4e5;
  --page: #f4f8fc;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--page);
  color: var(--navy);
  font-family: "General Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

.topbar { background: var(--navy); }
.topbar-inner { max-width: 880px; margin: 0 auto; padding: 14px 20px; }
.logo { height: 34px; width: auto; display: block; }

main { max-width: 880px; margin: 0 auto; padding: 32px 16px; }

.card {
  background: #fff;
  border: 1px solid var(--line);
  border-top: 4px solid var(--gold);
  border-radius: 8px;
  padding: 32px;
}
@media (max-width: 480px) {
  .card { padding: 20px 16px; }
}

h1 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 500; margin: 0 0 1rem; }
p { margin: 0 0 1.25rem; }

.links { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.links a { color: var(--blue-dark); font-weight: 500; }
.links a:hover { color: var(--navy); }

footer { max-width: 880px; margin: 0 auto; padding: 0 20px 40px; color: var(--muted); font-size: 0.875rem; }