Batch 4: Click-to-navigate providers (D-D), simplify coffin details (D-G)

ProvidersStep (D-D):
- Remove selection state (selectedProviderId) and Continue button
- Clicking a provider card triggers navigation directly
- Remove radiogroup pattern, error, loading props
- Cards are now simple interactive links, not radio buttons
- Stories updated: removed WithSelection, WithError, Loading

CoffinDetailsStep (D-G):
- Remove all customisation (handles, lining, nameplate)
- Remove OptionSection helper, ProductOption/CoffinDetailsStepValues types
- Simplified to coffin profile (image, specs, price) + Continue CTA
- Changed from detail-toggles split to centered-form layout
- Customisation noted as future enhancement
- Updated index.ts re-exports to match simplified API
- Stories simplified: Default, PrePlanning, MinimalInfo, Loading

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

src/components/pages/ProvidersStep/ProvidersStep.tsx

@@ -7,7 +7,6 @@ import { SearchBar } from '../../molecules/SearchBar';
 import { FilterPanel } from '../../molecules/FilterPanel';
 import { Chip } from '../../atoms/Chip';
 import { Typography } from '../../atoms/Typography';
-import { Button } from '../../atoms/Button';
 
 // ─── Types ───────────────────────────────────────────────────────────────────
 
@@ -49,9 +48,7 @@ export interface ProviderFilter {
 export interface ProvidersStepProps {
   /** List of providers to display */
   providers: ProviderData[];
-  /** Currently selected provider ID */
-  selectedProviderId: string | null;
-  /** Callback when a provider is selected */
+  /** Callback when a provider card is clicked — triggers navigation (D-D) */
   onSelectProvider: (id: string) => void;
   /** Search query value */
   searchQuery: string;
@@ -65,14 +62,8 @@ export interface ProvidersStepProps {
   onFilterToggle?: (index: number) => void;
   /** Callback to clear all filters */
   onFilterClear?: () => void;
-  /** Callback for the Continue button */
-  onContinue: () => void;
   /** Callback for the Back button */
   onBack: () => void;
-  /** Validation error message */
-  error?: string;
-  /** Whether the Continue action is loading */
-  loading?: boolean;
   /** Map panel content — slot for future map integration */
   mapPanel?: React.ReactNode;
   /** Navigation bar — passed through to WizardLayout */
@@ -89,11 +80,11 @@ export interface ProvidersStepProps {
  * Step 2 — Provider selection page for the FA arrangement wizard.
  *
  * List + Map split layout. Left panel shows a scrollable list of
- * provider cards with search and filter chips. Right panel is a
+ * provider cards with search and filter button. Right panel is a
  * slot for future map integration.
  *
- * Uses radiogroup pattern for card selection — arrow keys navigate
- * between cards, Space/Enter selects.
+ * Click-to-navigate (D-D): clicking a provider card triggers
+ * navigation directly — no selection state or Continue button.
  *
  * Pure presentation component — props in, callbacks out.
  *
@@ -101,7 +92,6 @@ export interface ProvidersStepProps {
  */
 export const ProvidersStep: React.FC<ProvidersStepProps> = ({
   providers,
-  selectedProviderId,
   onSelectProvider,
   searchQuery,
   onSearchChange,
@@ -109,10 +99,7 @@ export const ProvidersStep: React.FC<ProvidersStepProps> = ({
   filters,
   onFilterToggle,
   onFilterClear,
-  onContinue,
   onBack,
-  error,
-  loading = false,
   mapPanel,
   navigation,
   isPrePlanning = false,
@@ -212,22 +199,10 @@ export const ProvidersStep: React.FC<ProvidersStepProps> = ({
         </Typography>
       </Box>
 
-      {/* Error message */}
-      {error && (
-        <Typography
-          variant="body2"
-          sx={{ mb: 2, color: 'var(--fa-color-text-brand)' }}
-          role="alert"
-        >
-          {error}
-        </Typography>
-      )}
-
-      {/* Provider list — radiogroup pattern */}
+      {/* Provider list — click-to-navigate (D-D) */}
       <Box
-        role="radiogroup"
         aria-label="Funeral providers"
-        sx={{ display: 'flex', flexDirection: 'column', gap: 2, mb: 3 }}
+        sx={{ display: 'flex', flexDirection: 'column', gap: 2, pb: 3 }}
       >
         {providers.map((provider) => (
           <ProviderCard
@@ -240,21 +215,13 @@ export const ProvidersStep: React.FC<ProvidersStepProps> = ({
             rating={provider.rating}
             reviewCount={provider.reviewCount}
             startingPrice={provider.startingPrice}
-            selected={selectedProviderId === provider.id}
             onClick={() => onSelectProvider(provider.id)}
-            role="radio"
-            aria-checked={selectedProviderId === provider.id}
             aria-label={`${provider.name}, ${provider.location}${provider.rating ? `, rated ${provider.rating}` : ''}${provider.startingPrice ? `, from $${provider.startingPrice}` : ''}`}
           />
         ))}
 
         {providers.length === 0 && (
-          <Box
-            sx={{
-              py: 6,
-              textAlign: 'center',
-            }}
-          >
+          <Box sx={{ py: 6, textAlign: 'center' }}>
             <Typography variant="body1" color="text.secondary" sx={{ mb: 1 }}>
               No providers found matching your search.
             </Typography>
@@ -264,19 +231,6 @@ export const ProvidersStep: React.FC<ProvidersStepProps> = ({
           </Box>
         )}
       </Box>
-
-      {/* Continue button */}
-      <Box sx={{ display: 'flex', justifyContent: 'flex-end', pb: 2 }}>
-        <Button
-          variant="contained"
-          size="large"
-          onClick={onContinue}
-          disabled={!selectedProviderId}
-          loading={loading}
-        >
-          Continue
-        </Button>
-      </Box>
     </WizardLayout>
   );
 };