:root{
  /* Black & Gold (Cuyahoga Falls vibe) */
  --bg:#0b0b0b;           /* page background (near-black) */
  --panel:#ffffff;        /* cards/panels */
  --text:#111;            /* primary text */
  --muted:#5a5a5a;        /* muted text */
  --brand:#d4af37;        /* gold */
  --brand-ink:#1a1a1a;    /* dark for contrast */
  --link:#0a58ca;         /* links */
  --border:#eaeaea;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font:16px/1.6 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text);
  background:#fafafa;
}

.container{max-width:1000px;margin:0 auto;padding:1.25rem}

a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}

/* Header / nav */
.site-header{
  background:var(--brand-ink);
  color:#fff;
  position:sticky;top:0;z-index:10;
  box-shadow:0 2px 12px rgba(0,0,0,.15);
}
.nav{display:flex;align-items:center;gap:1rem;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.65rem;color:#fff;text-decoration:none}
.brand-mark{
  display:inline-grid;place-items:center;
  width:36px;height:36px;border-radius:10px;
  background:var(--brand);color:#111;font-weight:800
}
.brand-text{font-weight:700;letter-spacing:.2px}
.site-header nav a{color:#ddd;margin-left:1rem}
.site-header nav a:hover{color:#fff}

/* Hero */
.hero{
  background:linear-gradient(135deg, #111 0%, #222 60%, #2a2a2a 100%);
  color:#fff;padding:3.5rem 0;border-bottom:3px solid var(--brand);
}
.hero h1{font-size:2.2rem;margin:0 0 .4rem;font-weight:800}
.hero p{margin:0 0 1rem;color:#e9e9e9}
.btn{
  display:inline-block;padding:.7rem 1rem;border-radius:.6rem;
  background:var(--brand);color:#111;font-weight:700;border:1px solid rgba(0,0,0,.08)
}
.btn:hover{filter:brightness(1.05);text-decoration:none}

/* Page content */
.page-content{padding:2rem 1.25rem}
h1,h2,h3{line-height:1.25;color:#111;margin-top:1.2em}
h1{font-size:2rem}
h2{font-size:1.4rem}
p,li{color:#333}

/* Cards / lists */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.card{
  background:var(--panel);border:1px solid var(--border);border-radius:14px;
  padding:1rem;box-shadow:0 2px 10px rgba(0,0,0,.04)
}
.card h3{margin:.2rem 0 .35rem}
.card .meta{color:var(--muted);font-size:.92rem}

/* Senior page specifics (works with your existing senior layout) */
.avatar{border:3px solid var(--brand)}
.links a{border-color:var(--border)}
.links a:hover{border-color:var(--brand)}
.site-footer{border-top:1px solid var(--border);padding:1.5rem 0;color:var(--muted);background:#fff}