diff --git a/README.md b/README.md
index 1be0223..fc3af4b 100644
--- a/README.md
+++ b/README.md
@@ -113,7 +113,7 @@ lare-viewer/
 
 ## Configuring `workflow.json`
 
-The workflow and the processes requests are configurable from the JSON file at `src/config/workflow.json`.
+The workflow and process requests are configurable from the JSON file at `src/config/workflow.json`.
 
 ### Overall structure
 
@@ -129,7 +129,7 @@ The workflow and the processes requests are configurable from the JSON file at `
       "requiredSteps": [],
       "completionEvent": null,
       "components": [ /* UI configuration */ ],
-      "wps": { /* optional WPS configuration */ }
+      "process": { /* optional process configuration */ }
     }
   ]
 }
@@ -137,14 +137,14 @@ The workflow and the processes requests are configurable from the JSON file at `
 
 - **`logo`**: Path (relative to `public/`) to the logo shown at the top of the main navigation drawer.
 - **`steps`**: Ordered list of workflow steps. Each step:
-  - **`id`**: Unique identifier used internally (e.g. for dependencies and WPS results).
+  - **`id`**: Unique identifier used internally (e.g. for dependencies and process results).
   - **`title`**: Label shown in the main navigation drawer.
   - **`drawerTitle`**: Title shown at the top of the step drawer.
   - **`icon`**: Vuetify Material Design Icon name (e.g. `mdi-map-marker-radius`).
   - **`requiredSteps`** (optional): Array of step `id`s that must be completed before this step is enabled.
   - **`completionEvent`** (optional): How the step is marked complete. `null` (default) means completion is driven by child components; `"auto"` means the step completes as soon as its drawer opens.
   - **`components`**: List of UI components rendered inside the step drawer.
-  - **`wps`** (optional): Configuration for a WPS Execute call associated with this step (see below).
+  - **`process`** (optional): Configuration for an OGC API process execution associated with this step (see below).
 
 ### Components inside a step
 
@@ -185,7 +185,7 @@ Different components expect different props:
   - **`options`**: Array of `{ "id": "value", "name": "Label" }` entries.
   - **`selectionKey`** (optional): Name under which the selected value is stored in the app store (`app.selections[selectionKey]`). If omitted, the value is only passed via the `step-complete` payload.
 - **`NumberInput`**:
-  - Typical props include `label`, `suffix`, `min`, `max`, `step`, `defaultValue`, and `defaultValueSource` (see below under WPS input sources).
+  - Typical props include `label`, `suffix`, `min`, `max`, `step`, `defaultValue`, and `defaultValueSource` (see below under process input sources).
 
 ### Use case selection and `selectionKey`
 
@@ -218,7 +218,7 @@ With this configuration:
 
 - **`SelectionList`**:
   - Stores the chosen option under `app.selections.userCaseSelection` using `selectionKey`.
-  - Emits `step-complete` with a payload `{ "value": "<selected id>" }`, which can be used by WPS inputs via `source: "payload:value"`.
+  - Emits `step-complete` with a payload `{ "value": "<selected id>" }`, which can be used by process inputs via `source: "payload:value"`.
 
 You can then make a later step conditionally show layers depending on this value by combining `conditionSource` and per-layer `condition` values:
 
@@ -275,9 +275,9 @@ Steps can depend on the completion of earlier steps. For example:
 
 The `hazard` step becomes clickable only after the `regionSelection` step has been completed.
 
-### WPS configuration per step
+### Process configuration per step
 
-Each step can optionally define a `wps` object describing a WPS Execute call to run when the step is completed or when the user interacts with the map.
+Each step can optionally define a `process` object describing an OGC API process execution to run when the step is completed or when the user interacts with the map.
 
 Example from `workflow.json`:
 
@@ -309,12 +309,12 @@ Example from `workflow.json`:
       }
     }
   ],
