:root{
  --brand:#d61b5f; /* magenta/pinkish to match the provided logo */
  --bg:#ffffff;
  --muted:#666;
  --card:#fafafa;
  --radius:10px;
  --max-width:980px;
  --accent:#112;
  font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:linear-gradient(180deg,#fff 0%, #f7f6fb 100%);
  color:var(--accent);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:24px;
}

.site-header{
  text-align:center;
  max-width:var(--max-width);
  width:100%;
  background:var(--card);
  border-radius:var(--radius);
  padding:20px;
  box-shadow:0 6px 18px rgba(17,17,17,0.06);
  margin-bottom:20px;
}

.logo{max-height:72px; width:auto; display:block; margin:0 auto 12px}
h1{margin:6px 0 0; font-size:28px; color:var(--brand)}
.tagline{margin:6px 0 0; color:var(--muted)}

.content{
  max-width:var(--max-width);
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
}

.intro{
  background:white;
  border-radius:8px;
  padding:18px;
  box-shadow:0 4px 12px rgba(17,17,17,0.04);
}

.quick-links{background:white;border-radius:8px;padding:18px}
.quick-links ul{padding-left:18px}
.quick-links a{color:var(--brand); text-decoration:none}

.site-footer{
  margin-top:24px;
  color:var(--muted);
  text-align:center;
  font-size:13px;
}
.small{font-size:12px; margin-top:6px}
@media(min-width:720px){
  .content{grid-template-columns:2fr 1fr}
}
