#support{padding-top:64px;padding-bottom:64px;overflow:hidden}
#support .prose{margin-top:24px}
#support .prose p+p{margin-top:14px}
.support-ribbon{margin-top:30px;overflow-x:auto;scrollbar-width:thin;padding:16px 0}
#support .feature-chips{display:flex;flex-wrap:nowrap;justify-content:flex-start;width:max-content;max-width:none;gap:16px;margin:0;padding-right:16px}
#support .feature-chip{display:flex;align-items:center;gap:12px;flex:none;white-space:nowrap;padding:14px 20px;border:1px solid rgba(10,59,46,.12);border-radius:14px;background:var(--cream);color:var(--pine);font-size:.9rem;font-weight:500}
#support .feature-chip svg{width:28px;height:28px;flex:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:var(--teal)}
.support-ribbon.is-moving{overflow:hidden}
.support-ribbon.is-moving .feature-chips{animation:support-scroll 65s linear infinite}
.support-ribbon:hover .feature-chips,.support-ribbon:focus-within .feature-chips,.support-ribbon.is-offscreen .feature-chips{animation-play-state:paused}
.support-ribbon:focus-visible{outline:2px solid var(--teal);outline-offset:4px}
@keyframes support-scroll{to{transform:translateX(-50%)}}
@media(max-width:640px){#support{padding-top:44px;padding-bottom:44px}#support .feature-chip{padding:12px 16px}}
@media(prefers-reduced-motion:reduce){.support-ribbon.is-moving{overflow-x:auto}.support-ribbon.is-moving .feature-chips{animation:none}.support-ribbon [aria-hidden="true"].feature-chip{display:none}}

/* Soft sage adds depth between the page's ivory and pine surfaces. */
#support{background:#e5ede5}
#scope{background:var(--ivory)!important}
#scope .clarify{background:var(--cream)}
#scope .clarify h3{color:var(--pine)}
#faq{background:#e5ede5!important}
#feedback{background:var(--pine)!important;color:var(--ivory)}
#feedback .eyebrow,#feedback .email{color:var(--ivory)!important}
#feedback p{color:rgba(246,241,230,.85)!important}
