:root{--purple:#241773;--gold:#9E7C0C;--bg:#f4f6fb;}
html,body{height:100%;}
body{margin:0;font-family:'Inter',system-ui;background:var(--bg);display:flex;flex-direction:column;}
main.pageWrap{flex:1;}

.siteHeader{background:linear-gradient(90deg,#241773,#2e1f8f);color:#fff;}
.headerInner{max-width:1200px;margin:auto;padding:14px 18px;display:flex;justify-content:space-between;align-items:center;}
.logoTextSmall{font-weight:800;}
.mainNav a{color:#fff;text-decoration:none;margin-left:22px;font-weight:600;}
.hamburger{display:none;background:none;border:none;color:#fff;font-size:26px;}
@media(max-width:768px){
  .hamburger{display:block}
  .mainNav{position:absolute;top:60px;right:0;background:#241773;flex-direction:column;width:220px;padding:14px;display:none}
  .mainNav.open{display:flex}
  .mainNav a{margin:10px 0}
}

.pageWrap{max-width:1100px;margin:0 auto;padding:28px 20px;}
.hero{background:#fff;padding:40px;border-radius:20px;text-align:center;}
.helpBar{margin:20px 0;padding:16px;border-left:4px solid var(--gold);background:#faf7e8;border-radius:10px;}

.cardGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.resourceCard{background:#fff;border-radius:18px;padding:18px;box-shadow:0 18px 40px rgba(0,0,0,.08);display:flex;flex-direction:column;justify-content:space-between;}
.rcTitle{font-weight:800;margin-bottom:6px;}
.rcAddr{font-size:14px;color:#555;margin-bottom:6px;}
.rcPhone a{font-weight:600;text-decoration:none;color:#241773;}
.cardActions{display:flex;gap:10px;margin-top:auto;}
.btnPrimary{background:var(--gold);color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none;border:none;}
.btnSecondary{background:#e5e7eb;padding:10px 14px;border-radius:10px;border:none;}

/* colorful category buttons */
.tileGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media(max-width:1000px){.tileGrid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:700px){.tileGrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:420px){.tileGrid{grid-template-columns:1fr;}}

.catTile{border-radius:22px;padding:28px 18px;text-align:center;text-decoration:none;color:#fff;box-shadow:0 18px 40px rgba(0,0,0,.12);transition:.15s;}
.catTile:hover{transform:translateY(-4px)}
.tileIcon{font-size:34px;margin-bottom:8px}
.tileLabel{font-weight:800}

.tile-shelter{background:linear-gradient(135deg,#6d28d9,#4c1d95)}
.tile-food{background:linear-gradient(135deg,#ea580c,#c2410c)}
.tile-health{background:linear-gradient(135deg,#dc2626,#991b1b)}
.tile-transit{background:linear-gradient(135deg,#2563eb,#1e3a8a)}
.tile-veterans{background:linear-gradient(135deg,#047857,#064e3b)}
.tile-jobs{background:linear-gradient(135deg,#ca8a04,#854d0e)}
.tile-legal{background:linear-gradient(135deg,#4b5563,#1f2933)}
.tile-dental{background:linear-gradient(135deg,#0ea5e9,#075985)}
.tile-std{background:linear-gradient(135deg,#db2777,#831843)}
.tile-needle{background:linear-gradient(135deg,#9333ea,#581c87)}
.tile-sharps{background:linear-gradient(135deg,#6b7280,#374151)}
.tile-default{background:linear-gradient(135deg,#334155,#0f172a)}

.contactForm.vertical{display:flex;flex-direction:column;gap:10px;max-width:520px;margin:0 auto;}
.req{color:#dc2626;font-weight:700;}

.siteFooter{background:#111827;color:#d1d5db;padding:20px;text-align:center;margin-top:auto;}