body.easterncape {
  margin: 0;
  background: #f6fbff;
  color: #1f2b3a;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.6;
}
body.easterncape.roodepan-page { min-height: 100vh; display: flex; flex-direction: column; }
body.easterncape.roodepan-page main { flex: 1; }
body.easterncape .hero { background: linear-gradient(135deg, #0f4c81 0%, #1f7bc8 50%, #42a5f5 100%); color: #fff; text-align: center; padding: 2.4rem 1rem 1.3rem; }
body.easterncape .hero h1 { margin: 0; font-size: 1.9rem; }
body.easterncape .hero-subtitle { margin: 0.35rem 0 0.9rem; opacity: 0.95; }
body.easterncape .province-content { max-width: 980px; margin: 1.3rem auto 0; padding: 0 1rem; }
body.easterncape .province-content h2 { color: #0f4c81; margin: 0 0 0.8rem; }
body.easterncape .province-content ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
body.easterncape .province-content a { display: block; background: #fff; border: 1px solid #bfdbff; color: #0f4c81; font-weight: 600; text-decoration: none; border-radius: 12px; padding: 0.85rem 1rem; transition: all 0.2s ease; }
body.easterncape .province-content a:hover, body.easterncape .province-content a:focus-visible { background: #0f4c81; color: #fff; transform: translateY(-2px); outline: none; }
body.easterncape footer { margin-top: 2rem; background: #0f2742; color: #e2efff; }
body.easterncape .footer-bottom { border-top: 1px solid rgba(226,239,255,0.25); text-align: center; padding: 0.8rem 1rem; }
@media (min-width: 768px) { body.easterncape .province-content ul { grid-template-columns: repeat(2, minmax(0,1fr)); } }