/* NursingRidge — layout primitives */

:root { --nr-gutter: clamp(20px, 5vw, 64px); --nr-max: 1160px; }

.nr-wrap { max-width: var(--nr-max); margin: 0 auto; padding: 0 var(--nr-gutter); }
.nr-wrap--narrow { max-width: 820px; }
.nr-wrap--wide { max-width: 1360px; }

.nr-sec { padding: clamp(56px, 7.5vw, 112px) 0; }
.nr-sec--tight { padding: clamp(36px, 4.5vw, 64px) 0; }

/* Section grounds. Every band paints its own background AND text colour —
   nothing inherits from body, so a page renders correctly even if a
   container above it forces a different canvas. */
.nr-sec--paper { background: var(--nr-paper); color: var(--nr-ink); }
.nr-sec--white { background: var(--nr-white); color: var(--nr-ink); }
.nr-sec--navy  { background: var(--nr-navy-900); color: var(--nr-on-navy); }
.nr-sec--deep  { background: var(--nr-navy-800); color: var(--nr-on-navy); }

.nr-sec--navy h1, .nr-sec--navy h2, .nr-sec--navy h3,
.nr-sec--deep h1, .nr-sec--deep h2, .nr-sec--deep h3 { color: var(--nr-on-navy); }
.nr-sec--navy a, .nr-sec--deep a { color: var(--nr-on-navy); }
.nr-sec--navy a:hover, .nr-sec--deep a:hover { color: var(--nr-teal-500); }

/* Page shell */
.nr-page { display: flex; flex-direction: column; min-height: 100vh; }
.nr-main { flex: 1 0 auto; }

.nr-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28px, 4vw, 56px);
}
.nr-layout--sidebar-first  { grid-template-columns: 300px 1fr; }
.nr-layout--sidebar-second { grid-template-columns: 1fr 300px; }
.nr-layout--both           { grid-template-columns: 260px 1fr 260px; }
@media (max-width: 1000px) {
  .nr-layout--sidebar-first,
  .nr-layout--sidebar-second,
  .nr-layout--both { grid-template-columns: 1fr; }
}

/* Generic grids used across module pages */
.nr-grid { display: grid; gap: 16px; }
.nr-grid--2 { grid-template-columns: repeat(2, 1fr); }
.nr-grid--3 { grid-template-columns: repeat(3, 1fr); }
.nr-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .nr-grid--3, .nr-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .nr-grid--2, .nr-grid--3, .nr-grid--4 { grid-template-columns: 1fr; } }

.nr-stack > * + * { margin-top: 1rem; }
.nr-center { text-align: center; }
.nr-center .nr-lede { margin-left: auto; margin-right: auto; }