-  "wps": {
-    "identifier": "lare_region",
+  "process": {
+    "identifier": "lare-hazard",
     "trigger": "mapClick",
     "inputs": [
       {
-        "id": "nutsname",
+        "id": "name",
         "type": "LiteralData",
         "source": "store:map.activeRegion.properties.nuts_name"
       }
@@ -324,54 +324,94 @@ Example from `workflow.json`:
 }
 ```
 
-The WPS configuration supports the following fields:
+The process configuration supports the following fields:
 
-- **`identifier`**: The WPS process identifier as exposed by the backend (e.g. `"lare_region"`, `"lare_hazard"`, `"lare_uom"`). This value is passed directly to the WPS `Execute` request.
-- **`trigger`**: When to execute the WPS call for this step:
+- **`identifier`**: The pygeoapi process identifier as exposed by the backend (e.g. `"lare-start"`, `"lare-hazard"`, `"lare-uom"`). This value is used to call `/processes/{identifier}/execution?f=json`.
+- **`trigger`**: When to execute the process call for this step:
+  - `"onStart"`: Execute during app startup (used by `initialSetup.process`).
+  - `"stepOpen"`: Execute when the step drawer is opened.
+  - `"component"`: Execute when a child component emits `run-process` (e.g. calculator button in `NumberInput`).
   - `"mapClick"`: Execute whenever the user selects a region on the map (using `mapStore.activeRegion`) while this step is open.
   - `"stepComplete"`: Execute when the step signals completion (for example when the user picks an option or enters a number and the component emits a `step-complete` event).
-- **`inputs`**: Array of WPS input definitions:
-  - `id`: Input identifier expected by the WPS process.
-  - `type`: WPS data type, typically `"LiteralData"` (default) or `"ComplexData"`.
+- **`inputs`**: Array of process input definitions:
+  - `id`: Input identifier expected by the backend process.
   - `source`: Where the value comes from, using the pattern `<sourceType>:<path>`.
-- **`storeResultAs`** (optional): Key under which the full WPS response is stored in the app store (`app.wpsResults[storeResultAs]`).
+- **`storeResultAs`** (optional): Key under which the full process response is stored in the app store (`app.processResults[storeResultAs]`).
 - **`outputActions`** (optional): Array of post-processing instructions for the response (see below).
 
-The WPS calls are sent to the base URL configured via the environment variable:
+### Template for a new process step
+
+Use this as a copy/paste starting point when adding a new step that calls an OGC API process:
+
+```json
+{
+  "id": "myStep",
+  "title": "My Step",
+  "drawerTitle": "Run process",
+  "requiredSteps": ["regionSelection"],
+  "requiresConfirmation": true,
+  "confirmationSource": "process",
+  "process": {
+    "identifier": "lare-my-process",
+    "trigger": "component",
+    "inputs": [
+      { "id": "sessionid", "source": "store:app.processResults.initialSetup.sessionid" },
+      { "id": "regionId", "source": "store:map.activeRegionId" },
+      { "id": "valueFromUi", "source": "payload:value" },
+      { "id": "constant", "source": "static:my-value" }
+    ],
+    "storeResultAs": "myStepResult",
+    "outputActions": [
+      { "action": "addLayer", "path": "response" }
+    ]
+  },
+  "components": [
+    {
+      "component": "NumberInput",
+      "componentProps": {
+        "label": "Input value",
+        "showCalcButton": true
+      }
+    }
+  ]
+}
+```
+
+The process execution requests are sent to the API root URL configured via the environment variable:
 
 ```env
-VITE_WPS_BASE_URL=https://your-wps-endpoint.example.com/wps
+VITE_OGC_API_URL=http://localhost:5000
 ```
 
-### WPS input `source` syntax
+### Process input `source` syntax
 
-The `source` field describes where to read the value for a given WPS input. Supported forms:
+The `source` field describes where to read the value for a given process input. Supported forms:
 
 - **`store:<storeName>.<path>`**:
   - Reads from a Pinia store by name, e.g. `"store:map.activeRegion.properties.nuts_name"`.
-  - `storeName` is the key used in the WPS context (`app` or `map`).
+  - `storeName` is the key used in the process context (`app` or `map`).
 - **`payload:<path>`**:
   - Reads from the payload passed by the component that completes the step.
   - Example: in the `hazard` step:
     ```json
-    { "id": "hazard", "type": "LiteralData", "source": "payload:value" }
+    { "id": "hazard", "source": "payload:value" }
     ```
-- **`wpsResult:<path>`**:
-  - Reads from previously stored WPS results (`app.wpsResults`), allowing chaining between steps.
+- **`processResult:<path>`**:
+  - Reads from previously stored process results (`app.processResults`), allowing chaining between steps.
   - Example: in the `uom` step:
     ```json
-    "defaultValueSource": "wpsResult:regionSelection.suggested_uom"
+    "defaultValueSource": "processResult:regionSelection.suggested_uom"
     ```
 - **`static:<value>`**:
   - Use a literal constant value.
 
-### Storing and reusing WPS results
+### Storing and reusing process results
 
-When `storeResultAs` is set, the full parsed WPS response is stored under:
+When `storeResultAs` is set, the full parsed process response is stored under:
 
-- `app.wpsResults[storeResultAs]`
+- `app.processResults[storeResultAs]`
 
-You can then reference this data in later steps via `source: "wpsResult:..."` or via component props like `defaultValueSource` (for `NumberInput`).
+You can then reference this data in later steps via `source: "processResult:..."` or via component props like `defaultValueSource` (for `NumberInput`).
 
 Example:
 
@@ -380,12 +420,14 @@ Example:
   "id": "uom",
   "title": "Calculate UOM",
   "requiredSteps": ["hazard"],
-  "wps": {
-    "identifier": "lare_uom",
+  "process": {
+    "identifier": "lare-uom",
     "trigger": "stepComplete",
     "inputs": [
-      { "id": "nutsname", "type": "LiteralData", "source": "store:map.activeRegion.properties.nuts_name" },
-      { "id": "uomsize", "type": "LiteralData", "source": "payload:value" }
+      { "id": "sessionid", "source": "store:app.processResults.initialSetup.sessionid" },
+      { "id": "uomsize", "source": "payload:value" },
+      { "id": "layername", "source": "store:app.selections.userCaseSelection.layerNameForProcess" },
+      { "id": "id", "source": "store:map.activeRegionId" }
     ],
     "storeResultAs": "uom"
   },
@@ -399,7 +441,7 @@ Example:
         "max": 50000000,
         "step": 100000,
         "defaultValue": 1000,
-        "defaultValueSource": "wpsResult:regionSelection.suggested_uom"
+        "defaultValueSource": "processResult:regionSelection.suggested_uom"
       }
     }
   ]
@@ -408,18 +450,18 @@ Example:
 
 ### Post-processing with `outputActions`
 
-For more advanced cases, you can define `outputActions` inside the `wps` block to automatically store parts of the response or to add dynamic layers to the map.
+For more advanced cases, you can define `outputActions` inside the `process` block to automatically store parts of the response or to add dynamic layers to the map.
 
 Supported actions:
 
-- **`storeValue`**: Store a (sub-)value into `app.wpsResults` under a nested key.
+- **`storeValue`**: Store a (sub-)value into `app.processResults` under a nested key.
 - **`addLayer`**: Add one or more dynamic layers to the map (via `mapStore.addDynamicLayer`).
 
 Example:
 
 ```json
 {
-  "wps": {
+  "process": {
     "identifier": "lare_example",
     "trigger": "stepComplete",
     "inputs": [ /* ... */ ],
@@ -431,7 +473,7 @@ Example:
       },
       {
         "action": "addLayer",
-        "path": "response.layers"
+        "path": "response"
       }
     ]
   }
@@ -439,11 +481,11 @@ Example:
 ```
 
 - **`path`**:
-  - Dot-notated path into the WPS response object.
+  - Dot-notated path into the process response object.
   - If omitted or set to `"response"`, the entire response is used.
   - If it starts with `"response."`, that prefix is ignored (so `"response.layers"` and `"layers"` are equivalent).
 - **`storeAs`** (for `storeValue`):
-  - Dot-notated path where the value will be stored under `app.wpsResults`, e.g. `"example.statistics"`.
+  - Dot-notated path where the value will be stored under `app.processResults`, e.g. `"example.statistics"`.
 - **`layerConfig`** (optional, for `addLayer`):
   - Extra fields merged into each dynamic layer configuration (e.g. default opacity, visibility flags).
 
@@ -455,7 +497,7 @@ The structure expected by `addLayer` is:
   - `url`: WMS/WFS/WMS-T endpoint for the layer.
   - `name` (optional): Human-readable name.
 
-This matches the output format produced by the backend WPS processes and is what the viewer uses to add layers dynamically.
+This matches the output format produced by the backend processes and is what the viewer uses to add layers dynamically.
 
 
 ## License
diff --git a/components.d.ts b/components.d.ts
index 199b4f7..e313e78 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -15,7 +15,6 @@ declare module 'vue' {
     AreaMenu: typeof import('./src/components/AreaMenu.vue')['default']
     LayerLegend: typeof import('./src/components/LayerLegend.vue')['default']
     LayerList: typeof import('./src/components/LayerList.vue')['default']
-    MapboxHighlight: typeof import('./src/components/MapboxHighlight.vue')['default']
     MapComponent: typeof import('./src/components/MapComponent.vue')['default']
     MapLayer: typeof import('./src/components/MapLayer.vue')['default']
     MapZoomControl: typeof import('./src/components/MapZoomControl.vue')['default']
diff --git a/src/App.vue b/src/App.vue
index bee6309..26aca1a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -15,22 +15,22 @@
   import workflowConfig from '@/config/workflow.json'
   import { useAppStore } from '@/stores/app'
   import { useMapStore } from '@/stores/map'
-  import { executeWpsConfig } from '@/lib/wps/execute-config'
+  import { executeProcessConfig } from '@/lib/ogc-process/execute-config'
 
   const appStore = useAppStore()
   const mapStore = useMapStore()
 
   onMounted(async () => {
-    const wps = workflowConfig.initialSetup?.wps
-    if (wps?.trigger === 'onStart') {
+    const process = workflowConfig.initialSetup?.process
+    if (process?.trigger === 'onStart') {
       try {
-        await executeWpsConfig(wps, {
+        await executeProcessConfig(process, {
           payload: {},
           appStore,
           mapStore,
         })
       } catch (error) {
-        console.error('Initial setup WPS request failed:', error)
+        console.error('Initial setup process request failed:', error)
       }
     }
 
diff --git a/src/components/NavigationDrawer.vue b/src/components/NavigationDrawer.vue
index c9e4858..b27c9aa 100644
--- a/src/components/NavigationDrawer.vue
+++ b/src/components/NavigationDrawer.vue
@@ -30,7 +30,7 @@
     :requires-confirmation="step.requiresConfirmation || false"
     :confirmation-source="step.confirmationSource || 'component'"
     :explanation="step.explanation || ''"
-    :wps="step.wps || null"
+    :process="step.process || null"
   />
 </template>
 
diff --git a/src/components/NumberInput.vue b/src/components/NumberInput.vue
index c9aca17..2ac5a6d 100644
--- a/src/components/NumberInput.vue
+++ b/src/components/NumberInput.vue
@@ -33,7 +33,7 @@
   import { ref, watch, computed } from 'vue'
   import { useAppStore } from '@/stores/app'
   import { useMapStore } from '@/stores/map'
-  import { resolveInputValue } from '@/lib/wps/resolve-input'
+  import { resolveInputValue } from '@/lib/ogc-process/resolve-input'
 
   const appStore = useAppStore()
   const mapStore = useMapStore()
@@ -50,7 +50,7 @@
     calcButtonTitle: { type: String, default: 'Calculate' },
   })
 
-  const emit = defineEmits(['step-ready', 'run-wps'])
+  const emit = defineEmits(['step-ready', 'run-process'])
 
   const resolvedDefault = computed(() => {
     if (!props.defaultValueSource) return props.defaultValue
@@ -77,7 +77,7 @@
 
   function onCalcClick () {
     if (props.showCalcButton && value.value != null && value.value >= props.min && value.value <= props.max) {
-      emit('run-wps', { value: value.value })
+      emit('run-process', { value: value.value })
     }
   }
 </script>
diff --git a/src/components/SelectionList.vue b/src/components/SelectionList.vue
index 22f9e14..35ac2d7 100644
--- a/src/components/SelectionList.vue
+++ b/src/components/SelectionList.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="selection-list pa-4">
     <v-select
-      v-model="selected"
+      v-model="model"
       :items="options"
       :label="label"
       item-title="name"
@@ -11,44 +11,85 @@
       clearable
       hide-details
     />
+    <v-btn
+      v-if="confirmSelection"
+      class="mt-3"
+      color="primary"
+      variant="tonal"
+      block
+      size="small"
+      :disabled="pending == null"
+      @click="confirm"
+    >
+      {{ confirmLabel }}
+    </v-btn>
   </div>
 </template>
 
 <script setup>
-  import { ref, watch, onMounted } from 'vue'
+  import { ref, watch, onMounted, computed } from 'vue'
   import { useAppStore } from '@/stores/app'
 
   const props = defineProps({
     label: { type: String, required: true },
     options: { type: Array, required: true },
     selectionKey: { type: String, default: null },
+    /** When true, store + step-complete only after the confirm button (dropdown is pending until then). */
+    confirmSelection: { type: Boolean, default: false },
+    confirmLabel: { type: String, default: 'Confirm' },
   })
 
   const emit = defineEmits(['step-complete'])
   const appStore = useAppStore()
-  const selected = ref(null)
+  const pending = ref(null)
+  const committed = ref(null)
+
+  const model = computed({
+    get: () => (props.confirmSelection ? pending.value : committed.value),
+    set: (v) => {
+      if (props.confirmSelection) {
+        pending.value = v
+      } else {
+        committed.value = v
+      }
+    },
+  })
+
+  function selectionToStore (value) {
+    if (!props.selectionKey || value == null) return
+    const option = props.options.find(o => o.id === value)
+    const toStore =
+      option && option.layerName != null
+        ? {
+          id: option.id,
+          layerName: option.layerName,
+          ...(option.regionIdProperty != null && { regionIdProperty: option.regionIdProperty }),
+          ...(option.layerNameForProcess != null && { layerNameForProcess: option.layerNameForProcess }),
+        }
+        : value
+    appStore.setSelection(props.selectionKey, toStore)
+  }
+
+  function confirm () {
+    if (pending.value == null) return
+    committed.value = pending.value
+    selectionToStore(committed.value)
+    emit('step-complete', { value: committed.value })
+  }
 
   onMounted(() => {
-    if (props.selectionKey && appStore.selections[props.selectionKey] != null) {
-      const stored = appStore.selections[props.selectionKey]
-      selected.value = typeof stored === 'object' && stored?.id != null ? stored.id : stored
+    if (!props.selectionKey || appStore.selections[props.selectionKey] == null) return
+    const stored = appStore.selections[props.selectionKey]
+    const id = typeof stored === 'object' && stored?.id != null ? stored.id : stored
+    committed.value = id
+    if (props.confirmSelection) {
+      pending.value = id
     }
   })
 
-  watch(selected, (value) => {
-    if (props.selectionKey) {
-      const option = props.options.find(o => o.id === value)
-      const toStore =
-        option && option.layerName != null
-          ? {
-            id: option.id,
-            layerName: option.layerName,
-            ...(option.regionIdProperty != null && { regionIdProperty: option.regionIdProperty }),
-            ...(option.layerNameForWPS != null && { layerNameForWPS: option.layerNameForWPS }),
-          }
-          : value
-      appStore.setSelection(props.selectionKey, toStore)
-    }
+  watch(committed, (value) => {
+    if (props.confirmSelection) return
+    selectionToStore(value)
     if (value != null) {
       emit('step-complete', { value })
     }
diff --git a/src/components/SubMenu.vue b/src/components/SubMenu.vue
index 85f02ff..344ec56 100644
--- a/src/components/SubMenu.vue
+++ b/src/components/SubMenu.vue
@@ -29,7 +29,7 @@
           v-bind="comp.props"
           @step-complete="onChildStepComplete"
           @step-ready="onStepReady"
-          @run-wps="onRunWps"
+          @run-process="onRunProcess"
         />
       </div>
 
@@ -46,7 +46,7 @@
           variant="tonal"
           block
           size="small"
-          :disabled="props.requiresConfirmation && !stepReadyPayload"
+          :disabled="confirmButtonDisabled"
           @click="onConfirmClick"
         >
           Confirm
@@ -60,7 +60,7 @@
   import { computed, shallowRef, watch } from 'vue'
   import { useAppStore } from '@/stores/app'
   import { useMapStore } from '@/stores/map'
-  import { executeWpsConfig } from '@/lib/wps/execute-config'
+  import { executeProcessConfig } from '@/lib/ogc-process/execute-config'
 
   const props = defineProps({
     menuId: { type: String, required: true },
@@ -70,7 +70,7 @@
     requiresConfirmation: { type: Boolean, default: false },
     confirmationSource: { type: String, default: 'component' },
     explanation: { type: String, default: '' },
-    wps: { type: Object, default: null },
+    process: { type: Object, default: null },
   })
 
   const store = useAppStore()
@@ -105,6 +105,17 @@
     return loadedComponents.value.filter(comp => comp.component)
   })
 
+  /** For process-driven steps, footer Confirm must wait for a successful run (payload includes `result`). */
+  const confirmButtonDisabled = computed(() => {
+    if (!props.requiresConfirmation) return false
+    const p = stepReadyPayload.value
+    if (!p) return true
+    if (props.confirmationSource === 'process' && props.process?.trigger === 'component') {
+      return p.result == null
+    }
+    return false
+  })
+
   const isOpen = computed({
     get: () => store.activeMenu === props.menuId,
     set: (value) => {
@@ -124,12 +135,12 @@
     if (open && props.completionEvent === 'auto' && !store.isStepCompleted(props.menuId)) {
       completeStep()
     }
-    if (open && props.confirmationSource === 'wps' && props.wps?.trigger === 'stepOpen') {
+    if (open && props.confirmationSource === 'process' && props.process?.trigger === 'stepOpen') {
       try {
-        const result = await executeWpsOnly({})
+        const result = await executeProcessOnly({})
         stepReadyPayload.value = result != null ? { result } : {}
       } catch (error) {
-        console.error(`WPS request failed for step "${ props.menuId }" (stepOpen):`, error)
+        console.error(`Process request failed for step "${ props.menuId }" (stepOpen):`, error)
       }
     }
   })
@@ -149,60 +160,37 @@
     store.completeStep(props.menuId)
   }
 
-  // --- WPS execution (driven by wps.trigger) ---
+  // --- Process execution (driven by process.trigger) ---
 
-  const wpsTrigger = props.wps?.trigger
+  const processTrigger = props.process?.trigger
 
-  if (wpsTrigger === 'mapClick') {
+  if (processTrigger === 'mapClick') {
     watch(() => mapStore.activeRegion, (region) => {
       if (region && isOpen.value) {
-        executeWps()
+        executeProcess()
       }
     })
   }
 
-  async function executeWpsOnly (payload = {}) {
-    if (!props.wps) return null
-    const result = await executeWpsConfig(props.wps, {
+  async function executeProcessOnly (payload = {}) {
+    if (!props.process) return null
+    return executeProcessConfig(props.process, {
       payload,
       appStore: store,
       mapStore,
     })
-    addWpsLayers(result)
-    return result
   }
 
-  async function executeWps (payload = {}) {
+  async function executeProcess (payload = {}) {
     try {
-      await executeWpsOnly(payload)
+      await executeProcessOnly(payload)
     } catch (error) {
-      console.error(`WPS request failed for step "${ props.menuId }":`, error)
+      console.error(`Process request failed for step "${ props.menuId }":`, error)
       return
     }
     completeStep()
   }
 
-  function addWpsLayers (result) {
-    if (!result) return
-
-    const layerData = result.layers ?? result
-    const folders = Array.isArray(layerData) ? layerData : []
-
-    for (const folder of folders) {
-      if (!folder?.contents) continue
-      for (const entry of folder.contents) {
-        if (entry.layer && entry.url) {
-          mapStore.addDynamicLayer({
-            id: entry.layer,
-            name: entry.name || entry.layer,
-            layer: entry.layer,
-            url: entry.url,
-          })
-        }
-      }
-    }
-  }
-
   function onChildStepComplete (payload) {
     if (props.requiresConfirmation) {
       stepReadyPayload.value = payload || {}
@@ -215,19 +203,19 @@
     stepReadyPayload.value = payload || {}
   }
 
-  async function onRunWps (payload) {
-    if (props.wps?.trigger !== 'component') return
+  async function onRunProcess (payload) {
+    if (props.process?.trigger !== 'component') return
     try {
-      const result = await executeWpsOnly(payload || {})
+      const result = await executeProcessOnly(payload || {})
       stepReadyPayload.value = result != null ? { result } : {}
     } catch (error) {
-      console.error(`WPS request failed for step "${ props.menuId }" (run-wps):`, error)
+      console.error(`Process request failed for step "${ props.menuId }" (run-process):`, error)
     }
   }
 
   async function onStepComplete (payload) {
-    if (wpsTrigger === 'stepComplete') {
-      await executeWps(payload)
+    if (processTrigger === 'stepComplete') {
+      await executeProcess(payload)
     } else {
       completeStep()
     }
@@ -237,7 +225,7 @@
     if (props.requiresConfirmation && !stepReadyPayload.value) return
     const payload = stepReadyPayload.value || {}
     stepReadyPayload.value = null
-    if (props.confirmationSource === 'wps' || props.confirmationSource === 'mapClick') {
+    if (props.confirmationSource === 'process' || props.confirmationSource === 'mapClick') {
       completeStep()
       store.openNextStep(props.menuId)
       return
diff --git a/src/config/workflow.json b/src/config/workflow.json
index f81b429..f6708f1 100644
--- a/src/config/workflow.json
+++ b/src/config/workflow.json
@@ -1,8 +1,8 @@
 {
   "logo": "/desirmed_logo.png",
   "initialSetup": {
-    "wps": {
-      "identifier": "lare_start",
+    "process": {
+      "identifier": "lare-start",
       "trigger": "onStart",
       "inputs": [],
       "storeResultAs": "initialSetup"
@@ -28,14 +28,14 @@
                 "name": "Administration",
                 "layerName": "region:nuts_2021_level_3",
                 "regionIdProperty": "nuts_name",
-                "layerNameForWPS": "region:nuts_2021"
+                "layerNameForProcess": "region:nuts_2021"
               },
               {
                 "id": "hydrobasin",
                 "name": "Hydro basin",
                 "layerName": "topography:hybas_eu_lev12_v1c",
                 "regionIdProperty": "hybas_id",
-                "layerNameForWPS": "hydro:hybas_eu_lev12_v1c"
+                "layerNameForProcess": "hydro:hybas_eu_lev12_v1c"
               }
             ]
           }
@@ -90,43 +90,65 @@
       "requiredSteps": [
         "regionSelection"
       ],
-      "explanation": "Enter the hexagon size, click the calculator to run the UOM calculation, then confirm to continue.",
+      "explanation": "Choose a landscape archetype and confirm, then enter the hexagon size, click the calculator to run the UOM calculation, then confirm to continue.",
       "requiresConfirmation": true,
-      "confirmationSource": "wps",
-      "wps": {
-        "identifier": "lare_uom",
+      "confirmationSource": "process",
+      "process": {
+        "identifier": "lare-uom",
         "trigger": "component",
         "inputs": [
           {
             "id": "sessionid",
-            "type": "LiteralData",
-            "source": "store:app.wpsResults.initialSetup.sessionid"
+            "source": "store:app.processResults.initialSetup.sessionid"
           },
           {
             "id": "uomsize",
-            "type": "LiteralData",
             "source": "payload:value"
           },
           {
             "id": "layername",
-            "type": "LiteralData",
-            "source": "store:app.selections.userCaseSelection.layerNameForWPS"
+            "source": "store:app.selections.userCaseSelection.layerNameForProcess"
           },
           {
             "id": "id",
-            "type": "LiteralData",
             "source": "store:map.activeRegionId"
+          },
+          {
+            "id": "archetype",
+            "source": "store:app.selections.uomArchetype"
           }
         ],
         "storeResultAs": "uom",
         "outputActions": [
           {
             "action": "addLayer",
-            "path": "layers"
+            "path": "response"
           }
         ]
       },
       "components": [
+        {
+          "component": "SelectionList",
+          "componentProps": {
+            "label": "Landscape archetype",
+            "selectionKey": "uomArchetype",
+            "confirmSelection": true,
+            "options": [
+              {
+                "id": "coastal",
+                "name": "Coastal"
+              },
+              {
+                "id": "urban",
+                "name": "Urban"
+              },
+              {
+                "id": "rural",
+                "name": "Rural"
+              }
+            ]
+          }
+        },
         {
           "component": "NumberInput",
           "componentProps": {
diff --git a/src/lib/ogc-process/execute-config.js b/src/lib/ogc-process/execute-config.js
new file mode 100644
index 0000000..9063b8c
--- /dev/null
+++ b/src/lib/ogc-process/execute-config.js
@@ -0,0 +1,36 @@
+import sendProcessRequest from '@/lib/ogc-process'
+import { resolveInputs } from '@/lib/ogc-process/resolve-input'
+import { handleOutputActions } from '@/lib/ogc-process/handle-output'
+
+/**
+ * Execute a process request from a workflow config (workflow.json process object).
+ *
+ * @param {Object} processConfig - Process config from workflow (identifier, inputs, storeResultAs, outputActions)
+ * @param {Object} context
+ * @param {Object} [context.payload={}] - Payload for resolving inputs (e.g. from step completion)
+ * @param {Object} context.appStore - Pinia app store
+ * @param {Object} context.mapStore - Pinia map store
+ * @returns {Promise<Object>} The parsed process response
+ */
+export async function executeProcessConfig (processConfig, { payload = {}, appStore, mapStore }) {
+  const baseUrl = import.meta.env.VITE_OGC_API_URL ?? import.meta.env.VITE_WPS_BASE_URL
+  const { identifier, outputActions, storeResultAs } = processConfig
+  const stores = { app: appStore, map: mapStore }
+  const context = { payload, stores }
+
+  const inputs = resolveInputs(processConfig.inputs ?? [], context)
+  const result = await sendProcessRequest({
+    baseUrl,
+    identifier,
+    inputs,
+  })
+
+  if (storeResultAs) {
+    appStore.setProcessResult(storeResultAs, result)
+  }
+  if (outputActions?.length) {
+    handleOutputActions(outputActions, result, stores)
+  }
+
+  return result
+}
diff --git a/src/lib/wps/handle-output.js b/src/lib/ogc-process/handle-output.js
similarity index 81%
rename from src/lib/wps/handle-output.js
rename to src/lib/ogc-process/handle-output.js
index bda09bd..516812c 100644
--- a/src/lib/wps/handle-output.js
+++ b/src/lib/ogc-process/handle-output.js
@@ -1,21 +1,21 @@
 /**
- * Processes WPS response data according to output action definitions
+ * Processes response data according to output action definitions
  * from workflow.json.
  *
  * Supported actions:
- *   - storeValue:  saves a value (or sub-path of response) into appStore.wpsResults
- *   - addLayer:    adds a dynamic layer to the map via mapStore
+ *   - storeValue: saves a value (or sub-path of response) into appStore.processResults
+ *   - addLayer:   adds a dynamic layer to the map via mapStore
  *   - removeLayer: removes a dynamic layer that was previously added
  *
  * @param {Array<OutputAction>} actions - Output action definitions from config
- * @param {Object} response - The parsed WPS response
+ * @param {Object} response - The parsed process response
  * @param {Object} stores - { app: appStore, map: mapStore }
  *
  * @typedef {Object} OutputAction
- * @property {'storeValue'|'addLayer'|'removeLayer'} action
- * @property {string} [path]           - For storeValue/addLayer: dot-notated path into the current WPS response (omit or "response" for full response)
- * @property {string} [storeAs]        - For storeValue: key under wpsResults to store into
- * @property {Object} [layerConfig]    - For addLayer: layer configuration
+ * @property {'storeValue'|'addLayer'} action
+ * @property {string} [path]        - Dot-notated path into the response (omit or "response" for full response)
+ * @property {string} [storeAs]     - For storeValue: key under processResults to store into
+ * @property {Object} [layerConfig] - For addLayer: layer configuration
  * @property {string} [fromResultKey]  - For removeLayer: key in appStore.wpsResults to resolve layers from
  */
 export function handleOutputActions (actions, response, stores) {
@@ -26,7 +26,7 @@ export function handleOutputActions (actions, response, stores) {
       case 'storeValue': {
         const value = resolvePath(response, action.path)
         if (action.storeAs && stores.app) {
-          setNestedValue(stores.app.wpsResults, action.storeAs, value)
+          setNestedValue(stores.app.processResults, action.storeAs, value)
         }
         break
       }
diff --git a/src/lib/ogc-process/index.js b/src/lib/ogc-process/index.js
new file mode 100644
index 0000000..c3ab59b
--- /dev/null
+++ b/src/lib/ogc-process/index.js
@@ -0,0 +1,34 @@
+import axios from 'axios'
+
+/**
+ * Sends an OGC API Processes execute request using JSON.
+ *
+ * @param {Object} config
+ * @param {string} config.baseUrl - pygeoapi root URL (e.g. http://localhost:5000)
+ * @param {string} config.identifier - Process identifier (e.g. 'lare-uom')
+ * @param {Array<Object>} [config.inputs] - List of input parameters
+ * @returns {Promise<Object>} Parsed response data
+ */
+export default function sendProcessRequest ({
+  baseUrl,
+  identifier,
+  inputs = [],
+}) {
+  const cleanBaseUrl = baseUrl.replace(/\/+$/, '')
+  const url = `${ cleanBaseUrl }/processes/${ identifier }/execution?f=json`
+  const resolvedInputs = {}
+
+  for (const input of inputs) {
+    if (!input?.id) continue
+    resolvedInputs[input.id] = input.value
+  }
+
+  return axios.post(url, {
+    inputs: resolvedInputs,
+  }, {
+    headers: {
+      'Content-Type': 'application/json',
+      'Accept': 'application/json',
+    },
+  }).then(({ data }) => data)
+}
diff --git a/src/lib/wps/resolve-input.js b/src/lib/ogc-process/resolve-input.js
similarity index 72%
rename from src/lib/wps/resolve-input.js
rename to src/lib/ogc-process/resolve-input.js
index 8a0f09c..d5976d2 100644
--- a/src/lib/wps/resolve-input.js
+++ b/src/lib/ogc-process/resolve-input.js
@@ -1,6 +1,6 @@
 /**
  * Resolve a single value from a source string.
- * Source format: "store:path" | "payload:path" | "wpsResult:path" | "static:value"
+ * Source format: "store:path" | "payload:path" | "processResult:path" | "static:value"
  */
 export function resolveInputValue (source, context) {
   const i = source.indexOf(':')
@@ -14,8 +14,8 @@ export function resolveInputValue (source, context) {
     return store ? get(pathParts.slice(1), store) : undefined
   }
   if (type === 'payload') return get(pathParts, context.payload)
-  if (type === 'wpsResult') {
-    const results = context.stores?.app?.wpsResults
+  if (type === 'processResult') {
+    const results = context.stores?.app?.processResults
     return results ? get(pathParts, results) : undefined
   }
   if (type === 'static') return path
@@ -23,19 +23,19 @@ export function resolveInputValue (source, context) {
 }
 
 /**
- * Resolve WPS inputs from config.
- * @param {Array} inputs - [{ id, type, source }, ...]
+ * Resolve process inputs from config.
+ * @param {Array} inputs - [{ id, source }, ...]
  * @param {Object} context - { payload, stores }
- * @returns {Array} [{ id, type, value }, ...] for sendWpsRequest
+ * @returns {Array} [{ id, value }, ...] for sendProcessRequest
  */
 export function resolveInputs (inputs, context) {
   if (!Array.isArray(inputs)) return []
   const out = []
-  for (const { id, type = 'LiteralData', source } of inputs) {
+  for (const { id, source } of inputs) {
     if (!id || !source) continue
     const value = resolveInputValue(source, context)
     if (value === undefined || value === null) continue
-    out.push({ id, type, value })
+    out.push({ id, value })
   }
   return out
 }
diff --git a/src/lib/wps/execute-config.js b/src/lib/wps/execute-config.js
deleted file mode 100644
index b87beba..0000000
--- a/src/lib/wps/execute-config.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import sendWpsRequest from '@/lib/wps'
-import { resolveInputs } from '@/lib/wps/resolve-input'
-import { handleOutputActions } from '@/lib/wps/handle-output'
-
-/**
- * Execute a WPS request from a workflow config (workflow.json wps object).
- *
- * @param {Object} wpsConfig - WPS config from workflow (identifier, inputs, storeResultAs, outputActions)
- * @param {Object} context
- * @param {Object} [context.payload={}] - Payload for resolving inputs (e.g. from step completion)
- * @param {Object} context.appStore - Pinia app store
- * @param {Object} context.mapStore - Pinia map store
- * @returns {Promise<Object>} The parsed WPS response
- */
-export async function executeWpsConfig (wpsConfig, { payload = {}, appStore, mapStore }) {
-  const baseUrl = import.meta.env.VITE_WPS_BASE_URL
-  const { identifier, outputActions, storeResultAs } = wpsConfig
-  const stores = { app: appStore, map: mapStore }
-  const context = { payload, stores }
-
-  const inputs = resolveInputs(wpsConfig.inputs ?? [], context)
-  const result = await sendWpsRequest({
-    baseUrl,
-    identifier,
-    inputs,
-  })
-
-  if (storeResultAs) {
-    appStore.setWpsResult(storeResultAs, result)
-  }
-  if (outputActions?.length) {
-    handleOutputActions(outputActions, result, stores)
-  }
-
-  return result
-}
diff --git a/src/lib/wps/index.js b/src/lib/wps/index.js
deleted file mode 100644
index 43644e3..0000000
--- a/src/lib/wps/index.js
+++ /dev/null
@@ -1,48 +0,0 @@
-import axios from 'axios'
-import { buildWpsExecuteXml } from './template'
-
-/**
-/**
- * Sends a WPS Execute request using XML.
- *
- * @param {Object} config
- * @param {string} config.identifier - WPS process identifier (e.g., 'create_transect')
- * @param {Array<Object>} [config.inputs] - List of input parameters, each with:
- *    - id {string}: WPS input identifier
- *    - type {string}: 'LiteralData' or 'ComplexData'
- *    - value {string|object}: Literal value or GeoJSON object
- *    - title {string} [optional]: Optional title
- *    - mimeType {string} [optional]: Only for ComplexData
- * @param {string} [config.outputIdentifier='output_json'] - Output identifier name
- * @param {string} [config.mimeType='application/json'] - Desired response mime type
- *
- * @returns {Promise<Object>} Parsed response data
- */
-
-export default function sendWpsRequest ({
-  baseUrl,
-  identifier,
-  inputs = [],
-  outputIdentifier = 'output_json',
-  mimeType = 'application/json',
-}) {
-  const template = buildWpsExecuteXml({
-    identifier,
-    inputs,
-    outputIdentifier,
-    mimeType,
-  })
-
-  return axios({
-    method: 'post',
-    url: baseUrl,
-    data: template,
-
-    headers: {
-      'Content-Type': 'application/xml',
-      'Accept': 'application/json',
-    },
-  }).then(({ data }) => {
-    return typeof data === 'object' ? data : JSON.parse(data)
-  })
-}
diff --git a/src/lib/wps/template.js b/src/lib/wps/template.js
deleted file mode 100644
index 20ccfe3..0000000
--- a/src/lib/wps/template.js
+++ /dev/null
@@ -1,43 +0,0 @@
-export function buildWpsExecuteXml ({
-  identifier,
-  inputs = [],
-  outputIdentifier = 'output_json',
-  mimeType = 'application/json',
-}) {
-  const inputXml = inputs.map(input => {
-    const { id, title = id, type = 'LiteralData', value, mimeType: inputMimeType } = input
-
-    let dataBlock = ''
-    if (type === 'LiteralData') {
-      const literalContent = typeof value === 'object' ? JSON.stringify(value) : value
-      dataBlock = `<wps:LiteralData>${ literalContent }</wps:LiteralData>`
-    } else if (type === 'ComplexData') {
-      const complexContent = typeof value === 'object' ? JSON.stringify(value) : value
-      dataBlock = `<wps:ComplexData${ inputMimeType ? ` mimeType="${ inputMimeType }"` : '' }>${ complexContent }</wps:ComplexData>`
-    }
-
-    return `
-    <wps:Input>
-      <ows:Identifier xmlns:ows="http://www.opengis.net/ows/1.1">${ id }</ows:Identifier>
-      <ows:Title xmlns:ows="http://www.opengis.net/ows/1.1">${ title }</ows:Title>
-      <wps:Data>
-        ${ dataBlock }
-      </wps:Data>
-    </wps:Input>`
-  }).join('')
-
-  return `
-<wps:Execute xmlns:wps="http://www.opengis.net/wps/1.0.0"
-             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
-             service="WPS"
-             version="1.0.0"
-             xsi:schemaLocation="http://www.opengis.net/wps/1.0.0 http://schemas.opengis.net/wps/1.0.0/wpsAll.xsd">
-  <ows:Identifier xmlns:ows="http://www.opengis.net/ows/1.1">${ identifier }</ows:Identifier>
-  ${ inputs.length > 0 ? `<wps:DataInputs>${ inputXml }</wps:DataInputs>` : '' }
-  <wps:ResponseForm>
-    <wps:RawDataOutput mimeType="${ mimeType }">
-      <ows:Identifier xmlns:ows="http://www.opengis.net/ows/1.1">${ outputIdentifier }</ows:Identifier>
-    </wps:RawDataOutput>
-  </wps:ResponseForm>
-</wps:Execute>`.trim()
-}
diff --git a/src/stores/app.js b/src/stores/app.js
index 6739f25..ae48a5a 100644
--- a/src/stores/app.js
+++ b/src/stores/app.js
@@ -5,7 +5,7 @@ export const useAppStore = defineStore('app', {
   state: () => ({
     activeMenu: null,
     completedSteps: [],
-    wpsResults: {},
+    processResults: {},
     selections: {},
   }),
 
@@ -39,8 +39,8 @@ export const useAppStore = defineStore('app', {
       }
     },
 
-    setWpsResult (key, result) {
-      this.wpsResults[key] = result
+    setProcessResult (key, result) {
+      this.processResults[key] = result
     },
 
     setSelection (key, value) {
@@ -60,7 +60,7 @@ export const useAppStore = defineStore('app', {
           id => !toRemove.includes(id),
         )
         for (const id of toRemove) {
-          delete this.wpsResults[id]
+          delete this.processResults[id]
         }
       }
     },
diff --git a/src/stores/map.js b/src/stores/map.js
index 7f14805..b3241bd 100644
--- a/src/stores/map.js
+++ b/src/stores/map.js
@@ -3,6 +3,29 @@ import area from '@turf/area'
 import layersConfig from '@/config/base-layers-config.json'
 import buildMapboxLayer from '@/lib/build-mapbox-layer'
 
+function normalizeLayerUrlForBrowser (rawUrl) {
+  if (!rawUrl || typeof rawUrl !== 'string') {
+    return rawUrl
+  }
+
+  // Backend may return host.docker.internal URLs valid from containers but
+  // unreachable from the browser on Windows; remap to localhost by default.
+  const publicGeoserverBase = import.meta.env.VITE_GEOSERVER_PUBLIC_BASE_URL
+  if (publicGeoserverBase) {
+    try {
+      const sourceUrl = new URL(rawUrl)
+      const targetBaseUrl = new URL(publicGeoserverBase)
+      sourceUrl.protocol = targetBaseUrl.protocol
+      sourceUrl.host = targetBaseUrl.host
+      return sourceUrl.toString()
+    } catch {
+      return rawUrl
+    }
+  }
+
+  return rawUrl.replace('://host.docker.internal:', '://localhost:')
+}
+
 export const useMapStore = defineStore('map', {
   state: () => ({
     layersConfig,
@@ -161,8 +184,10 @@ export const useMapStore = defineStore('map', {
       const existing = this.mapboxLayers.find(l => l.id === layerConfig.id)
       if (existing) return
 
+      const normalizedUrl = normalizeLayerUrlForBrowser(layerConfig.url)
       const built = buildMapboxLayer({
         ...layerConfig,
+        url: normalizedUrl,
         format: 'image/png',
       })
       if (built) {