Quality pass 2: sticky header breathing room, a11y labels, semantic tokens

Visual fixes:
- Sticky headers: add pt: 2 so scrolling content doesn't bleed
  flush against the heading (ProvidersStep, VenueStep)

Accessibility:
- ProvidersStep: add role="list" to provider list container
  (aria-label needs a semantic role to be announced)
- VenueStep: add aria-label to search TextField (placeholder
  alone is not a reliable label for screen readers)

Token consistency:
- Map placeholders: var(--fa-color-sage-50) → var(--fa-color-surface-cool)
  (use semantic token, not primitive) in ProvidersStep, VenueStep
- ArrangementDialog: var(--fa-color-brand-50) → var(--fa-color-surface-warm)
  for package summary background
- ArrangementDialog: replace Box component="a" with Link atom
  for terms and conditions (consistent focus/hover styling)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/components/organisms/ArrangementDialog/ArrangementDialog.tsx

@@ -19,6 +19,7 @@ import { ProviderCardCompact } from '../../molecules/ProviderCardCompact';
 import { Collapse } from '../../atoms/Collapse';
 import { Typography } from '../../atoms/Typography';
 import { Button } from '../../atoms/Button';
+import { Link } from '../../atoms/Link';
 import { Divider } from '../../atoms/Divider';
 
 // ─── Types ───────────────────────────────────────────────────────────────────
@@ -265,7 +266,7 @@ export const ArrangementDialog = React.forwardRef<HTMLDivElement, ArrangementDia
               {/* Package summary */}
               <Box
                 sx={{
-                  bgcolor: 'var(--fa-color-brand-50)',
+                  bgcolor: 'var(--fa-color-surface-warm)',
                   borderRadius: 2,
                   p: 2.5,
                   mb: 3,
@@ -534,17 +535,9 @@ export const ArrangementDialog = React.forwardRef<HTMLDivElement, ArrangementDia
               {/* Terms */}
               <Typography variant="caption" color="text.secondary" sx={{ display: 'block', mb: 3 }}>
                 By continuing, you agree to the{' '}
-                <Box
-                  component="a"
-                  href="#"
-                  sx={{
-                    color: 'var(--fa-color-text-brand)',
-                    textDecoration: 'underline',
-                    fontSize: 'inherit',
-                  }}
-                >
+                <Link href="#" sx={{ fontSize: 'inherit' }}>
                   terms and conditions
-                </Box>
+                </Link>
                 .
               </Typography>