Update: Alle modellen

assets/scss/main.scss

@@ -82,6 +82,10 @@ $headings-color:       #212121;
     background-color: $van-emous-blue !important;
 }
 
+.bg-secondary-light {
+    background-color: lighten($color: $van-emous-blue, $amount: 6)  !important;
+}
+
 body,
 html {
     margin: 0;
@@ -194,7 +198,7 @@ p {
 
 // Menu
 .top-bar {
-    background-color: #a8bbd5;
+    background-color: #5D76A7;
     font-size: 0.9rem;
     color: white;
     font-size:18px;
@@ -421,6 +425,47 @@ p {
     }
 }
 
+.btn-cta-white {
+    display: inline-block;
+    position: relative;
+    font-weight: 600;
+    color: $van-emous-orange;
+    background-color: #fff !important;
+    padding: 17px 60px 17px 35px;
+    font-size: 16px;
+    line-height: normal;
+    border-radius: 50px;
+    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
+    font-family: $mukta-font;
+    border: none;
+    text-decoration: none;
+
+    &::after {
+        content: "";
+        background-image: url('/img/chevron-orange.svg');
+        background-size: contain;
+        background-repeat: no-repeat;
+        display: block;
+        width: 7px;
+        height: 13px;
+        position: absolute;
+        right: 30px;
+        top: 50%;
+        transform: translateY(-50%);
+        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
+        color: $van-emous-orange !important;
+    }
+
+    &:hover {
+        color: $van-emous-orange !important;
+        padding-right: 80px; 
+        
+        &::after {
+            right: 30px; 
+        }
+    }
+}
+
 .cta-wrapper {
     @media (min-width: 992px) {
         min-width: 320px;
@@ -496,6 +541,14 @@ p {
     }
 }
 
+.card-primary {
+    background-color: $van-emous-orange;
+    border-radius:30px;
+    min-height:200px;
+    padding: 2rem;
+    color: #fff
+}
+
 .card-secondary {
     background-color: $van-emous-blue;
     border-radius:30px;

content/modellen/_index.md

@@ -0,0 +1,10 @@
+---
+title: "Zorgwoning overzicht"
+subtitle: "Groen sedumdak & grote veranda"
+price: 89000
+image: "/img/modellen/berkel/berkel-002-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 90
+---

content/modellen/model-amstel.md

@@ -0,0 +1,66 @@
+---
+title: "Amstel"
+subtitle: "Modern met een sociaal hart"
+price: 89000
+image: "/img/modellen/amstel/amstel-002-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 90
+
+
+hero:
+  image: "/img/modellen/amstel/amstel-002-1600x.webp"
+  image_alt: "Impressie van model Amstel"
+  title: "Zorgwoning Amstel"
+  eyebrow: "Modern uiterlijk met ouderwetse gezelligheid"
+  paragraph: "De woning is een prachtig ontwerp wat eenvoudige geometrie vormen afwisselt met speels materiaalgebruik. De eye-catcher is het centrale kookeiland in de imposante 36m² kamer, die de ruimte verdeelt in een eet- en zitgedeelte zonder muren. Door de woonruimte te scheiden van de slaapkamers, kan de bewoner of logee een rustmoment pakken zonder hinder."
+  summary:
+    - property: "Afmetingen"
+      value: "11,24m x 7,2m"
+      icon: "bi-arrows-fullscreen"
+    - property: "Totaal oppervlakte"
+      value: "82m²"
+      icon: "bi-house-door"
+    - property: "2 Slaapkamers"
+      value: "12m² / 7m²"
+      icon: "bi-moon-stars"
+    - property: "Gescheiden leefruimtes"
+      value: "Comfort & Privacy"
+      icon: "bi-hr"
+    - property: "Woonkamer / Keuken"
+      value: "36m²"
+      icon: "bi-lamp"
+    - property: "Badkamer"
+      value: "4m²"
+      icon: "bi-droplet"
+
+gallery:
+  - image: "/img/modellen/amstel/amstel-001-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-002-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-003-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-004-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-005-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-006-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-007-800x.webp"
+    alt: "Zorgwoning Amstel"
+  - image: "/img/modellen/amstel/amstel-008-800x.webp"
+    alt: "Zorgwoning Amstel"
+
+plattegrond: "/img/modellen/amstel/plattegrond.webp"
+---
+
+## Ecologisch en duurzaam ontwerp
+Wat direct in het oog springt, is het prachtige groene dak. Dit ecologische sedumdak is niet alleen een lust voor het oog, maar biedt ook praktische voordelen: het zorgt voor uitstekende thermische isolatie, dempt geluid en bevordert de lokale biodiversiteit. Zo woont u letterlijk in harmonie met de natuur.
+
+### Hoogwaardige moderne materialen
+In dit model gaan esthetiek en duurzaamheid hand in hand. Door het gebruik van moderne materialen geniet u van de warme uitstraling van hout, zonder de intensieve zorg die daarbij komt kijken. De strakke antracietkleurige kozijnen en de grote raampartijen geven de woning een eigentijds karakter en zorgen voor een overvloed aan natuurlijk licht in de leefruimte.
+
+### Riant wonen op 90m²
+Met een oppervlakte van 90m² is de Amstel een van onze meest ruime modellen. Deze opzet biedt u een riante woonkamer met open keuken, een royale slaapkamer en een moderne badkamer. Dankzij de de overdekte veranda over de hele lengte van de woning vloeien binnen en buiten naadloos in elkaar over.

content/modellen/model-beta.md

@@ -1,9 +0,0 @@
----
-title: "Model Beta"
-subtitle: "Compact en comfortabel"
-price: 89000
-image: "/img/modellen/model-002.jpg"
-featured: true
-weight: 1
----
-Dit model is speciaal ontworpen voor kleinere tuinen zonder in te leveren op luxe.

content/modellen/model-delta.md

@@ -1,9 +0,0 @@
----
-title: "Model Delta"
-subtitle: "Compact en comfortabel"
-price: 89000
-image: "/img/modellen/model-003.jpg"
-featured: true
-weight: 1
----
-Dit model is speciaal ontworpen voor kleinere tuinen zonder in te leveren op luxe.

content/modellen/model-gamma.md

@@ -1,9 +0,0 @@
----
-title: "Model Gamma"
-subtitle: "Compact en comfortabel"
-price: 89000
-image: "/img/modellen/model-003.jpg"
-featured: true
-weight: 1
----
-Dit model is speciaal ontworpen voor kleinere tuinen zonder in te leveren op luxe.

content/modellen/model-ijssel.md

@@ -1,6 +1,6 @@
 ---
 title: "IJssel"
-subtitle: "Met een rietdak"
+subtitle: "Landelijke uitstraling met rieten dak"
 price: 89000
 image: "/img/modellen/ijssel/ijssel-002-800x.webp"
 featured: true

content/modellen/model-maas.md

@@ -0,0 +1,63 @@
+---
+title: "Maas"
+subtitle: "Compact met aandacht voor mobiliteit"
+price: 89000
+image: "/img/modellen/maas/maas-007-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 100
+
+hero:
+  image: "/img/modellen/maas/maas-007-1600x.webp"
+  image_alt: "Impressie van model Maas"
+  title: "Zorgwoning Maas"
+  eyebrow: "Ruimte, comfort & rust"
+  paragraph: "Dankzij de vierkante vorm van 9,2m bij 9,2m is de Maas verrassend ruim op een bescheiden oppervlak, samen met de neutrale uitstraling past deze woning op bijna elk kavel. De veranda is onderdeel van de woning zelf wat een unieke uitstraling en zo blijft het buitenleven toegankelijk, ook met beperkte mobiliteit. De slaapkamer is tevens extra breed, waardoor u comfortabel de ruimte heeft naast het bed."
+  summary:
+    - property: "Afmetingen"
+      value: "9,2m x 9,2m"
+      icon: "bi-arrows-fullscreen"
+    - property: "Totaal oppervlakte"
+      value: "85m²"
+      icon: "bi-house-door"
+    - property: "2 Slaapkamers"
+      value: "13m² / 4m²"
+      icon: "bi-moon-stars"
+    - property: "Berging"
+      value: "4m²"
+      icon: "bi-box-seam"
+    - property: "Woonkamer / Keuken"
+      value: "27m²"
+      icon: "bi-lamp"
+    - property: "Badkamer"
+      value: "5m²"
+      icon: "bi-droplet"
+
+gallery:
+  - image: "/img/modellen/maas/maas-001-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-002-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-003-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-004-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-005-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-006-800x.webp"
+    alt: "Zorgwoning Maas"
+  - image: "/img/modellen/maas/maas-007-800x.webp"
+    alt: "Zorgwoning Maas"
+
+plattegrond: "/img/modellen/maas/plattegrond.webp"
+---
+
+## Tijdloze architectuur
+De strakke lijnen en de ingetogen uitstraling zorgen voor een woning die op een stijlvolle manier opgaat in de omgeving. Het is de ideale keuze voor wie zoekt naar een moderne, onderhoudsvriendelijke woning met een solide karakter.
+
+### De inpandige veranda
+Wat de Maas echt bijzonder maakt, is de veranda die naadloos onderdeel uitmaakt van de hoofdbouw. In plaats van een losse aanbouw, is het terras verwerkt in de contouren van de woning zelf. Dit zorgt ook voor beschutting en comfort in elk seizoen. Voor mensen met een beperkte mobiliteit is dit ontwerp ideaal: de overgang van de woonkamer naar het buitenleven is volledig drempelloos en veilig, waardoor u optimaal van de gezonde buitenlucht geniet.
+
+### Zelfstandigheid behouden met minder mobiliteit
+Bij het ontwerp van de Maas heeft bewegingsvrijheid centraal gestaan, waardoor de woning uitstekend inspeelt op huidige of toekomstige mobiliteitsbehoeften. Dit is direct merkbaar in de royale hoofdslaapkamer van 13m2, die extra breed is opgezet zodat er rondom het bed ruimte overblijft voor hulpmiddelen. Het ontwerp biedt bovendien volop mogelijkheden: zoals het tweede toilet opofferen om de badkamer te vergroten.

content/modellen/model-reest.md

@@ -1,38 +1,38 @@
 ---
 title: "Reest"
-subtitle: "Met een rietdak"
+subtitle: "Unieke vorm met lessenaarsdak"
 price: 89000
 image: "/img/modellen/reest/reest-004-800x.webp"
 featured: true
 weight: 1
 layout: model
-size: 76
+size: 65
 
 
 hero:
   image: "/img/modellen/reest/reest-004-1600x.webp"
   image_alt: "Impressie van model Reest"
   title: "Zorgwoning Reest"
-  eyebrow: "Onderhoudsarm rieten dak"
-  paragraph: "De Reest is een prachtige L-vorm woning, die in een landelijke omgeving helemaal tot recht komt. Dankzij de keuze uit diverse kleuren steenstrips vormt de woning altijd een harmonieus geheel met het hoofdgebouw. De geheel open woonkamer en keuken van 38m² gezamenlijk, heeft deuren naar het terras voor aanvullend woonplezier."
+  eyebrow: "Praktische en stijlvolle indeling"
+  paragraph: "De Reest ademt ruimte dankzij een slimme indeling met het bescheiden oppervlak van 65m². De woonkamer met open keuken geeft een ruime woonervaring en met meerdere grote raampartijen geniet u van veel natuurlijk licht. Voor de buitenmens is er een directe toegang naar het terras vanuit de woonkamer, direct bij de voordeur is een separaat toilet voor gemakkelijke toegang."
   summary:
     - property: "Afmetingen"
-      value: "7,6m x 14m"
+      value: "7,85m x 12,9m"
       icon: "bi-arrows-fullscreen"
     - property: "Totaal oppervlakte"
-      value: "76m²"
+      value: "65m²"
       icon: "bi-house-door"
     - property: "Slaapkamer"
       value: "12m²"
       icon: "bi-moon-stars"
     - property: "Berging"
-      value: "8m²"
+      value: "3m²"
       icon: "bi-box-seam"
     - property: "Woonkamer / Keuken"
-      value: "38m²"
+      value: "31m²"
       icon: "bi-lamp"
     - property: "Badkamer"
-      value: "4m²"
+      value: "6m²"
       icon: "bi-droplet"
 
 gallery:
@@ -52,11 +52,11 @@ gallery:
 plattegrond: "/img/modellen/reest/plattegrond.webp"
 ---
 
-## Karakteristiek wonen onder riet
-Wat direct de aandacht trekt, is de prachtige rieten kap. Dit natuurlijke materiaal geeft de Reest een tijdloze, landelijke uitstraling die perfect opgaat in een groene omgeving. Naast de esthetische waarde biedt een rieten dak uitstekende natuurlijke isolatie; het houdt de woning heerlijk koel in de zomer en behaaglijk warm in de winter. Zo geniet u van een authentiek karakter met het comfort van nu.
+## Compact design, groots comfort
+Wat de Reest uniek maakt, is de efficiënte benutting van elke vierkante meter. Met een oppervlakte van 65m² biedt deze woning verrassend veel leefruimte zonder in te leveren op comfort. De centrale entree fungeert als spil van de woning en biedt directe toegang tot alle vertrekken. Dankzij de strategisch geplaatste raampartijen aan drie zijden van de woonkamer baadt de leefruimte in het daglicht, wat het ruimtelijke effect extra versterkt.
 
-### Slimme L-vorm voor optimale privacy
-De doordachte L-vormige architectuur van de Reest zorgt voor een natuurlijke scheiding tussen wonen en rusten. De royale woonkamer met open keuken van 38m2 vormt het kloppende hart van de woning, terwijl de slaapvleugel met aangrenzende badkamer in de uitbouw voor extra privacy zorgt. 
+### Harmonie tussen binnen en buiten
+De Reest is ontworpen voor liefhebbers van het buitenleven. De grote schuifpui in de woonkamer fungeert als een transparante barrière die uw terras bij de zithoek betrekt. Of het nu gaat om een zomerse lunch of een rustige ochtend met een kop koffie, de overgang naar buiten is moeiteloos. De strakke architectuur en de hoogwaardige afwerking van de gevels zorgen ervoor dat de woning een moderne, maar natuurlijke aanvulling vormt op uw perceel.
 
-### Ruimte voor al uw ambities
-Met een totaaloppervlakte van 76m² biedt de Reest verrassend veel praktische ruimte. Naast de riante slaapkamer van 12m² beschikt de woning over een berging van 8m². Deze ruimte is ideaal als hobbyruimte, werkplek aan huis of zelfs compacte logeerkamer.
+### Praktisch en doordacht ingedeeld
+De woning beschikt over een volwaardige slaapkamer van 12m² met een en-suite badkamer voor gemakkelijke toegang. Daarnaast is er slim nagedacht over opslag: de inpandige berging biedt plaats aan al uw technische installaties en extra voorraad, terwijl het separate toilet bij de entree zorgt voor extra privacy in het slaapgedeelte van de woning.

content/modellen/model-rijn.md

@@ -0,0 +1,64 @@
+---
+title: "Rijn"
+subtitle: "Ruim & comfortabel"
+price: 89000
+image: "/img/modellen/rijn/rijn-001-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 100
+
+
+hero:
+  image: "/img/modellen/rijn/rijn-001-1600x.webp"
+  image_alt: "Impressie van model Rijn"
+  title: "Zorgwoning Rijn"
+  eyebrow: "Ruimte, comfort & rust"
+  paragraph: "De Rijn is ontworpen met een sociaal en comfortabel karakter. Met het kookeiland in de open keuken bent u onderdeel van de gezelligheid in de woonkamer, die samen maar liefst 50m² groot zijn. Ook is het eenvoudig een gast te ontvangen dankzij de aanvullende slaapkamer en separaat toilet. Dankzij de grote berging achter de keuken, kan u gemakkelijk bij uw opslag en dient tevens als wasruimte."
+  summary:
+    - property: "Afmetingen"
+      value: "13m x 10m"
+      icon: "bi-arrows-fullscreen"
+    - property: "Totaal oppervlakte"
+      value: "100m²"
+      icon: "bi-house-door"
+    - property: "2 Slaapkamers"
+      value: "13m² / 7m²"
+      icon: "bi-moon-stars"
+    - property: "Berging"
+      value: "8m²"
+      icon: "bi-box-seam"
+    - property: "Woonkamer / Keuken"
+      value: "50m²"
+      icon: "bi-lamp"
+    - property: "Badkamer"
+      value: "6m²"
+      icon: "bi-droplet"
+
+gallery:
+  - image: "/img/modellen/rijn/rijn-001-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-002-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-003-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-004-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-005-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-006-800x.webp"
+    alt: "Zorgwoning Rijn"
+  - image: "/img/modellen/rijn/rijn-007-800x.webp"
+    alt: "Zorgwoning Rijn"
+
+plattegrond: "/img/modellen/rijn/plattegrond.webp"
+---
+
+## Imposant met een robuust karakter
+De Rijn onderscheidt zich direct door zijn indrukwekkende verschijning. De volledige buitenzijde is bekleed met hoogwaardige steenstrips, wat de woning een solide en tijdloze uitstraling geeft die niet onderdoet voor traditionele villabouw. Deze gevelafwerking is niet alleen onderhoudsarm, maar zorgt in combinatie met de strakke lijnen van het ontwerp voor een statig geheel dat in elke omgeving een blikvanger is.
+
+### Het sociale middelpunt: de royale leefkeuken
+Met een gecombineerd oppervlak van maar liefst 50m² vormt de woonkamer en open keuken het kloppende hart van de woning. Het kookeiland is strategisch geplaatst, zodat u tijdens het koken altijd in contact blijft met uw gezelschap in de zithoek of aan de eettafel. De dubbele openslaande deuren naar het terras versterken het gevoel van vrijheid en maken van deze ruimte een uitnodigende plek. In de avond kan u gezellig genieten van de haard in uw woonkamer.
+
+### Luxe en gastvrijheid zonder compromissen
+Als ons grootste model biedt de Rijn de luxe van een doordachte indeling met drie volwaardige kamers. De hoofdslaapkamer van 13m² biedt directe toegang tot de ruime badkamer, terwijl de separate logeerkamer van 7m² ideaal is voor het ontvangen van gasten of het inrichten van een rustig thuiskantoor. Praktisch gemak is overal terug te vinden: van het aanvullende toilet bij de entree tot de riante inpandige berging die direct vanuit de keuken bereikbaar is.

content/modellen/model-waal.md

@@ -0,0 +1,63 @@
+---
+title: "Waal"
+subtitle: "Ruimte in elke kamer"
+price: 89000
+image: "/img/modellen/waal/waal-007-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 100
+
+hero:
+  image: "/img/modellen/waal/waal-007-1600x.webp"
+  image_alt: "Impressie van model Waal"
+  title: "Zorgwoning Waal"
+  eyebrow: "Elke kamer heeft extra ruimte"
+  paragraph: "Mobiliteit begint met de ruimte om mobiel te zijn, ons model de Waal is dan ook ontworpen met dit in gedachte. Het begint bij de entree die extra breed is, gevolgd door een woonkamer en open keuken met 44m² gezamenlijke oppervlakte. Ook de slaapkamer is met 13m² extra breed, de badkamer van 6m² is direct toegankelijk en ook is er een extra ruimte naast de slaapkamer."
+  summary:
+    - property: "Afmetingen"
+      value: "12,85m x 7m"
+      icon: "bi-arrows-fullscreen"
+    - property: "Totaal oppervlakte"
+      value: "90m²"
+      icon: "bi-house-door"
+    - property: "Slaapkamer"
+      value: "13m²"
+      icon: "bi-moon-stars"
+    - property: "Berging"
+      value: "5m²"
+      icon: "bi-box-seam"
+    - property: "Woonkamer / Keuken"
+      value: "44m²"
+      icon: "bi-lamp"
+    - property: "Badkamer"
+      value: "6m²"
+      icon: "bi-droplet"
+
+gallery:
+  - image: "/img/modellen/waal/waal-001-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-002-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-003-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-004-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-005-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-006-800x.webp"
+    alt: "Zorgwoning Waal"
+  - image: "/img/modellen/waal/waal-007-800x.webp"
+    alt: "Zorgwoning Waal"
+
+plattegrond: "/img/modellen/waal/plattegrond.webp"
+---
+
+## Ruimte voor zelfstandigheid
+Het ontwerp stelt bewegingsvrijheid centraal, wat direct merkbaar is bij de extra brede entree en de royale opzet van de verkeersruimten. Met een gecombineerd oppervlak van 44m² voor de woonkamer en keuken biedt dit model een open en lichte leefomgeving waar u zich moeiteloos kunt verplaatsen. De grote raampartijen versterken het ruimtelijke effect en halen het buitenleven naar binnen, terwijl de drempelloze overgangen veiligheid en comfort garanderen.
+
+### Ergonomisch slapen en verzorgen
+Comfort is in de Waal doorvertaald naar de kleinste details in het privégedeelte. De hoofdslaapkamer van 13m² is specifiek ontworpen met extra breedte rondom het bed, wat essentieel is voor het gebruik van hulpmiddelen. Direct aangrenzend bevindt zich de badkamer van 6m², die door zijn slimme positionering en ruime draaicirkel optimale ondersteuning biedt bij de dagelijkse verzorging. Deze opzet zorgt voor een korte, veilige looproute en een luxe hotelgevoel in eigen huis.
+
+### Flexibel maatwerk voor zorg en hobby
+Wat de Waal echt onderscheidt, is de multifunctionele extra kamer direct naast de slaapvleugel. Deze ruimte van 5m² is ideaal als inloopkast of hobbykamer, maar kan ook perfect dienen als technische ruimte voor extra zorgfaciliteiten. Dit maakt de Waal een goede keuze voor zelfstandigheid voor nu of in de toekomst.

content/modellen/model-wetering.md

@@ -0,0 +1,64 @@
+---
+title: "Wetering"
+subtitle: "Compact & snel leverbaar"
+price: 89000
+image: "/img/modellen/wetering/wetering-002-800x.webp"
+featured: true
+weight: 1
+layout: model
+size: 49
+
+
+hero:
+  image: "/img/modellen/wetering/wetering-002-1600x.webp"
+  image_alt: "Impressie van model Wetering"
+  title: "Zorgwoning Wetering"
+  eyebrow: "Compact met aanvullende ruimte voor zorg"
+  paragraph: "Niet alleen de bewoner heeft ruimte nodig, ook de mantelzorger. De Wetering is gemaakt om zowel compact voor plaatsing te zijn, terwijl het een zeer ruim model is op de plekken die belangrijk zijn voor zorg. Zo is de slaapkamer maar liefst 14m² met een direct aangrenzende badkamer van 5m² waardoor het helpen bij lichamelijke verzorging gemakkelijker is."
+  summary:
+    - property: "Afmetingen"
+      value: "10,5m x 4,8m"
+      icon: "bi-arrows-fullscreen"
+    - property: "Totaal oppervlakte"
+      value: "49m²"
+      icon: "bi-house-door"
+    - property: "Slaapkamer"
+      value: "14m²"
+      icon: "bi-moon-stars"
+    - property: "Berging"
+      value: "5m²"
+      icon: "bi-box-seam"
+    - property: "Woonkamer / Keuken"
+      value: "26m²"
+      icon: "bi-lamp"
+    - property: "Badkamer"
+      value: "5m²"
+      icon: "bi-droplet"
+
+gallery:
+  - image: "/img/modellen/wetering/wetering-001-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-002-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-003-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-004-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-005-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-006-800x.webp"
+    alt: "Zorgwoning Wetering"
+  - image: "/img/modellen/wetering/wetering-007-800x.webp"
+    alt: "Zorgwoning Wetering"
+
+plattegrond: "/img/modellen/wetering/plattegrond.webp"
+---
+
+## Doordacht design voor zorg en comfort
+De Wetering is specifiek ontwikkeld als hoogwaardige zorgwoning waarbij elke centimeter bijdraagt aan de zelfredzaamheid van de bewoner en het gemak van de mantelzorger. Door de slimme, rechthoekige opzet is de woning eenvoudig te plaatsen op vrijwel elk perceel, zonder concessies te doen aan de interne bewegingsruimte. De grote raampartijen aan de voorzijde zorgen voor een open verbinding met de omgeving, wat bijdraagt aan een gezonde en lichte leefomgeving, ook als de mobiliteit afneemt.
+
+### Maximale ruimte in de zorgkern
+In de Wetering zijn de slaapkamer en badkamer de belangrijkste vertrekken. Met een riante slaapkamer van 14m² is er meer dan voldoende plek voor een hoog-laagbed en medische hulpmiddelen, terwijl er aan weerszijden van het bed loopruimte overblijft. De direct aangrenzende badkamer van 5m² is drempelloos en zo ingedeeld dat een mantelzorger of zorgprofessional alle ruimte heeft om fysieke ondersteuning te bieden. Deze logische en ruime zorgkern vormt de basis voor een veilige woonervaring.
+
+### Efficiënt en sociaal wonen
+Naast de uitgebreide zorgfaciliteiten biedt de Wetering een sfeervolle woonkamer met open keuken van 20m². Deze ruimte is efficiënt ingericht, zodat alles binnen handbereik is en er toch een volwaardig sociaal hart ontstaat om gasten te ontvangen. De centrale entree fungeert als een rustige sluis tussen de leefruimte en de zorgvleugel, waardoor privacy gewaarborgd blijft. Zo biedt de Wetering de perfecte balans tussen professionele zorgmogelijkheden en een warm, eigen thuis.

hugo.toml

@@ -28,25 +28,25 @@ paginate = 10
     weight = 10
 
 [[menus.main]]
-    name = "Mantelzorgwoningen"
-    identifier = "mantelzorgwoningen"
+    name = "Zorgwoningen"
+    identifier = "zorgwoningen"
     url = "/mantelzorgwoningen/"
     weight = 20
 
 [[menus.main]]
-    parent = "mantelzorgwoningen"
+    parent = "zorgwoningen"
     name = "Zorgwoning Berkel"
     url = "/modellen/model-berkel/"
     weight = 1
 
 [[menus.main]]
-    parent = "mantelzorgwoningen"
+    parent = "zorgwoningen"
     name = "Zorgwoning IJssel"
     url = "/modellen/model-ijssel/"
     weight = 1
 
 [[menus.main]]
-    parent = "mantelzorgwoningen"
+    parent = "zorgwoningen"
     name = "Zorgwoning Reest"
     url = "/modellen/model-reest/"
     weight = 1

hugo_stats.json

@@ -12,11 +12,9 @@
       "h1",
       "h2",
       "h3",
-      "h4",
       "h5",
       "h6",
       "head",
-      "header",
       "hr",
       "html",
       "i",
@@ -52,7 +50,6 @@
       "align-items-center",
       "align-items-end",
       "align-items-start",
-      "align-middle",
       "bg-light",
       "bg-primary",
       "bg-secondary",
@@ -69,8 +66,10 @@
       "bi-geo-alt-fill",
       "bi-house-door",
       "bi-house-door-fill",
+      "bi-hr",
       "bi-lamp",
       "bi-moon-stars",
+      "bi-person-hearts",
       "bi-telephone-fill",
       "bi-x-lg",
       "border",
@@ -80,10 +79,10 @@
       "btn",
       "btn-close",
       "btn-cta",
+      "btn-cta-white",
       "btn-lightbox-close",
       "card",
-      "card-secondary",
-      "col-11",
+      "card-primary",
       "col-12",
       "col-6",
       "col-auto",
@@ -103,7 +102,6 @@
       "collapse",
       "collapsed",
       "contact-icon-circle",
-      "contact-info",
       "container",
       "content",
       "cta-wrapper",
@@ -135,7 +133,6 @@
       "form-control",
       "form-label",
       "form-select",
-      "fs-6",
       "fw-bold",
       "g-0",
       "g-2",
@@ -175,7 +172,6 @@
       "mb-lg-5",
       "me-2",
       "me-3",
-      "me-lg-5",
       "modal",
       "modal-body",
       "modal-content",
@@ -188,6 +184,7 @@
       "model-card",
       "model-card-bg",
       "model-card-overlay",
+      "model-check",
       "model-info",
       "model-section",
       "modellen-sectie",
@@ -200,7 +197,9 @@
       "mt-5",
       "mt-auto",
       "mt-lg-5",
+      "mx-0",
       "mx-auto",
+      "my-3",
       "my-4",
       "my-5",
       "my-lg-5",
@@ -238,11 +237,11 @@
       "ps-4",
       "ps-lg-5",
       "pt-5",
+      "px-0",
       "px-3",
       "px-4",
       "px-5",
       "px-lg-5",
-      "py-10",
       "py-2",
       "py-3",
       "py-4",
@@ -278,7 +277,6 @@
       "text-uppercase",
       "text-white",
       "top-0",
-      "top-bar",
       "usp-bar",
       "usp-item",
       "usp-text",
@@ -287,6 +285,7 @@
     "ids": [
       "accordionFAQ",
       "achternaam",
+      "bericht",
       "btnSearch",
       "callme",
       "col-map",
@@ -296,34 +295,59 @@
       "collapseFAQ2",
       "collapseFAQ3",
       "collapseFAQ4",
+      "compact-design-groots-comfort",
       "contactModal",
+      "de-inpandige-veranda",
+      "doordacht-design-voor-zorg-en-comfort",
       "ecologisch-en-duurzaam-ontwerp",
+      "efficiënt-en-sociaal-wonen",
       "email",
+      "ergonomisch-slapen-en-verzorgen",
       "f-aanhef",
       "f-achternaam",
       "f-email",
       "f-telefoon",
       "faq",
+      "flexibel-maatwerk-voor-zorg-en-hobby",
       "form-success",
       "gallery-splide",
       "geen-cookies",
       "geen-onnodige-toegangen",
+      "harmonie-tussen-binnen-en-buiten",
+      "het-sociale-middelpunt-de-royale-leefkeuken",
       "hn-input",
       "hoe-lang-bewaren-we-uw-gegevens",
       "hoogwaardige-moderne-materialen",
+      "huisnummer",
+      "imposant-met-een-robuust-karakter",
       "karakteristiek-wonen-onder-riet",
       "lead-form",
       "lightbox-splide",
       "lightboxModal",
+      "luxe-en-gastvrijheid-zonder-compromissen",
       "map",
+      "maximale-ruimte-in-de-zorgkern",
       "model-eigenschappen",
       "model-splide",
+      "modelModal",
+      "model_model-amstel",
+      "model_model-berkel",
+      "model_model-berkel copy",
+      "model_model-ijssel",
+      "model_model-maas",
+      "model_model-reest",
+      "model_model-rijn",
+      "model_model-waal",
+      "model_model-wetering",
       "modellen",
-      "navbarDropdownmantelzorgwoningen",
+      "navbarDropdownzorgwoningen",
       "navbarNav",
       "nieuwsbrief",
       "panel",
       "pc-input",
+      "postcode",
+      "praktisch-en-doordacht-ingedeeld",
+      "privacy-notitie",
       "privacyCheck",
       "res-bouwjaar",
       "res-kavelformaat",
@@ -332,12 +356,15 @@
       "res-max",
       "riant-wonen-op-90m",
       "ruimte-voor-al-uw-ambities",
+      "ruimte-voor-zelfstandigheid",
       "slimme-l-vorm-voor-optimale-privacy",
       "telephone",
+      "tijdloze-architectuur",
       "uw-rechten",
       "uw-veiligheid-staat-voorop",
       "vergunningscheck",
-      "voornaam"
+      "voornaam",
+      "zelfstandigheid-behouden-met-minder-mobiliteit"
     ]
   }
 }

layouts/_default/model.html

@@ -1,14 +1,14 @@
 {{ define "main" }}
 <section class="model-section py-4">
     <div class="container">
-        <div class="row">
+        <div class="row g-5">
             {{ partial "hero-model.html" . }}
         </div>
     </div>
 </section>
 
 {{ with .Params.gallery }}
-<div id="gallery-splide" class="splide mt-2" aria-label="Afbeeldingen van model {{ $.Title }}">
+<div id="gallery-splide" class="splide my-5" aria-label="Afbeeldingen van model {{ $.Title }}">
     <div class="splide__track">
         <ul class="splide__list">
             {{ range . }}
@@ -56,36 +56,144 @@
         </div>
     </div>
 </div>
-
-<div class="container">
-    <div class="row">
-        <div class="col-11 mx-auto">
+<section class="model-section py-4">
+    <div class="container">
+        <div class="col-md-11 mx-auto">
             <div class="row g-5">
                 <div class="col-md-8">
-                    <article>
-                        <div class="content mt-4">
-                            {{ .Content }}
-                        </div>
-                </article>
+                    {{ .Content }}
                 </div>
                 <div class="col-md-4">
-                    <div class="card-secondary">
-                        <h4>Plattegrond bekijken</h4>
-                        <p>Bekijk de standaard indeling van de woning. Het is uiteraard mogelijk om aanpassingen te maken</p>
-                        <div class="bg-white shadow p-4 rounded-4 mb-4">
-                            <img class="img-fluid" src="{{ .Params.plattegrond }}">
-                        </div>
-                        <a class="btn btn-cta">Download plattegrond</a>
-                        
+                    <div class="card-primary">
+                        <h3 class="text-white pb-3 fw-bold">Bekijk plattegrond</h3>
+                        <p>U kan <a href="" class="text-white">de plattegrond direct bekijken</a> of een papieren exemplaar op A3 formaat thuis ontvangen.</p>
+                        <a class="btn btn-cta-white" role="button" type="button" data-bs-toggle="modal" data-bs-target="#modelModal">Thuis ontvangen</a>
                     </div>
                     
                 </div>
-            </div>       
+            </div> 
+            <hr class="mt-5">      
         </div>
     </div>
+</section>
+
+<div class="modal fade" id="modelModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-lg">
+        <div class="modal-content rounded-4 border-0 shadow p-lg-5 p-md-4">
+            <div class="modal-header border-0">
+                <div class="row">
+                    <h6 class="text-primary d-lg-inline-block">Ontvang de details thuis</h6>
+                    <h5 class="modal-title h3 d-block">Model plattegrond aanvragen (A3)</h5>
+                </div>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body p-4">
+                <form action="jouw-verwerkings-url" method="POST">
+                    <div class="row mb-3">
+                        <div class="col-md-6">
+                            <label for="voornaam" class="form-label">Voornaam</label>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="voornaam" name="voornaam" required>
+                        </div>
+                        <div class="col-md-6">
+                            <label for="achternaam" class="form-label">Achternaam</label>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="achternaam" name="achternaam" required>
+                        </div>
+                    </div>
+                    <div class="row mb-3">
+                        <div class="col-md-6">
+                            <label for="postcode" class="form-label">Postcode</label>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="postcode" name="postcode" placeholder="1234 AB" required>
+                        </div>
+                        <div class="col-md-6">
+                            <label for="huisnummer" class="form-label">Huisnummer & toevoeging</label>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="huisnummer" name="huisnummer" placeholder="12a" required>
+                        </div>
+                    </div>
+                    <div class="row mb-3">
+                        <div class="col-md-6">
+                            <label for="email" class="form-label">E-mailadres</label>
+                            <input type="email" class="form-control rounded-pill bg-light border-0" id="email" name="email" required>
+                        </div>
+                        <div class="col-md-6">
+                            <label for="telephone" class="form-label">Telefoonnummer</label>
+                            <input type="tel" class="form-control rounded-pill bg-light border-0" id="telephone" name="telephone" required>
+                        </div>
+                    </div>
+
+                    <hr class="my-4">
+
+                    <div class="mb-4">
+                        <label class="form-label d-block mb-1"><strong>Van welke modellen wilt u de plattegrond ontvangen?</strong></label>
+                        <p class="small text-muted mb-3">Selecteer maximaal 2 modellen.</p>
+                        <div class="row g-3">
+                            {{ $currentPageTitle := .Title }} {{ range (where .Site.RegularPages "Section" "modellen") }}
+                            <div class="col-6 col-md-4">
+                                <div class="form-check">
+                                    <input class="form-check-input model-check" 
+                                        type="checkbox" 
+                                        id="model_{{ .File.TranslationBaseName }}" 
+                                        name="modellen[]" 
+                                        value="{{ .Params.title }}"
+                                        {{ if eq .Title $currentPageTitle }} checked {{ end }}> <label class="form-check-label" for="model_{{ .File.TranslationBaseName }}">
+                                        {{ .Params.title }}
+                                    </label>
+                                </div>
+                            </div>
+                            {{ end }}
+                        </div>
+                    </div>
+
+                    <hr class="my-4">
+
+                    <div class="form-check mb-2">
+                        <input class="form-check-input" type="checkbox" id="nieuwsbrief" name="nieuwsbrief" checked>
+                        <label class="form-check-label" for="nieuwsbrief">
+                            Ja, ik meld mij aan voor de nieuwsbrief en blijf graag op de hoogte.
+                        </label>
+                    </div>
+                    <div class="form-check mb-2">
+                        <input class="form-check-input" type="checkbox" id="callme" name="callme">
+                        <label class="form-check-label" for="callme">
+                            Ik wil graag vrijblijvend & persoonlijk advies ontvangen
+                        </label>
+                    </div>
+
+                    <div class="">
+                        
+                        <button type="submit" class="btn btn-cta my-3">Plattegronden aanvragen</button>
+                        <p class="py-2 small text-muted">U gaat bij verzenden akkoord met de verwerking van uw gegevens zoals beschreven in ons privacybeleid.</p>
+                    </div>
+                </form>
+            </div>
+        </div>
+        
+    </div>
 </div>
 
+{{ partial "map.html" . }}
+
 <script>
+    const checkboxes = document.querySelectorAll('.model-check');
+    const maxSelection = 2;
+
+    checkboxes.forEach(checkbox => {
+        checkbox.addEventListener('change', function() {
+            const checkedCount = document.querySelectorAll('.model-check:checked').length;
+            
+            if (checkedCount >= maxSelection) {
+                checkboxes.forEach(cb => {
+                    if (!cb.checked) {
+                        cb.disabled = true;
+                    }
+                });
+            } else {
+                checkboxes.forEach(cb => {
+                    cb.disabled = false;
+                });
+            }
+        });
+    });
+
     document.addEventListener('DOMContentLoaded', function () {
         const mainGallery = document.querySelector('#gallery-splide');
         const lightboxEl = document.querySelector('#lightbox-splide');

layouts/index.html

@@ -11,7 +11,7 @@
                         {{ with .Params.info_section.image }}
                         <img src="{{ . | relURL }}" 
                              alt="{{ $.Params.info_section.image_alt | default "Van Emous Mantelzorgwoningen" }}" 
-                             class="img-fluid rounded-img shadow fade-left">
+                             class="img-fluid rounded-img shadow fade-left" loading="lazy">
                         {{ end }}
                     </div>
                 </div>
@@ -61,7 +61,7 @@
                         {{ with .Params.about_section.image }}
                         <img src="{{ . | relURL }}" 
                              alt="{{ $.Params.info_section.image_alt | default "Van Emous Mantelzorgwoningen" }}" 
-                             class="img-fluid rounded-img shadow">
+                             class="img-fluid rounded-img shadow" loading="lazy">
                         {{ end }}
                     </div>
                 </div>

layouts/partials/faq.html

@@ -5,7 +5,6 @@
         <div class="row">
             <div class="col-lg-8 col-md-10 mx-auto">
                 <div class="d-block pb-4 text-center">
-                    <p class="h6 text-primary">{{ .subtitle | default "Een snel overzicht" }}</p>
                     <h2 class="display-3">{{ .title | default "Veelgestelde vragen" }}</h2>
                 </div>
                 <div class="accordion faq-accordion" id="accordionFAQ">

layouts/partials/footer-contact.html

@@ -43,27 +43,27 @@
                     <div class="row g-4">
                         <div class="col-md-6">
                             <label for="voornaam" class="form-label">Voornaam</label>
-                            <input type="text" class="form-control rounded-pill bg-light border-0" id="voornaam" name="voornaam" required>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="voornaam" name="voornaam" required aria-required="true">
                         </div>
 
                         <div class="col-md-6">
                             <label for="achternaam" class="form-label">Achternaam</label>
-                            <input type="text" class="form-control rounded-pill bg-light border-0" id="achternaam" name="achternaam" required>
+                            <input type="text" class="form-control rounded-pill bg-light border-0" id="achternaam" name="achternaam" required aria-required="true">
                         </div>
 
                         <div class="col-md-6">
                             <label for="email" class="form-label">E-mailadres</label>
-                            <input type="email" class="form-control rounded-pill bg-light border-0" id="email" name="email" required>
+                            <input type="email" class="form-control rounded-pill bg-light border-0" id="email" name="email" required aria-required="true">
                         </div>
 
                         <div class="col-md-6">
                             <label for="telephone" class="form-label">Telefoon</label>
-                            <input type="tel" class="form-control rounded-pill bg-light border-0" id="telephone" name="telephone" required>
+                            <input type="tel" class="form-control rounded-pill bg-light border-0" id="telephone" name="telephone" required aria-required="true">
                         </div>
 
                         <div class="col-12">
-                            <label for="" class="form-label">Uw bericht</label>
-                            <textarea class="form-control bg-light border-0" rows="6"></textarea>
+                            <label for="bericht" class="form-label">Uw bericht</label>
+                            <textarea id="bericht" name="bericht" class="form-control bg-light border-0" rows="6" required aria-required="true"></textarea>
                         </div>
 
                         <div class="col-12">
@@ -75,8 +75,8 @@
                             </div>
 
                             <div class="">
-                                <p class=" py-2 small">U gaat bij verzenden akkoord met de verwerking van gegevens zoals beschreven in het privacybeleid.</p>
-                                <button type="submit" class="btn btn-cta">Verstuur aanvraag</button>
+                                <p id="privacy-notitie" class="py-2 small">U gaat bij verzenden akkoord met de verwerking van uw gegevens zoals beschreven in het privacybeleid.</p>
+                                <button type="submit" class="btn btn-cta" aria-describedby="privacy-notitie">Verstuur aanvraag</button>
                             </div>
                         </div>
                     </div>                    

layouts/partials/footer.html

@@ -4,7 +4,7 @@
             <div class="row">
                 
                 <div class="col-lg-4">
-                    <img src="/img/logo-box.svg" alt="Van Emous Logo" class="mb-4 pb-lg-5" style="height: 240px;max-width:100%;">
+                    <img src="/img/logo-box.svg" alt="Van Emous Logo" class="mb-4 pb-lg-5" style="height: 240px;max-width:100%;" loading="lazy">
                     <h5 class="fw-bold mb-3">Gratis brochure aanvragen</h5>
                     <form action="#" class="brochure-form">
                         <div class="mb-3">

layouts/partials/header.html

@@ -1,4 +1,4 @@
-<header>
+<!-- <header>
     <div class="top-bar py-2">
         <div class="container d-flex justify-content-between align-items-center">
             <nav class="contact-info" aria-label="Contactinformatie">
@@ -27,13 +27,13 @@
             {{ end }}
         </div>
     </div>
-</header>
+</header> -->
 
 <nav class="navbar navbar-expand-lg navbar-light bg-white py-3 sticky-top" aria-label="Hoofdmenu">        
     <div class="container">
         <a class="navbar-brand d-flex align-items-center" href="/" aria-label="Van Emous Mantelzorgwoningen Home">
             {{ if .Site.Params.logo }}
-                <img src="{{ .Site.Params.logo | relURL }}" alt="Van Emous Logo" height="60" class="me-2">
+                <img src="{{ .Site.Params.logo | relURL }}" alt="Van Emous Logo" height="60" class="me-2" loading="lazy">
             {{ end }}
         </a>
         
@@ -77,8 +77,8 @@
                 {{ end }}
 
                 <li class="nav-item ms-lg-3 d-flex align-items-center justify-content-end cta-wrapper">
-                    <a href="/brochure" class="btn btn-cta" role="button" type="button" data-bs-toggle="modal" data-bs-target="#contactModal">
-                        Contact
+                    <a href="/advies" class="btn btn-cta" role="button" type="button" data-bs-toggle="modal" data-bs-target="#contactModal">
+                        Vrijblijvend advies
                     </a>
                 </li>
             </ul>

layouts/partials/hero-model.html

@@ -20,7 +20,7 @@
     {{ end }}
 
     {{ if $hero.summary }}
-        <div id="model-eigenschappen" class="row g-3 mt-2">
+        <div id="model-eigenschappen" class="row g-3 mt-2 mx-0 px-0">
             {{ range $index, $element := $hero.summary }}
             {{ $delay := add 200 (mul $index 100) }}
             

layouts/partials/map.html

@@ -1,15 +1,15 @@
-<section class="info-section py-5 my-lg-5" id="vergunningscheck">
+<section class="info-section py-3" id="vergunningscheck">
   <div class="container overflow-hidden">
     <div class="row">
-      <div class="mb-4 col-md-8">
+      <div class="mb-4 col-md-11 mx-auto">
         <h6 class="text-primary">Doe een vooronderzoek</h6>
         <h2 class="display-5 fw-bold">Toets uw kavel</h2>
-        <p>U kunt geheel vrijblijvend een vooronderzoek doen naar uw mogelijkheden. Voer uw (plaatsing-)adres in en krijg direct resultaat en een uitgebreid verslag ontvangt u binnen 5 minuten per email.</p>
+        <p>U kunt geheel vrijblijvend een vooronderzoek doen naar uw mogelijkheden.</p>
         <p>Liever <a href="/contact">persoonlijk advies?</a> Dat kunt uiteraard ook.</p>
       </div>
     </div>
     
-    <div class="row flex-nowrap g-5 h-100" style="min-height: 400px;" data-aos="zoom-in" data-aos-offset="500" data-aos-delay="100"> 
+    <div class="row flex-nowrap g-5 h-100" style="min-height: 300px;" data-aos="zoom-in" data-aos-offset="200" data-aos-delay="100"> 
       
       <div id="col-map" class="col-12 mb-3" style="transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); flex-shrink: 0;">
         <div class="panel overflow-hidden shadow" style="height: 600px; position: relative;border:2px solid #fff;">

layouts/partials/mogelijkheden.html

@@ -34,7 +34,7 @@
                                 </a>
                             </div>
                             <div class="col-md-6 h-100">
-                                <img src="{{ .image | relURL }}" alt="{{ .title }}" class="h-100 w-100 object-fit-cover">
+                                <img src="{{ .image | relURL }}" alt="{{ .title }}" class="h-100 w-100 object-fit-cover" loading="lazy">
                             </div>
                         </div>
                     </div>
@@ -50,7 +50,7 @@
                                 {{ .link_text }} <i class="bi bi-chevron-right ms-1 text-primary"></i>
                             </a>
                         </div>
-                        <img src="{{ .image | relURL }}" alt="{{ .title }}" class="mt-auto w-100 object-fit-cover" style="height: 200px;">
+                        <img src="{{ .image | relURL }}" alt="{{ .title }}" class="mt-auto w-100 object-fit-cover" style="height: 200px;" loading="lazy">
                     </div>
                 </div>
                 {{ end }}

static/img/chevron-orange.svg

@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="8"
+   height="13"
+   viewBox="0 0 8 13"
+   fill="none"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="chevron-orange.svg"
+   inkscape:version="1.4.3 (0d15f75042, 2025-12-25)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="66.769231"
+     inkscape:cx="3.9988479"
+     inkscape:cy="6.5"
+     inkscape:window-width="1920"
+     inkscape:window-height="1099"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <path
+     d="M-8.58307e-06 1.06L1.06099 1.90735e-06L6.83999 5.777C6.93315 5.86957 7.00707 5.97965 7.05752 6.1009C7.10797 6.22215 7.13394 6.35218 7.13394 6.4835C7.13394 6.61483 7.10797 6.74486 7.05752 6.86611C7.00707 6.98736 6.93315 7.09743 6.83999 7.19L1.06099 12.97L0.000991344 11.91L5.42499 6.485L-8.58307e-06 1.06Z"
+     fill="white"
+     id="path1"
+     style="fill:#b95913;fill-opacity:1" />
+</svg>