/* Daylight theme — bands. Split from daylight.css (see docs/adr/0002). */

/* ---------- Section bands ---------- */
.sec {
  padding-block: var(--section-y);
  background: var(--surface);
  color: var(--tx);
}

/* White band — the only variant most pages need */
.sec--white {
  --surface: var(--c-vit);
  --line: var(--c-line);
}

/* Spruce band — used sparingly (one block per page at most) */
.sec--gran {
  --surface: var(--c-fill);
  --tx: var(--text-on-gran);
  --tx-muted: var(--text-on-gran-muted);
  --line: var(--line-on-gran);
}

.sec--gran .over { color: var(--text-on-gran); }

/* Prose links on the gold band — ink on gold, the underline carries the link */
.sec--gran :is(p, li, dd) a:not(.btn) {
  color: var(--text-on-gran);
}

.sec--gran :is(p, li, dd) a:not(.btn):hover {
  color: var(--text-on-gran);
}

.sec-head {
  max-width: 720px;
  margin-bottom: clamp(28px, 4vw, 44px);
}

.sec-head h2 {
  color: var(--tx);
}

.sec-head p {
  margin-top: 12px;
  color: var(--tx-muted);
}