/* ════════════════ DAYBREAK — the porcelain chapter ════════════════ */
.porcelain {
  --dawn: clamp(220px, 26vw, 380px);
  position: relative; color: var(--p-ink);
  padding-top: calc(var(--dawn) + 40px); padding-bottom: calc(var(--dawn) + 40px);
  background: linear-gradient(180deg,
    rgba(248,247,244,0) 0,
    rgba(135,189,159,.14) calc(var(--dawn) * .3),
    rgba(254,228,193,.36) calc(var(--dawn) * .62),
    rgba(248,247,244,.92) calc(var(--dawn) * .9),
    var(--porcelain) var(--dawn),
    var(--porcelain) calc(100% - var(--dawn)),
    rgba(248,247,244,.9) calc(100% - var(--dawn) * .88),
    rgba(135,189,159,.32) calc(100% - var(--dawn) * .5),
    rgba(31,92,64,.2) calc(100% - var(--dawn) * .25),
    rgba(248,247,244,0) 100%);
}
.porcelain .eyebrow { color: var(--p-forest); }
.porcelain .h2 em { color: var(--p-forest); }
.porcelain .lede { color: var(--p-2); }
.sun { position: absolute; left: 50%; top: calc(var(--dawn) - 22%); width: min(900px, 90vw); aspect-ratio: 1; translate: -50% 0; border-radius: 50%; background: radial-gradient(closest-side, rgba(254,228,193,.75), rgba(243,188,124,.18) 45%, rgba(248,247,244,0) 72%); pointer-events: none; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 72px; border-top: 1px solid var(--p-edge); }
.stat { padding: 36px 24px 8px 0; border-right: 1px solid var(--p-edge); }
.stat + .stat { padding-left: 24px; }
.stat:last-child { border-right: 0; }
.stat .n { font-family: var(--serif); font-size: clamp(64px, 7.6vw, 112px); line-height: .9; letter-spacing: -.02em; color: var(--p-ink); }
.stat .n.g { color: var(--p-forest); }
.stat .n.a { color: var(--p-amber); font-style: italic; }
.stat p { margin-top: 18px; font-size: 15px; color: var(--p-2); line-height: 1.55; max-width: 26ch; }

@media (max-width: 960px) {
  .stats { grid-template-columns: 1fr 1fr; }
  .stat:nth-child(2) { border-right: 0; }
  .stat:nth-child(3) { padding-left: 0; }
  .stat:nth-child(n+3) { border-top: 1px solid var(--p-edge); }
}
@media (max-width: 560px) {
  .stats { grid-template-columns: 1fr; }
  .stat, .stat + .stat { padding: 28px 0 8px; border-right: 0; border-top: 1px solid var(--p-edge); }
}