diff --git a/.github/workflows/deploy-branch.yml b/.github/workflows/deploy-branch.yml
new file mode 100644
index 000000000..99f2da98a
--- /dev/null
+++ b/.github/workflows/deploy-branch.yml
@@ -0,0 +1,60 @@
+name: Deploy Branch Preview
+on:
+  push:
+    branches-ignore:
+      - main
+      - develop
+  pull_request:
+    branches:
+      - main
+      - develop
+
+jobs:
+  deploy-preview:
+    runs-on: ubuntu-latest
+    env:
+      SEMANTIC_SEARCH_API_URL: ${{ secrets.SEMANTIC_SEARCH_API_URL }}
+    steps:
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "lts/*"
+
+      - uses: actions/checkout@v4
+
+      - name: Get branch name
+        id: branch-name
+        run: |
+          if [ "${{ github.event_name }}" = "pull_request" ]; then
+            echo "branch_name=${{ github.head_ref }}" >> $GITHUB_OUTPUT
+          else
+            echo "branch_name=${{ github.ref_name }}" >> $GITHUB_OUTPUT
+          fi
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build for preview
+        run: npm run build -- --pathPrefix="/stac-browser/preview/${{ steps.branch-name.outputs.branch_name }}" --historyMode=hash --semanticSearchApiUrl="${{ env.SEMANTIC_SEARCH_API_URL }}"
+
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: dist
+          exclude_assets: "report.html"
+          user_name: "STAC Browser CI"
+          user_email: github@developmentseed.org
+          destination_dir: preview/${{ steps.branch-name.outputs.branch_name }}
+          publish_branch: gh-pages-preview
+
+      - name: Comment PR
+        if: github.event_name == 'pull_request'
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const url = `https://${{ github.repository_owner }}.github.io/${{ github.event.repository.name }}/preview/${{ steps.branch-name.outputs.branch_name }}/`;
+            github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: `🚀 **Preview deployed!**\n\nYour changes are now available at: ${url}\n\nThis preview will be automatically updated on each push to this branch.`
+            });
diff --git a/README.md b/README.md
index 69fe7b1b4..1e0abafe0 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@ It's not officially supported, but you may also be able to use it for
 certain _OGC API - Records_ and _OGC API - Features_ compliant servers.
 
 **Please note that STAC Browser is currently with limited funding for both maintenance, bug fixes and improvements. This means issues and PRs may be addressed very slowly.
-If you care about STAC Browser and have some funds to support the future of STAC Browser, please contact matthias@mohr.ws**
+If you care about STAC Browser and have some funds to support the future of STAC Browser, please contact <matthias@mohr.ws>**
 
 **Table of Contents:**
 
