/* Source-backed context within the existing chapters, without extra top-level sections. */
.roasting-description { margin-top: 20px; color: var(--secondary-foreground); font-size: 15px; }
.roasting-process { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 0; margin: 32px 0 0; }
.roasting-process::before, .roasting-process::after { content: ""; position: absolute; z-index: -1; top: 32px; left: 16.67%; right: 16.67%; height: 2px; background: var(--border); }
.roasting-process::after { background: var(--brand-primary); transform: scaleX(0); transform-origin: left; }
.roasting-process li { min-width: 0; text-align: center; }
.roasting-icon { display: grid; place-items: center; width: 64px; height: 64px; margin-inline: auto; border-radius: var(--mobile-radius-surface); background: var(--brand-primary-surface); color: var(--brand-primary); }
.roasting-icon svg { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.roasting-step { display: block; font-size: 11px; color: var(--secondary-foreground); margin-top: 16px; }
.roasting-process strong { display: block; font-size: 14px; margin-top: 4px; }
.roasting-process.is-roasting::after { animation: roasting-route calc(var(--motion-reveal) * 3) var(--motion-ease) both; }
.roasting-process.is-roasting .roasting-icon { animation: roasting-beat var(--motion-reveal) var(--motion-ease) both; }
.roasting-process.is-roasting li:nth-child(2) .roasting-icon { animation-delay: var(--motion-reveal); }
.roasting-process.is-roasting li:nth-child(3) .roasting-icon { animation-delay: calc(var(--motion-reveal) * 2); }
.local-benefits { margin: 32px 0 0; padding: 0; }
.local-benefits > div { display: grid; grid-template-columns: 88px 1fr; gap: 16px; padding-block: 16px; border-top: 1px solid var(--border); font-size: 15px; }
.local-benefits dt { color: var(--brand-primary); font-weight: 700; }
.local-benefits dd { margin: 0; color: var(--secondary-foreground); }
.feature-section .merchant-copy .merchant-conditions { font-size: 12px; color: var(--muted-foreground); margin-top: 16px; }
.partnership-invitation { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 56px; padding-top: 32px; border-top: 1px solid color-mix(in srgb, var(--brand-on-primary) 30%, transparent); }
.partnership-invitation h3 { font-size: 26px; }
.partnership-invitation p:not(.participation-label) { font-size: 15px; margin-top: 12px; }
.partnership-invitation .text-link { flex-shrink: 0; color: var(--brand-accent); }
@keyframes roasting-route { to { transform: scaleX(1); } }
@keyframes roasting-beat { 0% { transform: translateY(0); } 45% { transform: translateY(-6px); background: var(--brand-accent); } 100% { transform: translateY(0); } }
@media (max-width: 749px) {
  .partnership-invitation { flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 40px; }
  .local-benefits > div { grid-template-columns: 80px 1fr; gap: 12px; font-size: 14px; }
}
@media (max-width: 379px) {
  .roasting-process { gap: 8px; }
  .roasting-process strong { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .roasting-process.is-roasting::after, .roasting-process.is-roasting .roasting-icon { animation: none; }
  .roasting-process::after { transform: scaleX(1); }
}