{"id":8335,"date":"2026-09-08T12:28:27","date_gmt":"2026-09-08T10:28:27","guid":{"rendered":"https:\/\/soul-boats.de\/?page_id=8335"},"modified":"2026-09-09T14:22:46","modified_gmt":"2026-09-09T12:22:46","slug":"compromis720","status":"publish","type":"page","link":"https:\/\/soul-boats.de\/en\/compromis720\/","title":{"rendered":"Compromis720"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8335\" class=\"elementor elementor-8335\">\n\t\t\t\t<div class=\"elementor-element elementor-element-289312c e-flex e-con-boxed e-con e-parent\" data-id=\"289312c\" 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-0f0a4bb elementor-widget elementor-widget-html\" data-id=\"0f0a4bb\" 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     COMPROMIS 720 \u201eSEA BREEZE\u201c \u2013 HERO INTRO\r\n     ================================================== -->\r\n\r\n<!--\r\n  NUR NOCH DIE HINTERGRUNDBILD-URL UNTEN ERSETZEN\r\n-->\r\n\r\n<div\r\n  class=\"intro-splash\"\r\n  id=\"intro-compromis720\"\r\n  style=\"--intro-bg: url('DEINE-BOOTS-HINTERGRUNDBILD-URL');\"\r\n>\r\n\r\n  <div class=\"intro-inner\">\r\n\r\n    <img decoding=\"async\"\r\n      class=\"compromis-logo\"\r\n      src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/Compromis_logo.png\"\r\n      alt=\"Compromis 720 Sea Breeze\"\r\n    >\r\n\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<style>\r\n\r\n\/* ==================================================\r\n   ALTE INTROS SICHER AUSBLENDEN\r\n   ================================================== *\/\r\n\r\n#sigma-intro,\r\n#intro-spitzgatter,\r\n#intro-marieholm26 {\r\n  display: none !important;\r\n  visibility: hidden !important;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   GESAMTER INTRO-BILDSCHIRM\r\n   ================================================== *\/\r\n\r\n#intro-compromis720 {\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  width: 100%;\r\n  height: 100%;\r\n\r\n  background: #071d30;\r\n\r\n  overflow: hidden;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   HINTERGRUNDFOTO\r\n   ================================================== *\/\r\n\r\n#intro-compromis720::before {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: -5%;\r\n\r\n  z-index: 0;\r\n\r\n  background-image: var(--intro-bg);\r\n  background-size: cover;\r\n  background-position: center center;\r\n  background-repeat: no-repeat;\r\n\r\n  \/*\r\n   * Nur das Hintergrundfoto wird weichgezeichnet.\r\n   * Das Logo bleibt vollst\u00e4ndig scharf.\r\n   *\/\r\n  filter:\r\n    brightness(0.48)\r\n    saturate(0.90)\r\n    blur(4px);\r\n\r\n  transform: scale(1.06);\r\n\r\n  animation:\r\n    compromisBackground\r\n    4.5s\r\n    ease-out\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   DUNKLE MARINEBLAUE \u00dcBERLAGERUNG\r\n   ================================================== *\/\r\n\r\n#intro-compromis720::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: 0;\r\n\r\n  z-index: 1;\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(2, 14, 25, 0.18) 0%,\r\n      rgba(4, 24, 41, 0.24) 50%,\r\n      rgba(2, 13, 23, 0.58) 100%\r\n    ),\r\n\r\n    radial-gradient(\r\n      ellipse at center,\r\n      rgba(12, 45, 70, 0.05) 0%,\r\n      rgba(4, 20, 35, 0.42) 68%,\r\n      rgba(2, 12, 22, 0.74) 100%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   LOGO-BEREICH\r\n   ================================================== *\/\r\n\r\n#intro-compromis720 .intro-inner {\r\n  position: relative;\r\n  z-index: 2;\r\n\r\n  width: min(90vw, 950px);\r\n\r\n  padding:\r\n    clamp(20px, 4vw, 60px);\r\n\r\n  box-sizing: border-box;\r\n\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n\r\n  text-align: center;\r\n\r\n  animation:\r\n    compromisLogoIn\r\n    1.5s\r\n    ease\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   COMPROMIS 720 \u201eSEA BREEZE\u201c LOGO\r\n   ================================================== *\/\r\n\r\n#intro-compromis720 .compromis-logo {\r\n  display: block;\r\n\r\n  \/*\r\n   * Absichtlich nicht auf 1000+ px aufblasen.\r\n   * Dadurch bleibt das Logo deutlich sch\u00e4rfer.\r\n   *\/\r\n  width: min(78vw, 760px);\r\n  max-width: 760px;\r\n\r\n  height: auto;\r\n\r\n  object-fit: contain;\r\n\r\n  image-rendering: auto;\r\n\r\n  \/*\r\n   * Sehr dezenter Schatten.\r\n   * Kein Blur auf dem Logo selbst.\r\n   *\/\r\n  filter:\r\n    drop-shadow(\r\n      0 8px 22px\r\n      rgba(0, 0, 0, 0.50)\r\n    )\r\n    drop-shadow(\r\n      0 0 10px\r\n      rgba(230, 238, 244, 0.07)\r\n    );\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   LOGO EINBLENDEN\r\n   ================================================== *\/\r\n\r\n@keyframes compromisLogoIn {\r\n\r\n  from {\r\n    opacity: 0;\r\n\r\n    transform:\r\n      translateY(12px)\r\n      scale(0.97);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n\r\n    transform:\r\n      translateY(0)\r\n      scale(1);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   DEZENTE HINTERGRUNDBEWEGUNG\r\n   ================================================== *\/\r\n\r\n@keyframes compromisBackground {\r\n\r\n  from {\r\n    transform:\r\n      scale(1.10);\r\n  }\r\n\r\n  to {\r\n    transform:\r\n      scale(1.04);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   GESAMTES INTRO AUSBLENDEN\r\n   ================================================== *\/\r\n\r\n@keyframes compromisIntroOut {\r\n\r\n  from {\r\n    opacity: 1;\r\n  }\r\n\r\n  to {\r\n    opacity: 0;\r\n\r\n    transform:\r\n      scale(0.995);\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  #intro-compromis720 .intro-inner {\r\n    width: 92vw;\r\n  }\r\n\r\n\r\n  #intro-compromis720 .compromis-logo {\r\n    width: min(82vw, 720px);\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  #intro-compromis720::before {\r\n    \/*\r\n     * Mobil etwas weniger Blur,\r\n     * damit das Hintergrundbild nicht zu weich wirkt.\r\n     *\/\r\n    filter:\r\n      brightness(0.46)\r\n      saturate(0.88)\r\n      blur(3px);\r\n  }\r\n\r\n\r\n  #intro-compromis720 .intro-inner {\r\n    width: 94vw;\r\n\r\n    padding:\r\n      24px\r\n      18px;\r\n  }\r\n\r\n\r\n  #intro-compromis720 .compromis-logo {\r\n    width: 88vw;\r\n    max-width: 620px;\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  #intro-compromis720 .intro-inner {\r\n    width: 96vw;\r\n\r\n    padding:\r\n      20px\r\n      14px;\r\n  }\r\n\r\n\r\n  #intro-compromis720 .compromis-logo {\r\n    width: 92vw;\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  #intro-compromis720::before,\r\n  #intro-compromis720 .intro-inner {\r\n    animation: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<script>\r\n\r\n(function () {\r\n\r\n  \/* ==================================================\r\n     ALTE INTRO-VERSIONEN ENTFERNEN\r\n     ================================================== *\/\r\n\r\n  function removeOldIntros() {\r\n\r\n    document\r\n      .querySelectorAll(\r\n        '#sigma-intro, #intro-spitzgatter, #intro-marieholm26'\r\n      )\r\n      .forEach(function (element) {\r\n\r\n        element.remove();\r\n\r\n      });\r\n\r\n  }\r\n\r\n\r\n  removeOldIntros();\r\n\r\n\r\n  \/*\r\n   * Falls Elementor alte Elemente nachtr\u00e4glich\r\n   * in den DOM l\u00e4dt, werden sie ebenfalls entfernt.\r\n   *\/\r\n\r\n  const observer =\r\n    new MutationObserver(removeOldIntros);\r\n\r\n\r\n  observer.observe(\r\n    document.documentElement,\r\n    {\r\n      childList: true,\r\n      subtree: true\r\n    }\r\n  );\r\n\r\n\r\n  setTimeout(function () {\r\n\r\n    observer.disconnect();\r\n\r\n  }, 10000);\r\n\r\n\r\n  \/* ==================================================\r\n     IM ELEMENTOR-EDITOR NICHT ANZEIGEN\r\n     ================================================== *\/\r\n\r\n  if (\r\n    window.location.href.includes('elementor-preview')\r\n  ) {\r\n\r\n    const editorIntro =\r\n      document.getElementById(\r\n        'intro-compromis720'\r\n      );\r\n\r\n\r\n    if (editorIntro) {\r\n\r\n      editorIntro.remove();\r\n\r\n    }\r\n\r\n\r\n    return;\r\n\r\n  }\r\n\r\n\r\n  \/* ==================================================\r\n     INTRO STARTEN\r\n     ================================================== *\/\r\n\r\n  function startCompromisIntro() {\r\n\r\n    const intro =\r\n      document.getElementById(\r\n        'intro-compromis720'\r\n      );\r\n\r\n\r\n    if (!intro) {\r\n      return;\r\n    }\r\n\r\n\r\n    \/*\r\n     * Scrollen w\u00e4hrend des Intros deaktivieren\r\n     *\/\r\n\r\n    document.documentElement.style.overflow =\r\n      'hidden';\r\n\r\n\r\n    if (document.body) {\r\n\r\n      document.body.style.overflow =\r\n        'hidden';\r\n\r\n    }\r\n\r\n\r\n    \/*\r\n     * Intro 3 Sekunden vollst\u00e4ndig anzeigen\r\n     *\/\r\n\r\n    setTimeout(function () {\r\n\r\n      intro.style.animation =\r\n        'compromisIntroOut 1.5s ease forwards';\r\n\r\n\r\n      \/*\r\n       * Nach dem Fade-out komplett entfernen\r\n       *\/\r\n\r\n      setTimeout(function () {\r\n\r\n        intro.remove();\r\n\r\n\r\n        document.documentElement.style.overflow =\r\n          '';\r\n\r\n\r\n        if (document.body) {\r\n\r\n          document.body.style.overflow =\r\n            '';\r\n\r\n        }\r\n\r\n      }, 1500);\r\n\r\n\r\n    }, 3000);\r\n\r\n  }\r\n\r\n\r\n  \/* ==================================================\r\n     NACH DOM-LADEN STARTEN\r\n     ================================================== *\/\r\n\r\n  if (\r\n    document.readyState === 'complete' ||\r\n    document.readyState === 'interactive'\r\n  ) {\r\n\r\n    startCompromisIntro();\r\n\r\n  } else {\r\n\r\n    document.addEventListener(\r\n      'DOMContentLoaded',\r\n      startCompromisIntro\r\n    );\r\n\r\n  }\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-6235bbf e-con-full e-flex e-con e-parent\" data-id=\"6235bbf\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bf94f80 elementor-widget elementor-widget-html\" data-id=\"bf94f80\" 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     COMPROMIS 720 \u201eSEA BREEZE\u201c\r\n     KOMPAKTER PERMANENTER SEITENHEADER\r\n     OHNE LOGO\r\n     ================================================== -->\r\n\r\n\r\n<!-- Schriftarten -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\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&family=Playfair+Display:wght@600&display=swap\"\r\n  rel=\"stylesheet\"\r\n>\r\n\r\n\r\n<!-- ==================================================\r\n     HEADER\r\n\r\n     Nur noch die Hintergrundbild-URL ersetzen\r\n     ================================================== -->\r\n\r\n<header\r\n  class=\"c720-page-hero\"\r\n  style=\"--c720-bg: url('DEINE-COMPROMIS-HINTERGRUNDBILD-URL');\"\r\n>\r\n\r\n  <div class=\"c720-hero-content\">\r\n\r\n    <!-- Bootsname -->\r\n    <h1>Sea Breeze<\/h1>\r\n\r\n\r\n    <!-- Modellbezeichnung -->\r\n    <p class=\"c720-model\">\r\n      Compromis 720\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n\r\n  <!-- Scroll-Hinweis -->\r\n  <a\r\n    class=\"c720-scroll-hint\"\r\n    href=\"#compromis-inhalt\"\r\n    aria-label=\"Mehr \u00fcber die Compromis 720 Sea Breeze erfahren\"\r\n  >\r\n\r\n    <span>Yacht entdecken<\/span>\r\n\r\n    <span\r\n      class=\"c720-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<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\/* ==================================================\r\n   COMPROMIS 720 \u2013 HERO\r\n   ================================================== *\/\r\n\r\n.c720-page-hero {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  \/* Volle Browserbreite trotz Elementor-Container *\/\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\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\r\n  overflow: hidden;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   HINTERGRUNDFOTO\r\n   ================================================== *\/\r\n\r\n.c720-page-hero::before {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: -4%;\r\n\r\n  z-index: -2;\r\n\r\n  background-image: var(--c720-bg);\r\n  background-position: center 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    c720BackgroundIn\r\n    2.5s\r\n    ease-out\r\n    both;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   MARINEBLAUE VIGNETTE\r\n   ================================================== *\/\r\n\r\n.c720-page-hero::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  inset: 0;\r\n\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.28) 0%,\r\n      rgba(5, 30, 51, 0.24) 46%,\r\n      rgba(2, 15, 27, 0.78) 100%\r\n    ),\r\n\r\n    radial-gradient(\r\n      ellipse at center,\r\n      rgba(12, 49, 77, 0.04) 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.c720-hero-content {\r\n  width: min(92vw, 1050px);\r\n\r\n  padding:\r\n    clamp(55px, 7vw, 85px)\r\n    28px\r\n    clamp(80px, 8vw, 105px);\r\n\r\n  box-sizing: border-box;\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.c720-hero-content h1 {\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:\r\n    clamp(58px, 8vw, 100px);\r\n\r\n  font-weight: 600;\r\n\r\n  line-height: 0.96;\r\n\r\n  letter-spacing: 0.025em;\r\n\r\n  color: #f7f6f2;\r\n\r\n  text-shadow:\r\n    0 10px 30px\r\n    rgba(0, 0, 0, 0.52),\r\n\r\n    0 1px 0\r\n    rgba(255, 255, 255, 0.12);\r\n\r\n  opacity: 0;\r\n\r\n  animation:\r\n    c720ElementIn\r\n    1.3s\r\n    ease\r\n    0.18s\r\n    forwards;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   MODELLBEZEICHNUNG\r\n   ================================================== *\/\r\n\r\n.c720-model {\r\n  margin:\r\n    clamp(18px, 2.2vw, 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:\r\n    clamp(12px, 1.4vw, 17px);\r\n\r\n  font-weight: 300;\r\n\r\n  line-height: 1.4;\r\n\r\n  letter-spacing: 0.38em;\r\n\r\n  text-transform: uppercase;\r\n\r\n  color: #c7ccd1;\r\n\r\n  opacity: 0;\r\n\r\n  animation:\r\n    c720ElementIn\r\n    1.3s\r\n    ease\r\n    0.5s\r\n    forwards;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   SCROLL-HINWEIS\r\n   ================================================== *\/\r\n\r\n.c720-scroll-hint {\r\n  position: absolute;\r\n\r\n  left: 50%;\r\n\r\n  bottom:\r\n    clamp(15px, 2vw, 24px);\r\n\r\n  transform:\r\n    translateX(-50%);\r\n\r\n  display: flex;\r\n\r\n  flex-direction: column;\r\n\r\n  align-items: center;\r\n\r\n  gap: 6px;\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\r\n  font-weight: 300;\r\n\r\n  letter-spacing: 0.26em;\r\n\r\n  text-transform: uppercase;\r\n\r\n  text-decoration: none;\r\n\r\n  white-space: nowrap;\r\n\r\n  color:\r\n    rgba(225, 229, 232, 0.78);\r\n\r\n  transition:\r\n    color 0.3s ease,\r\n    opacity 0.3s ease;\r\n}\r\n\r\n\r\n.c720-scroll-hint:hover {\r\n  color: #ffffff;\r\n}\r\n\r\n\r\n.c720-scroll-hint:focus-visible {\r\n  outline:\r\n    2px solid\r\n    rgba(255, 255, 255, 0.8);\r\n\r\n  outline-offset: 7px;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   PFEIL\r\n   ================================================== *\/\r\n\r\n.c720-arrow {\r\n  font-size: 18px;\r\n\r\n  line-height: 1;\r\n\r\n  animation:\r\n    c720ArrowMove\r\n    1.8s\r\n    ease-in-out\r\n    infinite;\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   EINBLENDUNG\r\n   ================================================== *\/\r\n\r\n@keyframes c720ElementIn {\r\n\r\n  from {\r\n    opacity: 0;\r\n\r\n    transform:\r\n      translateY(12px);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n\r\n    transform:\r\n      translateY(0);\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* ==================================================\r\n   HINTERGRUNDBEWEGUNG\r\n   ================================================== *\/\r\n\r\n@keyframes c720BackgroundIn {\r\n\r\n  from {\r\n    opacity: 0.75;\r\n\r\n    transform:\r\n      scale(1.08);\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n\r\n    transform:\r\n      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 c720ArrowMove {\r\n\r\n  0%,\r\n  100% {\r\n    transform:\r\n      translateY(0);\r\n  }\r\n\r\n  50% {\r\n    transform:\r\n      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  .c720-page-hero {\r\n    min-height:\r\n      clamp(420px, 50vh, 540px);\r\n  }\r\n\r\n\r\n  .c720-hero-content h1 {\r\n    font-size:\r\n      clamp(58px, 10vw, 90px);\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  .c720-page-hero {\r\n    min-height: 500px;\r\n  }\r\n\r\n\r\n  .c720-hero-content {\r\n    width: 94vw;\r\n\r\n    padding:\r\n      70px\r\n      18px\r\n      95px;\r\n  }\r\n\r\n\r\n  .c720-hero-content h1 {\r\n    font-size:\r\n      clamp(56px, 16vw, 78px);\r\n  }\r\n\r\n\r\n  .c720-model {\r\n    margin-top: 20px;\r\n\r\n    font-size: 11px;\r\n\r\n    letter-spacing: 0.27em;\r\n  }\r\n\r\n\r\n  .c720-scroll-hint {\r\n    bottom: 18px;\r\n\r\n    font-size: 8px;\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  .c720-page-hero {\r\n    min-height: 470px;\r\n  }\r\n\r\n\r\n  .c720-hero-content {\r\n    padding:\r\n      65px\r\n      14px\r\n      88px;\r\n  }\r\n\r\n\r\n  .c720-hero-content h1 {\r\n    font-size:\r\n      clamp(52px, 17vw, 70px);\r\n  }\r\n\r\n\r\n  .c720-model {\r\n    font-size: 10px;\r\n\r\n    letter-spacing: 0.23em;\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\r\n  .c720-page-hero::before,\r\n  .c720-hero-content h1,\r\n  .c720-model,\r\n  .c720-arrow {\r\n    animation: none;\r\n\r\n    opacity: 1;\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<\/div>\n\t\t<div class=\"elementor-element elementor-element-21120da e-flex e-con-boxed e-con e-parent\" data-id=\"21120da\" 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-81538a9 elementor-widget elementor-widget-html\" data-id=\"81538a9\" 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<!-- =============================================================\n     COMPROMIS 720 \u201eSEA BREEZE\u201c\n     GALERIE, DATEN UND KONTAKT\n\n     Komplett in ein Elementor-HTML-Widget einf\u00fcgen.\n\n     GALERIE:\n     Genau 18 Bild-URLs einsetzen.\n     Jede Bildadresse wird nur einmal bei src eingesetzt.\n     Dieselbe Datei wird automatisch auch in der Lightbox verwendet.\n     ============================================================= -->\n\n\n<!-- ===================== SCHRIFTARTEN ===================== -->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n\n<link\n  rel=\"preconnect\"\n  href=\"https:\/\/fonts.gstatic.com\"\n  crossorigin\n>\n\n<link\n  href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@300;400;500;600&family=Playfair+Display:wght@600&display=swap\"\n  rel=\"stylesheet\"\n>\n\n\n<!-- ===================== SWIPER ===================== -->\n\n<link rel=\"preconnect\" href=\"https:\/\/cdn.jsdelivr.net\">\n\n<link\n  rel=\"stylesheet\"\n  href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@9\/swiper-bundle.min.css\"\n>\n\n\n<!-- =============================================================\n     HAUPTBEREICH\n     ============================================================= -->\n\n<section\n  id=\"compromis-inhalt\"\n  class=\"c720-expose-stage\"\n  aria-label=\"Compromis 720 Sea Breeze \u2013 Galerie und technische Daten\"\n>\n\n\n  <!-- ===========================================================\n       GALERIE\n       =========================================================== -->\n\n  <div class=\"c720-gallery-column\">\n\n    <div class=\"c720-gallery-shell\">\n\n      <div class=\"c720-swiper swiper\">\n\n        <div class=\"swiper-wrapper\">\n\n\n          <!-- BILD 01 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3664-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 1\"\n              loading=\"eager\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 02 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3673-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 2\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 03 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3669-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 3\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 04 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3672-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 4\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 05 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3678-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 5\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 06 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3683-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 6\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 07 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3698-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 7\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 08 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3692-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 8\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 09 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3690-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 9\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 10 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3723-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 10\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 11 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3710-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 11\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 12 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3713-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 12\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 13 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3726-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 13\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 14 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3727-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 14\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 15 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3735-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 15\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 16 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3751-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 16\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 17 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3755-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 17\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n          <!-- BILD 18 -->\n          <div class=\"swiper-slide\">\n            <img decoding=\"async\"\n              src=\"https:\/\/soul-boats.de\/wp-content\/uploads\/2026\/09\/IMG_3760-scaled.jpg\"\n              alt=\"Compromis 720 Sea Breeze \u2013 Ansicht 18\"\n              loading=\"lazy\"\n              draggable=\"false\"\n            >\n          <\/div>\n\n\n        <\/div>\n      <\/div>\n\n\n      <!-- Bildz\u00e4hler -->\n      <div\n        class=\"c720-image-counter\"\n        aria-live=\"polite\"\n      >\n        1 \/ 18\n      <\/div>\n\n\n      <!-- Nach oben -->\n      <button\n        type=\"button\"\n        class=\"c720-nav c720-prev\"\n        aria-label=\"Vorheriges Bild\"\n      >\n        <svg\n          viewBox=\"0 0 24 24\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M6 15l6-6 6 6\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n          ><\/path>\n        <\/svg>\n      <\/button>\n\n\n      <!-- Nach unten -->\n      <button\n        type=\"button\"\n        class=\"c720-nav c720-next\"\n        aria-label=\"N\u00e4chstes Bild\"\n      >\n        <svg\n          viewBox=\"0 0 24 24\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M6 9l6 6 6-6\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n          ><\/path>\n        <\/svg>\n      <\/button>\n\n    <\/div>\n\n\n    <!-- Galeriehinweis -->\n    <div\n      class=\"c720-gallery-note\"\n      role=\"note\"\n    >\n\n      <svg\n        viewBox=\"0 0 24 24\"\n        aria-hidden=\"true\"\n      >\n        <path\n          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\"\n        ><\/path>\n\n        <circle\n          cx=\"12\"\n          cy=\"13\"\n          r=\"3.5\"\n        ><\/circle>\n      <\/svg>\n\n\n      <div>\n\n        <strong>18 Aufnahmen der Sea Breeze<\/strong>\n\n        <span>\n          Ein Bild anklicken, um die Gro\u00dfansicht und Diashow zu \u00f6ffnen.\n        <\/span>\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n\n\n  <!-- ===========================================================\n       DATENSPALTE\n       =========================================================== -->\n\n  <aside class=\"c720-data-column\">\n\n    <div class=\"c720-info-panel\">\n\n\n      <!-- ===================== TITEL ===================== -->\n\n      <div class=\"c720-panel-intro\">\n\n        <span>Sea Breeze<\/span>\n\n        <h2>\n          Compromis 720 im \u00dcberblick\n        <\/h2>\n\n      <\/div>\n\n\n\n      <!-- =========================================================\n           TECHNISCHE DATEN\n           COMPROMIS 720 \u201eSEA BREEZE\u201c \u2013 BAUJAHR 1973\n           ========================================================= -->\n\n      <section class=\"c720-card c720-techdata\">\n\n        <header class=\"c720-card-header\">\n\n          <h3>\n            Technische Daten\n          <\/h3>\n\n        <\/header>\n\n\n        <div class=\"c720-card-content\">\n\n          <dl class=\"c720-specs\">\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Hersteller \/ Modell\n              <\/dt>\n\n              <dd>\n                Jachtwerf Zaadnoordijk \/ Compromis 720\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Bootsname\n              <\/dt>\n\n              <dd>\n                Sea Breeze\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Baujahr\n              <\/dt>\n\n              <dd>\n                1973\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Herkunft\n              <\/dt>\n\n              <dd>\n                Niederlande\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Bootstyp\n              <\/dt>\n\n              <dd>\n                S-Spant-Kaj\u00fctsegeljacht \/ Fahrtensegler\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Konstruktion\n              <\/dt>\n\n              <dd>\n                Jachtwerf Zaadnoordijk\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Material\n              <\/dt>\n\n              <dd>\n                GFK \/ Polyester\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                L\u00e4nge \u00fcber alles\n              <\/dt>\n\n              <dd>\n                7,20 m\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Breite\n              <\/dt>\n\n              <dd>\n                2,50 m\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Tiefgang\n              <\/dt>\n\n              <dd>\n                0,90 m\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Verdr\u00e4ngung\n              <\/dt>\n\n              <dd>\n                ca. 1.500 kg\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Ballast\n              <\/dt>\n\n              <dd>\n                ca. 700 kg\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Rigg\n              <\/dt>\n\n              <dd>\n                Topgetakeltes Slup-Rigg\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Segelfl\u00e4che\n              <\/dt>\n\n              <dd>\n                ca. 21,0 m\u00b2\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Gro\u00dfsegel\n              <\/dt>\n\n              <dd>\n                ca. 13,7 m\u00b2\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Genua\n              <\/dt>\n\n              <dd>\n                ca. 12 m\u00b2\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Steuerung\n              <\/dt>\n\n              <dd>\n                Pinnensteuerung \/ Balanceruder\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Cockpit\n              <\/dt>\n\n              <dd>\n                Selbstlenzend\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Motor\n              <\/dt>\n\n              <dd>\n                Yamaha 4 PS, 2-Takt-Au\u00dfenbordmotor\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Schlafpl\u00e4tze\n              <\/dt>\n\n              <dd>\n                4 fest, bis zu 6 m\u00f6glich\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Stehh\u00f6he Kaj\u00fcte\n              <\/dt>\n\n              <dd>\n                ca. 1,68 m\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Wassertank\n              <\/dt>\n\n              <dd>\n                urspr\u00fcnglich ca. 90 l\n              <\/dd>\n\n            <\/div>\n\n\n            <div class=\"c720-spec\">\n\n              <dt>\n                Liegeplatz\n              <\/dt>\n\n              <dd>\n                Lelystad \u00b7 Niederlande\n              <\/dd>\n\n            <\/div>\n\n\n          <\/dl>\n\n        <\/div>\n\n      <\/section>\n\n\n\n      <!-- =========================================================\n           AUSSTATTUNG \u00d6FFNEN\n           ========================================================= -->\n\n      <button\n        type=\"button\"\n        class=\"c720-card-button\"\n        data-c720-open-equipment\n      >\n\n        <span>\n          Ausstattung\n        <\/span>\n\n        <svg\n          viewBox=\"0 0 24 24\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M8 5l8 7-8 7\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          ><\/path>\n        <\/svg>\n\n      <\/button>\n\n\n\n      <!-- =========================================================\n           MAKLERTEXT\n           ========================================================= -->\n\n      <details class=\"c720-card c720-accordion\">\n\n        <summary>\n\n          <span>\n            Makler sagt\n          <\/span>\n\n          <svg\n            viewBox=\"0 0 24 24\"\n            aria-hidden=\"true\"\n          >\n            <path\n              d=\"M6 9l6 6 6-6\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n            ><\/path>\n          <\/svg>\n\n        <\/summary>\n\n\n        <div class=\"c720-broker-text\">\n\n          <p>\n            Mit der \u201eSea Breeze\u201c k\u00f6nnte man grunds\u00e4tzlich sofort lossegeln. Alles Wesentliche f\u00fcr sch\u00f6nen Segelspa\u00df ist an Bord: Der Yamaha-Au\u00dfenbordmotor l\u00e4uft einwandfrei, Gro\u00dfsegel und Genua sind vorhanden und auch zwei automatische Rettungswesten geh\u00f6ren zur Ausstattung.\n          <\/p>\n\n          <p>\n            Vor einer l\u00e4ngeren Fahrt w\u00fcrde ich pers\u00f6nlich dennoch eine gr\u00fcndliche Reinigung innen und au\u00dfen sowie einen allgemeinen technischen Check empfehlen. Die \u201eSea Breeze\u201c stammt aus dem Jahr 1973 und zeigt entsprechend ihres Alters nat\u00fcrlich Gebrauchsspuren.\n          <\/p>\n\n          <p>\n            Der Innenraum wurde vom letzten Eigner teilweise nach eigenen Vorstellungen umgebaut. Die Ausf\u00fchrung ist dabei nicht \u00fcberall professionell gelungen und sicherlich auch eine Frage des pers\u00f6nlichen Geschmacks. Gerade darin sehe ich aber auch eine Chance: Die \u201eSea Breeze\u201c ist meiner Meinung nach ein Boot f\u00fcr jemanden, der gerne selbst Hand anlegt, eigene Ideen verwirklicht und sich sein Segelboot Schritt f\u00fcr Schritt so gestaltet, wie es zu ihm passt.\n          <\/p>\n\n          <p>\n            Die wichtige Basis ist vorhanden: Der Motor l\u00e4uft, die Segel sind an Bord und auch f\u00fcr die grundlegende Sicherheitsausstattung ist gesorgt. Man kauft hier also kein fertiges Hochglanzprojekt, sondern eine ehrliche Compromis 720 mit Charakter und Potenzial.\n          <\/p>\n\n          <p>\n            Wer Freude daran hat, einem klassischen Segelboot mit \u00fcberschaubarem Aufwand seine pers\u00f6nliche Handschrift zu geben, kann mit der \u201eSea Breeze\u201c schon bald aufs Wasser gehen. Denn das Wichtigste ist bereits da: Der Segelspa\u00df kann beginnen.\n          <\/p>\n\n        <\/div>\n\n      <\/details>\n\n\n\n      <!-- =========================================================\n           KONTAKT\n           ========================================================= -->\n\n      <section class=\"c720-card c720-contact-card\">\n\n        <h3>\n          Kontakt und Besichtigung\n        <\/h3>\n\n\n        <p>\n          Ansprechpartner:\n          <strong>Hans-Thomas Roth<\/strong>\n        <\/p>\n\n\n        <p>\n\n          Telefon:\n\n          <a href=\"tel:+491637570675\">\n            +49&nbsp;163&nbsp;7570675\n          <\/a>\n\n        <\/p>\n\n\n        <p>\n\n          WhatsApp:\n\n          <a\n            href=\"https:\/\/wa.me\/491637570675\"\n            target=\"_blank\"\n            rel=\"noopener\"\n          >\n            Nachricht senden\n          <\/a>\n\n        <\/p>\n\n\n        <a\n          href=\"https:\/\/soul-boats.de\/contact\/\"\n          class=\"c720-contact-button\"\n          target=\"_blank\"\n          rel=\"noopener\"\n        >\n          Besichtigung anfragen\n        <\/a>\n\n      <\/section>\n\n\n\n      <!-- =========================================================\n           PREIS\n           ========================================================= -->\n\n      <section class=\"c720-price-card\">\n\n        <span>\n          Verkaufspreis\n        <\/span>\n\n        <strong>\n          2.500 \u20ac\n        <\/strong>\n\n      <\/section>\n\n\n    <\/div>\n\n  <\/aside>\n\n\n\n  <!-- ===========================================================\n       AUSSTATTUNGSMODAL\n       =========================================================== -->\n\n  <dialog\n    class=\"c720-equipment-dialog\"\n    aria-labelledby=\"c720-equipment-title\"\n  >\n\n\n    <button\n      type=\"button\"\n      class=\"c720-dialog-close\"\n      aria-label=\"Ausstattung schlie\u00dfen\"\n    >\n      \u00d7\n    <\/button>\n\n\n    <div class=\"c720-dialog-titlebar\">\n\n      <span>\n        Sea Breeze\n      <\/span>\n\n      <h3 id=\"c720-equipment-title\">\n        Ausstattung \u2013 Compromis 720\n      <\/h3>\n\n    <\/div>\n\n\n    <div class=\"c720-dialog-content\">\n\n\n      <div class=\"c720-equipment-notice\">\n\n        <strong>\n          Ausgew\u00e4hlte Ausstattung der \u201eSea Breeze\u201c\n        <\/strong>\n\n        <span>\n          Die Ausstattung wurde nach aktuellem Kenntnisstand zusammengestellt\n          und kann nach weiterer Bestandsaufnahme noch erg\u00e4nzt werden.\n        <\/span>\n\n      <\/div>\n\n\n\n      <!-- RUMPF UND DECK -->\n\n      <h4>\n        Rumpf und Deck\n      <\/h4>\n\n      <ul class=\"c720-equipment-grid\">\n\n        <li>\n          GFK-Rumpf, au\u00dfen in Maritimblau lackiert\n        <\/li>\n\n        <li>\n          Wei\u00dfer Kaj\u00fctaufbau\n        <\/li>\n\n        <li>\n          Rutschhemmende Decksoberfl\u00e4chen \/ Antirutschbelag\n        <\/li>\n\n        <li>\n          Teak-Handl\u00e4ufe auf dem Kaj\u00fctaufbau\n        <\/li>\n\n        <li>\n          Edelstahl-Badeleiter\n        <\/li>\n\n        <li>\n          Leinen und Festmacher vorhanden\n        <\/li>\n        \n        <li>\n  Anker mit Ankerleine\n<\/li>\n\n      <\/ul>\n\n\n\n      <!-- RIGG UND SEGEL -->\n\n      <h4>\n        Rigg und Segel\n      <\/h4>\n\n      <ul class=\"c720-equipment-grid\">\n\n        <li>\n          Topgetakeltes Slup-Rigg\n        <\/li>\n\n        <li>\n          Aluminiummast\n        <\/li>\n\n        <li>\n          Gro\u00dfsegel\n        <\/li>\n\n        <li>\n          Genua\n        <\/li>\n\n        <li>\n          Seld\u00e9n Furlex 100S Rollreffanlage f\u00fcr das Vorsegel\n        <\/li>\n\n        <li>\n          Lazy Jacks mit Lazy Bag f\u00fcr das Gro\u00dfsegel\n        <\/li>\n\n      <\/ul>\n\n\n\n      <!-- MOTOR UND TECHNIK -->\n\n      <h4>\n        Motor und Technik\n      <\/h4>\n\n      <ul class=\"c720-equipment-grid\">\n\n        <li>\n          Yamaha 4 PS, 2-Takt-Au\u00dfenbordmotor\n        <\/li>\n\n        <li>\n          Au\u00dfenbordmotor mit frisch durchgef\u00fchrter Inspektion \/ Wartung\n        <\/li>\n\n        <li>\n          Elektrische Heizstrahler\n        <\/li>\n\n      <\/ul>\n\n\n\n      <!-- NAVIGATION UND SICHERHEIT -->\n\n      <h4>\n        Navigation und Sicherheit\n      <\/h4>\n\n      <ul class=\"c720-equipment-grid\">\n\n        <li>\n          Navigationsbeleuchtung\n        <\/li>\n\n        <li>\n          NASA Clipper Duet \u2013 Geschwindigkeit \/ Logge und Echolot \/ Tiefe\n        <\/li>\n\n        <li>\n          Kompass\n        <\/li>\n\n        <li>\n          2 automatische Rettungswesten\n        <\/li>\n\n      <\/ul>\n\n\n\n      <!-- INNENRAUM UND KOMFORT -->\n\n      <h4>\n        Innenraum und Komfort\n      <\/h4>\n\n      <ul class=\"c720-equipment-grid\">\n\n        <li>\n          Campingtoilette im Vorschiff\n        <\/li>\n        \n        <li>\n  Sp\u00fcle mit praktischer Abdeckung, die zugleich als zus\u00e4tzliche Arbeitsfl\u00e4che zur Zubereitung von Mahlzeiten genutzt werden kann\n<\/li>\n\n<li>\n  Zweiflammiger Gasherd\n<\/li>\n\n      <\/ul>\n\n\n    <\/div>\n\n  <\/dialog>\n\n\n\n  <!-- ===========================================================\n       BILDLIGHTBOX\n       =========================================================== -->\n\n  <div\n    class=\"c720-lightbox\"\n    aria-hidden=\"true\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-label=\"Gro\u00dfe Bildansicht der Compromis 720 Sea Breeze\"\n  >\n\n\n    <button\n      type=\"button\"\n      class=\"c720-lb-close\"\n      aria-label=\"Bildansicht schlie\u00dfen\"\n    >\n      \u00d7\n    <\/button>\n\n\n    <button\n      type=\"button\"\n      class=\"c720-lb-arrow c720-lb-prev\"\n      aria-label=\"Vorheriges Bild\"\n    >\n      \u2039\n    <\/button>\n\n\n    <button\n      type=\"button\"\n      class=\"c720-lb-arrow c720-lb-next\"\n      aria-label=\"N\u00e4chstes Bild\"\n    >\n      \u203a\n    <\/button>\n\n\n    <button\n      type=\"button\"\n      class=\"c720-lb-play\"\n      aria-label=\"Diashow pausieren\"\n      data-state=\"playing\"\n    >\n      \u275a\u275a\n    <\/button>\n\n\n    <img\n      class=\"c720-lb-image\"\n      alt=\"\"\n    >\n\n\n  <\/div>\n\n\n<\/section>\n\n\n\n<!-- =============================================================\n     SWIPER JAVASCRIPT\n     ============================================================= -->\n\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@9\/swiper-bundle.min.js\"><\/script>\n\n\n\n<script>\n\n(function () {\n\n  'use strict';\n\n\n  \/* ===========================================================\n     COMPROMIS-GALERIE INITIALISIEREN\n     =========================================================== *\/\n\n  function initializeCompromisGallery(attempt) {\n\n\n    var root =\n      document.getElementById('compromis-inhalt');\n\n\n    if (\n      !root ||\n      root.dataset.c720Ready === 'true'\n    ) {\n      return;\n    }\n\n\n    \/*\n     * Elementor kann das externe Swiper-Skript\n     * leicht verz\u00f6gert laden.\n     *\/\n\n    if (\n      typeof window.Swiper === 'undefined'\n    ) {\n\n      if (attempt < 50) {\n\n        window.setTimeout(\n          function () {\n\n            initializeCompromisGallery(\n              attempt + 1\n            );\n\n          },\n          100\n        );\n\n      }\n\n      return;\n    }\n\n\n    root.dataset.c720Ready = 'true';\n\n\n\n    \/* ===========================================================\n       ELEMENTE\n       =========================================================== *\/\n\n    var galleryColumn =\n      root.querySelector(\n        '.c720-gallery-column'\n      );\n\n\n    var infoPanel =\n      root.querySelector(\n        '.c720-info-panel'\n      );\n\n\n    var swiperElement =\n      root.querySelector(\n        '.c720-swiper'\n      );\n\n\n    var previousButton =\n      root.querySelector(\n        '.c720-prev'\n      );\n\n\n    var nextButton =\n      root.querySelector(\n        '.c720-next'\n      );\n\n\n    var counter =\n      root.querySelector(\n        '.c720-image-counter'\n      );\n\n\n    var slideImages =\n      Array.prototype.slice.call(\n\n        root.querySelectorAll(\n          '.c720-swiper .swiper-slide img'\n        )\n\n      );\n\n\n\n    \/* ===========================================================\n       GALERIEH\u00d6HE\n       =========================================================== *\/\n\n    function synchronizeGalleryHeight() {\n\n\n      if (\n        !galleryColumn ||\n        !infoPanel\n      ) {\n        return;\n      }\n\n\n      if (\n        window.innerWidth > 1024\n      ) {\n\n        galleryColumn.style.height =\n          infoPanel.offsetHeight + 'px';\n\n      } else {\n\n        galleryColumn.style.height = '';\n\n      }\n\n\n      if (\n        root.c720Swiper\n      ) {\n\n        root.c720Swiper.update();\n\n      }\n\n    }\n\n\n\n    \/* ===========================================================\n       BILDZ\u00c4HLER\n       =========================================================== *\/\n\n    function updateCounter(swiper) {\n\n\n      if (!counter) {\n        return;\n      }\n\n\n      counter.textContent =\n        (swiper.realIndex + 1) +\n        ' \/ ' +\n        slideImages.length;\n\n    }\n\n\n\n    \/* ===========================================================\n       SWIPER\n       =========================================================== *\/\n\n    root.c720Swiper =\n      new window.Swiper(\n        swiperElement,\n        {\n\n          direction: 'vertical',\n\n          loop:\n            slideImages.length > 2,\n\n          loopAdditionalSlides: 6,\n\n          slidesPerView: 'auto',\n\n          slidesPerGroup: 1,\n\n          spaceBetween: 20,\n\n          speed: 850,\n\n          grabCursor: true,\n\n          centeredSlides: false,\n\n\n          autoplay: {\n\n            delay: 2400,\n\n            reverseDirection: true,\n\n            disableOnInteraction: false,\n\n            pauseOnMouseEnter: true\n\n          },\n\n\n          mousewheel: {\n\n            forceToAxis: true,\n\n            sensitivity: 0.62\n\n          },\n\n\n          keyboard: {\n\n            enabled: true\n\n          },\n\n\n          navigation: {\n\n            nextEl: nextButton,\n\n            prevEl: previousButton\n\n          },\n\n\n          watchSlidesProgress: true,\n\n\n          on: {\n\n            init: function (swiper) {\n\n              updateCounter(swiper);\n\n            },\n\n\n            slideChange: function (swiper) {\n\n              updateCounter(swiper);\n\n            }\n\n          }\n\n        }\n      );\n\n\n\n    synchronizeGalleryHeight();\n\n\n    window.addEventListener(\n      'load',\n      synchronizeGalleryHeight\n    );\n\n\n    window.addEventListener(\n      'resize',\n      synchronizeGalleryHeight\n    );\n\n\n\n    if (\n      'ResizeObserver' in window &&\n      infoPanel\n    ) {\n\n      var resizeObserver =\n        new ResizeObserver(\n          synchronizeGalleryHeight\n        );\n\n\n      resizeObserver.observe(\n        infoPanel\n      );\n\n    }\n\n\n\n    \/* ===========================================================\n       GALERIEPFEILE\n       =========================================================== *\/\n\n    var galleryShell =\n      root.querySelector(\n        '.c720-gallery-shell'\n      );\n\n\n    if (\n      galleryShell &&\n      previousButton &&\n      nextButton\n    ) {\n\n\n      galleryShell.addEventListener(\n        'mouseenter',\n        function () {\n\n          previousButton.classList.add(\n            'is-visible'\n          );\n\n          nextButton.classList.add(\n            'is-visible'\n          );\n\n        }\n      );\n\n\n      galleryShell.addEventListener(\n        'mouseleave',\n        function () {\n\n          previousButton.classList.remove(\n            'is-visible'\n          );\n\n          nextButton.classList.remove(\n            'is-visible'\n          );\n\n        }\n      );\n\n    }\n\n\n\n    \/* ===========================================================\n       LIGHTBOX\n       =========================================================== *\/\n\n    var lightbox =\n      root.querySelector(\n        '.c720-lightbox'\n      );\n\n\n    var lightboxImage =\n      root.querySelector(\n        '.c720-lb-image'\n      );\n\n\n    var lightboxClose =\n      root.querySelector(\n        '.c720-lb-close'\n      );\n\n\n    var lightboxPrevious =\n      root.querySelector(\n        '.c720-lb-prev'\n      );\n\n\n    var lightboxNext =\n      root.querySelector(\n        '.c720-lb-next'\n      );\n\n\n    var lightboxPlay =\n      root.querySelector(\n        '.c720-lb-play'\n      );\n\n\n    var lightboxIndex = -1;\n\n    var lightboxTimer = null;\n\n    var previousBodyOverflow = '';\n\n    var lightboxDelay = 3500;\n\n\n\n    function imageSource(index) {\n\n      return (\n        slideImages[index].currentSrc ||\n        slideImages[index].src\n      );\n\n    }\n\n\n\n    function showLightboxImage(index) {\n\n\n      lightboxIndex =\n        (\n          index +\n          slideImages.length\n        ) %\n        slideImages.length;\n\n\n      lightboxImage.src =\n        imageSource(\n          lightboxIndex\n        );\n\n\n      lightboxImage.alt =\n        slideImages[\n          lightboxIndex\n        ].alt || '';\n\n    }\n\n\n\n    function stopLightboxSlideshow() {\n\n\n      if (lightboxTimer) {\n\n        window.clearInterval(\n          lightboxTimer\n        );\n\n        lightboxTimer = null;\n\n      }\n\n\n      lightboxPlay.dataset.state =\n        'paused';\n\n\n      lightboxPlay.textContent =\n        '\u25b6';\n\n\n      lightboxPlay.setAttribute(\n        'aria-label',\n        'Diashow starten'\n      );\n\n    }\n\n\n\n    function startLightboxSlideshow() {\n\n\n      stopLightboxSlideshow();\n\n\n      lightboxPlay.dataset.state =\n        'playing';\n\n\n      lightboxPlay.textContent =\n        '\u275a\u275a';\n\n\n      lightboxPlay.setAttribute(\n        'aria-label',\n        'Diashow pausieren'\n      );\n\n\n      lightboxTimer =\n        window.setInterval(\n          function () {\n\n            showLightboxImage(\n              lightboxIndex + 1\n            );\n\n          },\n          lightboxDelay\n        );\n\n    }\n\n\n\n    function openLightbox(index) {\n\n\n      previousBodyOverflow =\n        document.body.style.overflow;\n\n\n      showLightboxImage(index);\n\n\n      lightbox.setAttribute(\n        'aria-hidden',\n        'false'\n      );\n\n\n      document.body.style.overflow =\n        'hidden';\n\n\n      lightboxClose.focus({\n        preventScroll: true\n      });\n\n\n      startLightboxSlideshow();\n\n    }\n\n\n\n    function closeLightbox() {\n\n\n      lightbox.setAttribute(\n        'aria-hidden',\n        'true'\n      );\n\n\n      lightboxImage.removeAttribute(\n        'src'\n      );\n\n\n      document.body.style.overflow =\n        previousBodyOverflow;\n\n\n      stopLightboxSlideshow();\n\n\n      lightboxIndex = -1;\n\n    }\n\n\n\n    swiperElement.addEventListener(\n      'click',\n      function (event) {\n\n\n        var image =\n          event.target.closest(\n            '.swiper-slide img'\n          );\n\n\n        if (!image) {\n          return;\n        }\n\n\n        \/*\n         * Bei Swiper-Loop zuverl\u00e4ssig das Bild\n         * anhand der URL bestimmen.\n         *\/\n\n        var clickedSource =\n          image.currentSrc ||\n          image.src;\n\n\n        var index =\n          slideImages.findIndex(\n            function (originalImage) {\n\n              return (\n                (\n                  originalImage.currentSrc ||\n                  originalImage.src\n                ) ===\n                clickedSource\n              );\n\n            }\n          );\n\n\n        if (index >= 0) {\n\n          openLightbox(index);\n\n        }\n\n      }\n    );\n\n\n\n    lightboxPrevious.addEventListener(\n      'click',\n      function () {\n\n        showLightboxImage(\n          lightboxIndex - 1\n        );\n\n        stopLightboxSlideshow();\n\n      }\n    );\n\n\n\n    lightboxNext.addEventListener(\n      'click',\n      function () {\n\n        showLightboxImage(\n          lightboxIndex + 1\n        );\n\n        stopLightboxSlideshow();\n\n      }\n    );\n\n\n\n    lightboxPlay.addEventListener(\n      'click',\n      function () {\n\n\n        if (lightboxTimer) {\n\n          stopLightboxSlideshow();\n\n        } else {\n\n          startLightboxSlideshow();\n\n        }\n\n      }\n    );\n\n\n\n    lightboxClose.addEventListener(\n      'click',\n      closeLightbox\n    );\n\n\n\n    lightbox.addEventListener(\n      'click',\n      function (event) {\n\n\n        if (\n          event.target === lightbox\n        ) {\n\n          closeLightbox();\n\n        }\n\n      }\n    );\n\n\n\n    \/* ===========================================================\n       AUSSTATTUNGSMODAL\n       =========================================================== *\/\n\n    var equipmentDialog =\n      root.querySelector(\n        '.c720-equipment-dialog'\n      );\n\n\n    var equipmentOpen =\n      root.querySelector(\n        '[data-c720-open-equipment]'\n      );\n\n\n    var equipmentClose =\n      root.querySelector(\n        '.c720-dialog-close'\n      );\n\n\n\n    if (\n      equipmentOpen &&\n      equipmentDialog\n    ) {\n\n\n      equipmentOpen.addEventListener(\n        'click',\n        function () {\n\n\n          if (\n            typeof equipmentDialog.showModal ===\n            'function'\n          ) {\n\n            equipmentDialog.showModal();\n\n          } else {\n\n            equipmentDialog.setAttribute(\n              'open',\n              ''\n            );\n\n          }\n\n\n          document.body.classList.add(\n            'c720-modal-open'\n          );\n\n        }\n      );\n\n    }\n\n\n\n    function closeEquipmentDialog() {\n\n\n      if (!equipmentDialog) {\n        return;\n      }\n\n\n      if (\n        typeof equipmentDialog.close ===\n        'function'\n      ) {\n\n        equipmentDialog.close();\n\n      } else {\n\n        equipmentDialog.removeAttribute(\n          'open'\n        );\n\n      }\n\n\n      document.body.classList.remove(\n        'c720-modal-open'\n      );\n\n\n      synchronizeGalleryHeight();\n\n    }\n\n\n\n    if (equipmentClose) {\n\n      equipmentClose.addEventListener(\n        'click',\n        closeEquipmentDialog\n      );\n\n    }\n\n\n\n    if (equipmentDialog) {\n\n\n      equipmentDialog.addEventListener(\n        'cancel',\n        function (event) {\n\n          event.preventDefault();\n\n          closeEquipmentDialog();\n\n        }\n      );\n\n\n      equipmentDialog.addEventListener(\n        'click',\n        function (event) {\n\n\n          var rectangle =\n            equipmentDialog.getBoundingClientRect();\n\n\n          var outside =\n\n            event.clientX <\n            rectangle.left ||\n\n            event.clientX >\n            rectangle.right ||\n\n            event.clientY <\n            rectangle.top ||\n\n            event.clientY >\n            rectangle.bottom;\n\n\n          if (outside) {\n\n            closeEquipmentDialog();\n\n          }\n\n        }\n      );\n\n    }\n\n\n\n    \/* ===========================================================\n       TASTATURSTEUERUNG\n       =========================================================== *\/\n\n    document.addEventListener(\n      'keydown',\n      function (event) {\n\n\n        if (\n          lightbox.getAttribute(\n            'aria-hidden'\n          ) !== 'true'\n        ) {\n\n\n          if (\n            event.key === 'Escape'\n          ) {\n\n            closeLightbox();\n\n          }\n\n\n          if (\n            event.key === 'ArrowLeft'\n          ) {\n\n            showLightboxImage(\n              lightboxIndex - 1\n            );\n\n            stopLightboxSlideshow();\n\n          }\n\n\n          if (\n            event.key === 'ArrowRight'\n          ) {\n\n            showLightboxImage(\n              lightboxIndex + 1\n            );\n\n            stopLightboxSlideshow();\n\n          }\n\n        }\n\n      }\n    );\n\n  }\n\n\n\n  \/* ===========================================================\n     START\n     =========================================================== *\/\n\n  function startCompromisGallery() {\n\n    initializeCompromisGallery(0);\n\n  }\n\n\n\n  if (\n    document.readyState === 'loading'\n  ) {\n\n    document.addEventListener(\n      'DOMContentLoaded',\n      startCompromisGallery\n    );\n\n  } else {\n\n    startCompromisGallery();\n\n  }\n\n\n})();\n\n<\/script>\n\n\n\n<style>\n\n\/* =============================================================\n   COMPROMIS 720 \u2013 FARBEN UND GRUNDLAYOUT\n   ============================================================= *\/\n\n#compromis-inhalt {\n\n  --c720-navy: #0b2844;\n\n  --c720-navy-light: #174b70;\n\n  --c720-silver: #c6cbd0;\n\n  --c720-silver-dark: #899199;\n\n  --c720-ivory: #f6f5f1;\n\n  --c720-background: #edf0f2;\n\n  --c720-ink: #142433;\n\n  --c720-muted: #65717c;\n\n  --c720-radius: 20px;\n\n  --c720-shadow:\n    0 18px 48px\n    rgba(11, 40, 68, 0.12);\n\n  --c720-shadow-hover:\n    0 30px 72px\n    rgba(11, 40, 68, 0.22);\n\n  --c720-gallery-width:\n    clamp(330px, 38vw, 590px);\n\n  --c720-slide-height:\n    clamp(245px, 31vh, 390px);\n\n\n  scroll-margin-top: 100px;\n\n\n  width: 100vw;\n\n  max-width: 100vw;\n\n\n  margin-left:\n    calc(50% - 50vw);\n\n\n  display: grid;\n\n\n  grid-template-columns:\n    var(--c720-gallery-width)\n    minmax(340px, 1fr);\n\n\n  gap:\n    clamp(30px, 5vw, 82px);\n\n\n  align-items: start;\n\n\n  padding:\n    clamp(34px, 6vw, 84px);\n\n\n  box-sizing: border-box;\n\n\n  background:\n\n    radial-gradient(\n      circle at 12% 10%,\n      rgba(255, 255, 255, 0.95),\n      transparent 34%\n    ),\n\n    linear-gradient(\n      145deg,\n      #f7f7f5 0%,\n      var(--c720-background) 100%\n    );\n\n\n  color:\n    var(--c720-ink);\n\n\n  overflow: hidden;\n\n}\n\n\n\n\/* =============================================================\n   GALERIE\n   ============================================================= *\/\n\n#compromis-inhalt .c720-gallery-column {\n\n  width:\n    var(--c720-gallery-width);\n\n  min-height: 0;\n\n\n  display: grid;\n\n\n  grid-template-rows:\n    minmax(0, 1fr)\n    auto;\n\n\n  gap: 16px;\n\n}\n\n\n\n#compromis-inhalt .c720-gallery-shell {\n\n  position: relative;\n\n  min-height: 560px;\n\n  overflow: hidden;\n\n  border-radius: 28px;\n\n}\n\n\n\n#compromis-inhalt .c720-swiper {\n\n  width: 100%;\n\n  height: 100%;\n\n}\n\n\n\n#compromis-inhalt .c720-swiper .swiper-wrapper {\n\n  align-items: center;\n\n}\n\n\n\n#compromis-inhalt .c720-swiper .swiper-slide {\n\n  width: 100%;\n\n  height:\n    var(--c720-slide-height);\n\n\n  overflow: hidden;\n\n\n  border-radius:\n    var(--c720-radius);\n\n\n  background:\n    #ffffff;\n\n\n  box-shadow:\n    var(--c720-shadow);\n\n\n  transform:\n    scale(0.965);\n\n\n  opacity: 0.82;\n\n\n  filter:\n    saturate(0.93)\n    contrast(0.98);\n\n\n  transition:\n\n    transform 0.45s ease,\n\n    opacity 0.45s ease,\n\n    box-shadow 0.45s ease,\n\n    filter 0.45s ease;\n\n}\n\n\n\n#compromis-inhalt .c720-swiper .swiper-slide-active,\n#compromis-inhalt .c720-swiper .swiper-slide-next {\n\n  transform:\n    scale(1);\n\n  opacity: 1;\n\n  filter:\n    saturate(1.02)\n    contrast(1.02);\n\n}\n\n\n\n#compromis-inhalt .c720-swiper .swiper-slide:hover {\n\n  transform:\n    scale(1.018);\n\n  opacity: 1;\n\n  box-shadow:\n    var(--c720-shadow-hover);\n\n}\n\n\n\n#compromis-inhalt .c720-swiper img {\n\n  display: block;\n\n  width: 100%;\n\n  height: 100%;\n\n\n  object-fit: cover;\n\n\n  cursor: zoom-in;\n\n\n  user-select: none;\n\n  -webkit-user-drag: none;\n\n}\n\n\n\n\/* =============================================================\n   BILDZ\u00c4HLER\n   ============================================================= *\/\n\n#compromis-inhalt .c720-image-counter {\n\n  position: absolute;\n\n  right: 16px;\n\n  bottom: 16px;\n\n  z-index: 11;\n\n\n  min-width: 68px;\n\n\n  padding:\n    9px\n    13px;\n\n\n  box-sizing: border-box;\n\n\n  border:\n    1px solid\n    rgba(198, 203, 208, 0.34);\n\n\n  border-radius: 999px;\n\n\n  background:\n    rgba(7, 27, 45, 0.72);\n\n\n  backdrop-filter:\n    blur(12px);\n\n\n  font-family:\n    \"Montserrat\",\n    Arial,\n    sans-serif;\n\n\n  font-size: 11px;\n\n  font-weight: 500;\n\n  letter-spacing: 0.1em;\n\n  text-align: center;\n\n  color: #ffffff;\n\n}\n\n\n\n\/* =============================================================\n   GALERIEPFEILE\n   ============================================================= *\/\n\n#compromis-inhalt .c720-nav {\n\n  position: absolute;\n\n  left: 50%;\n\n  z-index: 12;\n\n\n  width: 46px;\n\n  height: 46px;\n\n\n  display: grid;\n\n  place-items: center;\n\n\n  border:\n    1px solid\n    rgba(198, 203, 208, 0.35);\n\n\n  border-radius: 50%;\n\n\n  background:\n    rgba(11, 40, 68, 0.84);\n\n\n  backdrop-filter:\n    blur(14px);\n\n\n  box-shadow:\n    0 12px 30px\n    rgba(0, 0, 0, 0.18);\n\n\n  color: #ffffff;\n\n\n  cursor: pointer;\n\n\n  opacity: 0;\n\n  pointer-events: none;\n\n\n  transform:\n    translateX(-50%);\n\n\n  transition:\n\n    opacity 0.22s ease,\n\n    background 0.22s ease,\n\n    transform 0.22s ease;\n\n}\n\n\n\n#compromis-inhalt .c720-nav svg {\n\n  width: 27px;\n\n  height: 27px;\n\n}\n\n\n\n#compromis-inhalt .c720-prev {\n\n  top: 18px;\n\n}\n\n\n\n#compromis-inhalt .c720-next {\n\n  bottom: 18px;\n\n}\n\n\n\n#compromis-inhalt .c720-nav.is-visible,\n#compromis-inhalt .c720-nav:focus-visible {\n\n  opacity: 1;\n\n  pointer-events: auto;\n\n}\n\n\n\n#compromis-inhalt .c720-nav:hover {\n\n  background:\n    var(--c720-navy);\n\n}\n\n\n\n\/* =============================================================\n   GALERIEHINWEIS\n   ============================================================= *\/\n\n#compromis-inhalt .c720-gallery-note {\n\n  min-height: 104px;\n\n\n  padding:\n    20px\n    22px;\n\n\n  box-sizing: border-box;\n\n\n  display: flex;\n\n  align-items: center;\n\n  gap: 16px;\n\n\n  border:\n    1px solid\n    rgba(198, 203, 208, 0.28);\n\n\n  border-radius:\n    var(--c720-radius);\n\n\n  background:\n\n    linear-gradient(\n      135deg,\n      var(--c720-navy),\n      #123d5e\n    );\n\n\n  box-shadow:\n    0 18px 44px\n    rgba(11, 40, 68, 0.18);\n\n\n  color: #ffffff;\n\n}\n\n\n\n#compromis-inhalt .c720-gallery-note svg {\n\n  flex: 0 0 auto;\n\n\n  width: 34px;\n\n  height: 34px;\n\n\n  fill: none;\n\n\n  stroke:\n    var(--c720-silver);\n\n\n  stroke-width: 1.5;\n\n}\n\n\n\n#compromis-inhalt .c720-gallery-note div {\n\n  display: grid;\n\n  gap: 5px;\n\n}\n\n\n\n#compromis-inhalt .c720-gallery-note strong {\n\n  font-family:\n    \"Playfair Display\",\n    Georgia,\n    serif;\n\n\n  font-size: 20px;\n\n  font-weight: 600;\n\n  letter-spacing: 0.02em;\n\n}\n\n\n\n#compromis-inhalt .c720-gallery-note span {\n\n  font-family:\n    \"Montserrat\",\n    Arial,\n    sans-serif;\n\n\n  font-size: 12px;\n\n  font-weight: 300;\n\n  line-height: 1.5;\n\n\n  color:\n    rgba(255, 255, 255, 0.72);\n\n}\n\n\n\n\/* =============================================================\n   DATENSPALTE\n   ============================================================= *\/\n\n#compromis-inhalt .c720-data-column {\n\n  min-width: 0;\n\n}\n\n\n\n#compromis-inhalt .c720-info-panel {\n\n  width: 100%;\n\n\n  max-width: 780px;\n\n\n  margin-left: auto;\n\n\n  display: grid;\n\n\n  gap: 15px;\n\n\n  font-family:\n    \"Montserrat\",\n    Arial,\n    sans-serif;\n\n}\n\n\n\n\/* =============================================================\n   INTRO\n   ============================================================= *\/\n\n#compromis-inhalt .c720-panel-intro {\n\n  padding:\n    0\n    4px\n    14px;\n\n}\n\n\n\n#compromis-inhalt .c720-panel-intro span {\n\n  display: block;\n\n\n  margin-bottom: 7px;\n\n\n  font-size: 11px;\n\n\n  font-weight: 500;\n\n\n  letter-spacing: 0.3em;\n\n\n  text-transform: uppercase;\n\n\n  color:\n    var(--c720-silver-dark);\n\n}\n\n\n\n#compromis-inhalt .c720-panel-intro h2 {\n\n  margin: 0;\n\n\n  font-family:\n    \"Playfair Display\",\n    Georgia,\n    serif;\n\n\n  font-size:\n    clamp(28px, 4vw, 44px);\n\n\n  font-weight: 600;\n\n\n  line-height: 1.08;\n\n\n  color:\n    var(--c720-navy);\n\n}\n\n\n\n\/* =============================================================\n   KARTEN\n   ============================================================= *\/\n\n#compromis-inhalt .c720-card,\n#compromis-inhalt .c720-card-button,\n#compromis-inhalt .c720-price-card {\n\n  width: 100%;\n\n\n  box-sizing: border-box;\n\n\n  border:\n    1px solid\n    rgba(11, 40, 68, 0.08);\n\n\n  border-radius:\n    var(--c720-radius);\n\n\n  background:\n    rgba(255, 255, 255, 0.86);\n\n\n  backdrop-filter:\n    blur(16px);\n\n\n  box-shadow:\n    var(--c720-shadow);\n\n\n  overflow: hidden;\n\n}\n\n\n\n#compromis-inhalt .c720-card-header,\n#compromis-inhalt .c720-card-button,\n#compromis-inhalt .c720-accordion summary,\n#compromis-inhalt .c720-price-card {\n\n  background:\n\n    linear-gradient(\n      135deg,\n      var(--c720-navy),\n      var(--c720-navy-light)\n    );\n\n\n  color: #ffffff;\n\n}\n\n\n\n\/* =============================================================\n   TECHNISCHE DATEN\n   ============================================================= *\/\n\n#compromis-inhalt .c720-card-header {\n\n  padding:\n    17px\n    20px;\n\n\n  border-bottom:\n    1px solid\n    rgba(198, 203, 208, 0.18);\n\n}\n\n\n\n#compromis-inhalt .c720-card-header h3,\n#compromis-inhalt .c720-contact-card h3 {\n\n  margin: 0;\n\n\n  font-size: 12px;\n\n\n  font-weight: 600;\n\n\n  letter-spacing: 0.14em;\n\n\n  text-transform: uppercase;\n\n}\n\n\n\n#compromis-inhalt .c720-card-content {\n\n  padding:\n    15px\n    20px\n    18px;\n\n}\n\n\n\n#compromis-inhalt .c720-specs {\n\n  display: grid;\n\n  margin: 0;\n\n}\n\n\n\n#compromis-inhalt .c720-spec {\n\n  display: grid;\n\n\n  grid-template-columns:\n    minmax(150px, 1fr)\n    minmax(150px, auto);\n\n\n  gap: 20px;\n\n\n  padding:\n    9px 0;\n\n\n  border-bottom:\n    1px solid\n    rgba(11, 40, 68, 0.08);\n\n\n  font-size: 12px;\n\n\n  line-height: 1.45;\n\n}\n\n\n\n#compromis-inhalt .c720-spec:last-child {\n\n  border-bottom: 0;\n\n}\n\n\n\n#compromis-inhalt .c720-spec dt {\n\n  font-weight: 500;\n\n  color: #34495a;\n\n}\n\n\n\n#compromis-inhalt .c720-spec dd {\n\n  margin: 0;\n\n  text-align: right;\n\n  color:\n    var(--c720-muted);\n\n}\n\n\n\n#compromis-inhalt\n.c720-techdata\n.c720-card-header\nh3 {\n\n  color: #ffffff;\n\n}\n\n\n\n\/* =============================================================\n   AUSSTATTUNGSBUTTON\n   ============================================================= *\/\n\n#compromis-inhalt .c720-card-button {\n\n  min-height: 58px;\n\n\n  padding:\n    16px\n    20px;\n\n\n  display: flex;\n\n\n  justify-content:\n    space-between;\n\n\n  align-items: center;\n\n\n  gap: 18px;\n\n\n  border-color:\n    rgba(198, 203, 208, 0.18);\n\n\n  font-family:\n    \"Montserrat\",\n    Arial,\n    sans-serif;\n\n\n  font-size: 12px;\n\n\n  font-weight: 600;\n\n\n  letter-spacing: 0.14em;\n\n\n  text-transform: uppercase;\n\n\n  text-align: left;\n\n\n  color: #ffffff;\n\n\n  cursor: pointer;\n\n\n  transition:\n\n    filter 0.2s ease,\n\n    transform 0.2s ease;\n\n}\n\n\n\n#compromis-inhalt .c720-card-button span {\n\n  color: #ffffff;\n\n}\n\n\n\n#compromis-inhalt .c720-card-button svg {\n\n  width: 21px;\n\n  height: 21px;\n\n\n  transition:\n    transform 0.2s ease;\n\n}\n\n\n\n#compromis-inhalt .c720-card-button:hover {\n\n  filter:\n    brightness(1.08);\n\n\n  transform:\n    translateY(-1px);\n\n}\n\n\n\n#compromis-inhalt .c720-card-button:hover svg {\n\n  transform:\n    translateX(3px);\n\n}\n\n\n\n\/* =============================================================\n   MAKLERTEXT\n   ============================================================= *\/\n\n#compromis-inhalt .c720-accordion {\n\n  margin: 0;\n\n}\n\n\n\n#compromis-inhalt .c720-accordion summary {\n\n  min-height: 58px;\n\n\n  padding:\n    16px\n    20px;\n\n\n  box-sizing: border-box;\n\n\n  display: flex;\n\n\n  align-items: center;\n\n\n  justify-content:\n    space-between;\n\n\n  gap: 18px;\n\n\n  list-style: none;\n\n\n  cursor: pointer;\n\n\n  font-size: 12px;\n\n\n  font-weight: 600;\n\n\n  letter-spacing: 0.14em;\n\n\n  text-transform: uppercase;\n\n}\n\n\n\n#compromis-inhalt\n.c720-accordion\nsummary::-webkit-details-marker {\n\n  display: none;\n\n}\n\n\n\n#compromis-inhalt\n.c720-accordion\nsummary svg {\n\n  width: 21px;\n\n  height: 21px;\n\n\n  transition:\n    transform 0.25s ease;\n\n}\n\n\n\n#compromis-inhalt\n.c720-accordion[open]\nsummary svg {\n\n  transform:\n    rotate(180deg);\n\n}\n\n\n\n#compromis-inhalt .c720-broker-text {\n\n  padding:\n    18px\n    20px\n    20px;\n\n}\n\n\n\n#compromis-inhalt .c720-broker-text p {\n\n  margin:\n    0\n    0\n    13px;\n\n\n  font-size: 13px;\n\n\n  line-height: 1.7;\n\n\n  color: #526171;\n\n}\n\n\n\n#compromis-inhalt\n.c720-broker-text\np:last-child {\n\n  margin-bottom: 0;\n\n}\n\n\n\n\/* =============================================================\n   KONTAKT\n   ============================================================= *\/\n\n#compromis-inhalt .c720-contact-card {\n\n  padding: 21px;\n\n\n  font-size: 13px;\n\n\n  line-height: 1.6;\n\n}\n\n\n\n#compromis-inhalt .c720-contact-card h3 {\n\n  margin-bottom: 12px;\n\n\n  color:\n    var(--c720-navy);\n\n}\n\n\n\n#compromis-inhalt .c720-contact-card p {\n\n  margin:\n    6px 0;\n\n\n  color: #526171;\n\n}\n\n\n\n#compromis-inhalt\n.c720-contact-card\na:not(.c720-contact-button) {\n\n  color: inherit;\n\n}\n\n\n\n#compromis-inhalt .c720-contact-button {\n\n  display: inline-flex;\n\n\n  margin-top: 14px;\n\n\n  padding:\n    11px\n    17px;\n\n\n  border-radius: 999px;\n\n\n  background:\n    var(--c720-navy);\n\n\n  color: #ffffff;\n\n\n  text-decoration: none;\n\n\n  font-size: 12px;\n\n\n  font-weight: 600;\n\n\n  transition:\n\n    transform 0.2s ease,\n\n    background 0.2s ease;\n\n}\n\n\n\n#compromis-inhalt .c720-contact-button:hover {\n\n  transform:\n    translateY(-2px);\n\n\n  background:\n    var(--c720-navy-light);\n\n}\n\n\n\n\/* =============================================================\n   PREIS\n   ============================================================= *\/\n\n#compromis-inhalt .c720-price-card {\n\n  padding: 21px;\n\n\n  display: flex;\n\n\n  align-items: baseline;\n\n\n  justify-content:\n    space-between;\n\n\n  gap: 20px;\n\n\n  border-color:\n    rgba(198, 203, 208, 0.18);\n\n}\n\n\n\n#compromis-inhalt .c720-price-card span {\n\n  font-size: 11px;\n\n\n  font-weight: 400;\n\n\n  letter-spacing: 0.16em;\n\n\n  text-transform: uppercase;\n\n\n  color:\n    rgba(255, 255, 255, 0.72);\n\n}\n\n\n\n#compromis-inhalt .c720-price-card strong {\n\n  font-family:\n    \"Playfair Display\",\n    Georgia,\n    serif;\n\n\n  font-size:\n    clamp(23px, 3vw, 34px);\n\n\n  font-weight: 600;\n\n\n  line-height: 1;\n\n\n  color: #ffffff;\n\n}\n\n\n\n\/* =============================================================\n   AUSSTATTUNGSDIALOG\n   ============================================================= *\/\n\nbody.c720-modal-open {\n\n  overflow: hidden !important;\n\n}\n\n\n\n#compromis-inhalt .c720-equipment-dialog {\n\n  width:\n    min(1120px, 94vw);\n\n\n  max-height:\n    calc(100svh - 54px);\n\n\n  margin: auto;\n\n\n  padding: 0;\n\n\n  border:\n    1px solid\n    rgba(198, 203, 208, 0.18);\n\n\n  border-radius: 26px;\n\n\n  background:\n    #f7f8f9;\n\n\n  box-shadow:\n    0 38px 110px\n    rgba(0, 0, 0, 0.48);\n\n\n  color:\n    var(--c720-ink);\n\n\n  overflow: auto;\n\n}\n\n\n\n#compromis-inhalt\n.c720-equipment-dialog::backdrop {\n\n  background:\n    rgba(3, 14, 24, 0.78);\n\n\n  backdrop-filter:\n    blur(10px);\n\n}\n\n\n\n#compromis-inhalt .c720-dialog-close {\n\n  position: fixed;\n\n\n  top: 18px;\n\n  right: 18px;\n\n\n  z-index: 2;\n\n\n  width: 48px;\n\n  height: 48px;\n\n\n  display: grid;\n\n  place-items: center;\n\n\n  border:\n    1px solid\n    rgba(11, 40, 68, 0.08);\n\n\n  border-radius: 50%;\n\n\n  background:\n    rgba(255, 255, 255, 0.96);\n\n\n  box-shadow:\n    0 12px 34px\n    rgba(0, 0, 0, 0.22);\n\n\n  font-size: 27px;\n\n\n  line-height: 1;\n\n\n  color:\n    var(--c720-navy);\n\n\n  cursor: pointer;\n\n}\n\n\n\n#compromis-inhalt .c720-dialog-titlebar {\n\n  position: sticky;\n\n\n  top: 0;\n\n\n  z-index: 1;\n\n\n  padding:\n    22px\n    26px;\n\n\n  border-bottom:\n    1px solid\n    rgba(198, 203, 208, 0.18);\n\n\n  background:\n\n    linear-gradient(\n      135deg,\n      var(--c720-navy),\n      var(--c720-navy-light)\n    );\n\n\n  color: #ffffff;\n\n}\n\n\n\n#compromis-inhalt .c720-dialog-titlebar span {\n\n  display: block;\n\n\n  margin-bottom: 5px;\n\n\n  font-size: 10px;\n\n\n  font-weight: 400;\n\n\n  letter-spacing: 0.3em;\n\n\n  text-transform: uppercase;\n\n\n  color:\n    var(--c720-silver);\n\n}\n\n\n\n#compromis-inhalt .c720-dialog-titlebar h3 {\n\n  margin: 0;\n\n\n  padding-right: 54px;\n\n\n  font-family:\n    \"Playfair Display\",\n    Georgia,\n    serif;\n\n\n  font-size:\n    clamp(24px, 3vw, 36px);\n\n\n  font-weight: 600;\n\n\n  color: #ffffff;\n\n}\n\n\n\n#compromis-inhalt .c720-dialog-content {\n\n  padding:\n    24px\n    26px\n    30px;\n\n}\n\n\n\n#compromis-inhalt .c720-equipment-notice {\n\n  margin-bottom: 25px;\n\n\n  padding:\n    18px\n    20px;\n\n\n  display: grid;\n\n\n  gap: 6px;\n\n\n  border-left:\n    3px solid\n    var(--c720-silver-dark);\n\n\n  border-radius:\n    0\n    14px\n    14px\n    0;\n\n\n  background:\n    rgba(11, 40, 68, 0.06);\n\n}\n\n\n\n#compromis-inhalt\n.c720-equipment-notice\nstrong {\n\n  font-size: 14px;\n\n\n  color:\n    var(--c720-navy);\n\n}\n\n\n\n#compromis-inhalt\n.c720-equipment-notice\nspan {\n\n  font-size: 12px;\n\n\n  line-height: 1.5;\n\n\n  color:\n    var(--c720-muted);\n\n}\n\n\n\n#compromis-inhalt\n.c720-dialog-content\nh4 {\n\n  margin:\n    25px\n    0\n    12px;\n\n\n  font-size: 12px;\n\n\n  font-weight: 600;\n\n\n  letter-spacing: 0.14em;\n\n\n  text-transform: uppercase;\n\n\n  color:\n    var(--c720-navy);\n\n}\n\n\n\n#compromis-inhalt .c720-equipment-grid {\n\n  display: grid;\n\n\n  grid-template-columns:\n    repeat(\n      auto-fit,\n      minmax(230px, 1fr)\n    );\n\n\n  gap: 12px;\n\n\n  margin: 0;\n\n\n  padding: 0;\n\n\n  list-style: none;\n\n}\n\n\n\n#compromis-inhalt\n.c720-equipment-grid\nli {\n\n  padding:\n    15px\n    16px;\n\n\n  border:\n    1px solid\n    rgba(11, 40, 68, 0.08);\n\n\n  border-radius: 15px;\n\n\n  background: #ffffff;\n\n\n  box-shadow:\n    0 9px 24px\n    rgba(11, 40, 68, 0.06);\n\n\n  font-size: 12px;\n\n\n  line-height: 1.5;\n\n\n  color: #526171;\n\n\n  transition:\n\n    transform 0.18s ease,\n\n    box-shadow 0.18s ease;\n\n}\n\n\n\n#compromis-inhalt\n.c720-equipment-grid\nli:hover {\n\n  transform:\n    translateY(-2px);\n\n\n  box-shadow:\n    0 16px 34px\n    rgba(11, 40, 68, 0.11);\n\n}\n\n\n\n\/* =============================================================\n   LIGHTBOX\n   ============================================================= *\/\n\n#compromis-inhalt\n.c720-lightbox[aria-hidden=\"true\"] {\n\n  display: none;\n\n}\n\n\n\n#compromis-inhalt .c720-lightbox {\n\n  position: fixed;\n\n\n  inset: 0;\n\n\n  z-index: 999999;\n\n\n  display: grid;\n\n\n  place-items: center;\n\n\n  padding: 4vw;\n\n\n  box-sizing: border-box;\n\n\n  background:\n    rgba(3, 14, 24, 0.90);\n\n\n  backdrop-filter:\n    blur(10px);\n\n}\n\n\n\n#compromis-inhalt .c720-lb-image {\n\n  max-width: 100%;\n\n\n  max-height: 90vh;\n\n\n  object-fit: contain;\n\n\n  border-radius: 14px;\n\n\n  box-shadow:\n    0 32px 100px\n    rgba(0, 0, 0, 0.58);\n\n}\n\n\n\n#compromis-inhalt .c720-lb-close,\n#compromis-inhalt .c720-lb-play {\n\n  position: fixed;\n\n\n  z-index: 1000000;\n\n\n  width: 48px;\n\n  height: 48px;\n\n\n  display: grid;\n\n\n  place-items: center;\n\n\n  border:\n    1px solid\n    rgba(198, 203, 208, 0.28);\n\n\n  border-radius: 50%;\n\n\n  background:\n    rgba(255, 255, 255, 0.95);\n\n\n  box-shadow:\n    0 10px 30px\n    rgba(0, 0, 0, 0.30);\n\n\n  color:\n    var(--c720-navy);\n\n\n  cursor: pointer;\n\n}\n\n\n\n#compromis-inhalt .c720-lb-close {\n\n  top: 18px;\n\n  right: 18px;\n\n\n  font-size: 26px;\n\n}\n\n\n\n#compromis-inhalt .c720-lb-play {\n\n  bottom: 22px;\n\n\n  left: 50%;\n\n\n  transform:\n    translateX(-50%);\n\n\n  font-size: 17px;\n\n}\n\n\n\n#compromis-inhalt .c720-lb-arrow {\n\n  position: fixed;\n\n\n  top: 50%;\n\n\n  z-index: 1000000;\n\n\n  border: 0;\n\n\n  background: transparent;\n\n\n  font-size: 76px;\n\n\n  line-height: 1;\n\n\n  color:\n    rgba(255, 255, 255, 0.84);\n\n\n  cursor: pointer;\n\n\n  transform:\n    translateY(-50%);\n\n}\n\n\n\n#compromis-inhalt .c720-lb-prev {\n\n  left: 24px;\n\n}\n\n\n\n#compromis-inhalt .c720-lb-next {\n\n  right: 24px;\n\n}\n\n\n\n\/* =============================================================\n   TABLET\n   ============================================================= *\/\n\n@media (max-width: 1024px) {\n\n\n  #compromis-inhalt {\n\n    grid-template-columns:\n      1fr;\n\n\n    gap: 38px;\n\n  }\n\n\n  #compromis-inhalt .c720-gallery-column {\n\n    width: 100%;\n\n    height: auto;\n\n  }\n\n\n  #compromis-inhalt .c720-gallery-shell {\n\n    height: 74vh;\n\n    min-height: 560px;\n\n  }\n\n\n  #compromis-inhalt .c720-info-panel {\n\n    max-width: none;\n\n  }\n\n\n  #compromis-inhalt .c720-nav {\n\n    opacity: 1;\n\n    pointer-events: auto;\n\n  }\n\n}\n\n\n\n\/* =============================================================\n   SMARTPHONE\n   ============================================================= *\/\n\n@media (max-width: 560px) {\n\n\n  #compromis-inhalt {\n\n    --c720-slide-height:\n      clamp(195px, 33vh, 285px);\n\n\n    padding:\n      22px\n      17px\n      34px;\n\n  }\n\n\n  #compromis-inhalt .c720-gallery-shell {\n\n    height: 68vh;\n\n    min-height: 500px;\n\n    border-radius: 22px;\n\n  }\n\n\n  #compromis-inhalt .c720-gallery-note {\n\n    min-height: 96px;\n\n\n    padding: 18px;\n\n  }\n\n\n  #compromis-inhalt .c720-gallery-note strong {\n\n    font-size: 18px;\n\n  }\n\n\n  #compromis-inhalt .c720-panel-intro h2 {\n\n    font-size: 31px;\n\n  }\n\n\n  #compromis-inhalt .c720-spec {\n\n    grid-template-columns:\n      1fr;\n\n\n    gap: 4px;\n\n  }\n\n\n  #compromis-inhalt .c720-spec dd {\n\n    text-align: left;\n\n  }\n\n\n  #compromis-inhalt .c720-price-card {\n\n    display: block;\n\n  }\n\n\n  #compromis-inhalt .c720-price-card strong {\n\n    display: block;\n\n\n    margin-top: 9px;\n\n  }\n\n\n  #compromis-inhalt .c720-lb-arrow {\n\n    font-size: 54px;\n\n  }\n\n\n  #compromis-inhalt .c720-lb-prev {\n\n    left: 10px;\n\n  }\n\n\n  #compromis-inhalt .c720-lb-next {\n\n    right: 10px;\n\n  }\n\n\n  #compromis-inhalt .c720-dialog-content {\n\n    padding:\n      20px\n      17px\n      25px;\n\n  }\n\n\n  #compromis-inhalt .c720-dialog-titlebar {\n\n    padding:\n      20px\n      17px;\n\n  }\n\n}\n\n\n\n\/* =============================================================\n   REDUZIERTE BEWEGUNG\n   ============================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n\n  #compromis-inhalt *,\n  #compromis-inhalt *::before,\n  #compromis-inhalt *::after {\n\n    scroll-behavior:\n      auto !important;\n\n\n    animation-duration:\n      0.01ms !important;\n\n\n    animation-iteration-count:\n      1 !important;\n\n\n    transition-duration:\n      0.01ms !important;\n\n  }\n\n}\n\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-bf8c837 e-flex e-con-boxed e-con e-parent\" data-id=\"bf8c837\" 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-94c25b1 elementor-widget elementor-widget-text-editor\" data-id=\"94c25b1\" 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>Sea Breeze Compromis 720 Yacht entdecken \u2193 1 \/ 18 18 Aufnahmen der Sea Breeze Ein Bild anklicken, um die Gro\u00dfansicht und Diashow zu \u00f6ffnen. Sea Breeze Compromis 720 im \u00dcberblick Technische Daten Hersteller \/ Modell Jachtwerf Zaadnoordijk \/ Compromis 720 Bootsname Sea Breeze Baujahr 1973 Herkunft Niederlande Bootstyp S-Spant-Kaj\u00fctsegeljacht \/ Fahrtensegler Konstruktion Jachtwerf Zaadnoordijk [&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-8335","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8335","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=8335"}],"version-history":[{"count":61,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8335\/revisions"}],"predecessor-version":[{"id":8435,"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/pages\/8335\/revisions\/8435"}],"wp:attachment":[{"href":"https:\/\/soul-boats.de\/en\/wp-json\/wp\/v2\/media?parent=8335"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}