@@ -37,6 +37,7 @@ If you care about STAC Browser and have some funds to support the future of STAC
       - [Translation](#translation)
     - [Customize through root catalog](#customize-through-root-catalog)
     - [Custom extensions](#custom-extensions)
+    - [Natural Language Search](#natural-language-search)
   - [Docker](#docker)
   - [Contributing](#contributing)
     - [Adding a new language](#adding-a-new-language)
@@ -269,6 +270,48 @@ STAC Browser supports some non-standardized extensions to the STAC specification
    Add a `name` field and it will be used as title in the tab header, the same applies for the core Asset Object.
 3. A link with relation type `icon` and a Browser-supported media type in any STAC entity will show an icon in the header and the lists of Catalogs, Collections and Items.
 
+### Natural Language Search
+
+STAC Browser supports natural language search functionality that allows users to search for STAC items using descriptive queries in natural language (e.g., "satellite images of forests in California from 2023").
+
+To enable natural language search:
+
+1. **Configure the API URL**: Set the `semanticSearchApiUrl` option in your configuration file:
+
+```javascript
+// config.js
+module.exports = {
+  // ... other config options
+  semanticSearchApiUrl: "https://your-semantic-search-api.com",
+  // ... other config options
+};
+```
+
+2. **API Requirements**: Your semantic search API should accept POST requests to `/items/search` with the following format:
+
+```json
+{
+  "query": "your natural language query",
+  "limit": 10
+}
+```
+
+And return results in this format:
+
+```json
+{
+  "results": {
+    "items": [
+      // Array of STAC items
+    ]
+  }
+}
+```
+
+3. **User Interface**: Once configured, users will see the "Natural Language Query" search interface where they can enter descriptive queries.
+
+**Note**: Natural language search is disabled by default. The feature will only appear in the interface when `semanticSearchApiUrl` is configured with a valid API URL.
+
 ## Docker
 
 You can use the Docker to work with STAC Browser. Please read [Docker documentation](docs/docker.md) for more details.
diff --git a/config.js b/config.js
index 2b32abc30..58f89b92f 100644
--- a/config.js
+++ b/config.js
@@ -48,5 +48,6 @@ module.exports = {
     requestQueryParameters: {},
     socialSharing: ['email', 'bsky', 'mastodon', 'x'],
     preprocessSTAC: null,
-    authConfig: null
+    authConfig: null,
+    semanticSearchApiUrl: false,
 };
diff --git a/src/components/ApiCapabilitiesMixin.js b/src/components/ApiCapabilitiesMixin.js
index d3b797fcb..904ec2158 100644
--- a/src/components/ApiCapabilitiesMixin.js
+++ b/src/components/ApiCapabilitiesMixin.js
@@ -73,6 +73,9 @@ export default {
     canFilterFreeText() {
       return this.supportsConformance(this.conformances.FreeText);
     },
+    canSupportNaturalLanguage() {
+      return true;
+    },
     cql() {
       if (!this.supportsConformance(this.conformances.CqlFilters)) {
         return null;
diff --git a/src/components/Map.vue b/src/components/Map.vue
index 69d45e71a..36d75c626 100644
--- a/src/components/Map.vue
+++ b/src/components/Map.vue
@@ -11,6 +11,7 @@
       <l-tile-layer v-for="xyz of xyzLinks" ref="xyzOverlays" :key="xyz.url" layerType="overlay" v-bind="xyz" />
       <LWMSTileLayer v-for="wms of wmsLinks" ref="wmsOverlays" :key="wms.url" layerType="overlay" v-bind="wms" />
       <l-geo-json v-if="geojson" ref="geojson" :geojson="geojson" :options="{onEachFeature: showPopup}" :optionsStyle="{color: secondaryColor, weight: secondaryWeight}" />
+      <l-geo-json v-if="intersectsPolygon" ref="intersectsLayer" :geojson="intersectsPolygon" :options="{onEachFeature: showIntersectsPopup}" :optionsStyle="{color: '#3B82F6', weight: 2, fillColor: '#3B82F6', fillOpacity: 0.15, opacity: 0.8, dashArray: '5, 5'}" @ready="onIntersectsLayerReady" />
     </l-map>
     <b-popover
       v-if="popover && selectedItem" placement="left" triggers="manual" :show="selectedItem !== null"
@@ -180,6 +181,15 @@ export default {
         }
       }
       return wmsLinks;
+    },
+    naturalLanguageDescription() {
+      return this.naturalLanguageExplanation;
+    },
+    intersectsPolygon() {
+      if (this.stacLayerData && this.stacLayerData.intersects) {
+        return this.stacLayerData.intersects;
+      }
+      return null;
     }
   },
   watch: {
@@ -428,6 +438,12 @@ export default {
         this.$refs.geojson.mapObject.bringToFront();
       }
     },
+    onIntersectsLayerReady() {
+      const layer = this.$refs.intersectsLayer && this.$refs.intersectsLayer.mapObject;
+      if (layer && this.map) {
+        this.fitBounds(layer);
+      }
+    },
     fitBounds(layer, noPadding = false) {
       let fitOptions = {
         padding: noPadding ? [0,0] : [90,90],
@@ -452,6 +468,10 @@ export default {
       }
       layer.bindPopup(html);
     },
+    showIntersectsPopup(feature, layer) {
+      const html = `<h3>${this.$t('search.naturalLanguageSearchArea')}</h3><p>${this.$t('search.naturalLanguageSearchAreaDescription')}</p>`;
+      layer.bindPopup(html);
+    },
     addBoundsSelector() {
       this.areaSelect = L.areaSelect({ // eslint-disable-line 
         width: 300,
diff --git a/src/components/SearchFilter.vue b/src/components/SearchFilter.vue
index 82dcd04de..7f3ffb946 100644
--- a/src/components/SearchFilter.vue
+++ b/src/components/SearchFilter.vue
@@ -6,6 +6,47 @@
 
         <b-card-title v-if="title" :title="title" />
 
+        <!-- Natural Language Search -->
+        <b-form-group v-if="canSupportNaturalLanguage" class="natural-language-search" :label="$t('search.naturalLanguageQuery')" :label-for="ids.naturalLanguage" :description="naturalLanguageDescription">
+          <div class="alert alert-info mb-3">
+            {{ $t('search.naturalLanguageInfo') }}
+          </div>
+          <b-alert v-if="naturalLanguageError" variant="danger" show dismissible @dismissed="naturalLanguageError = null">
+            {{ naturalLanguageError }}
+          </b-alert>
+          <div>
+            <b-form-input
+              :id="ids.naturalLanguage"
+              v-model="naturalLanguageQuery"
+              type="text"
+              :placeholder="$t('search.enterNaturalLanguageQuery')"
+              @keyup.enter="directNaturalLanguageSearch"
+              @keydown.enter.prevent
+              class="mb-3"
+            />
+            <div class="d-flex justify-content-end">
+              <b-button variant="outline-secondary" @click="applyNaturalLanguageQuery" :disabled="naturalLanguageLoading && naturalLanguageAction !== 'populate'" class="mr-2">
+                <span v-if="naturalLanguageLoading && naturalLanguageAction === 'populate'">
+                  {{ $t('search.processing') }}
+                </span>
+                <span v-else>
+                  {{ $t('search.populateForm') }}
+                </span>
+              </b-button>
+              <b-button variant="primary" @click="directNaturalLanguageSearch" :disabled="naturalLanguageLoading && naturalLanguageAction !== 'search'">
+                <span v-if="naturalLanguageLoading && naturalLanguageAction === 'search'">
+                  {{ $t('search.processing') }}
+                </span>
+                <span v-else>
+                  {{ $t('search.searchDirectly') }}
+                </span>
+              </b-button>
+            </div>
+          </div>
+        </b-form-group>
+
+        <hr v-if="canSupportNaturalLanguage">
+
         <b-form-group v-if="canFilterFreeText" class="filter-freetext" :label="$t('search.freeText')" :label-for="ids.q" :description="$t('search.freeTextDescription')">
           <multiselect
             :id="ids.q" :value="query.q" @input="setSearchTerms"
@@ -27,8 +68,15 @@
         </b-form-group>
 
         <b-form-group v-if="canFilterExtents" class="filter-bbox" :label="$t('search.spatialExtent')" :label-for="ids.bbox">
-          <b-form-checkbox :id="ids.bbox" v-model="provideBBox" value="1" @change="setBBox()">{{ $t('search.filterBySpatialExtent') }}</b-form-checkbox>
-          <Map class="mb-4" v-if="provideBBox" :stac="stac" selectBounds @bounds="setBBox" scrollWheelZoom />
+          <b-form-radio-group :id="ids.bbox" v-model="spatialExtentType" :options="spatialExtentOptions" name="spatialExtent" @change="setBBox()" />
+          <Map class="mb-4" v-if="spatialExtentType === 'boundingBox'" :stac="stac" selectBounds @bounds="setBBox" scrollWheelZoom />
+          <div v-if="spatialExtentType === 'naturalSearchArea' && naturalSearchArea">
+            <div class="alert alert-info mb-3">
+              <strong>{{ $t('search.spatialExtentOptions.naturalSearchArea') }}:</strong>
+              {{ $t('search.naturalSearchAreaDescription') }}
+            </div>
+            <Map class="mb-4" :key="'naturalSearchArea-' + JSON.stringify(naturalSearchArea)" :stac="stac" :stacLayerData="{intersects: naturalSearchArea}" scrollWheelZoom />
+          </div>
         </b-form-group>
 
         <b-form-group v-if="conformances.CollectionIdFilter" class="filter-collection" :label="$tc('stacCollection', collections.length)" :label-for="ids.collections">
@@ -116,7 +164,7 @@
 </template>
 
 <script>
-import { BBadge, BDropdown, BDropdownItem, BForm, BFormGroup, BFormInput, BFormCheckbox, BFormRadioGroup } from 'bootstrap-vue';
+import { BBadge, BDropdown, BDropdownItem, BForm, BFormGroup, BFormInput, BFormRadioGroup, BButton } from 'bootstrap-vue';
 import Multiselect from 'vue-multiselect';
 import { mapGetters, mapState } from "vuex";
 import refParser from '@apidevtools/json-schema-ref-parser';
@@ -140,11 +188,13 @@ function getQueryDefaults() {
     q: [],
     datetime: null,
     bbox: null,
+    intersects: null,
     limit: null,
     ids: [],
     collections: [],
     sortby: null,
-    filters: null
+    filters: null,
+    naturalLanguageQuery: ''
   };
 }
 
@@ -152,11 +202,17 @@ function getDefaults() {
   return {
     sortOrder: 1,
     sortTerm: null,
-    provideBBox: false,
+    spatialExtentType: 'none',
     query: getQueryDefaults(),
     filtersAndOr: 'and',
     filters: [],
-    selectedCollections: []
+    selectedCollections: [],
+    naturalLanguageQuery: '',
+    naturalLanguageExplanation: '',
+    naturalLanguageLoading: false,
+    naturalLanguageError: null,
+    naturalLanguageAction: null,
+    naturalSearchArea: null
   };
 }
 
@@ -171,8 +227,8 @@ export default {
     BForm,
     BFormGroup,
     BFormInput,
-    BFormCheckbox,
     BFormRadioGroup,
+    BButton,
     QueryableInput: () => import('./QueryableInput.vue'),
     Loading,
     Map: () => import('./Map.vue'),
@@ -209,12 +265,16 @@ export default {
       hasAllCollections: false,
       collections: [],
       collectionsLoadingTimer: null,
-      additionalCollectionCount: 0
+      additionalCollectionCount: 0,
+      naturalLanguageLoading: false
     }, getDefaults());
   },
   computed: {
     ...mapState(['itemsPerPage', 'maxItemsPerPage', 'uiLanguage']),
     ...mapGetters(['canSearchCollections', 'supportsConformance']),
+    canSupportNaturalLanguage() {
+      return Boolean(this.$store.state.semanticSearchApiUrl);
+    },
     collectionSelectOptions() {
       let taggable = !this.hasAllCollections;
       let isResult = this.collections.length > 0 && !this.hasAllCollections;
@@ -245,7 +305,7 @@ export default {
     },
     ids() {
       let obj = {};
-      ['q', 'datetime', 'bbox', 'collections', 'ids', 'sort', 'limit']
+      ['q', 'datetime', 'bbox', 'collections', 'ids', 'sort', 'limit', 'naturalLanguage']
         .forEach(field => obj[field] = field + formId);
       return obj;
     },
@@ -289,6 +349,25 @@ export default {
       set(val) {
         this.query.datetime = Array.isArray(val) ? val.map(d => Utils.dateToUTC(d)) : null;
       }
+    },
+    naturalLanguageDescription() {
+      return this.naturalLanguageExplanation;
+    },
+    spatialExtentOptions() {
+      const options = [
+        { value: 'none', text: this.$t('search.spatialExtentOptions.none') },
+        { value: 'boundingBox', text: this.$t('search.spatialExtentOptions.boundingBox') },
+      ];
+      
+      // Add natural search area option if available
+      if (this.naturalSearchArea) {
+        options.push({ 
+          value: 'naturalSearchArea', 
+          text: this.$t('search.spatialExtentOptions.naturalSearchArea') 
+        });
+      }
+      
+      return options;
     }
   },
   watch: {
@@ -349,6 +428,199 @@ export default {
     Promise.all(promises).finally(() => this.loaded = true);
   },
   methods: {
+    async applyNaturalLanguageQuery(event) {
+      // Prevent form submission
+      if (event) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+      
+      if (this.naturalLanguageQuery) {
+        this.naturalLanguageLoading = true;
+        this.naturalLanguageAction = 'populate';
+        try {
+          const SEMANTIC_SEARCH_API_URL = this.$store.state.semanticSearchApiUrl;
+          const response = await fetch(`${SEMANTIC_SEARCH_API_URL}/items/search`, {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+              return_search_params_only: true,
+              query: this.naturalLanguageQuery,
+              limit: 10
+            })
+          });
+
+          if (!response.ok) {
+            throw new Error(`API request failed with status ${response.status}`);
+          }
+
+          const responseData = await response.json();
+          
+          // Store the explanation if available in the response
+          if (responseData.explanation) {
+            this.naturalLanguageExplanation = responseData.explanation;
+          } else if (responseData.results && responseData.results.explanation) {
+            this.naturalLanguageExplanation = responseData.results.explanation;
+          }
+          
+          // Extract datetime from search_params if available
+          if (responseData.results && responseData.results.search_params && responseData.results.search_params.datetime) {
+            const datetimeString = responseData.results.search_params.datetime;
+            // Parse datetime string in format '2021-01-01/2022-12-31'
+            const dates = datetimeString.split('/');
+            if (dates.length === 2) {
+              const startDate = dates[0] === '..' ? null : new Date(dates[0]);
+              const endDate = dates[1] === '..' ? null : new Date(dates[1]);
+              
+              // Set the datetime in the query
+              this.query.datetime = [startDate, endDate];
+            }
+          }
+          
+          // Extract collections from search_params if available
+          if (responseData.results && responseData.results.search_params && responseData.results.search_params.collections) {
+            const collectionIds = responseData.results.search_params.collections;
+            if (Array.isArray(collectionIds) && collectionIds.length > 0) {
+              // Remove duplicates and set collections in the query
+              const uniqueCollectionIds = [...new Set(collectionIds)];
+              this.$set(this.query, 'collections', uniqueCollectionIds);
+              
+              // Update selectedCollections to match the query collections
+              this.selectedCollections = uniqueCollectionIds.map(id => {
+                // Try to find existing collection in the collections array
+                let existingCollection = this.collections.find(c => c.value === id);
+                if (existingCollection) {
+                  return existingCollection;
+                }
+                // If not found, create a new collection option
+                return this.collectionToMultiSelect({id});
+              });
+            }
+          }
+          
+          // Extract max_items from search_params if available
+          if (responseData.results && responseData.results.search_params && responseData.results.search_params.max_items) {
+            const maxItems = parseInt(responseData.results.search_params.max_items, 10);
+            if (!isNaN(maxItems) && maxItems > 0) {
+              // Ensure the value doesn't exceed the maximum allowed
+              const limitedMaxItems = Math.min(maxItems, this.maxItems);
+              this.$set(this.query, 'limit', limitedMaxItems);
+            }
+          }
+          
+          // Extract natural search area from search_params if available
+          if (responseData.results && responseData.results.search_params && responseData.results.search_params.intersects) {
+            const intersects = responseData.results.search_params.intersects;
+            if (intersects) {
+              this.naturalSearchArea = intersects;
+              // Set spatial extent type to natural search area if available
+              this.spatialExtentType = 'naturalSearchArea';
+            }
+          }
+                    
+          this.naturalLanguageError = null;
+          
+        } catch (error) {
+          console.error('Error in semantic search:', error);
+          this.naturalLanguageError = error.message;
+        } finally {
+          this.naturalLanguageLoading = false;
+          this.naturalLanguageAction = null;
+        }
+      }
+    },
+    async directNaturalLanguageSearch(event) {
+      // Prevent form submission
+      if (event) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+
+      if (this.naturalLanguageQuery) {
+        this.naturalLanguageLoading = true;
+        this.naturalLanguageAction = 'search';
+        try {
+          const SEMANTIC_SEARCH_API_URL = this.$store.state.semanticSearchApiUrl;
+          const response = await fetch(`${SEMANTIC_SEARCH_API_URL}/items/search`, {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+              return_search_params_only: true,
+              query: this.naturalLanguageQuery,
+              limit: this.query.limit || this.itemsPerPage
+            })
+          });
+
+          if (!response.ok) {
+            throw new Error(`API request failed with status ${response.status}`);
+          }
+
+          const responseData = await response.json();
+
+          // Create a search query from the response and emit it directly
+          const searchQuery = {};
+
+          if (responseData.results && responseData.results.search_params) {
+            const params = responseData.results.search_params;
+            
+            // Extract datetime
+            if (params.datetime) {
+              const datetimeString = params.datetime;
+              const dates = datetimeString.split('/');
+              if (dates.length === 2) {
+                const startDate = dates[0] === '..' ? null : new Date(dates[0]);
+                const endDate = dates[1] === '..' ? null : new Date(dates[1]);
+                searchQuery.datetime = [startDate, endDate];
+              }
+            }
+            
+            // Extract collections
+            if (params.collections && Array.isArray(params.collections)) {
+              searchQuery.collections = [...new Set(params.collections)];
+            }
+            
+            // Extract limit
+            if (params.max_items) {
+              const maxItems = parseInt(params.max_items, 10);
+              if (!isNaN(maxItems) && maxItems > 0) {
+                searchQuery.limit = Math.min(maxItems, this.maxItems);
+              }
+            }
+            
+            // Extract spatial parameters
+            if (params.intersects) {
+              searchQuery.intersects = params.intersects;
+              // Also store the natural search area locally for UI display
+              this.naturalSearchArea = params.intersects;
+              this.spatialExtentType = 'naturalSearchArea';
+            }
+          }
+
+          // Store explanation for display
+          if (responseData.explanation) {
+            this.naturalLanguageExplanation = responseData.explanation;
+          } else if (responseData.results && responseData.results.explanation) {
+            this.naturalLanguageExplanation = responseData.results.explanation;
+          }
+
+          // Emit the search query directly to trigger immediate search
+          this.$emit('input', searchQuery, false);
+
+          this.naturalLanguageError = null;
+          
+        } catch (error) {
+          console.error('Error in direct semantic search:', error);
+          this.naturalLanguageError = error.message;
+        } finally {
+          this.naturalLanguageLoading = false;
+          this.naturalLanguageAction = null;
+        }
+      }
+    },
     resetSearchCollection() {
       clearTimeout(this.collectionsLoadingTimer);
       this.collectionsLoadingTimer = null;
@@ -502,10 +774,40 @@ export default {
       }
       let filters = this.buildFilter();
       this.$set(this.query, 'filters', filters);
-      this.$emit('input', this.query, false);
+      
+      // Set spatial parameters based on current selection
+      if (this.spatialExtentType === 'naturalSearchArea' && this.naturalSearchArea) {
+        this.$set(this.query, 'intersects', this.naturalSearchArea);
+        this.$set(this.query, 'bbox', null);
+      } else if (this.spatialExtentType === 'boundingBox') {
+        this.$set(this.query, 'bbox', this.query.bbox);
+        this.$set(this.query, 'intersects', null);
+      } else {
+        // None selected
+        this.$set(this.query, 'bbox', null);
+        this.$set(this.query, 'intersects', null);
+      }
+      
+      // Remove naturalLanguageQuery from the submitted query
+      const submitQuery = { ...this.query };
+      delete submitQuery.naturalLanguageQuery;
+      
+      // Only include intersects if it's not empty
+      if (!submitQuery.intersects) {
+        delete submitQuery.intersects;
+      }
+      
+      this.$emit('input', submitQuery, false);
     },
     async onReset() {
       Object.assign(this, getDefaults());
+      this.naturalLanguageQuery = '';
+      this.naturalLanguageExplanation = '';
+      this.naturalLanguageLoading = false;
+      this.naturalLanguageError = null;
+      this.naturalLanguageAction = null;
+      this.naturalSearchArea = null;
+      this.query.intersects = null;
       this.$emit('input', {}, true);
     },
     setLimit(limit) {
@@ -529,7 +831,9 @@ export default {
     },
     setBBox(bounds) {
       let bbox = null;
-      if (this.provideBBox) {
+      let intersects = null;
+      
+      if (this.spatialExtentType === 'boundingBox') {
         if (Utils.isObject(bounds) && typeof bounds.toBBoxString === 'function') {
           // This is a Leaflet LatLngBounds Object
           const Y = 85.06;
@@ -545,7 +849,13 @@ export default {
           bbox = bounds;
         }
       }
+      else if (this.spatialExtentType === 'naturalSearchArea' && this.naturalSearchArea) {
+        // Use the natural search area as intersects parameter
+        intersects = this.naturalSearchArea;
+      }
+      
       this.$set(this.query, 'bbox', bbox);
+      this.$set(this.query, 'intersects', intersects);
     },
     addCollection(collection) {
       if (!this.collectionSelectOptions.taggable) {
@@ -610,6 +920,11 @@ $primary-color: map-get($theme-colors, "primary");
     > label {
       font-weight: 600;
     }
+    
+    // Add styling for fieldset > legend
+    legend {
+      font-weight: 600;
+    }
   }
 }
 </style>
diff --git a/src/locales/en/texts.json b/src/locales/en/texts.json
index 5e0e20b0c..417fa046e 100644
--- a/src/locales/en/texts.json
+++ b/src/locales/en/texts.json
@@ -224,6 +224,15 @@
     "enterCollections": "Enter one or more Collection IDs...",
     "enterItemIds": "Enter one or more Item IDs...",
     "enterSearchTerms": "Enter one or more search terms...",
+    "enterNaturalLanguageQuery": "e.g., 'satellite images of California from 2023'",
+    "naturalLanguageQuery": "Natural Language Search",
+    "naturalLanguageInfo": "Enter a description of what you are searching for using natural language, such as 'satellite images of California from 2023'.",
+    "applyNaturalLanguageQuery": "Populate",
+    "searchDirectly": "Search",
+    "populateForm": "Populate Form",
+    "naturalLanguageSearchArea": "Natural Language Search Area",
+    "naturalLanguageSearchAreaDescription": "This area represents the spatial extent used in your natural language search query.",
+    "processing": "Processing...",
     "equalTo": "equal to",
     "filterBySpatialExtent": "Filter by spatial extent",
     "filterCollection": "Filter Collection",
@@ -259,6 +268,12 @@
       "title": "Title"
     },
     "spatialExtent": "Spatial Extent",
+    "spatialExtentOptions": {
+      "none": "None",
+      "boundingBox": "Bounding Box",
+      "naturalSearchArea": "Natural Search Area"
+    },
+    "naturalSearchAreaDescription": "This spatial area was automatically derived from your natural language query and will be used to filter search results.",
     "tabs": {
       "collections": "Search for Collections",
       "items": "Search for Items"
diff --git a/src/views/Search.vue b/src/views/Search.vue
index 9c186599d..ca8aa167e 100644
--- a/src/views/Search.vue
+++ b/src/views/Search.vue
@@ -25,7 +25,7 @@
         <b-alert v-else-if="data === null" variant="info" show>{{ $t('search.modifyCriteria') }}</b-alert>
         <b-alert v-else-if="results.length === 0 && noFurtherItems" variant="info" show>{{ $t('search.noFurtherItemsFound') }}</b-alert>
         <b-alert v-else-if="results.length === 0" variant="warning" show>{{ $t('search.noItemsFound') }}</b-alert>
-        <template v-else>
+        <template v-if="data && results.length > 0">
           <div id="search-map" v-if="itemCollection">
             <Map :stac="stac" :stacLayerData="itemCollection" scrollWheelZoom popover />
           </div>
@@ -70,6 +70,7 @@ import Loading from '../components/Loading.vue';
 import STAC from '../models/stac';
 import { BIconCheckSquare, BIconSquare, BTabs, BTab } from 'bootstrap-vue';
 import { processSTAC, stacRequest } from '../store/utils';
+import ApiCapabilitiesMixin from '../components/ApiCapabilitiesMixin';
 
 export default {
   name: "Search",
@@ -85,6 +86,9 @@ export default {
     SearchFilter,
     StacLink: () => import('../components/StacLink.vue')
   },
+  mixins: [
+    ApiCapabilitiesMixin
+  ],
   props: {
     loadParent: {
       type: String,
@@ -103,7 +107,7 @@ export default {
       itemFilters: {},
       collectionFilters: {},
       activeSearch: 0,
-      selectedCollections: {}
+      selectedCollections: {},
     };
   },
   computed: {
@@ -159,6 +163,7 @@ export default {
               return null;
             }
             let selfLink = Utils.getLinkWithRel(obj.links, 'self');
+
             let url;
             if (selfLink?.href) {
               url = Utils.toAbsolute(selfLink.href, this.link.href);
@@ -187,7 +192,7 @@ export default {
       return this.$t('search.metaDescription', {title});
     },
     noFurtherItems() {
-      // Ideally this would be dertmined by the prev link, but it's not required
+      // Ideally this would be determined by the prev link, but it's not required
       // so we check whether our current link has a next rel type which indicates
       // that it's a subsequent page. On the first pages the link rel type would be
       // "search" (or "prev" or "first"). This only works for forward navigation.