/* Housing — page-level styles (shared chrome lives in /css/style.css) */
.page-hero { background-image: url('/images/managed/page-housing-bg.jpg'); }
#content .section-banner { border-radius: var(--radius-md); margin-bottom: 1.5rem; }
.hg-about { margin-bottom: 3rem; padding: 2rem 2.25rem; background: var(--surface-alt); border: 1px solid var(--border); border-left: 4px solid var(--primary); border-radius: var(--radius-md); }
.hg-about-title { margin-top: 1.5rem; margin-bottom: 0.75rem; color: var(--primary-light); }
.hg-about-note { margin: 0 0 1.5rem; padding: 0.875rem 1.125rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--fg-soft); }
.hg-soft { font-size: 0.938rem; color: var(--fg-soft); }
.hg-apply { margin-bottom: 3rem; padding: 2.5rem; background: var(--surface-alt); border-radius: var(--radius-md); border: 1px solid var(--border); }
.hg-apply-callout { margin-bottom: 1.5rem; margin-top: .5rem; }
.hg-steps-title { margin-top: 1rem; margin-bottom: 0.75rem; }
.hg-steps-list { padding-left: 1.25rem; font-size: 0.938rem; color: var(--fg-soft); line-height: 2.4; }
.hg-eq-box { margin-top: 1.5rem; padding: 1.25rem; background: var(--surface); border-radius: var(--radius-sm); border: 1px solid var(--border); }
.hg-pref { margin-bottom: 3rem; }
.hg-pref-title { margin-bottom: 1.5rem; }
.hg-pref-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; margin-top: 1.5rem; }
.hg-pref-grid-2 { margin-top: 1.25rem; }
.hg-pref-text { font-size: 0.938rem; color: var(--fg-soft); line-height: 1.6; }
.hg-pref-note { font-size: 0.875rem; color: var(--fg-soft); margin-top: 1.25rem; font-style: italic; }
.hg-contact-block { padding-bottom: clamp(2.5rem, 6vw, 5rem); }
.hg-contact { padding: 2.5rem; background: color-mix(in srgb, var(--primary) 4%, var(--surface)); border-radius: var(--radius-md); border: 1px solid color-mix(in srgb, var(--primary) 12%, var(--border)); }
.hg-contact-title { color: var(--primary-light); }
.hg-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(20ch, 1fr)); gap: 1.5rem; margin-top: 1.25rem; }
.hg-contact-email { font-size: 0.875rem; }

/* Responsive: Preference Points grid */
@media (max-width: 900px) {
  .hg-pref-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .hg-pref-grid { grid-template-columns: 1fr; gap: 1rem; }
}