/* /donate: the heart's quiet page. Plain words on the temple black with the layer's slowly opening ring of petals behind them (the layer:
   assets/css/ds/chakra.css, aspect `bloom`). No boxes and no cards: a hairline opens each part, the three steps are a numbered run (they are a
   sequence), the six kinds of service a flowing list. Tokens only; the page wears Temple Dark in both themes (the wrapper carries .ds-theme-dark). */
.donate-world { --ck: var(--ck-heart); --donate-pad: max(var(--ds-gutter, 1rem), calc((100% - 72rem) / 2)); font-family: var(--ds-font-ui); color: var(--ds-text); min-inline-size: 0; clip-path: inset(0); }
.donate-world a { text-underline-offset: .25em; }
.donate-world :focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 3px; border-radius: var(--ds-radius-sm); }
.donate-world .ds-chakra-beat { box-sizing: border-box; padding-inline: var(--donate-pad); min-inline-size: 0; }
.donate-world .ds-chakra-beat > .donate-col { margin-inline: 0; max-inline-size: 36rem; }
.donate-world .ds-chakra-beat > .donate-col--wide { max-inline-size: 52rem; }
.donate-world .donate-rule > .donate-col { padding-block-start: var(--ds-space-8); border-block-start: 1px solid var(--ds-border); }
.donate-col { display: flex; flex-direction: column; gap: var(--ds-space-5); min-inline-size: 0; }

/* the opening: the one h1, one plain button, the promise that nothing is expected */
.donate-world .donate-open { display: flex; align-items: center; min-block-size: min(40rem, 82svh); padding-block: var(--ds-space-11) var(--ds-space-10); }
.donate-title, .donate-h { margin: 0; font-family: var(--ds-font-display); font-weight: 500; color: var(--ds-text); text-wrap: balance; letter-spacing: -.01em;
  text-shadow: 0 0 2.2rem color-mix(in srgb, var(--ck) 38%, transparent), 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.donate-title { font-size: var(--ds-text-4xl); line-height: 1; max-inline-size: 11em; }
.donate-h { font-size: var(--ds-text-3xl); line-height: 1.05; }
.donate-lede, .donate-sub, .donate-prose, .donate-world .story-next__note, .donate-world .story-trust { text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent), 0 0 .2rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.donate-lede { margin: 0; font-size: var(--ds-text-lg); line-height: var(--ds-leading-normal); color: var(--ds-text); text-wrap: pretty; }
.donate-sub { margin: 0; font-size: var(--ds-text-lg); line-height: var(--ds-leading-normal); color: var(--ds-text-muted); text-wrap: pretty; }
.donate-prose { max-inline-size: 60ch; font-size: var(--ds-text-md); line-height: 1.7; color: var(--ds-text); }
.donate-prose p { margin: 0 0 var(--ds-space-4); }
.donate-prose p:last-child { margin-block-end: 0; }
.donate-prose a { color: var(--ds-accent); }
.donate-actions { align-items: center; gap: var(--ds-space-3) var(--ds-space-5); }
.donate-world .donate-actions .story-next__note { max-inline-size: 30ch; }
.donate-world .story-trust__item::before { background: var(--ck-heart); box-shadow: 0 0 .6rem var(--ck-heart); }

/* how a gift works: three steps, a real sequence, marked by a quiet numeral in the heart's own light */
.donate-steps, .donate-services { list-style: none; margin: 0; padding: 0; }
.donate-steps { counter-reset: donate-step; display: grid; }
.donate-steps__item { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: var(--ds-space-4); padding-block: var(--ds-space-5); border-block-start: 1px solid var(--ds-border); }
.donate-steps__item:last-child { border-block-end: 1px solid var(--ds-border); }
.donate-steps__item::before { counter-increment: donate-step; content: counter(donate-step); grid-row: 1 / span 2; font-family: var(--ds-font-display); font-size: var(--ds-text-2xl); line-height: 1; color: var(--ck-text, var(--ds-accent)); font-variant-numeric: lining-nums tabular-nums; }
.donate-steps__title, .donate-services__title { margin: 0 0 var(--ds-space-2); font-family: var(--ds-font-display); font-weight: 500; font-size: var(--ds-text-xl); line-height: var(--ds-leading-tight); color: var(--ds-text); text-shadow: 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 85%, transparent); }
.donate-steps__item p, .donate-services__item p { margin: 0; color: var(--ds-text-muted); line-height: var(--ds-leading-normal); text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent); }
.donate-world .story-facts { margin-block-start: var(--ds-space-2); }
.donate-world .story-facts dd { text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent); }

/* six kinds of service: a flowing list, hairline above each, two columns when there is room */
.donate-services { display: grid; column-gap: var(--ds-space-9); }
.donate-services__item { padding-block: var(--ds-space-5); border-block-start: 1px solid var(--ds-border); min-inline-size: 0; }

.donate-world .story-next { gap: var(--ds-space-7); }
.donate-last { padding-block-end: clamp(var(--ds-space-10), 14vh, var(--ds-space-12)); }
.donate-world .ds-chakra-why { margin-block-start: var(--ds-space-8); }

@media (min-width: 48rem) {
  .donate-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .donate-world .story-next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .donate-world .donate-last > .donate-col { max-inline-size: 44rem; }
}
