{"id":8461,"date":"2026-10-03T11:40:17","date_gmt":"2026-10-03T09:40:17","guid":{"rendered":"https:\/\/soul-boats.de\/?page_id=8461"},"modified":"2026-10-05T11:25:13","modified_gmt":"2026-10-05T09:25:13","slug":"illusion","status":"publish","type":"page","link":"https:\/\/soul-boats.de\/en\/illusion\/","title":{"rendered":"Illusion"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8461\" class=\"elementor elementor-8461\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d92c11 e-flex e-con-boxed e-con e-parent\" data-id=\"1d92c11\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-af9c1ff elementor-widget elementor-widget-html\" data-id=\"af9c1ff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ILLUSION \u2013 HERO INTRO\r\n     Komplett in EIN Elementor-HTML-Widget einsetzen.\r\n\r\n     Optionales Hintergrundbild:\r\n     \"none\" bei --intro-bg durch\r\n     url('DEINE-WORDPRESS-BILD-URL') ersetzen.\r\n\r\n     Ohne Bild bleibt das Intro dunkelblau.\r\n\r\n     Alle sichtbaren Texte stehen direkt im HTML und sind \u00fcbersetzbar.\r\n     TranslatePress: Nur der Bootsname ist von \u00dcbersetzungen ausgenommen.\r\n     Im \u00dcbersetzungseditor bleibt das Intro als Seitenabschnitt sichtbar.\r\n-->\r\n\r\n<div\r\n  id=\"intro-illusion\"\r\n  style=\"--intro-bg: none;\"\r\n  hidden\r\n>\r\n  <div class=\"illusion-inner\">\r\n\r\n    <p class=\"illusion-type\">\r\n      One-Off\r\n      <span class=\"illusion-separator\" aria-hidden=\"true\">\u00b7<\/span>\r\n      Segelyacht\r\n    <\/p>\r\n\r\n    <p\r\n      class=\"illusion-name notranslate\"\r\n      translate=\"no\"\r\n      data-no-translation\r\n    >\r\n      ILLUSION\r\n    <\/p>\r\n\r\n    <div class=\"illusion-line\" aria-hidden=\"true\"><\/div>\r\n\r\n    <p class=\"illusion-tagline\">\r\n      Ein beeindruckendes Einzelst\u00fcck.\r\n    <\/p>\r\n\r\n    <div class=\"illusion-specs\">\r\n\r\n      <div>\r\n        <strong class=\"illusion-value\">8,60 m<\/strong>\r\n        <span class=\"illusion-label\">L\u00e4nge<\/span>\r\n      <\/div>\r\n\r\n      <div>\r\n        <strong class=\"illusion-value\">2,95 m<\/strong>\r\n        <span class=\"illusion-label\">Breite<\/span>\r\n      <\/div>\r\n\r\n      <div>\r\n        <strong class=\"illusion-value\">1,80 m<\/strong>\r\n        <span class=\"illusion-label\">Tiefgang<\/span>\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n  <button class=\"illusion-skip\" type=\"button\">\r\n    Intro \u00fcberspringen\r\n  <\/button>\r\n<\/div>\r\n\r\n<style>\r\n\r\n\/* Alle Gestaltungsregeln sind auf dieses Intro begrenzt. *\/\r\n\r\n#intro-illusion,\r\n#intro-illusion * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n#intro-illusion[hidden] {\r\n  display: none !important;\r\n}\r\n\r\n\r\n\/* Gesamter Intro-Bildschirm *\/\r\n\r\n#intro-illusion {\r\n  position: fixed;\r\n  inset: 0;\r\n  z-index: 999999;\r\n\r\n  display: grid;\r\n  place-items: center;\r\n\r\n  overflow: hidden;\r\n  isolation: isolate;\r\n\r\n  background: #071d30;\r\n  color: #edf2f5;\r\n\r\n  opacity: 1;\r\n  transition: opacity 1.5s ease;\r\n}\r\n\r\n\r\n\/* Optionales Hintergrundbild *\/\r\n\r\n#intro-illusion::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: -5%;\r\n  z-index: -2;\r\n\r\n  background-image: var(--intro-bg, none);\r\n  background-size: cover;\r\n  background-position: center;\r\n  background-repeat: no-repeat;\r\n\r\n  filter:\r\n    brightness(0.48)\r\n    saturate(0.9)\r\n    blur(5px);\r\n\r\n  animation: illusionBackground 4.5s ease-out both;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* Dunkle \u00dcberlagerung *\/\r\n\r\n#intro-illusion::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: -1;\r\n\r\n  background:\r\n    radial-gradient(\r\n      ellipse at center,\r\n      rgba(23, 58, 84, 0.12) 0%,\r\n      rgba(4, 20, 35, 0.55) 72%,\r\n      rgba(2, 12, 22, 0.78) 100%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* Inhalt *\/\r\n\r\n#intro-illusion .illusion-inner {\r\n  width: min(92vw, 1050px);\r\n  padding: 40px 20px 76px;\r\n\r\n  text-align: center;\r\n\r\n  animation: illusionContentIn 1.4s ease both;\r\n}\r\n\r\n\r\n\/* Bootstyp *\/\r\n\r\n#intro-illusion .illusion-type {\r\n  margin: 0 0 16px;\r\n\r\n  color: #c3d0d9;\r\n\r\n  font:\r\n    500 clamp(11px, 1.25vw, 15px)\/1.6\r\n    \"Montserrat\", Arial, sans-serif;\r\n\r\n  letter-spacing: 0.25em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n#intro-illusion .illusion-separator {\r\n  margin: 0 0.3em;\r\n}\r\n\r\n\r\n\/* Silberner Bootsname *\/\r\n\r\n#intro-illusion .illusion-name {\r\n  margin: 0;\r\n\r\n  color: #e8eef2;\r\n\r\n  font:\r\n    400 clamp(48px, 11vw, 140px)\/1.12\r\n    \"Cormorant Garamond\", Georgia, serif;\r\n\r\n  letter-spacing: 0.07em;\r\n  text-indent: 0.07em;\r\n\r\n  filter:\r\n    drop-shadow(0 8px 20px rgba(0, 0, 0, 0.42));\r\n}\r\n\r\n@supports ((background-clip: text) or (-webkit-background-clip: text)) {\r\n\r\n  #intro-illusion .illusion-name {\r\n    background:\r\n      linear-gradient(\r\n        180deg,\r\n        #ffffff 0%,\r\n        #e8edf1 28%,\r\n        #97aab9 49%,\r\n        #f0f5f8 72%,\r\n        #b8c6d0 100%\r\n      );\r\n\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n\r\n    color: transparent;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* Feine Trennlinie *\/\r\n\r\n#intro-illusion .illusion-line {\r\n  width: min(220px, 46vw);\r\n  height: 1px;\r\n\r\n  margin: 24px auto;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      transparent,\r\n      #adbfcc,\r\n      transparent\r\n    );\r\n}\r\n\r\n\r\n\/* Untertitel *\/\r\n\r\n#intro-illusion .illusion-tagline {\r\n  margin: 0;\r\n\r\n  color: #e4e9ed;\r\n\r\n  font:\r\n    400 clamp(19px, 2.4vw, 28px)\/1.5\r\n    \"Cormorant Garamond\", Georgia, serif;\r\n}\r\n\r\n\r\n\/* Abmessungen *\/\r\n\r\n#intro-illusion .illusion-specs {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  justify-content: center;\r\n\r\n  gap: clamp(24px, 5vw, 64px);\r\n  row-gap: 18px;\r\n\r\n  margin-top: 36px;\r\n\r\n  font-family: \"Montserrat\", Arial, sans-serif;\r\n}\r\n\r\n#intro-illusion .illusion-value {\r\n  display: block;\r\n\r\n  color: #e5edf2;\r\n\r\n  font-size: clamp(16px, 1.7vw, 20px);\r\n  font-weight: 500;\r\n  line-height: 1.4;\r\n\r\n  white-space: nowrap;\r\n}\r\n\r\n#intro-illusion .illusion-label {\r\n  display: block;\r\n\r\n  margin-top: 5px;\r\n\r\n  color: #aabbc8;\r\n\r\n  font-size: 10px;\r\n  line-height: 1.5;\r\n  letter-spacing: 0.16em;\r\n\r\n  text-transform: uppercase;\r\n}\r\n\r\n\r\n\/* Intro \u00fcberspringen *\/\r\n\r\n#intro-illusion .illusion-skip {\r\n  position: absolute;\r\n\r\n  bottom: max(22px, env(safe-area-inset-bottom, 0px));\r\n  left: 50%;\r\n\r\n  transform: translateX(-50%);\r\n\r\n  min-height: 44px;\r\n\r\n  margin: 0;\r\n  padding: 10px 18px;\r\n\r\n  border: 1px solid rgba(196, 210, 220, 0.3);\r\n  border-radius: 3px;\r\n\r\n  background: rgba(7, 29, 48, 0.35);\r\n  color: #cfdae2;\r\n\r\n  font:\r\n    400 11px\/1.4\r\n    \"Montserrat\", Arial, sans-serif;\r\n\r\n  letter-spacing: 0.06em;\r\n  text-transform: none;\r\n  white-space: nowrap;\r\n\r\n  box-shadow: none;\r\n\r\n  cursor: pointer;\r\n}\r\n\r\n#intro-illusion .illusion-skip:hover {\r\n  background: rgba(196, 210, 220, 0.1);\r\n  color: #ffffff;\r\n}\r\n\r\n#intro-illusion .illusion-skip:focus-visible {\r\n  outline: 2px solid #edf2f5;\r\n  outline-offset: 5px;\r\n}\r\n\r\n\r\n\/* Ausblenden *\/\r\n\r\n#intro-illusion.is-leaving {\r\n  opacity: 0;\r\n}\r\n\r\n\r\n\/* TranslatePress:\r\n   Sichtbar bleiben und Editor-Bedienelemente frei lassen. *\/\r\n\r\n#intro-illusion.illusion-translation-preview {\r\n  position: relative;\r\n  inset: auto;\r\n  z-index: 0;\r\n\r\n  width: 100%;\r\n  min-height: 620px;\r\n\r\n  opacity: 1;\r\n  transition: none;\r\n}\r\n\r\n#intro-illusion.illusion-translation-preview::before,\r\n#intro-illusion.illusion-translation-preview .illusion-inner {\r\n  animation: none;\r\n}\r\n\r\n#intro-illusion.illusion-translation-preview .illusion-inner {\r\n  width: min(100%, 1050px);\r\n}\r\n\r\n\r\n\/* Animationen *\/\r\n\r\n@keyframes illusionContentIn {\r\n\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(10px) scale(0.975);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0) scale(1);\r\n  }\r\n\r\n}\r\n\r\n@keyframes illusionBackground {\r\n\r\n  from {\r\n    transform: scale(1.09);\r\n  }\r\n\r\n  to {\r\n    transform: scale(1.04);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* Mobile Darstellung *\/\r\n\r\n@media (max-width: 767px) {\r\n\r\n  #intro-illusion .illusion-inner {\r\n    padding: 28px 10px 72px;\r\n  }\r\n\r\n  #intro-illusion .illusion-type {\r\n    letter-spacing: 0.17em;\r\n  }\r\n\r\n  #intro-illusion .illusion-line {\r\n    margin: 20px auto;\r\n  }\r\n\r\n  #intro-illusion .illusion-specs {\r\n    margin-top: 28px;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* Kleine Bildschirmh\u00f6he, beispielsweise im Querformat *\/\r\n\r\n@media (max-height: 500px) {\r\n\r\n  #intro-illusion .illusion-inner {\r\n    padding: 20px 10px 70px;\r\n  }\r\n\r\n  #intro-illusion .illusion-type {\r\n    margin-bottom: 5px;\r\n  }\r\n\r\n  #intro-illusion .illusion-name {\r\n    font-size: clamp(44px, 10vw, 70px);\r\n  }\r\n\r\n  #intro-illusion .illusion-line {\r\n    margin: 10px auto;\r\n  }\r\n\r\n  #intro-illusion .illusion-specs {\r\n    margin-top: 14px;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* Bei reduzierter Bewegung direkt zur Seite.\r\n   Die TranslatePress-Bearbeitungsansicht bleibt sichtbar. *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  #intro-illusion:not(.illusion-translation-preview) {\r\n    display: none !important;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n\r\n(function () {\r\n\r\n  const intro = document.getElementById('intro-illusion');\r\n\r\n  if (!intro || intro.dataset.started === 'true') {\r\n    return;\r\n  }\r\n\r\n  const params = new URLSearchParams(window.location.search);\r\n\r\n\r\n  \/* Im Elementor-Editor das Intro ausblenden. *\/\r\n\r\n  const isEditor =\r\n    params.has('elementor-preview') ||\r\n    document.body.classList.contains('elementor-editor-active') ||\r\n    (\r\n      window.elementorFrontend &&\r\n      typeof window.elementorFrontend.isEditMode === 'function' &&\r\n      window.elementorFrontend.isEditMode()\r\n    );\r\n\r\n  if (isEditor) {\r\n    intro.remove();\r\n    return;\r\n  }\r\n\r\n  intro.dataset.started = 'true';\r\n\r\n\r\n  \/* TranslatePress:\r\n     Keine Timer, keine Scrollsperre, kein automatisches Schlie\u00dfen.\r\n     Auch die Schaltfl\u00e4che bleibt hier zur \u00dcbersetzung stehen. *\/\r\n\r\n  if (params.has('trp-edit-translation')) {\r\n\r\n    intro.classList.add('illusion-translation-preview');\r\n    intro.hidden = false;\r\n\r\n    return;\r\n  }\r\n\r\n\r\n  \/* Besucher mit reduzierter Bewegung gelangen direkt zur Seite. *\/\r\n\r\n  if (\r\n    window.matchMedia('(prefers-reduced-motion: reduce)').matches\r\n  ) {\r\n    intro.remove();\r\n    return;\r\n  }\r\n\r\n\r\n  \/* Vorherigen Fokus und vorhandene Scroll-Einstellungen merken. *\/\r\n\r\n  const previousFocus = document.activeElement;\r\n\r\n  const scrollStyles = [\r\n    document.documentElement,\r\n    document.body\r\n  ].map(function (el) {\r\n\r\n    return {\r\n      el: el,\r\n      value: el.style.getPropertyValue('overflow'),\r\n      priority: el.style.getPropertyPriority('overflow')\r\n    };\r\n\r\n  });\r\n\r\n  let holdTimer;\r\n  let fadeTimer;\r\n  let safetyTimer;\r\n\r\n  let finished = false;\r\n\r\n\r\n  \/* Intro entfernen und vorherige Einstellungen wiederherstellen. *\/\r\n\r\n  function finish() {\r\n\r\n    if (finished) {\r\n      return;\r\n    }\r\n\r\n    finished = true;\r\n\r\n    clearTimeout(holdTimer);\r\n    clearTimeout(fadeTimer);\r\n    clearTimeout(safetyTimer);\r\n\r\n    document.removeEventListener('keydown', onKey);\r\n    window.removeEventListener('pagehide', finish);\r\n\r\n    const restoreFocus =\r\n      intro.contains(document.activeElement);\r\n\r\n    intro.remove();\r\n\r\n    scrollStyles.forEach(function (item) {\r\n\r\n      if (item.value) {\r\n\r\n        item.el.style.setProperty(\r\n          'overflow',\r\n          item.value,\r\n          item.priority\r\n        );\r\n\r\n      } else {\r\n\r\n        item.el.style.removeProperty('overflow');\r\n\r\n      }\r\n\r\n    });\r\n\r\n    if (\r\n      restoreFocus &&\r\n      previousFocus &&\r\n      previousFocus.isConnected\r\n    ) {\r\n\r\n      previousFocus.focus({\r\n        preventScroll: true\r\n      });\r\n\r\n    }\r\n\r\n  }\r\n\r\n\r\n  \/* Mit Escape \u00fcberspringen. *\/\r\n\r\n  function onKey(event) {\r\n\r\n    if (event.key === 'Escape') {\r\n      finish();\r\n    }\r\n\r\n  }\r\n\r\n\r\n  \/* Schaltfl\u00e4che und Ereignisse verbinden. *\/\r\n\r\n  intro\r\n    .querySelector('.illusion-skip')\r\n    .addEventListener('click', finish);\r\n\r\n  document.addEventListener('keydown', onKey);\r\n\r\n  window.addEventListener('pagehide', finish);\r\n\r\n\r\n  \/* 3 Sekunden Intro, danach 1,5 Sekunden weich ausblenden. *\/\r\n\r\n  safetyTimer = setTimeout(finish, 7000);\r\n\r\n  holdTimer = setTimeout(function () {\r\n\r\n    intro.classList.add('is-leaving');\r\n\r\n    fadeTimer = setTimeout(finish, 1500);\r\n\r\n  }, 3000);\r\n\r\n\r\n  \/* W\u00e4hrend des Intros das Scrollen verhindern. *\/\r\n\r\n  scrollStyles.forEach(function (item) {\r\n\r\n    item.el.style.setProperty(\r\n      'overflow',\r\n      'hidden',\r\n      'important'\r\n    );\r\n\r\n  });\r\n\r\n\r\n  \/* Intro anzeigen. *\/\r\n\r\n  intro.hidden = false;\r\n\r\n})();\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-937b02b e-flex e-con-boxed e-con e-parent\" data-id=\"937b02b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6b8cf6d elementor-widget elementor-widget-html\" data-id=\"6b8cf6d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================================================\r\n     ILLUSION \u2013 KOMPAKTER PERMANENTER SEITENHEADER\r\n     F\u00fcr Elementor und TranslatePress\r\n\r\n     Optionales Hintergrundbild:\r\n     Im Header bei --illusion-header-bg das Wort none durch\r\n     url('DEINE-WORDPRESS-BILD-URL') ersetzen.\r\n\r\n     Alle Beschriftungen sind normale HTML-Texte.\r\n     Nur der Bootsname ist von \u00dcbersetzungen ausgenommen.\r\n\r\n     Das Scrollziel ist direkt unter dem Header enthalten.\r\n     ================================================== -->\r\n\r\n\r\n<!-- Schriftarten -->\r\n\r\n<link\r\n  rel=\"preconnect\"\r\n  href=\"https:\/\/fonts.googleapis.com\"\r\n>\r\n\r\n<link\r\n  rel=\"preconnect\"\r\n  href=\"https:\/\/fonts.gstatic.com\"\r\n  crossorigin\r\n>\r\n\r\n<link\r\n  href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@300;400&amp;family=Playfair+Display:wght@600&amp;display=swap\"\r\n  rel=\"stylesheet\"\r\n>\r\n\r\n\r\n<!-- ==================================================\r\n     HEADER\r\n     Optionales Hintergrundbild oben beschrieben\r\n     ================================================== -->\r\n\r\n<header\r\n  id=\"illusion-page-hero\"\r\n  style=\"--illusion-header-bg: none;\"\r\n>\r\n\r\n  <div class=\"illusion-header-content\">\r\n\r\n    <!-- Bootsname bleibt in allen Sprachen unver\u00e4ndert -->\r\n\r\n    <h1\r\n      class=\"illusion-header-title notranslate\"\r\n      translate=\"no\"\r\n      data-no-translation\r\n    >\r\n      ILLUSION\r\n    <\/h1>\r\n\r\n\r\n    <!-- Bootstyp: mit TranslatePress \u00fcbersetzbar -->\r\n\r\n    <p class=\"illusion-header-model\">\r\n      One-Off \u00b7 Segelyacht\r\n    <\/p>\r\n\r\n\r\n    <!-- Dezente Trennlinie -->\r\n\r\n    <div\r\n      class=\"illusion-header-line\"\r\n      aria-hidden=\"true\"\r\n    ><\/div>\r\n\r\n\r\n    <!-- Untertitel: mit TranslatePress \u00fcbersetzbar -->\r\n\r\n    <p class=\"illusion-header-tagline\">\r\n      Ein beeindruckendes Einzelst\u00fcck.\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n\r\n  <!-- Scroll-Hinweis -->\r\n\r\n  <a\r\n    class=\"illusion-header-scroll\"\r\n    href=\"#illusion-inhalt\"\r\n  >\r\n\r\n    <span>Yacht entdecken<\/span>\r\n\r\n    <span\r\n      class=\"illusion-header-arrow\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      \u2193\r\n    <\/span>\r\n\r\n  <\/a>\r\n\r\n<\/header>\r\n\r\n\r\n<!-- Scrollziel:\r\n     Der n\u00e4chste Inhaltsabschnitt folgt unter diesem Widget.\r\n     Die ID illusion-inhalt auf dieser Seite nur einmal vergeben. -->\r\n\r\n<div\r\n  id=\"illusion-inhalt\"\r\n  aria-hidden=\"true\"\r\n><\/div>\r\n\r\n\r\n<style>\r\n\r\n\/* ==================================================\r\n   SANFTES SCROLLEN\r\n   ================================================== *\/\r\n\r\nhtml {\r\n  scroll-behavior: smooth;\r\n}\r\n\r\n\r\n\/* Abstand f\u00fcr eine eventuell feststehende Navigation *\/\r\n\r\n#illusion-inhalt {\r\n  height: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  scroll-margin-top: 90px;\r\n}\r\n\r\n\r\n\/* Einheitliche Gr\u00f6\u00dfenberechnung *\/\r\n\r\n#illusion-page-hero,\r\n#illusion-page-hero * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   ILLUSION \u2013 KOMPAKTER HERO-HEADER\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  \/* Volle Bildschirmbreite trotz Elementor-Container *\/\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n  margin-left: calc(50% - 50vw);\r\n\r\n  min-height: clamp(380px, 44vh, 520px);\r\n\r\n  display: grid;\r\n  place-items: center;\r\n\r\n  background: #071d30;\r\n  overflow: hidden;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   HINTERGRUNDFOTO\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero::before {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: -4%;\r\n  z-index: -2;\r\n\r\n  background-image: var(--illusion-header-bg, none);\r\n  background-position: center;\r\n  background-size: cover;\r\n  background-repeat: no-repeat;\r\n\r\n  filter:\r\n    brightness(0.56)\r\n    saturate(0.92);\r\n\r\n  transform: scale(1.04);\r\n\r\n  animation:\r\n    illusionHeaderBackgroundIn\r\n    2.5s\r\n    ease-out\r\n    both;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   MARINEBLAUE VIGNETTE\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: -1;\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(3, 17, 29, 0.30) 0%,\r\n      rgba(5, 30, 51, 0.26) 48%,\r\n      rgba(2, 15, 27, 0.76) 100%\r\n    ),\r\n\r\n    radial-gradient(\r\n      ellipse at center,\r\n      rgba(12, 49, 77, 0.05) 0%,\r\n      rgba(3, 17, 30, 0.54) 82%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   ZENTRIERTER INHALT\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-content {\r\n  width: min(90vw, 1000px);\r\n\r\n  padding:\r\n    clamp(58px, 6vw, 86px)\r\n    24px\r\n    clamp(92px, 7vw, 108px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   BOOTSNAME \u2013 HAUPT\u00dcBERSCHRIFT\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-title {\r\n  margin: 0;\r\n\r\n  font-family:\r\n    \"Playfair Display\",\r\n    Georgia,\r\n    serif;\r\n\r\n  font-size: clamp(48px, 8vw, 98px);\r\n  font-weight: 600;\r\n\r\n  line-height: 1.1;\r\n  letter-spacing: 0.04em;\r\n  text-indent: 0.04em;\r\n\r\n  color: #f7f6f2;\r\n\r\n  text-shadow:\r\n    0 10px 30px rgba(0, 0, 0, 0.52),\r\n    0 1px 0 rgba(255, 255, 255, 0.12);\r\n\r\n  animation:\r\n    illusionHeaderElementIn\r\n    1.3s\r\n    ease\r\n    0.15s\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   BOOTSTYP\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-model {\r\n  margin:\r\n    clamp(18px, 2.5vw, 26px)\r\n    0\r\n    0;\r\n\r\n  font-family:\r\n    \"Montserrat\",\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: clamp(12px, 1.5vw, 18px);\r\n  font-weight: 300;\r\n\r\n  line-height: 1.6;\r\n  letter-spacing: 0.27em;\r\n  text-transform: uppercase;\r\n\r\n  color: #c7ccd1;\r\n\r\n  animation:\r\n    illusionHeaderElementIn\r\n    1.3s\r\n    ease\r\n    0.35s\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   DEZENTE TRENNLINIE\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-line {\r\n  width: min(190px, 42vw);\r\n  height: 1px;\r\n\r\n  margin: 24px auto;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      transparent,\r\n      #adbfcc,\r\n      transparent\r\n    );\r\n\r\n  animation:\r\n    illusionHeaderElementIn\r\n    1.3s\r\n    ease\r\n    0.5s\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   UNTERTITEL\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-tagline {\r\n  margin: 0;\r\n\r\n  font-family:\r\n    \"Montserrat\",\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: clamp(14px, 1.6vw, 18px);\r\n  font-weight: 300;\r\n\r\n  line-height: 1.7;\r\n  letter-spacing: 0.025em;\r\n\r\n  color: #e2e8ed;\r\n\r\n  animation:\r\n    illusionHeaderElementIn\r\n    1.3s\r\n    ease\r\n    0.6s\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   SCROLL-HINWEIS\r\n\r\n   Der sichtbare Text ist zugleich der zug\u00e4ngliche\r\n   Linkname und kann mit TranslatePress \u00fcbersetzt werden.\r\n   ================================================== *\/\r\n\r\n#illusion-page-hero .illusion-header-scroll {\r\n  position: absolute;\r\n\r\n  left: 50%;\r\n  bottom: clamp(15px, 2vw, 24px);\r\n\r\n  transform: translateX(-50%);\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  gap: 6px;\r\n\r\n  width: max-content;\r\n  max-width: 90%;\r\n  min-height: 44px;\r\n\r\n  padding: 4px 12px;\r\n  text-align: center;\r\n\r\n  font-family:\r\n    \"Montserrat\",\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: 9px;\r\n  font-weight: 400;\r\n\r\n  line-height: 1.5;\r\n  letter-spacing: 0.22em;\r\n\r\n  text-transform: uppercase;\r\n  text-decoration: none;\r\n\r\n  color: rgba(225, 229, 232, 0.85);\r\n\r\n  transition: color 0.3s ease;\r\n}\r\n\r\n\r\n#illusion-page-hero .illusion-header-scroll:hover {\r\n  color: #ffffff;\r\n}\r\n\r\n\r\n#illusion-page-hero .illusion-header-scroll:focus-visible {\r\n  outline:\r\n    2px solid\r\n    rgba(255, 255, 255, 0.8);\r\n\r\n  outline-offset: 5px;\r\n}\r\n\r\n\r\n\/* Pfeil *\/\r\n\r\n#illusion-page-hero .illusion-header-arrow {\r\n  font-size: 18px;\r\n  line-height: 1;\r\n\r\n  animation:\r\n    illusionHeaderArrowMove\r\n    1.8s\r\n    ease-in-out\r\n    infinite;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   EINBLENDUNG DER INHALTE\r\n   ================================================== *\/\r\n\r\n@keyframes illusionHeaderElementIn {\r\n\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(12px);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   DEZENTE BEWEGUNG DES HINTERGRUNDES\r\n   ================================================== *\/\r\n\r\n@keyframes illusionHeaderBackgroundIn {\r\n\r\n  from {\r\n    opacity: 0.75;\r\n    transform: scale(1.08);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n    transform: scale(1.04);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   PFEILBEWEGUNG\r\n   ================================================== *\/\r\n\r\n@keyframes illusionHeaderArrowMove {\r\n\r\n  0%,\r\n  100% {\r\n    transform: translateY(0);\r\n  }\r\n\r\n  50% {\r\n    transform: translateY(5px);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   TABLET\r\n   ================================================== *\/\r\n\r\n@media (max-width: 1024px) {\r\n\r\n  #illusion-page-hero {\r\n    min-height: clamp(400px, 46vh, 500px);\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-title {\r\n    font-size: clamp(46px, 9vw, 88px);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   SMARTPHONE\r\n   ================================================== *\/\r\n\r\n@media (max-width: 767px) {\r\n\r\n  #illusion-page-hero {\r\n    min-height: 420px;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-content {\r\n    width: 94vw;\r\n    padding: 60px 20px 100px;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-title {\r\n    font-size: clamp(42px, 12vw, 74px);\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-model {\r\n    margin-top: 20px;\r\n\r\n    font-size: 12px;\r\n    letter-spacing: 0.20em;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-line {\r\n    margin: 22px auto;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-tagline {\r\n    font-size: 14px;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-scroll {\r\n    bottom: 18px;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   SEHR KLEINE SMARTPHONES\r\n   ================================================== *\/\r\n\r\n@media (max-width: 390px) {\r\n\r\n  #illusion-page-hero {\r\n    min-height: 400px;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-content {\r\n    padding: 55px 16px 90px;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-title {\r\n    font-size: clamp(38px, 12vw, 48px);\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-model {\r\n    font-size: 11px;\r\n    letter-spacing: 0.16em;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   REDUZIERTE BEWEGUNG\r\n   ================================================== *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  html {\r\n    scroll-behavior: auto;\r\n  }\r\n\r\n  #illusion-page-hero::before,\r\n  #illusion-page-hero .illusion-header-title,\r\n  #illusion-page-hero .illusion-header-model,\r\n  #illusion-page-hero .illusion-header-line,\r\n  #illusion-page-hero .illusion-header-tagline,\r\n  #illusion-page-hero .illusion-header-arrow {\r\n    animation: none;\r\n    opacity: 1;\r\n    transform: none;\r\n  }\r\n\r\n  #illusion-page-hero .illusion-header-scroll {\r\n    transition: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1dde064 e-flex e-con-boxed e-con e-parent\" data-id=\"1dde064\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5837d3b elementor-widget elementor-widget-html\" data-id=\"5837d3b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- =========================================================\r\n     ILLUSION \u2013 GALERIE, DATEN, AUSSTATTUNG UND KONTAKT\r\n     Komplett in EIN Elementor-HTML-Widget einsetzen.\r\n     Galerie startet bei jedem Seitenaufruf mit Bild 1.\r\n     ========================================================= -->\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n\r\n<link\r\n  href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@300;400;500;600&amp;family=Playfair+Display:wght@600&amp;display=swap\"\r\n  rel=\"stylesheet\"\r\n>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@9.4.1\/swiper-bundle.min.css\"\r\n>\r\n\r\n<section id=\"illusion-expose\" aria-labelledby=\"il-overview-title\">\r\n\r\n  <!-- GALERIE -->\r\n\r\n  <div class=\"il-gallery-column\">\r\n    <div class=\"il-gallery-shell\">\r\n\r\n      <div class=\"il-empty-gallery\">\r\n        <span aria-hidden=\"true\">\u25c7<\/span>\r\n        <strong>Bilder folgen<\/strong>\r\n        <p>Die Galerie wird derzeit erg\u00e4nzt.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"il-swiper swiper\" hidden>\r\n        <div class=\"swiper-wrapper\">\r\n\r\n          <!-- BILD 1 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/E2E5CB3B-484A-4BA6-8756-CE056C72A100.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 1\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 2 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/5D591273-FD53-4702-ABF0-F56455018803.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 2\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 3 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/E0A7D7B1-26C8-43CD-B8BC-6469293838C1.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 3\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 4 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/AA0B249E-E218-4840-9EFA-E568F6E56154.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 4\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 5 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/459D32A0-F5EA-484C-ACD5-49DFF6F367F9.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 6 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/9A7AB91C-C426-413C-A4B6-2D2C45939CF2.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 6\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 7 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/0087239A-9912-4967-A8A2-FCD73144C64E.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 8 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/5DDDEA42-D60F-4263-981F-8FEA14BE911F-2.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 9 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/FB647760-3F79-4F0B-91D2-A4B5ACF65676.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 10 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9221-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 11 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9214-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 12 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9172-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 13 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/FullSizeRender-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 14 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/FullSizeRender-2-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 15 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9201-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 16 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9197-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 17 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9204-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 18 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9191-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 19 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/IMG_9193-scaled.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 20 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/35A1C676-7033-41EE-A52A-45A2F26E0BDB-1.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 21 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/E890A288-0349-47A4-AFB0-3A81419FFF69.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <!-- BILD 22 -->\r\n\r\n          <div class=\"swiper-slide\">\r\n            <button class=\"il-photo\" type=\"button\" disabled>\r\n              <img\r\n                data-src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/10\/459D32A0-F5EA-484C-ACD5-49DFF6F367F9.jpg\"\r\n                alt=\"Segelyacht \u2013 Ansicht 5\"\r\n                loading=\"lazy\"\r\n                draggable=\"false\"\r\n                hidden\r\n              >\r\n              <span class=\"il-photo-placeholder\">Bild folgt<\/span>\r\n            <\/button>\r\n          <\/div>\r\n\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"il-image-counter\" hidden>1 \/ 22<\/div>\r\n\r\n      <button type=\"button\" class=\"il-nav il-prev\" hidden>\r\n        <span class=\"il-sr-only\">Vorheriges Bild<\/span>\r\n        <span aria-hidden=\"true\">\u2191<\/span>\r\n      <\/button>\r\n\r\n      <button type=\"button\" class=\"il-nav il-next\" hidden>\r\n        <span class=\"il-sr-only\">N\u00e4chstes Bild<\/span>\r\n        <span aria-hidden=\"true\">\u2193<\/span>\r\n      <\/button>\r\n\r\n    <\/div>\r\n\r\n    <button\r\n      type=\"button\"\r\n      class=\"il-gallery-play il-play-toggle\"\r\n      data-playing=\"false\"\r\n      hidden\r\n    >\r\n      <span class=\"il-play-start\">Galerie starten<\/span>\r\n      <span class=\"il-play-stop\">Galerie pausieren<\/span>\r\n    <\/button>\r\n\r\n    <div class=\"il-more-images\" role=\"note\">\r\n      <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n        <path d=\"M4 7.5h3l1.4-2h7.2l1.4 2h3a2 2 0 0 1 2 2v8.5a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9.5a2 2 0 0 1 2-2Z\"><\/path>\r\n        <circle cx=\"12\" cy=\"13\" r=\"3.5\"><\/circle>\r\n      <\/svg>\r\n\r\n      <div>\r\n        <strong>Weitere Bilder folgen<\/strong>\r\n        <p>Das Expos\u00e9 wird derzeit erg\u00e4nzt.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- DATENSPALTE -->\r\n\r\n  <div class=\"il-data-column\">\r\n    <div class=\"il-info-panel\">\r\n\r\n      <div class=\"il-panel-intro\">\r\n        <span\r\n          class=\"il-name notranslate\"\r\n          translate=\"no\"\r\n          data-no-translation\r\n        >Illusion<\/span>\r\n\r\n        <h2 id=\"il-overview-title\">One-Off im \u00dcberblick<\/h2>\r\n      <\/div>\r\n\r\n      <section\r\n        class=\"il-card il-techdata\"\r\n        aria-labelledby=\"il-tech-title\"\r\n      >\r\n        <header class=\"il-card-header\">\r\n          <h3 id=\"il-tech-title\">Technische Daten<\/h3>\r\n        <\/header>\r\n\r\n        <div class=\"il-card-content\">\r\n          <dl class=\"il-specs\">\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Ausf\u00fchrung<\/dt>\r\n              <dd>One-Off \u00b7 Einzelbau<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Bootsname<\/dt>\r\n              <dd\r\n                class=\"notranslate\"\r\n                translate=\"no\"\r\n                data-no-translation\r\n              >Illusion<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Bootstyp<\/dt>\r\n              <dd>Segelyacht<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Werft \/ Konstrukteur<\/dt>\r\n              <dd>Noch nicht bekannt<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Baujahr<\/dt>\r\n              <dd>Wird erg\u00e4nzt<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Rumpfmaterial<\/dt>\r\n              <dd>GFK<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>L\u00e4nge<\/dt>\r\n              <dd>8,60 m<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Breite<\/dt>\r\n              <dd>2,95 m<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Tiefgang<\/dt>\r\n              <dd>1,80 m<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Verdr\u00e4ngung<\/dt>\r\n              <dd>Wird erg\u00e4nzt<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Motor<\/dt>\r\n              <dd>Sol\u00e9 Dieselmotor \u00b7 16 PS \u00b7 Saildrive<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Innenausbau<\/dt>\r\n              <dd>Mahagoni<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Cockpit<\/dt>\r\n              <dd>Breit ausgef\u00fchrt<\/dd>\r\n            <\/div>\r\n\r\n            <div class=\"il-spec\">\r\n              <dt>Liegeplatz<\/dt>\r\n              <dd>Lelystad \u00b7 Niederlande<\/dd>\r\n            <\/div>\r\n\r\n          <\/dl>\r\n        <\/div>\r\n      <\/section>\r\n\r\n      <button\r\n        type=\"button\"\r\n        class=\"il-card-button\"\r\n        data-il-open-equipment\r\n        aria-haspopup=\"dialog\"\r\n        aria-controls=\"il-equipment\"\r\n      >\r\n        <span>Ausstattung<\/span>\r\n        <span aria-hidden=\"true\">\u203a<\/span>\r\n      <\/button>\r\n\r\n      <button\r\n        type=\"button\"\r\n        class=\"il-card-button il-broker-button\"\r\n        data-il-open-broker\r\n        aria-haspopup=\"dialog\"\r\n        aria-controls=\"il-broker-dialog\"\r\n      >\r\n        <span>Makler sagt<\/span>\r\n        <span aria-hidden=\"true\">\u203a<\/span>\r\n      <\/button>\r\n\r\n      <section\r\n        class=\"il-card il-contact-card\"\r\n        aria-labelledby=\"il-contact-title\"\r\n      >\r\n        <h3 id=\"il-contact-title\">Kontakt und Besichtigung<\/h3>\r\n\r\n        <p>\r\n          Ansprechpartner:\r\n          <strong\r\n            class=\"notranslate\"\r\n            translate=\"no\"\r\n            data-no-translation\r\n          >Hans-Thomas Roth<\/strong>\r\n        <\/p>\r\n\r\n        <p>\r\n          Telefon:\r\n          <a href=\"tel:+491637570675\">+49&nbsp;163&nbsp;7570675<\/a>\r\n        <\/p>\r\n\r\n        <p>\r\n          WhatsApp:\r\n          <a\r\n            href=\"https:\/\/wa.me\/491637570675\"\r\n            target=\"_blank\"\r\n            rel=\"noopener\"\r\n          >Nachricht senden<\/a>\r\n        <\/p>\r\n\r\n        <a\r\n          href=\"https:\/\/soul-boats.de\/contact\/\"\r\n          class=\"il-contact-button\"\r\n          target=\"_blank\"\r\n          rel=\"noopener\"\r\n        >Besichtigung anfragen<\/a>\r\n      <\/section>\r\n\r\n      <section\r\n        class=\"il-price-card\"\r\n        aria-labelledby=\"il-price-title\"\r\n      >\r\n        <span id=\"il-price-title\">Verkaufspreis<\/span>\r\n        <strong>4.700&nbsp;\u20ac<\/strong>\r\n      <\/section>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- AUSSTATTUNG -->\r\n\r\n  <dialog\r\n    id=\"il-equipment\"\r\n    class=\"il-equipment-dialog\"\r\n    aria-labelledby=\"il-equipment-title\"\r\n  >\r\n    <div class=\"il-dialog-titlebar\">\r\n      <span\r\n        class=\"il-name notranslate\"\r\n        translate=\"no\"\r\n        data-no-translation\r\n      >Illusion<\/span>\r\n\r\n      <h3 id=\"il-equipment-title\">Ausstattung<\/h3>\r\n\r\n      <button type=\"button\" class=\"il-dialog-close\">\r\n        <span class=\"il-sr-only\">Ausstattung schlie\u00dfen<\/span>\r\n        <span aria-hidden=\"true\">\u00d7<\/span>\r\n      <\/button>\r\n    <\/div>\r\n\r\n    <div class=\"il-dialog-content\">\r\n\r\n      <div class=\"il-equipment-notice\">\r\n        <strong>Ausstattung im \u00dcberblick<\/strong>\r\n        <p>\r\n          Die nachfolgende Ausstattung ist \u00fcbersichtlich nach Bereichen gegliedert.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <h4>Rumpf und Deck<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>GFK-Rumpf<\/li>\r\n        <li>Individuell gebaute One-Off-Segelyacht<\/li>\r\n        <li>Teakdeck, \u00fcberwiegend geklebt<\/li>\r\n        <li>Massive Decksbeschl\u00e4ge von Pfeiffer Marine<\/li>\r\n        <li>Teak-Handl\u00e4ufe<\/li>\r\n        <li>Feste Edelstahlreling<\/li>\r\n        <li>Ankerkasten<\/li>\r\n        <li>Selbstlenzendes Cockpit<\/li>\r\n        <li>Pinnensteuerung<\/li>\r\n        <li>Badeleiter<\/li>\r\n        <li>Decklicht<\/li>\r\n        <li>Persenning<\/li>\r\n      <\/ul>\r\n\r\n      <h4>Rigg und Segel<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>Gro\u00dfsegel<\/li>\r\n        <li>Genua<\/li>\r\n        <li>Furlex 200S Rollreffanlage<\/li>\r\n        <li>2 \u00d7 Meissner selbstholende Winschen in Schwarz<\/li>\r\n        <li>Lewmar-Winsch am Mast<\/li>\r\n      <\/ul>\r\n\r\n      <h4>Innenraum und Komfort<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>Innenausbau in Mahagoni<\/li>\r\n        <li>Deckenverkleidung aus Mahagoni<\/li>\r\n        <li>Viele Klappen und Schr\u00e4nke mit gro\u00dfz\u00fcgigem Stauraum<\/li>\r\n        <li>Navigationstisch mit Klappstuhl<\/li>\r\n        <li>Hundekoje mit Panoramafenster<\/li>\r\n        <li>Klappbarer Salontisch<\/li>\r\n        <li>Salonpolster mit sehr guter Haptik<\/li>\r\n        <li>Lautsprecher im Salon<\/li>\r\n      <\/ul>\r\n\r\n      <h4>Pantry und Sanit\u00e4r<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>Wallas Marine Ceramic Dieselkocher<\/li>\r\n        <li>Nasszelle mit Pump-WC<\/li>\r\n      <\/ul>\r\n\r\n      <h4>Motor und Bordtechnik<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>Sol\u00e9 Dieselmotor mit 16 PS<\/li>\r\n        <li>Saildrive<\/li>\r\n        <li>50-Liter-Dieseltank<\/li>\r\n        <li>Drehzahlmesser<\/li>\r\n        <li>Motortemperaturanzeige<\/li>\r\n        <li>Elektrische Bilgenpumpe<\/li>\r\n        <li>Manuelle Bilgenpumpe<\/li>\r\n      <\/ul>\r\n\r\n      <h4>Elektrik und Navigation<\/h4>\r\n      <ul class=\"il-equipment-grid\">\r\n        <li>230-V-Landanschluss<\/li>\r\n        <li>Sterling-Batterieladeger\u00e4t<\/li>\r\n        <li>230-V-Steckdosen<\/li>\r\n        <li>USB-Ladeanschluss<\/li>\r\n        <li>GPS<\/li>\r\n        <li>AdvanSea S400 Windanzeige<\/li>\r\n        <li>AdvanSea S400 Tiefenmesser<\/li>\r\n        <li>Kompass<\/li>\r\n      <\/ul>\r\n\r\n    <\/div>\r\n  <\/dialog>\r\n\r\n  <!-- MAKLERTEXT -->\r\n\r\n  <dialog\r\n    id=\"il-broker-dialog\"\r\n    class=\"il-broker-dialog\"\r\n    aria-labelledby=\"il-broker-title\"\r\n  >\r\n    <div class=\"il-broker-modal\">\r\n      <header class=\"il-broker-modal-head\">\r\n\r\n        <div class=\"il-broker-brand\">\r\n          <img\r\n            class=\"il-broker-brand-logo\"\r\n            src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/01\/cropped-ChatGPT-Image-28.-Jan.-2026-18_59_30.png\"\r\n            alt=\"SoulBoats\"\r\n            loading=\"eager\"\r\n            decoding=\"async\"\r\n          >\r\n        <\/div>\r\n\r\n        <button\r\n          type=\"button\"\r\n          class=\"il-broker-close\"\r\n          aria-label=\"Maklertext schlie\u00dfen\"\r\n        >\r\n          <span aria-hidden=\"true\">\u00d7<\/span>\r\n        <\/button>\r\n\r\n        <span class=\"il-broker-kicker\">Pers\u00f6nliche Einsch\u00e4tzung<\/span>\r\n        <h3 id=\"il-broker-title\">Makler sagt<\/h3>\r\n\r\n        <p class=\"il-broker-lead\">\r\n          Mein pers\u00f6nlicher Eindruck von der Illusion \u2013 offen, fachlich\r\n          und mit Blick auf die Details, die dieses One-Off besonders machen.\r\n        <\/p>\r\n\r\n      <\/header>\r\n\r\n      <div class=\"il-broker-modal-body\">\r\n        <div class=\"il-broker-text\">\r\n\r\n          <p>\r\n            Die Illusion ist f\u00fcr mich ein faszinierendes Boot und in dieser\r\n            Gr\u00f6\u00dfenklasse eine au\u00dfergew\u00f6hnliche Erscheinung. Schon an Deck f\u00e4llt\r\n            auf, wie solide und hochwertig die Yacht ausgef\u00fchrt wurde. Selbst eine\r\n            feste Edelstahlreling geh\u00f6rt zur Ausstattung. Die Beschl\u00e4ge sind\r\n            gro\u00dfz\u00fcgig dimensioniert und vermitteln ebenso wie viele andere Details\r\n            einen sehr robusten und wertigen Eindruck.\r\n          <\/p>\r\n\r\n          <p>\r\n            Besonders gelungen finde ich das breite und \u00fcbersichtliche Cockpit.\r\n            Es bietet viel Bewegungsfreiheit, ist praktisch aufgebaut und verleiht\r\n            der Illusion gleichzeitig ihre ganz eigene, unverwechselbare Optik.\r\n            Auch der Niedergang wurde mit viel \u00dcberlegung gestaltet. Die elegante\r\n            Niedergangst\u00fcr und die intelligent angeordneten Stufen nutzen den\r\n            vorhandenen Raum sehr effizient.\r\n          <\/p>\r\n\r\n          <p>\r\n            Unter Deck setzt sich dieser Eindruck fort. Der Innenraum ist\r\n            umfangreich in Mahagoni ausgef\u00fchrt und wurde erkennbar mit viel\r\n            Verstand und Liebe zum Detail geplant. Zahlreiche Klappen und Schr\u00e4nke,\r\n            der klappbare Salontisch, der Navigationstisch und weitere durchdachte\r\n            L\u00f6sungen sorgen daf\u00fcr, dass der vorhandene Platz sehr gut genutzt wird.\r\n            Die Stehh\u00f6he im Salon ist konstruktionsbedingt eher gering, daf\u00fcr wirkt\r\n            der Innenraum f\u00fcr ein Boot dieser Gr\u00f6\u00dfe erstaunlich durchdacht und\r\n            wohnlich.\r\n          <\/p>\r\n\r\n          <p>\r\n            Auch technisch hat die Illusion einiges zu bieten. Der Sol\u00e9-Dieselmotor\r\n            mit 16 PS und Saildrive kam 2011 neu an Bord. Mit 1,80 m Tiefgang besitzt\r\n            die Yacht zudem f\u00fcr ihre Gr\u00f6\u00dfe einen vergleichsweise tiefgehenden Kiel,\r\n            was insbesondere hinsichtlich Kursstabilit\u00e4t und Segeleigenschaften am\r\n            Wind interessant ist.\r\n          <\/p>\r\n\r\n          <p>\r\n            Nat\u00fcrlich ist auch die Illusion kein neues Boot. Bei den Fenstern sind\r\n            derzeit leichte Undichtigkeiten vorhanden. Nach meiner Einsch\u00e4tzung\r\n            handelt es sich dabei jedoch um einen \u00fcberschaubaren Punkt, da die\r\n            betreffenden Fenster neu abgedichtet werden k\u00f6nnen. Insgesamt \u00fcberwiegt\r\n            f\u00fcr mich deutlich der Eindruck einer au\u00dfergew\u00f6hnlich solide gebauten\r\n            und sehr individuell gestalteten Yacht.\r\n          <\/p>\r\n\r\n          <p>\r\n            Wer kein Boot von der Stange sucht, sondern Wert auf massive Bauweise,\r\n            hochwertige Details und einen ganz eigenen Charakter legt, sollte sich\r\n            die Illusion pers\u00f6nlich ansehen. Bei einer Besichtigung in Lelystad\r\n            l\u00e4sst sich am besten erkennen, wie viele durchdachte L\u00f6sungen und\r\n            besondere Details in diesem One-Off stecken.\r\n          <\/p>\r\n\r\n        <\/div>\r\n\r\n        <footer class=\"il-broker-signature\">\r\n          <span class=\"il-broker-signature-line\" aria-hidden=\"true\"><\/span>\r\n          <div>\r\n            <strong>Hans-Thomas Roth<\/strong>\r\n            <span>Yachtmakler \u00b7 SOULBOATS<\/span>\r\n          <\/div>\r\n        <\/footer>\r\n      <\/div>\r\n    <\/div>\r\n  <\/dialog>\r\n\r\n  <!-- GROSSE BILDANSICHT -->\r\n\r\n  <dialog class=\"il-lightbox\" aria-labelledby=\"il-lightbox-title\">\r\n\r\n    <div class=\"il-lb-topbar\">\r\n      <h3 id=\"il-lightbox-title\">Gro\u00dfe Bildansicht<\/h3>\r\n\r\n      <button type=\"button\" class=\"il-lb-close\">\r\n        <span>Schlie\u00dfen<\/span>\r\n        <span aria-hidden=\"true\"> \u00d7<\/span>\r\n      <\/button>\r\n    <\/div>\r\n\r\n    <div class=\"il-lb-view\">\r\n      <img class=\"il-lb-image\" alt=\"\" hidden>\r\n    <\/div>\r\n\r\n    <div class=\"il-lb-toolbar\">\r\n\r\n      <button type=\"button\" class=\"il-lb-prev\">\r\n        <span aria-hidden=\"true\">\u2039 <\/span>\r\n        <span>Vorheriges Bild<\/span>\r\n      <\/button>\r\n\r\n      <span class=\"il-lb-counter\">0 \/ 0<\/span>\r\n\r\n      <button\r\n        type=\"button\"\r\n        class=\"il-lb-play il-play-toggle\"\r\n        data-playing=\"false\"\r\n      >\r\n        <span class=\"il-play-start\">Diashow starten<\/span>\r\n        <span class=\"il-play-stop\">Diashow pausieren<\/span>\r\n      <\/button>\r\n\r\n      <button type=\"button\" class=\"il-lb-next\">\r\n        <span>N\u00e4chstes Bild<\/span>\r\n        <span aria-hidden=\"true\"> \u203a<\/span>\r\n      <\/button>\r\n\r\n    <\/div>\r\n  <\/dialog>\r\n\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* GRUNDLAYOUT *\/\r\n\r\n#illusion-expose {\r\n  --il-navy: #0b2844;\r\n  --il-navy-light: #174b70;\r\n  --il-silver: #c6cbd0;\r\n  --il-ink: #142433;\r\n  --il-muted: #65717c;\r\n  --il-radius: 20px;\r\n  --il-shadow: 0 18px 48px rgba(11,40,68,.12);\r\n  --il-gallery-width: clamp(330px,38vw,590px);\r\n  --il-slide-height: clamp(245px,31vh,390px);\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n  margin-left: calc(50% - 50vw);\r\n  display: grid;\r\n  grid-template-columns: var(--il-gallery-width) minmax(0,1fr);\r\n  gap: clamp(30px,5vw,82px);\r\n  align-items: start;\r\n  padding: clamp(34px,6vw,84px);\r\n  scroll-margin-top: 100px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at 12% 10%,\r\n      rgba(255,255,255,.95),\r\n      transparent 34%\r\n    ),\r\n    linear-gradient(145deg,#f7f7f5,#edf0f2);\r\n\r\n  color: var(--il-ink);\r\n  font-family: \"Montserrat\",Arial,sans-serif;\r\n}\r\n\r\n#illusion-expose,\r\n#illusion-expose * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n#illusion-expose [hidden] {\r\n  display: none !important;\r\n}\r\n\r\n#illusion-expose button {\r\n  font-family: inherit;\r\n  text-transform: none;\r\n  cursor: pointer;\r\n}\r\n\r\n#illusion-expose button:disabled {\r\n  cursor: default;\r\n}\r\n\r\n#illusion-expose button:focus-visible,\r\n#illusion-expose a:focus-visible,\r\n#illusion-expose summary:focus-visible {\r\n  outline: 3px solid #7298b5;\r\n  outline-offset: 4px;\r\n}\r\n\r\n#illusion-expose .il-sr-only {\r\n  position: absolute;\r\n  width: 1px;\r\n  height: 1px;\r\n  padding: 0;\r\n  margin: -1px;\r\n  overflow: hidden;\r\n  clip-path: inset(50%);\r\n  white-space: nowrap;\r\n  border: 0;\r\n}\r\n\r\n#illusion-expose .il-play-toggle[data-playing=\"true\"] .il-play-start,\r\n#illusion-expose .il-play-toggle[data-playing=\"false\"] .il-play-stop {\r\n  display: none;\r\n}\r\n\r\n\/* GALERIE *\/\r\n\r\n#illusion-expose .il-gallery-column {\r\n  width: 100%;\r\n  min-width: 0;\r\n  display: grid;\r\n  grid-template-rows: minmax(0,1fr) auto auto;\r\n  gap: 16px;\r\n}\r\n\r\n#illusion-expose .il-gallery-shell {\r\n  position: relative;\r\n  min-height: 560px;\r\n  overflow: hidden;\r\n  border-radius: 28px;\r\n}\r\n\r\n#illusion-expose .il-empty-gallery {\r\n  min-height: 560px;\r\n  height: 100%;\r\n  padding: 30px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  text-align: center;\r\n  background: linear-gradient(145deg,#dce5eb,#f8fafb);\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-empty-gallery > span {\r\n  font-size: 64px;\r\n  color: #899caa;\r\n}\r\n\r\n#illusion-expose .il-empty-gallery strong {\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: 30px;\r\n}\r\n\r\n#illusion-expose .il-empty-gallery p {\r\n  font-size: 13px;\r\n  line-height: 1.6;\r\n}\r\n\r\n#illusion-expose .il-swiper {\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n#illusion-expose .il-swiper .swiper-wrapper {\r\n  align-items: center;\r\n}\r\n\r\n#illusion-expose .il-swiper .swiper-slide {\r\n  height: var(--il-slide-height);\r\n  width: 100%;\r\n  overflow: hidden;\r\n  border-radius: var(--il-radius);\r\n  background: #e7edf1;\r\n  box-shadow: var(--il-shadow);\r\n}\r\n\r\n#illusion-expose .il-photo {\r\n  position: relative;\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  padding: 0;\r\n  margin: 0;\r\n  border: 0;\r\n  border-radius: inherit;\r\n  background: #e7edf1;\r\n  color: var(--il-navy);\r\n  overflow: hidden;\r\n  box-shadow: none;\r\n}\r\n\r\n#illusion-expose .il-photo:not(:disabled) {\r\n  cursor: zoom-in;\r\n}\r\n\r\n#illusion-expose .il-photo img {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  user-select: none;\r\n  -webkit-user-drag: none;\r\n}\r\n\r\n#illusion-expose .il-photo-placeholder {\r\n  position: absolute;\r\n  inset: 0;\r\n  display: grid;\r\n  place-items: center;\r\n  background: linear-gradient(145deg,#dce5eb,#f8fafb);\r\n  font-size: 16px;\r\n}\r\n\r\n\/* Fallback bei nicht geladener Galerie-Bibliothek *\/\r\n\r\n#illusion-expose .il-swiper:not(.swiper-initialized) {\r\n  overflow-y: auto;\r\n}\r\n\r\n#illusion-expose .il-swiper:not(.swiper-initialized) .swiper-wrapper {\r\n  display: block;\r\n  height: auto;\r\n}\r\n\r\n#illusion-expose .il-swiper:not(.swiper-initialized) .swiper-slide {\r\n  margin-bottom: 20px;\r\n}\r\n\r\n#illusion-expose .il-image-counter {\r\n  position: absolute;\r\n  right: 16px;\r\n  bottom: 16px;\r\n  z-index: 3;\r\n  min-width: 62px;\r\n  padding: 9px 13px;\r\n  border: 1px solid rgba(198,203,208,.34);\r\n  border-radius: 999px;\r\n  background: rgba(7,27,45,.8);\r\n  color: white;\r\n  font-size: 11px;\r\n  text-align: center;\r\n  pointer-events: none;\r\n}\r\n\r\n#illusion-expose .il-nav {\r\n  position: absolute;\r\n  left: 50%;\r\n  z-index: 4;\r\n  width: 46px;\r\n  height: 46px;\r\n  padding: 0;\r\n  display: grid;\r\n  place-items: center;\r\n  border: 1px solid rgba(198,203,208,.35);\r\n  border-radius: 50%;\r\n  background: rgba(11,40,68,.88);\r\n  color: white;\r\n  font-size: 25px;\r\n  line-height: 1;\r\n  transform: translateX(-50%);\r\n  opacity: 0;\r\n  transition: opacity .2s;\r\n}\r\n\r\n#illusion-expose .il-prev {\r\n  top: 18px;\r\n}\r\n\r\n#illusion-expose .il-next {\r\n  bottom: 18px;\r\n}\r\n\r\n#illusion-expose .il-gallery-shell:hover .il-nav,\r\n#illusion-expose .il-gallery-shell:focus-within .il-nav {\r\n  opacity: 1;\r\n}\r\n\r\n#illusion-expose .il-gallery-play {\r\n  justify-self: center;\r\n  min-height: 44px;\r\n  padding: 10px 20px;\r\n  border: 1px solid #b8c6d0;\r\n  border-radius: 999px;\r\n  background: white;\r\n  color: var(--il-navy);\r\n  font-size: 12px;\r\n}\r\n\r\n#illusion-expose .il-more-images {\r\n  min-height: 104px;\r\n  padding: 20px 22px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 16px;\r\n  border-radius: var(--il-radius);\r\n  background: linear-gradient(135deg,var(--il-navy),#123d5e);\r\n  color: white;\r\n  box-shadow: var(--il-shadow);\r\n}\r\n\r\n#illusion-expose .il-more-images svg {\r\n  flex: 0 0 34px;\r\n  width: 34px;\r\n  height: 34px;\r\n  fill: none;\r\n  stroke: var(--il-silver);\r\n  stroke-width: 1.5;\r\n}\r\n\r\n#illusion-expose .il-more-images strong {\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: 20px;\r\n  font-weight: 600;\r\n}\r\n\r\n#illusion-expose .il-more-images p {\r\n  margin: 5px 0 0;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n  color: #d6e0e7;\r\n}\r\n\r\n\/* DATEN UND KARTEN *\/\r\n\r\n#illusion-expose .il-data-column {\r\n  min-width: 0;\r\n}\r\n\r\n#illusion-expose .il-info-panel {\r\n  width: 100%;\r\n  max-width: 780px;\r\n  margin-left: auto;\r\n  display: grid;\r\n  gap: 15px;\r\n}\r\n\r\n#illusion-expose .il-panel-intro {\r\n  padding: 0 4px 14px;\r\n}\r\n\r\n#illusion-expose .il-name {\r\n  display: block;\r\n  margin-bottom: 7px;\r\n  font-size: 11px;\r\n  font-weight: 500;\r\n  letter-spacing: .3em;\r\n  text-transform: uppercase;\r\n  color: #667786;\r\n}\r\n\r\n#illusion-expose .il-panel-intro h2 {\r\n  margin: 0;\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: clamp(28px,4vw,44px);\r\n  line-height: 1.1;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-card,\r\n#illusion-expose .il-card-button,\r\n#illusion-expose .il-price-card {\r\n  width: 100%;\r\n  border: 1px solid rgba(11,40,68,.08);\r\n  border-radius: var(--il-radius);\r\n  background: rgba(255,255,255,.9);\r\n  box-shadow: var(--il-shadow);\r\n  overflow: hidden;\r\n}\r\n\r\n#illusion-expose .il-card-header,\r\n#illusion-expose .il-card-button,\r\n#illusion-expose .il-accordion summary,\r\n#illusion-expose .il-price-card {\r\n  background: linear-gradient(\r\n    135deg,\r\n    var(--il-navy),\r\n    var(--il-navy-light)\r\n  );\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-card-header {\r\n  padding: 17px 20px;\r\n}\r\n\r\n#illusion-expose .il-card-header h3,\r\n#illusion-expose .il-contact-card h3 {\r\n  margin: 0;\r\n  font-family: inherit;\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  letter-spacing: .12em;\r\n  line-height: 1.6;\r\n  text-transform: uppercase;\r\n}\r\n\r\n#illusion-expose .il-card-header h3 {\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-card-content {\r\n  padding: 15px 20px 18px;\r\n}\r\n\r\n#illusion-expose .il-specs {\r\n  display: grid;\r\n  margin: 0;\r\n}\r\n\r\n#illusion-expose .il-spec {\r\n  display: grid;\r\n  grid-template-columns: minmax(0,1fr) minmax(0,1fr);\r\n  gap: 20px;\r\n  padding: 9px 0;\r\n  border-bottom: 1px solid rgba(11,40,68,.08);\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n#illusion-expose .il-spec:last-child {\r\n  border: 0;\r\n}\r\n\r\n#illusion-expose .il-spec dt {\r\n  font-weight: 500;\r\n  color: #34495a;\r\n}\r\n\r\n#illusion-expose .il-spec dd {\r\n  margin: 0;\r\n  text-align: right;\r\n  color: var(--il-muted);\r\n}\r\n\r\n#illusion-expose .il-card-button {\r\n  min-height: 58px;\r\n  padding: 16px 20px;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: 18px;\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  letter-spacing: .12em;\r\n  text-transform: uppercase;\r\n  text-align: left;\r\n  line-height: 1.5;\r\n  cursor: pointer;\r\n}\r\n\r\n#illusion-expose .il-card-button > span {\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-card-button > span:last-child {\r\n  font-size: 25px;\r\n}\r\n\r\n#illusion-expose .il-broker-button {\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n#illusion-expose .il-broker-button::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  background: linear-gradient(\r\n    110deg,\r\n    transparent 0 35%,\r\n    rgba(255,255,255,.08) 50%,\r\n    transparent 65% 100%\r\n  );\r\n  transform: translateX(-130%);\r\n  transition: transform .65s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n#illusion-expose .il-broker-button:hover::after,\r\n#illusion-expose .il-broker-button:focus-visible::after {\r\n  transform: translateX(130%);\r\n}\r\n\r\n#illusion-expose .il-contact-card {\r\n  padding: 21px;\r\n  font-size: 13px;\r\n  line-height: 1.6;\r\n}\r\n\r\n#illusion-expose .il-contact-card h3 {\r\n  margin-bottom: 12px;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-contact-card p {\r\n  margin: 6px 0;\r\n  color: #526171;\r\n}\r\n\r\n#illusion-expose .il-contact-card a:not(.il-contact-button) {\r\n  color: inherit;\r\n}\r\n\r\n#illusion-expose .il-contact-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  min-height: 44px;\r\n  margin-top: 14px;\r\n  padding: 11px 17px;\r\n  border-radius: 999px;\r\n  background: var(--il-navy);\r\n  color: white;\r\n  text-decoration: none;\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n}\r\n\r\n#illusion-expose .il-contact-button:hover {\r\n  background: var(--il-navy-light);\r\n}\r\n\r\n#illusion-expose .il-price-card {\r\n  padding: 21px;\r\n  display: flex;\r\n  align-items: baseline;\r\n  justify-content: space-between;\r\n  gap: 20px;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n#illusion-expose .il-price-card > span {\r\n  font-size: 11px;\r\n  letter-spacing: .12em;\r\n  text-transform: uppercase;\r\n  color: #d4dfe7;\r\n}\r\n\r\n#illusion-expose .il-price-card strong {\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: clamp(23px,3vw,34px);\r\n  font-weight: 600;\r\n  line-height: 1.2;\r\n  color: white;\r\n}\r\n\r\n\/* DIALOGE *\/\r\n\r\nhtml.il-modal-open,\r\nbody.il-modal-open {\r\n  overflow: hidden !important;\r\n}\r\n\r\n#illusion-expose dialog:not([open]) {\r\n  display: none;\r\n}\r\n\r\n#illusion-expose .il-equipment-dialog {\r\n  width: min(1120px,94vw);\r\n  max-width: 94vw;\r\n  max-height: calc(100svh - 54px);\r\n  margin: auto;\r\n  padding: 0;\r\n  border: 1px solid rgba(198,203,208,.18);\r\n  border-radius: 26px;\r\n  background: #f7f8f9;\r\n  box-shadow: 0 38px 110px rgba(0,0,0,.48);\r\n  color: var(--il-ink);\r\n  overflow: auto;\r\n  font-family: inherit;\r\n}\r\n\r\n#illusion-expose .il-equipment-dialog::backdrop {\r\n  background: rgba(3,14,24,.78);\r\n  backdrop-filter: blur(8px);\r\n}\r\n\r\n#illusion-expose .il-dialog-titlebar {\r\n  position: sticky;\r\n  top: 0;\r\n  z-index: 1;\r\n  padding: 22px 86px 22px 26px;\r\n  background: linear-gradient(\r\n    135deg,\r\n    var(--il-navy),\r\n    var(--il-navy-light)\r\n  );\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-dialog-titlebar .il-name {\r\n  color: var(--il-silver);\r\n}\r\n\r\n#illusion-expose .il-dialog-titlebar h3 {\r\n  margin: 0;\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: clamp(24px,3vw,36px);\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-dialog-close {\r\n  position: absolute;\r\n  top: 22px;\r\n  right: 22px;\r\n  width: 44px;\r\n  height: 44px;\r\n  padding: 0;\r\n  border: 1px solid #d8e1e8;\r\n  border-radius: 50%;\r\n  background: white;\r\n  color: var(--il-navy);\r\n  font-size: 27px;\r\n  line-height: 1;\r\n}\r\n\r\n#illusion-expose .il-dialog-content {\r\n  padding: 24px 26px 30px;\r\n}\r\n\r\n#illusion-expose .il-equipment-notice {\r\n  margin-bottom: 25px;\r\n  padding: 18px 20px;\r\n  border-left: 3px solid #899199;\r\n  border-radius: 0 14px 14px 0;\r\n  background: rgba(11,40,68,.06);\r\n}\r\n\r\n#illusion-expose .il-equipment-notice strong {\r\n  font-size: 14px;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-equipment-notice p {\r\n  margin: 6px 0 0;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n  color: var(--il-muted);\r\n}\r\n\r\n#illusion-expose .il-dialog-content h4 {\r\n  margin: 25px 0 12px;\r\n  font-family: inherit;\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  letter-spacing: .12em;\r\n  text-transform: uppercase;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-equipment-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(\r\n    auto-fit,\r\n    minmax(min(230px,100%),1fr)\r\n  );\r\n  gap: 12px;\r\n  margin: 0;\r\n  padding: 0;\r\n  list-style: none;\r\n}\r\n\r\n#illusion-expose .il-equipment-grid li {\r\n  padding: 15px 16px;\r\n  border: 1px solid rgba(11,40,68,.08);\r\n  border-radius: 15px;\r\n  background: white;\r\n  font-size: 12px;\r\n  line-height: 1.6;\r\n  color: #526171;\r\n}\r\n\r\n\/* MAKLERTEXT *\/\r\n\r\n#illusion-expose .il-broker-dialog {\r\n  width: min(900px,92vw);\r\n  max-width: 92vw;\r\n  max-height: calc(100svh - 48px);\r\n  margin: auto;\r\n  padding: 0;\r\n  border: 1px solid rgba(198,203,208,.3);\r\n  border-radius: 30px;\r\n  background: #f8f9fa;\r\n  color: var(--il-ink);\r\n  box-shadow:\r\n    0 42px 120px rgba(0,0,0,.42),\r\n    0 8px 28px rgba(11,40,68,.16);\r\n  overflow: auto;\r\n  font-family: inherit;\r\n}\r\n\r\n#illusion-expose .il-broker-dialog::backdrop {\r\n  background: rgba(3,14,24,.70);\r\n  backdrop-filter: blur(8px) saturate(.8);\r\n  -webkit-backdrop-filter: blur(8px) saturate(.8);\r\n}\r\n\r\n#illusion-expose .il-broker-modal {\r\n  position: relative;\r\n  min-height: 100%;\r\n  background:\r\n    radial-gradient(\r\n      circle at 92% 0%,\r\n      rgba(255,255,255,.12),\r\n      transparent 26%\r\n    ),\r\n    #f8f9fa;\r\n}\r\n\r\n#illusion-expose .il-broker-modal-head {\r\n  position: relative;\r\n  padding: 100px 76px 42px;\r\n  overflow: hidden;\r\n  background:\r\n    radial-gradient(\r\n      circle at 88% 8%,\r\n      rgba(255,255,255,.14),\r\n      transparent 28%\r\n    ),\r\n    linear-gradient(\r\n      135deg,\r\n      #081f36 0%,\r\n      var(--il-navy) 48%,\r\n      var(--il-navy-light) 100%\r\n    );\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-broker-modal-head::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 76px;\r\n  bottom: 0;\r\n  width: 92px;\r\n  height: 2px;\r\n  background: linear-gradient(\r\n    90deg,\r\n    #d7dde2,\r\n    rgba(215,221,226,.08)\r\n  );\r\n}\r\n\r\n#illusion-expose .il-broker-brand {\r\n  position: absolute;\r\n  top: 21px;\r\n  left: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  width: 190px;\r\n  max-width: calc(100% - 115px);\r\n  user-select: none;\r\n  pointer-events: none;\r\n}\r\n\r\n#illusion-expose .il-broker-brand-logo {\r\n  display: block;\r\n  width: 100%;\r\n  height: auto;\r\n  filter: brightness(0) invert(1);\r\n  opacity: .96;\r\n}\r\n\r\n#illusion-expose .il-broker-close {\r\n  position: absolute;\r\n  top: 24px;\r\n  right: 26px;\r\n  width: 46px;\r\n  height: 46px;\r\n  padding: 0;\r\n  display: grid;\r\n  place-items: center;\r\n  border: 1px solid rgba(255,255,255,.35);\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,.08);\r\n  color: white;\r\n  font-size: 28px;\r\n  font-weight: 300;\r\n  line-height: 1;\r\n  backdrop-filter: blur(8px);\r\n  transition:\r\n    background .2s ease,\r\n    transform .2s ease,\r\n    border-color .2s ease;\r\n}\r\n\r\n#illusion-expose .il-broker-close:hover {\r\n  background: rgba(255,255,255,.16);\r\n  border-color: rgba(255,255,255,.55);\r\n  transform: rotate(4deg);\r\n}\r\n\r\n#illusion-expose .il-broker-kicker {\r\n  display: block;\r\n  margin-bottom: 10px;\r\n  font-size: 10px;\r\n  font-weight: 600;\r\n  letter-spacing: .22em;\r\n  text-transform: uppercase;\r\n  color: #c7d3dc;\r\n}\r\n\r\n#illusion-expose .il-broker-modal-head h3 {\r\n  margin: 0;\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: clamp(35px,5vw,58px);\r\n  font-weight: 600;\r\n  line-height: 1.05;\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-broker-lead {\r\n  max-width: 630px;\r\n  margin: 18px 0 0;\r\n  font-size: 13px;\r\n  line-height: 1.8;\r\n  color: #d8e2e9;\r\n}\r\n\r\n#illusion-expose .il-broker-modal-body {\r\n  padding: 40px 76px 44px;\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(11,40,68,.035),\r\n      transparent 110px\r\n    ),\r\n    #f8f9fa;\r\n}\r\n\r\n#illusion-expose .il-broker-text {\r\n  max-width: 720px;\r\n  margin: 0 auto;\r\n}\r\n\r\n#illusion-expose .il-broker-text p {\r\n  margin: 0 0 20px;\r\n  font-size: 14px;\r\n  line-height: 1.88;\r\n  color: #445565;\r\n}\r\n\r\n#illusion-expose .il-broker-text p:first-child::first-letter {\r\n  float: left;\r\n  margin: 7px 9px 0 0;\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: 48px;\r\n  line-height: .72;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-broker-text p:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n#illusion-expose .il-broker-signature {\r\n  max-width: 720px;\r\n  margin: 34px auto 0;\r\n  padding-top: 22px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 16px;\r\n  border-top: 1px solid rgba(11,40,68,.1);\r\n}\r\n\r\n#illusion-expose .il-broker-signature-line {\r\n  width: 46px;\r\n  height: 1px;\r\n  background: var(--il-navy);\r\n  opacity: .55;\r\n}\r\n\r\n#illusion-expose .il-broker-signature div {\r\n  display: grid;\r\n  gap: 3px;\r\n}\r\n\r\n#illusion-expose .il-broker-signature strong {\r\n  font-family: \"Playfair Display\",Georgia,serif;\r\n  font-size: 17px;\r\n  color: var(--il-navy);\r\n}\r\n\r\n#illusion-expose .il-broker-signature span:not(.il-broker-signature-line) {\r\n  font-size: 9px;\r\n  font-weight: 500;\r\n  letter-spacing: .14em;\r\n  text-transform: uppercase;\r\n  color: var(--il-muted);\r\n}\r\n\r\n\/* GROSSE BILDANSICHT *\/\r\n\r\n#illusion-expose .il-lightbox {\r\n  position: fixed;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  max-width: none;\r\n  max-height: none;\r\n  margin: 0;\r\n  padding: 18px;\r\n  border: 0;\r\n  background: rgba(3,14,24,.96);\r\n  color: white;\r\n  font-family: inherit;\r\n}\r\n\r\n#illusion-expose .il-lightbox[open] {\r\n  display: grid;\r\n  grid-template-rows: auto minmax(0,1fr) auto;\r\n  gap: 12px;\r\n}\r\n\r\n#illusion-expose .il-lightbox::backdrop {\r\n  background: rgba(3,14,24,.8);\r\n}\r\n\r\n#illusion-expose .il-lb-topbar {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 20px;\r\n}\r\n\r\n#illusion-expose .il-lb-topbar h3 {\r\n  margin: 0;\r\n  font-family: inherit;\r\n  font-size: 14px;\r\n  color: white;\r\n}\r\n\r\n#illusion-expose .il-lb-view {\r\n  min-height: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n#illusion-expose .il-lb-image {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: contain;\r\n}\r\n\r\n#illusion-expose .il-lb-toolbar {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-wrap: wrap;\r\n  gap: 10px;\r\n}\r\n\r\n#illusion-expose .il-lightbox button {\r\n  min-height: 44px;\r\n  padding: 10px 15px;\r\n  border: 1px solid #647989;\r\n  border-radius: 999px;\r\n  background: #183247;\r\n  color: white;\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n}\r\n\r\n#illusion-expose .il-lb-counter {\r\n  padding: 8px;\r\n  font-size: 12px;\r\n}\r\n\r\n\/* TRANSLATEPRESS *\/\r\n\r\n#illusion-expose.il-translation-mode .il-equipment-dialog,\r\n#illusion-expose.il-translation-mode .il-broker-dialog,\r\n#illusion-expose.il-translation-mode .il-lightbox {\r\n  grid-column: 1 \/ -1;\r\n  position: relative;\r\n  inset: auto;\r\n  width: 100%;\r\n  max-width: 100%;\r\n  height: auto;\r\n  max-height: none;\r\n  margin: 0;\r\n  box-shadow: none;\r\n}\r\n\r\n#illusion-expose.il-translation-mode .il-broker-dialog {\r\n  border-radius: 20px;\r\n  max-height: none;\r\n}\r\n\r\n#illusion-expose.il-translation-mode .il-lightbox {\r\n  min-height: 180px;\r\n  border-radius: 20px;\r\n}\r\n\r\n#illusion-expose.il-translation-mode .il-gallery-column {\r\n  height: auto !important;\r\n}\r\n\r\n#illusion-expose.il-translation-mode .il-gallery-shell {\r\n  max-height: 700px;\r\n}\r\n\r\n#illusion-expose.il-translation-mode .il-play-toggle .il-play-start,\r\n#illusion-expose.il-translation-mode .il-play-toggle .il-play-stop {\r\n  display: block;\r\n}\r\n\r\n\/* TABLET *\/\r\n\r\n@media (max-width: 1024px) {\r\n  #illusion-expose {\r\n    grid-template-columns: 1fr;\r\n    gap: 38px;\r\n  }\r\n\r\n  #illusion-expose .il-gallery-column {\r\n    height: auto;\r\n  }\r\n\r\n  #illusion-expose .il-gallery-shell {\r\n    height: 74vh;\r\n    min-height: 560px;\r\n  }\r\n\r\n  #illusion-expose .il-info-panel {\r\n    max-width: none;\r\n  }\r\n\r\n  #illusion-expose .il-nav {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n\/* SMARTPHONE *\/\r\n\r\n@media (max-width: 560px) {\r\n  #illusion-expose {\r\n    --il-slide-height: clamp(195px,33vh,285px);\r\n    padding: 22px 17px 34px;\r\n  }\r\n\r\n  #illusion-expose .il-gallery-shell {\r\n    height: 68vh;\r\n    min-height: 500px;\r\n    border-radius: 22px;\r\n  }\r\n\r\n  #illusion-expose .il-empty-gallery {\r\n    min-height: 500px;\r\n  }\r\n\r\n  #illusion-expose .il-more-images {\r\n    min-height: 96px;\r\n    padding: 18px;\r\n  }\r\n\r\n  #illusion-expose .il-more-images strong {\r\n    font-size: 18px;\r\n  }\r\n\r\n  #illusion-expose .il-panel-intro h2 {\r\n    font-size: 31px;\r\n  }\r\n\r\n  #illusion-expose .il-spec {\r\n    grid-template-columns: 1fr;\r\n    gap: 4px;\r\n  }\r\n\r\n  #illusion-expose .il-spec dd {\r\n    text-align: left;\r\n  }\r\n\r\n  #illusion-expose .il-dialog-content {\r\n    padding: 20px 17px 25px;\r\n  }\r\n\r\n  #illusion-expose .il-dialog-titlebar {\r\n    padding: 20px 75px 20px 17px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-dialog {\r\n    width: min(94vw,900px);\r\n    max-width: 94vw;\r\n    max-height: calc(100svh - 24px);\r\n    border-radius: 22px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-modal-head {\r\n    padding: 92px 22px 30px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-modal-head::after {\r\n    left: 22px;\r\n    width: 68px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-brand {\r\n    top: 21px;\r\n    left: 18px;\r\n    width: 145px;\r\n    max-width: calc(100% - 88px);\r\n  }\r\n\r\n  #illusion-expose .il-broker-close {\r\n    top: 20px;\r\n    right: 18px;\r\n    width: 42px;\r\n    height: 42px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-modal-head h3 {\r\n    font-size: 38px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-modal-body {\r\n    padding: 28px 22px 30px;\r\n  }\r\n\r\n  #illusion-expose .il-broker-text p {\r\n    font-size: 13px;\r\n    line-height: 1.78;\r\n  }\r\n\r\n  #illusion-expose .il-broker-text p:first-child::first-letter {\r\n    font-size: 42px;\r\n  }\r\n\r\n  #illusion-expose .il-lightbox {\r\n    padding: 12px;\r\n  }\r\n\r\n  #illusion-expose .il-lb-toolbar {\r\n    gap: 6px;\r\n  }\r\n\r\n  #illusion-expose .il-lightbox button {\r\n    padding: 9px 11px;\r\n    font-size: 11px;\r\n  }\r\n}\r\n\r\n@media (hover: none) {\r\n  #illusion-expose .il-nav {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  #illusion-expose *,\r\n  #illusion-expose *::before,\r\n  #illusion-expose *::after {\r\n    animation: none !important;\r\n    transition: none !important;\r\n    scroll-behavior: auto !important;\r\n  }\r\n}\r\n\r\n<\/style>\r\n\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@9.4.1\/swiper-bundle.min.js\"><\/script>\r\n\r\n<script>\r\n(function () {\r\n  'use strict';\r\n\r\n  function initializeIllusion() {\r\n    const root = document.getElementById('illusion-expose');\r\n\r\n    if (!root || root.dataset.ilReady === 'true') {\r\n      return;\r\n    }\r\n\r\n    root.dataset.ilReady = 'true';\r\n\r\n    const translationMode =\r\n      new URLSearchParams(location.search)\r\n        .has('trp-edit-translation');\r\n\r\n    const motionPreference =\r\n      window.matchMedia('(prefers-reduced-motion: reduce)');\r\n\r\n    const galleryColumn = root.querySelector('.il-gallery-column');\r\n    const infoPanel = root.querySelector('.il-info-panel');\r\n    const gallery = root.querySelector('.il-swiper');\r\n    const emptyGallery = root.querySelector('.il-empty-gallery');\r\n    const galleryCounter = root.querySelector('.il-image-counter');\r\n    const previousButton = root.querySelector('.il-prev');\r\n    const nextButton = root.querySelector('.il-next');\r\n    const galleryPlay = root.querySelector('.il-gallery-play');\r\n    const equipment = root.querySelector('.il-equipment-dialog');\r\n    const brokerDialog = root.querySelector('.il-broker-dialog');\r\n    const lightbox = root.querySelector('.il-lightbox');\r\n    const lightboxImage = root.querySelector('.il-lb-image');\r\n    const lightboxPlay = root.querySelector('.il-lb-play');\r\n    const lightboxCounter = root.querySelector('.il-lb-counter');\r\n\r\n    let swiper = null;\r\n    let galleryTimer = null;\r\n    let lightboxTimer = null;\r\n\r\n    let galleryWantsPlay = !motionPreference.matches;\r\n    let galleryHovered = false;\r\n    let galleryFocused = false;\r\n    let galleryInView = false;\r\n    let pageActive = true;\r\n\r\n    let lightboxPhotos = [];\r\n    let lightboxIndex = 0;\r\n\r\n    const activeDialogs = new Set();\r\n    const previousFocus = new Map();\r\n    let scrollLocks = [];\r\n\r\n    \/* Nur eingetragene Bildadressen verwenden. *\/\r\n\r\n    const photos = Array.from(\r\n      gallery.querySelectorAll('img')\r\n    ).filter(function (img, index) {\r\n      const source = (img.dataset.src || '').trim();\r\n      const slide = img.closest('.swiper-slide');\r\n\r\n      if (!source) {\r\n        slide.remove();\r\n        return false;\r\n      }\r\n\r\n      const button = img.closest('.il-photo');\r\n      const placeholder =\r\n        button.querySelector('.il-photo-placeholder');\r\n\r\n      img.addEventListener('load', function () {\r\n        img.dataset.available = 'true';\r\n        placeholder.hidden = true;\r\n        button.disabled = false;\r\n        updateGalleryPlayback();\r\n      });\r\n\r\n      img.addEventListener('error', function () {\r\n        img.dataset.available = 'false';\r\n        img.hidden = true;\r\n        placeholder.hidden = false;\r\n        button.disabled = true;\r\n        updateGalleryPlayback();\r\n      });\r\n\r\n      if (index === 0) {\r\n        img.loading = 'eager';\r\n        img.setAttribute('fetchpriority', 'high');\r\n      }\r\n\r\n      img.hidden = false;\r\n      img.src = source;\r\n\r\n      return true;\r\n    });\r\n\r\n    gallery.hidden = photos.length === 0;\r\n    emptyGallery.hidden = photos.length > 0;\r\n    galleryCounter.hidden = photos.length === 0;\r\n\r\n    galleryCounter.textContent =\r\n      photos.length ? '1 \/ ' + photos.length : '0 \/ 0';\r\n\r\n    \/* H\u00f6he der Galerie an die Datenspalte anpassen. *\/\r\n\r\n    function synchronizeGalleryHeight() {\r\n      const height =\r\n        !translationMode && window.innerWidth > 1024\r\n          ? infoPanel.offsetHeight + 'px'\r\n          : '';\r\n\r\n      if (galleryColumn.style.height !== height) {\r\n        galleryColumn.style.height = height;\r\n\r\n        if (swiper) {\r\n          swiper.update();\r\n        }\r\n      }\r\n    }\r\n\r\n    synchronizeGalleryHeight();\r\n\r\n    window.addEventListener(\r\n      'resize',\r\n      synchronizeGalleryHeight\r\n    );\r\n\r\n    if ('ResizeObserver' in window) {\r\n      new ResizeObserver(\r\n        synchronizeGalleryHeight\r\n      ).observe(infoPanel);\r\n    }\r\n\r\n    \/*\r\n     * Immer mit Bild 1 beginnen.\r\n     * Automatik erst nach dem Intro und bei sichtbarer Galerie.\r\n     *\/\r\n\r\n    function introBlocksGallery() {\r\n      const intro = document.getElementById('intro-illusion');\r\n\r\n      if (!intro || intro.hidden || !intro.getClientRects().length) {\r\n        return false;\r\n      }\r\n\r\n      const style = window.getComputedStyle(intro);\r\n\r\n      return style.display !== 'none' &&\r\n        style.visibility !== 'hidden';\r\n    }\r\n\r\n    function canPlayGallery() {\r\n      return swiper &&\r\n        !swiper.destroyed &&\r\n        root.isConnected &&\r\n        photos.length > 1 &&\r\n        photos[0].dataset.available !== undefined &&\r\n        galleryWantsPlay &&\r\n        pageActive &&\r\n        galleryInView &&\r\n        !translationMode &&\r\n        !galleryHovered &&\r\n        !galleryFocused &&\r\n        !document.hidden &&\r\n        !introBlocksGallery() &&\r\n        activeDialogs.size === 0;\r\n    }\r\n\r\n    function updateGalleryPlayback() {\r\n      window.clearInterval(galleryTimer);\r\n      galleryTimer = null;\r\n      galleryPlay.dataset.playing = String(galleryWantsPlay);\r\n\r\n      if (!canPlayGallery()) {\r\n        return;\r\n      }\r\n\r\n      galleryTimer = window.setInterval(function () {\r\n        if (!canPlayGallery()) {\r\n          updateGalleryPlayback();\r\n          return;\r\n        }\r\n\r\n        \/* Vorw\u00e4rts: Bild 1, Bild 2, Bild 3 ... *\/\r\n        if (!swiper.animating) {\r\n          swiper.slideNext();\r\n        }\r\n      }, 3500);\r\n    }\r\n\r\n    function resetGalleryToFirst() {\r\n      window.clearInterval(galleryTimer);\r\n      galleryTimer = null;\r\n\r\n      gallery.scrollTop = 0;\r\n      gallery.scrollLeft = 0;\r\n\r\n      if (swiper && !swiper.destroyed) {\r\n        swiper.update();\r\n        swiper.slideTo(0, 0, false);\r\n      }\r\n\r\n      galleryCounter.textContent =\r\n        photos.length ? '1 \/ ' + photos.length : '0 \/ 0';\r\n    }\r\n\r\n    function refreshGalleryVisibility() {\r\n      const bounds = gallery.getBoundingClientRect();\r\n\r\n      const visibleHeight = Math.max(\r\n        0,\r\n        Math.min(bounds.bottom, window.innerHeight) -\r\n        Math.max(bounds.top, 0)\r\n      );\r\n\r\n      const visibleWidth = Math.max(\r\n        0,\r\n        Math.min(bounds.right, window.innerWidth) -\r\n        Math.max(bounds.left, 0)\r\n      );\r\n\r\n      const visible = bounds.width > 0 && bounds.height > 0 &&\r\n        (visibleWidth * visibleHeight) \/\r\n        (bounds.width * bounds.height) >= 0.1;\r\n\r\n      if (visible !== galleryInView) {\r\n        galleryInView = visible;\r\n        updateGalleryPlayback();\r\n      }\r\n    }\r\n\r\n    \/* Gro\u00dfe Bildansicht und Diashow. *\/\r\n\r\n    function stopLightboxSlideshow() {\r\n      window.clearInterval(lightboxTimer);\r\n      lightboxTimer = null;\r\n      lightboxPlay.dataset.playing = 'false';\r\n    }\r\n\r\n    function showLightboxImage(index) {\r\n      if (!lightboxPhotos.length) {\r\n        return;\r\n      }\r\n\r\n      lightboxIndex =\r\n        (index + lightboxPhotos.length) %\r\n        lightboxPhotos.length;\r\n\r\n      const original = lightboxPhotos[lightboxIndex];\r\n\r\n      lightboxImage.src =\r\n        original.currentSrc || original.src;\r\n\r\n      lightboxImage.alt = original.alt;\r\n      lightboxImage.hidden = false;\r\n\r\n      lightboxCounter.textContent =\r\n        (lightboxIndex + 1) + ' \/ ' + lightboxPhotos.length;\r\n    }\r\n\r\n    function startLightboxSlideshow() {\r\n      stopLightboxSlideshow();\r\n\r\n      if (\r\n        translationMode ||\r\n        lightboxPhotos.length < 2 ||\r\n        !lightbox.open\r\n      ) {\r\n        return;\r\n      }\r\n\r\n      lightboxPlay.dataset.playing = 'true';\r\n\r\n      lightboxTimer = window.setInterval(function () {\r\n        showLightboxImage(lightboxIndex + 1);\r\n      }, 3500);\r\n    }\r\n\r\n    \/* Dialoge \u00f6ffnen und schlie\u00dfen. *\/\r\n\r\n    function openDialog(dialog) {\r\n      if (translationMode || dialog.open) {\r\n        return;\r\n      }\r\n\r\n      previousFocus.set(\r\n        dialog,\r\n        document.activeElement\r\n      );\r\n\r\n      if (typeof dialog.showModal === 'function') {\r\n        dialog.showModal();\r\n      } else {\r\n        dialog.setAttribute('open', '');\r\n      }\r\n\r\n      if (activeDialogs.size === 0) {\r\n        scrollLocks = [\r\n          document.documentElement,\r\n          document.body\r\n        ].map(function (element) {\r\n          const alreadyLocked =\r\n            element.classList.contains('il-modal-open');\r\n\r\n          element.classList.add('il-modal-open');\r\n\r\n          return {\r\n            element: element,\r\n            alreadyLocked: alreadyLocked\r\n          };\r\n        });\r\n      }\r\n\r\n      activeDialogs.add(dialog);\r\n      updateGalleryPlayback();\r\n    }\r\n\r\n    function afterDialogClose(dialog) {\r\n      if (!activeDialogs.has(dialog)) {\r\n        return;\r\n      }\r\n\r\n      activeDialogs.delete(dialog);\r\n\r\n      if (dialog === lightbox) {\r\n        stopLightboxSlideshow();\r\n        lightboxImage.hidden = true;\r\n        lightboxImage.removeAttribute('src');\r\n      }\r\n\r\n      if (activeDialogs.size === 0) {\r\n        scrollLocks.forEach(function (item) {\r\n          if (!item.alreadyLocked) {\r\n            item.element.classList.remove('il-modal-open');\r\n          }\r\n        });\r\n\r\n        const focus = previousFocus.get(dialog);\r\n\r\n        if (focus && focus.isConnected) {\r\n          focus.focus({ preventScroll: true });\r\n        }\r\n      }\r\n\r\n      previousFocus.delete(dialog);\r\n      updateGalleryPlayback();\r\n    }\r\n\r\n    function closeDialog(dialog) {\r\n      if (translationMode || !dialog.open) {\r\n        return;\r\n      }\r\n\r\n      if (typeof dialog.close === 'function') {\r\n        dialog.close();\r\n      } else {\r\n        dialog.removeAttribute('open');\r\n      }\r\n\r\n      afterDialogClose(dialog);\r\n    }\r\n\r\n    \/*\r\n     * TranslatePress:\r\n     * Dialogtexte direkt auf der Seite anzeigen.\r\n     * Keine modale Sperre und keine automatische Bewegung.\r\n     *\/\r\n\r\n    if (translationMode) {\r\n      root.classList.add('il-translation-mode');\r\n\r\n      equipment.setAttribute('open', '');\r\n      brokerDialog.setAttribute('open', '');\r\n      lightbox.setAttribute('open', '');\r\n\r\n      galleryPlay.hidden = false;\r\n      return;\r\n    }\r\n\r\n    \/* Sichtbarkeit der Galerie \u00fcberwachen. *\/\r\n\r\n    if ('IntersectionObserver' in window) {\r\n      const galleryVisibilityObserver = new IntersectionObserver(\r\n        function (entries) {\r\n          const entry = entries[0];\r\n\r\n          const visible = entry.isIntersecting &&\r\n            entry.intersectionRatio >= 0.1;\r\n\r\n          if (visible !== galleryInView) {\r\n            galleryInView = visible;\r\n            updateGalleryPlayback();\r\n          }\r\n        },\r\n        { threshold: [0, 0.1] }\r\n      );\r\n\r\n      galleryVisibilityObserver.observe(gallery);\r\n    } else {\r\n      window.addEventListener(\r\n        'scroll',\r\n        refreshGalleryVisibility,\r\n        { passive: true }\r\n      );\r\n\r\n      window.addEventListener(\r\n        'resize',\r\n        refreshGalleryVisibility\r\n      );\r\n    }\r\n\r\n    \/* Nach dem Entfernen des Intros die erste Wartezeit starten. *\/\r\n\r\n    const intro = document.getElementById('intro-illusion');\r\n\r\n    if (intro && 'MutationObserver' in window) {\r\n      const introObserver = new MutationObserver(function () {\r\n        if (!intro.isConnected) {\r\n          introObserver.disconnect();\r\n        }\r\n\r\n        updateGalleryPlayback();\r\n      });\r\n\r\n      introObserver.observe(document.body, {\r\n        childList: true,\r\n        subtree: true\r\n      });\r\n\r\n      introObserver.observe(intro, {\r\n        attributes: true,\r\n        attributeFilter: ['hidden', 'class', 'style']\r\n      });\r\n    }\r\n\r\n    \/*\r\n     * Auch bei R\u00fcckkehr \u00fcber die Browsernavigation\r\n     * wieder bei Bild 1 beginnen.\r\n     *\/\r\n\r\n    window.addEventListener('pagehide', function () {\r\n      pageActive = false;\r\n      window.clearInterval(galleryTimer);\r\n      galleryTimer = null;\r\n      stopLightboxSlideshow();\r\n    });\r\n\r\n    window.addEventListener('pageshow', function (event) {\r\n      if (!root.isConnected) {\r\n        return;\r\n      }\r\n\r\n      pageActive = true;\r\n\r\n      if (event.persisted) {\r\n        Array.from(activeDialogs).forEach(closeDialog);\r\n      }\r\n\r\n      galleryHovered = gallery.matches(':hover');\r\n      galleryFocused = gallery.contains(document.activeElement);\r\n\r\n      resetGalleryToFirst();\r\n      refreshGalleryVisibility();\r\n      updateGalleryPlayback();\r\n\r\n      window.requestAnimationFrame(refreshGalleryVisibility);\r\n    });\r\n\r\n    \/* Dialog-Ereignisse. *\/\r\n\r\n    [equipment, brokerDialog, lightbox].forEach(function (dialog) {\r\n      dialog.addEventListener('close', function () {\r\n        afterDialogClose(dialog);\r\n      });\r\n    });\r\n\r\n    root\r\n      .querySelector('[data-il-open-equipment]')\r\n      .addEventListener('click', function () {\r\n        openDialog(equipment);\r\n      });\r\n\r\n    root\r\n      .querySelector('.il-dialog-close')\r\n      .addEventListener('click', function () {\r\n        closeDialog(equipment);\r\n      });\r\n\r\n    root\r\n      .querySelector('[data-il-open-broker]')\r\n      .addEventListener('click', function () {\r\n        openDialog(brokerDialog);\r\n      });\r\n\r\n    root\r\n      .querySelector('.il-broker-close')\r\n      .addEventListener('click', function () {\r\n        closeDialog(brokerDialog);\r\n      });\r\n\r\n    root\r\n      .querySelector('.il-lb-close')\r\n      .addEventListener('click', function () {\r\n        closeDialog(lightbox);\r\n      });\r\n\r\n    \/* Klick auf den Hintergrund schlie\u00dft das Fenster. *\/\r\n\r\n    equipment.addEventListener('click', function (event) {\r\n      if (event.target !== equipment) {\r\n        return;\r\n      }\r\n\r\n      const bounds = equipment.getBoundingClientRect();\r\n\r\n      if (\r\n        event.clientX < bounds.left ||\r\n        event.clientX > bounds.right ||\r\n        event.clientY < bounds.top ||\r\n        event.clientY > bounds.bottom\r\n      ) {\r\n        closeDialog(equipment);\r\n      }\r\n    });\r\n\r\n    brokerDialog.addEventListener('click', function (event) {\r\n      if (event.target !== brokerDialog) {\r\n        return;\r\n      }\r\n\r\n      const bounds = brokerDialog.getBoundingClientRect();\r\n\r\n      if (\r\n        event.clientX < bounds.left ||\r\n        event.clientX > bounds.right ||\r\n        event.clientY < bounds.top ||\r\n        event.clientY > bounds.bottom\r\n      ) {\r\n        closeDialog(brokerDialog);\r\n      }\r\n    });\r\n\r\n    lightbox.addEventListener('click', function (event) {\r\n      if (\r\n        event.target === lightbox ||\r\n        event.target.classList.contains('il-lb-view')\r\n      ) {\r\n        closeDialog(lightbox);\r\n      }\r\n    });\r\n\r\n    \/* Galeriebild \u00f6ffnen. *\/\r\n\r\n    gallery.addEventListener('click', function (event) {\r\n      if (\r\n        event.defaultPrevented ||\r\n        (swiper && !swiper.allowClick)\r\n      ) {\r\n        return;\r\n      }\r\n\r\n      const button = event.target.closest('.il-photo');\r\n\r\n      if (!button || button.disabled) {\r\n        return;\r\n      }\r\n\r\n      const selected = button.querySelector('img');\r\n\r\n      lightboxPhotos = photos.filter(function (img) {\r\n        return img.dataset.available === 'true';\r\n      });\r\n\r\n      const index = lightboxPhotos.indexOf(selected);\r\n\r\n      if (index < 0) {\r\n        return;\r\n      }\r\n\r\n      showLightboxImage(index);\r\n      openDialog(lightbox);\r\n\r\n      if (!motionPreference.matches) {\r\n        startLightboxSlideshow();\r\n      }\r\n    });\r\n\r\n    function manualStep(step) {\r\n      stopLightboxSlideshow();\r\n      showLightboxImage(lightboxIndex + step);\r\n    }\r\n\r\n    root\r\n      .querySelector('.il-lb-prev')\r\n      .addEventListener('click', function () {\r\n        manualStep(-1);\r\n      });\r\n\r\n    root\r\n      .querySelector('.il-lb-next')\r\n      .addEventListener('click', function () {\r\n        manualStep(1);\r\n      });\r\n\r\n    lightboxPlay.addEventListener('click', function () {\r\n      if (lightboxTimer) {\r\n        stopLightboxSlideshow();\r\n      } else {\r\n        startLightboxSlideshow();\r\n      }\r\n    });\r\n\r\n    lightbox.addEventListener('keydown', function (event) {\r\n      if (\r\n        event.key === 'ArrowLeft' ||\r\n        event.key === 'ArrowRight'\r\n      ) {\r\n        event.preventDefault();\r\n\r\n        manualStep(\r\n          event.key === 'ArrowLeft' ? -1 : 1\r\n        );\r\n      }\r\n    });\r\n\r\n    \/* Galerie pausieren oder starten. *\/\r\n\r\n    galleryPlay.addEventListener('click', function () {\r\n      galleryWantsPlay = !galleryWantsPlay;\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    gallery.addEventListener('mouseenter', function () {\r\n      galleryHovered = true;\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    gallery.addEventListener('mouseleave', function () {\r\n      galleryHovered = false;\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    gallery.addEventListener('focusin', function () {\r\n      galleryFocused = true;\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    gallery.addEventListener('focusout', function (event) {\r\n      galleryFocused = gallery.contains(event.relatedTarget);\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    document.addEventListener('visibilitychange', function () {\r\n      if (document.hidden) {\r\n        stopLightboxSlideshow();\r\n      }\r\n\r\n      updateGalleryPlayback();\r\n    });\r\n\r\n    if (motionPreference.addEventListener) {\r\n      motionPreference.addEventListener('change', function () {\r\n        if (motionPreference.matches) {\r\n          galleryWantsPlay = false;\r\n          stopLightboxSlideshow();\r\n        }\r\n\r\n        if (swiper) {\r\n          swiper.params.speed =\r\n            motionPreference.matches ? 0 : 850;\r\n        }\r\n\r\n        updateGalleryPlayback();\r\n      });\r\n    }\r\n\r\n    \/* Galerie-Bibliothek starten. *\/\r\n\r\n    function initializeSwiper(attempt) {\r\n      if (\r\n        photos.length < 2 ||\r\n        swiper ||\r\n        !root.isConnected\r\n      ) {\r\n        return;\r\n      }\r\n\r\n      if (typeof window.Swiper === 'undefined') {\r\n        if (attempt < 40) {\r\n          window.setTimeout(function () {\r\n            initializeSwiper(attempt + 1);\r\n          }, 100);\r\n        }\r\n\r\n        return;\r\n      }\r\n\r\n      swiper = new window.Swiper(gallery, {\r\n        direction: 'vertical',\r\n\r\n        \/* Bild 1 ist immer der Ausgangspunkt. *\/\r\n        initialSlide: 0,\r\n\r\n        loop: false,\r\n        rewind: true,\r\n\r\n        slidesPerView: 'auto',\r\n        slidesPerGroup: 1,\r\n        spaceBetween: 20,\r\n        speed: motionPreference.matches ? 0 : 850,\r\n\r\n        grabCursor: true,\r\n        watchSlidesProgress: true,\r\n\r\n        mousewheel: {\r\n          forceToAxis: true,\r\n          releaseOnEdges: true,\r\n          sensitivity: 0.62\r\n        },\r\n\r\n        \/* Eigene HTML-Beschriftungen f\u00fcr TranslatePress. *\/\r\n        a11y: {\r\n          enabled: false\r\n        },\r\n\r\n        navigation: {\r\n          nextEl: nextButton,\r\n          prevEl: previousButton\r\n        },\r\n\r\n        on: {\r\n          slideChange: function (instance) {\r\n            galleryCounter.textContent =\r\n              (instance.activeIndex + 1) +\r\n              ' \/ ' +\r\n              photos.length;\r\n          }\r\n        }\r\n      });\r\n\r\n      previousButton.hidden = false;\r\n      nextButton.hidden = false;\r\n      galleryPlay.hidden = false;\r\n\r\n      resetGalleryToFirst();\r\n      refreshGalleryVisibility();\r\n      updateGalleryPlayback();\r\n    }\r\n\r\n    resetGalleryToFirst();\r\n    initializeSwiper(0);\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener(\r\n      'DOMContentLoaded',\r\n      initializeIllusion,\r\n      { once: true }\r\n    );\r\n  } else {\r\n    initializeIllusion();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2e4ce72 e-flex e-con-boxed e-con e-parent\" data-id=\"2e4ce72\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-214a982 elementor-widget elementor-widget-text-editor\" data-id=\"214a982\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>\u201eIrrt\u00fcmer, \u00c4nderungen und Zwischenverkauf vorbehalten. Alle Angaben laut Eigner.\u201c<\/p><p>\u201eDie hier gemachten Angaben basieren auf Informationen des Eigent\u00fcmers. Eine Gew\u00e4hr f\u00fcr Vollst\u00e4ndigkeit und Richtigkeit wird nicht \u00fcbernommen.\u201c<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>One-Off \u00b7 Segelyacht ILLUSION Ein beeindruckendes Einzelst\u00fcck. 8,60 m L\u00e4nge 2,95 m Breite 1,80 m Tiefgang Intro \u00fcberspringen ILLUSION One-Off \u00b7 Segelyacht Ein beeindruckendes Einzelst\u00fcck. Yacht entdecken \u2193 \u25c7 Bilder folgen Die Galerie wird derzeit erg\u00e4nzt. Bild folgt Bild folgt Bild folgt Bild folgt Bild folgt Bild folgt Bild folgt Bild folgt Bild folgt Bild [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-8461","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8461","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/comments?post=8461"}],"version-history":[{"count":46,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8461\/revisions"}],"predecessor-version":[{"id":8547,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8461\/revisions\/8547"}],"wp:attachment":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/media?parent=8461"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}