{"id":14554,"date":"2026-05-21T13:30:41","date_gmt":"2026-05-21T13:30:41","guid":{"rendered":"https:\/\/lippert-studios.com\/?page_id=14554"},"modified":"2026-07-01T11:19:29","modified_gmt":"2026-07-01T09:19:29","slug":"studio-tour","status":"publish","type":"page","link":"https:\/\/lippert-studios.com\/en\/studio\/studio-tour\/","title":{"rendered":"Studio Tour"},"content":{"rendered":"<?xml encoding=\"UTF-8\"><?xml encoding=\"UTF-8\"><div data-elementor-type=\"wp-page\" data-elementor-id=\"14554\" class=\"elementor elementor-14554\">\n\t\t\t\t<div class=\"elementor-element elementor-element-063ad5b e-con e-atomic-element e-div-block-base e-063ad5b-ed1833d \" data-id=\"063ad5b\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"063ad5b\">\n    \t\t<div class=\"elementor-element elementor-element-d126082 elementor-widget elementor-widget-html\" data-id=\"d126082\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Bebas+Neue&amp;family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&amp;family=DM+Mono:wght@400;500&amp;display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n.ls-hotspot-root *,\r\n.ls-hotspot-root *::before,\r\n.ls-hotspot-root *::after {\r\n  box-sizing: border-box;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n\/* &#9472;&#9472; LOADER &#9472;&#9472; *\/\r\n.ls-loader {\r\n  position: fixed;\r\n  inset: 0;\r\n  z-index: 99999;\r\n  background: #fff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 28px;\r\n  transition: opacity 0.6s ease, visibility 0.6s ease;\r\n}\r\n\r\n.ls-loader.hidden {\r\n  opacity: 0;\r\n  visibility: hidden;\r\n  pointer-events: none;\r\n}\r\n\r\n.ls-loader__track {\r\n  width: 160px;\r\n  height: 2px;\r\n  background: #c5c5c5;\r\n  position: relative;\r\n  overflow: hidden;\r\n  border-radius: 5px;\r\n}\r\n\r\n.ls-loader__bar {\r\n  position: absolute;\r\n  top: 0; left: 0;\r\n  height: 100%;\r\n  width: 0%;\r\n  background: #007396;\r\n  transition: width 0.3s ease;\r\n  border-radius: 5px;\r\n}\r\n\r\n.ls-loader__hint {\r\n  font-size: 9px;\r\n  letter-spacing: 0.2em;\r\n  text-transform: uppercase;\r\n  color: #3d3d3d;\r\n}\r\n\r\n.ls-hotspot-root {\r\n  --cream: #eeeeee;\r\n  --ink: #0d0d0b;\r\n  --panel-w: 400px;\r\n  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);\r\n  font-family: 'DM Sans', sans-serif;\r\n  position: fixed;\r\n  inset: 0;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  max-height: none;\r\n  display: block;\r\n  overflow: hidden;\r\n  border-radius: 0;\r\n  z-index: 9999;\r\n  background: #ffffff85;\r\n}\r\n\r\n.ls-hotspot-root .widget {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n\/* &#9472;&#9472; STAGE FRAME &#9472;&#9472;\r\n   Der Frame bekommt per JS exakt das Seitenverh&auml;ltnis des Bildes und wird\r\n   zentriert. Dadurch stimmen die %-Positionen der Hotspots IMMER mit dem\r\n   sichtbaren Bild &uuml;berein, egal welches Seitenverh&auml;ltnis der Bildschirm hat.\r\n   Das war der Hauptgrund f&uuml;r das kaputte Mobile-Layout. *\/\r\n.ls-hotspot-root .stage-frame {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  transition: transform 0.9s var(--ease-out), top 0.6s var(--ease-out), width 0.25s ease, height 0.25s ease;\r\n  opacity: 0;\r\n}\r\n\r\n.ls-hotspot-root .stage-frame.ready { opacity: 1; }\r\n\r\n@media (min-width: 861px) {\r\n  .ls-hotspot-root .widget.panel-open .stage-frame {\r\n    transform: translate(-50%, -50%) scale(1.05) translateX(-7%);\r\n  }\r\n}\r\n\r\n.ls-hotspot-root .stage {\r\n  position: absolute;\r\n  inset: 0;\r\n  overflow: hidden;\r\n}\r\n\r\n.ls-hotspot-root .stage__bg-wrap {\r\n  width: 100%;\r\n  height: 100%;\r\n  line-height: 0;\r\n}\r\n\r\n.ls-hotspot-root .stage__bg {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: fill;\r\n}\r\n\r\n.ls-hotspot-root .stage__dim {\r\n  position: absolute;\r\n  inset: 0;\r\n  background: rgba(13,13,11,0);\r\n  transition: background 0.6s ease;\r\n  z-index: 2;\r\n  pointer-events: none;\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .stage__dim {\r\n  background: rgba(13,13,11,0.72);\r\n  pointer-events: auto;\r\n  cursor: pointer;\r\n}\r\n\r\n.ls-hotspot-root .hs {\r\n  position: absolute;\r\n  cursor: pointer;\r\n  transform-origin: center bottom;\r\n  transition: transform 0.3s var(--ease-out), opacity 0.4s ease;\r\n  z-index: 3;\r\n}\r\n\r\n.ls-hotspot-root .hs__img-wrap {\r\n  position: relative;\r\n  width: 100%;\r\n  line-height: 0;\r\n}\r\n\r\n.ls-hotspot-root .hs__img {\r\n  display: block;\r\n  width: 100%;\r\n  height: auto;\r\n  filter: brightness(0.93) contrast(1.04);\r\n  transition: filter 0.3s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n.ls-hotspot-root .hs:hover .hs__img,\r\n.ls-hotspot-root .hs.touch-hover .hs__img {\r\n  filter: brightness(1.07) contrast(1.0);\r\n}\r\n\r\n.ls-hotspot-root .hs__shine-img {\r\n  position: absolute;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: auto;\r\n  display: block;\r\n  pointer-events: none;\r\n  mix-blend-mode: screen;\r\n  filter: brightness(2.5) saturate(0);\r\n  opacity: 0;\r\n  -webkit-mask-image: linear-gradient(\r\n    105deg,\r\n    transparent  0%,\r\n    transparent  40%,\r\n    white        50%,\r\n    transparent  60%,\r\n    transparent  100%\r\n  );\r\n  mask-image: linear-gradient(\r\n    105deg,\r\n    transparent  0%,\r\n    transparent  40%,\r\n    white        50%,\r\n    transparent  60%,\r\n    transparent  100%\r\n  );\r\n  -webkit-mask-size: 300% 100%;\r\n  mask-size: 300% 100%;\r\n  -webkit-mask-position: -150% 0;\r\n  mask-position: -150% 0;\r\n  -webkit-mask-repeat: no-repeat;\r\n  mask-repeat: no-repeat;\r\n}\r\n\r\n.ls-hotspot-root .hs.shining .hs__shine-img {\r\n  animation: ls-shineSweep 2.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;\r\n}\r\n\r\n@keyframes ls-shineSweep {\r\n  0%   { opacity: 1; -webkit-mask-position: -150% 0; mask-position: -150% 0; }\r\n  100% { opacity: 1; -webkit-mask-position: 250% 0; mask-position: 250% 0; }\r\n}\r\n\r\n.ls-hotspot-root .hs.active {\r\n  z-index: 4;\r\n  transform: scale(1.07) translateY(0);\r\n}\r\n\r\n.ls-hotspot-root .hs.active .hs__img {\r\n  filter: brightness(1.12) contrast(1.0);\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .hs:not(.active) {\r\n  opacity: 0.12;\r\n  pointer-events: none;\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .hs.active {\r\n  opacity: 1;\r\n}\r\n\r\n.ls-hotspot-root .pin-layer {\r\n  position: absolute;\r\n  inset: 0;\r\n  pointer-events: none;\r\n  z-index: 50;\r\n}\r\n\r\n.ls-hotspot-root .pin {\r\n  position: absolute;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  transform: translateX(-50%);\r\n  pointer-events: none;\r\n  opacity: 1;\r\n  transition: opacity 0.3s ease;\r\n}\r\n\r\n.ls-hotspot-root .pin-dot {\r\n  width: 18px;\r\n  height: 18px;\r\n  border-radius: 50% 50% 50% 0;\r\n  background: var(--cream);\r\n  transform: rotate(-45deg);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  transition: background 0.3s ease;\r\n  box-shadow: 0 1px 4px rgba(0,0,0,0.35);\r\n}\r\n\r\n.ls-hotspot-root .pin-dot span {\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 7px;\r\n  font-weight: 500;\r\n  color: var(--ink);\r\n  transform: rotate(45deg);\r\n  line-height: 1;\r\n}\r\n\r\n.ls-hotspot-root .pin-line {\r\n  width: 1px;\r\n  height: 14px;\r\n  background: linear-gradient(to bottom, var(--cream), transparent);\r\n}\r\n\r\n@keyframes ls-pinFloat {\r\n  0%, 100% { transform: translateX(-50%) translateY(0px); }\r\n  50%       { transform: translateX(-50%) translateY(-5px); }\r\n}\r\n\r\n.ls-hotspot-root .widget:not(.panel-open) .pin {\r\n  animation: ls-pinFloat 2.8s ease-in-out infinite;\r\n  animation-delay: var(--delay, 0s);\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .pin { opacity: 0; }\r\n.ls-hotspot-root .widget.panel-open .pin.active { opacity: 1; }\r\n.ls-hotspot-root .pin.shining .pin-dot { background: #fff; }\r\n\r\n.ls-hotspot-root .hud {\r\n  position: absolute;\r\n  z-index: 25;\r\n  pointer-events: none;\r\n  transition: opacity 0.4s ease;\r\n}\r\n\r\n.ls-hotspot-root .hud--tl {\r\n  top: 28px; left: 32px;\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 11px;\r\n  letter-spacing: 0.12em;\r\n  color: rgba(240,235,226,0.4);\r\n}\r\n\r\n.ls-hotspot-root .hud--bc {\r\n  bottom: 28px; left: 50%;\r\n  transform: translateX(-50%);\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 10px;\r\n  letter-spacing: 0.2em;\r\n  text-transform: uppercase;\r\n  color: rgba(240,235,226,0.32);\r\n  white-space: nowrap;\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .hud { opacity: 0; }\r\n\r\n.ls-hotspot-root .panel {\r\n  position: absolute;\r\n  top: 0; right: 0;\r\n  width: var(--panel-w);\r\n  height: 100vh;\r\n  background: var(--cream);\r\n  z-index: 90;\r\n  display: flex;\r\n  flex-direction: column;\r\n  transform: translateX(100%);\r\n  transition: transform 0.65s var(--ease-out);\r\n  overflow: hidden;\r\n}\r\n\r\n.ls-hotspot-root .panel.visible { transform: translateX(0); }\r\n\r\n.ls-hotspot-root .panel__close {\r\n  position: absolute;\r\n  top: 63px; right: 20px;\r\n  width: 34px; height: 34px;\r\n  background: none;\r\n  border: 1px solid rgba(13,13,11,0.18);\r\n  border-radius: 50%;\r\n  cursor: pointer;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 5;\r\n  transition: background 0.2s ease, border-color 0.2s ease;\r\n}\r\n\r\n.ls-hotspot-root .panel__close:hover { background: var(--ink); border-color: var(--ink); }\r\n.ls-hotspot-root .panel__close:hover svg path { stroke: var(--cream); }\r\n.ls-hotspot-root .panel__close svg { width: 12px; height: 12px; }\r\n.ls-hotspot-root .panel__close svg path { stroke: var(--ink); stroke-width: 1.5; transition: stroke 0.2s; }\r\n\r\n.ls-hotspot-root .panel__img-wrap {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 46%;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n}\r\n\r\n.ls-hotspot-root .panel__img-wrap::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: 0; left: 0; right: 0;\r\n  height: 70px;\r\n  background: linear-gradient(transparent, var(--cream));\r\n  z-index: 2;\r\n}\r\n\r\n.ls-hotspot-root .panel__img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n  transition: opacity 0.35s ease, transform 0.8s var(--ease-out);\r\n}\r\n\r\n.ls-hotspot-root .panel__img.out { opacity: 0; transform: scale(1.05); }\r\n\r\n.ls-hotspot-root .panel__body {\r\n  flex: 1;\r\n  padding: 24px 32px 28px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow-y: auto;\r\n  scrollbar-width: none;\r\n}\r\n\r\n.ls-hotspot-root .panel__body::-webkit-scrollbar { display: none; }\r\n\r\n.ls-hotspot-root .panel__meta {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.ls-hotspot-root .panel__index {\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 10px;\r\n  color: rgba(13,13,11,0.3);\r\n  letter-spacing: 0.14em;\r\n}\r\n\r\n.ls-hotspot-root .panel__sep { width: 20px; height: 1px; background: rgba(13,13,11,0.18); }\r\n\r\n.ls-hotspot-root .panel__category {\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 10px;\r\n  letter-spacing: 0.16em;\r\n  text-transform: uppercase;\r\n  color: rgba(13,13,11,0.42);\r\n}\r\n\r\n.ls-hotspot-root .panel__title {\r\n  font-family: 'Bebas Neue', sans-serif;\r\n  font-size: clamp(30px, 3.8vw, 50px);\r\n  line-height: 0.93;\r\n  letter-spacing: 0.015em;\r\n  color: var(--ink);\r\n  margin-bottom: 18px;\r\n  white-space: pre-line;\r\n}\r\n\r\n.ls-hotspot-root .panel__rule { width: 32px; height: 1px; background: rgba(13,13,11,0.22); margin-bottom: 16px; }\r\n\r\n.ls-hotspot-root .panel__text {\r\n  font-family: 'DM Sans', sans-serif;\r\n  font-size: 13.5px;\r\n  font-weight: 300;\r\n  line-height: 1.78;\r\n  color: rgba(13,13,11,0.68);\r\n  flex: 1;\r\n}\r\n\r\n.ls-hotspot-root .panel__nav { display: flex; gap: 8px; margin-top: 22px; }\r\n\r\n.ls-hotspot-root .panel__nav-btn {\r\n  flex: 1;\r\n  font-family: 'DM Mono', monospace;\r\n  font-size: 10px;\r\n  letter-spacing: 0.13em;\r\n  text-transform: uppercase;\r\n  background: none;\r\n  border: 1px solid rgba(13,13,11,0.18);\r\n  border-radius: 6px;\r\n  padding: 11px 14px;\r\n  cursor: pointer;\r\n  color: rgba(13,13,11,0.45);\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.ls-hotspot-root .panel__nav-btn:hover { background: var(--ink); border-color: var(--ink); color: var(--cream); }\r\n\r\n.ls-hotspot-root .dot-nav {\r\n  position: absolute;\r\n  right: 24px;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 9px;\r\n  z-index: 210;\r\n  transition: right 0.65s var(--ease-out), opacity 0.4s ease;\r\n  opacity: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n.ls-hotspot-root .widget.panel-open .dot-nav {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n.ls-hotspot-root .panel.visible ~ .dot-nav {\r\n  right: calc(var(--panel-w) + 18px);\r\n}\r\n\r\n.ls-hotspot-root .dot {\r\n  width: 5px; height: 5px;\r\n  border-radius: 50%;\r\n  background: rgba(240,235,226,0.28);\r\n  cursor: pointer;\r\n  border: none;\r\n  padding: 0;\r\n  transition: background 0.2s ease, transform 0.2s ease;\r\n}\r\n\r\n.ls-hotspot-root .dot:hover { background: rgba(240,235,226,0.7); transform: scale(1.5); }\r\n.ls-hotspot-root .dot.active { background: var(--cream); transform: scale(1.6); }\r\n\r\n@media (max-width: 860px) {\r\n  .ls-hotspot-root .panel {\r\n    position: fixed;\r\n    top: auto; bottom: 0; right: 0; left: 0;\r\n    width: 100%;\r\n    height: 68vh !important;\r\n    transform: translateY(110%);\r\n    border-radius: 18px 18px 0 0;\r\n  }\r\n  .ls-hotspot-root .panel.visible { transform: translateY(0); }\r\n  .ls-hotspot-root .panel__img-wrap { height: 34%; }\r\n  .ls-hotspot-root .dot-nav {\r\n    position: fixed;\r\n    right: 16px; top: auto; bottom: 24px;\r\n    transform: none;\r\n    flex-direction: row;\r\n    transition: bottom 0.65s var(--ease-out), opacity 0.4s ease;\r\n  }\r\n  .ls-hotspot-root .panel.visible ~ .dot-nav { right: 16px; bottom: calc(68vh + 14px); }\r\n  .ls-hotspot-root .panel__body { padding: 18px 22px 22px; }\r\n  .ls-hotspot-root .panel__title { font-size: 28px; }\r\n  .ls-hotspot-root .pin-dot { width: 16px; height: 16px; }\r\n  .ls-hotspot-root .hud--tl { top: 18px; left: 18px; }\r\n  .ls-hotspot-root .hud--bc { bottom: 18px; }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .ls-hotspot-root .panel { height: 70vh !important; }\r\n  .ls-hotspot-root .panel__img-wrap { height: 28%; }\r\n  .ls-hotspot-root .panel__title { font-size: 24px; }\r\n  .ls-hotspot-root .panel.visible ~ .dot-nav { bottom: calc(70vh + 12px); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"ls-loader\" id=\"ls-loader\">\r\n  <div class=\"ls-loader__track\">\r\n    <div class=\"ls-loader__bar\" id=\"ls-loader-bar\"><\/div>\r\n  <\/div>\r\n  <div class=\"ls-loader__hint\">Studio Tour wird geladen<\/div>\r\n<\/div>\r\n\r\n<div class=\"ls-hotspot-root\">\r\n  <div class=\"widget\" id=\"ls-widget\">\r\n\r\n    <div class=\"stage-frame\" id=\"ls-stageFrame\">\r\n      <div class=\"stage\" id=\"ls-stage\">\r\n        <div class=\"stage__bg-wrap\">\r\n          <img decoding=\"async\" class=\"stage__bg\" id=\"ls-stageBg\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Isometric_Studio.png\" alt=\"Lippert Studios\">\r\n        <\/div>\r\n        <div class=\"stage__dim\" id=\"ls-dim\"><\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-web\" data-key=\"web\" style=\"top:69.4%;left:37.7%;width:11.9%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Web_Design.png\" alt=\"Web Design\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Web_Design.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-3d\" data-key=\"3d\" style=\"top:63%;left:48.9%;width:10.2%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_3D_Rendering.png\" alt=\"3D Rendering\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_3D_Rendering.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-kitchen\" data-key=\"kitchen\" style=\"top:69.8%;left:12.4%;width:8.5%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Kitchen.png\" alt=\"K&uuml;che\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Kitchen.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-monstera\" data-key=\"monstera\" style=\"top:20.1%;left:41.8%;width:16.8%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Monstera.png\" alt=\"Monstera\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Monstera.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-camera\" data-key=\"camera\" style=\"top:54.5%;left:36.75%;width:7.2%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Camera.png\" alt=\"Fotografie\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Camera.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-workshop\" data-key=\"workshop\" style=\"top:31.3%;left:67.8%;width:24.4%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Workshop.png\" alt=\"Workshop\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Workshop.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hs\" id=\"ls-hs-product\" data-key=\"product\" style=\"top:60.12%;left:58.9%;width:10%\">\r\n          <div class=\"hs__img-wrap\">\r\n            <img decoding=\"async\" class=\"hs__img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Product_Design.png\" alt=\"Produktdesign\">\r\n            <img decoding=\"async\" class=\"hs__shine-img\" src=\"https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Iso_Studio_Product_Design.png\" aria-hidden=\"true\" alt=\"\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"pin-layer\" id=\"ls-pinLayer\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"panel\" id=\"ls-panel\">\r\n      <button class=\"panel__close\" id=\"ls-closeBtn\" aria-label=\"Schlie&szlig;en\">\r\n        <svg viewbox=\"0 0 12 12\" fill=\"none\"><path d=\"M1 1L11 11M11 1L1 11\" stroke-linecap=\"round\"><\/path><\/svg>\r\n      <\/button>\r\n      <div class=\"panel__img-wrap\">\r\n        <img decoding=\"async\" src=\"\" alt=\"\" class=\"panel__img\" id=\"ls-panelImg\">\r\n      <\/div>\r\n      <div class=\"panel__body\">\r\n        <div class=\"panel__meta\">\r\n          <span class=\"panel__index\" id=\"ls-panelIndex\">01 \/ 07<\/span>\r\n          <div class=\"panel__sep\"><\/div>\r\n          <span class=\"panel__category\" id=\"ls-panelCategory\">Kompetenz<\/span>\r\n        <\/div>\r\n        <div class=\"panel__title\" id=\"ls-panelTitle\"><\/div>\r\n        <div class=\"panel__rule\"><\/div>\r\n        <div class=\"panel__text\" id=\"ls-panelText\"><\/div>\r\n        <div class=\"panel__nav\">\r\n          <button class=\"panel__nav-btn\" id=\"ls-btnPrev\">&larr; Zur&uuml;ck<\/button>\r\n          <button class=\"panel__nav-btn\" id=\"ls-btnNext\">Weiter &rarr;<\/button>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"dot-nav\" id=\"ls-dotNav\"><\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n\/* &#9472;&#9472; LOADER &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;\r\n   L&auml;uft komplett unabh&auml;ngig vom Rest des Scripts, damit ein Fehler\r\n   in der Hotspot-\/Panel-Logik den Loader niemals blockieren kann.\r\n   Zus&auml;tzlich ein Sicherheits-Timeout: der Loader verschwindet\r\n   sp&auml;testens nach 4 Sekunden, egal was mit dem Bild passiert. *\/\r\n(function () {\r\n  var loader = document.getElementById('ls-loader');\r\n  var bar = document.getElementById('ls-loader-bar');\r\n  var stageBg = document.getElementById('ls-stageBg');\r\n  if (!loader || !bar) return;\r\n\r\n  var progress = 0;\r\n  var target = 85;\r\n  var raf;\r\n  var done = false;\r\n\r\n  function tick() {\r\n    if (progress < target) {\r\n      progress += (target - progress) * 0.04;\r\n      bar.style.width = Math.min(progress, 100) + '%';\r\n      raf = requestAnimationFrame(tick);\r\n    }\r\n  }\r\n  raf = requestAnimationFrame(tick);\r\n\r\n  function finish() {\r\n    if (done) return;\r\n    done = true;\r\n    cancelAnimationFrame(raf);\r\n    bar.style.width = '100%';\r\n    setTimeout(function () { loader.classList.add('hidden'); }, 380);\r\n  }\r\n\r\n  if (stageBg) {\r\n    if (stageBg.complete && stageBg.naturalWidth > 0) {\r\n      target = 100;\r\n      setTimeout(finish, 400);\r\n    } else {\r\n      stageBg.addEventListener('load', finish);\r\n      stageBg.addEventListener('error', finish);\r\n    }\r\n  }\r\n\r\n  \/\/ Sicherheitsnetz: Loader sp&auml;testens nach 4s ausblenden,\r\n  \/\/ auch wenn Bild\/Rest-Script aus irgendeinem Grund h&auml;ngt.\r\n  setTimeout(finish, 4000);\r\n})();\r\n<\/script>\r\n\r\n<script>\r\n(function () {\r\ntry {\r\n\r\n  \/* &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;\r\n     EDITIERBARE INHALTE\r\n     Hier Kategorie \/ Titel \/ Text pro Hotspot anpassen.\r\n     \"img\" ist optional &mdash; wenn leer, wird automatisch das Hotspot-Bild\r\n     als Panel-Bild verwendet. Reihenfolge = Reihenfolge im HTML.\r\n  &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; *\/\r\n  var CONTENT = {\r\n    web: {\r\n      category: 'Kompetenz',\r\n      title: 'Web- & Grafikdesign',\r\n      text: 'Web- und Grafikdesign stehen im Zentrum der Kommunikation von Ideen. Jedes Detail erf&uuml;llt eine Funktion &ndash; es geht um weit mehr als &Auml;sthetik. Wir schaffen kraftvolle visuelle Botschaften, die eine einheitliche Identit&auml;t formen und einen bleibenden Eindruck hinterlassen.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Organisation_1.webp'\r\n    },\r\n    '3d': {\r\n      category: 'Kompetenz',\r\n      title: '3D-Rendering & Animation',\r\n      text: 'In unserem Studio erm&ouml;glichen 3D-Rendering und Animation, Produkte in hyperrealistischen Details zu erkunden &ndash; lange bevor die Produktion beginnt. Im Marketing schaffen wir atemberaubende Bilder, die weit &uuml;ber herk&ouml;mmliche Produktfotografie hinausgehen.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/3D_Rendering.webp'\r\n    },\r\n    kitchen: {\r\n      category: 'Studiokultur',\r\n      title: 'Unsere K&uuml;che',\r\n      text: 'Wir wechseln uns jeden Tag beim Kochen ab &ndash; falls du zuf&auml;llig zur Mittagszeit vorbeischaust, reservieren wir dir nat&uuml;rlich einen Platz am Tisch.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Food.webp'\r\n    },\r\n    monstera: {\r\n      category: 'Atmosph&auml;re',\r\n      title: '29 Pflanzen & eine Legende',\r\n      text: 'Wir haben aktuell 29 Pflanzen im Studio &ndash; darunter eine beeindruckende 30 Jahre alte Monstera mit Bl&auml;ttern bis zu einem Meter Gr&ouml;&szlig;e. Unser Studio ist als Ort der Inspiration gestaltet. Du bist jederzeit herzlich eingeladen.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Plants.webp'\r\n    },\r\n    camera: {\r\n      category: 'Kompetenz',\r\n      title: 'Fotografie & Styling',\r\n      text: 'Gute Fotografie zeigt gro&szlig;artige Produkte. Mit professioneller Beleuchtung, ma&szlig;geschneiderten Hintergr&uuml;nden und sorgf&auml;ltigem Styling sind unsere finalen Ergebnisse perfekt f&uuml;r Marketing, E-Commerce und dar&uuml;ber hinaus optimiert.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Medieninhalte_2.webp'\r\n    },\r\n    workshop: {\r\n      category: 'Kompetenz',\r\n      title: 'Prototyping & Workshop',\r\n      text: 'Von 3D-Druck und Laserschneiden bis hin zu Spritzkabinen und Metallbearbeitung &ndash; wir haben die Ressourcen, um Ideen zum Leben zu erwecken. Jede Iteration stellt sicher, dass das Produkt funktional und marktreif ist.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Prototyping-1.webp'\r\n    },\r\n    product: {\r\n      category: 'Kernkompetenz',\r\n      title: 'Produkt- & Industriedesign',\r\n      text: 'Produktdesign steht im Mittelpunkt unseres Schaffens und bildet die Grundlage f&uuml;r alle anderen F&auml;higkeiten. Von der Idee bis zur Markteinf&uuml;hrung begleiten wir Ihr Produkt auf jedem Schritt &ndash; ob Prototyping, Branding oder Produktionsvorbereitung.',\r\n      img: 'https:\/\/lippert-studios.com\/wp-content\/uploads\/2025\/01\/Zeichnung.png'\r\n    }\r\n  };\r\n\r\n  var root = document.querySelector('.ls-hotspot-root');\r\n  if (!root) return;\r\n\r\n  var widget     = root.querySelector('#ls-widget');\r\n  var stageFrame = root.querySelector('#ls-stageFrame');\r\n  var stageBg    = root.querySelector('#ls-stageBg');\r\n  var pinLayer   = root.querySelector('#ls-pinLayer');\r\n  var dim        = root.querySelector('#ls-dim');\r\n  var panel      = root.querySelector('#ls-panel');\r\n  var panelImg   = root.querySelector('#ls-panelImg');\r\n  var panelIndex = root.querySelector('#ls-panelIndex');\r\n  var panelCat   = root.querySelector('#ls-panelCategory');\r\n  var panelTitle = root.querySelector('#ls-panelTitle');\r\n  var panelText  = root.querySelector('#ls-panelText');\r\n  var closeBtn   = root.querySelector('#ls-closeBtn');\r\n  var btnPrev    = root.querySelector('#ls-btnPrev');\r\n  var btnNext    = root.querySelector('#ls-btnNext');\r\n  var dotNav     = root.querySelector('#ls-dotNav');\r\n\r\n  var hotspots = Array.prototype.slice.call(root.querySelectorAll('.hs'));\r\n  var keys = hotspots.map(function (hs) { return hs.dataset.key; });\r\n  var activeIndex = -1;\r\n\r\n  \/* &#9472;&#9472; 1. STAGE-LAYOUT: h&auml;lt das Seitenverh&auml;ltnis des Bildes exakt ein.\r\n     Das ist der Fix f&uuml;r das kaputte Mobile-Layout: die Hotspots sind in %\r\n     relativ zum Bild positioniert, also muss der Frame IMMER exakt die\r\n     Bild-Proportionen haben, egal ob Hochformat-Handy oder breiter Desktop.\r\n\r\n     Zusatz: Wenn auf Mobile das Panel offen ist (Bottom-Sheet), wird nicht\r\n     mehr gegen die volle Bildschirmh&ouml;he zentriert, sondern gegen die\r\n     tats&auml;chlich freie Fl&auml;che OBERHALB des Panels &mdash; sonst bleibt das Bild\r\n     mittig und es entsteht oben ein Leerraum. *\/\r\n  var mobileQuery = window.matchMedia('(max-width: 860px)');\r\n\r\n  function layoutStage() {\r\n    if (!stageBg.naturalWidth) return;\r\n    var ratio = stageBg.naturalWidth \/ stageBg.naturalHeight;\r\n    var containerW = widget.clientWidth;\r\n    var containerH = widget.clientHeight;\r\n    var centerOffset = 0; \/\/ px, Verschiebung des Mittelpunkts nach oben\r\n\r\n    var panelOpenOnMobile = mobileQuery.matches && widget.classList.contains('panel-open');\r\n    if (panelOpenOnMobile) {\r\n      var panelH = panel.getBoundingClientRect().height || (containerH * 0.68);\r\n      var availableH = containerH - panelH;\r\n      if (availableH > 60) {\r\n        containerH = availableH;\r\n        centerOffset = panelH \/ 2;\r\n      }\r\n    }\r\n\r\n    var containerRatio = containerW \/ containerH;\r\n    var w, h;\r\n    if (containerRatio > ratio) {\r\n      h = containerH;\r\n      w = h * ratio;\r\n    } else {\r\n      w = containerW;\r\n      h = w \/ ratio;\r\n    }\r\n    stageFrame.style.width = w + 'px';\r\n    stageFrame.style.height = h + 'px';\r\n    stageFrame.style.top = 'calc(50% - ' + centerOffset + 'px)';\r\n    stageFrame.classList.add('ready');\r\n  }\r\n\r\n  var resizeTimer;\r\n  window.addEventListener('resize', function () {\r\n    clearTimeout(resizeTimer);\r\n    resizeTimer = setTimeout(layoutStage, 100);\r\n  });\r\n  window.addEventListener('orientationchange', function () {\r\n    setTimeout(layoutStage, 150);\r\n  });\r\n\r\n  \/* &#9472;&#9472; 2. PINS aus den bestehenden Hotspot-Positionen generieren\r\n     (top\/left\/width kommen direkt aus dem inline style jedes .hs,\r\n     so bleibt die Positionierung einzige Quelle der Wahrheit). *\/\r\n  function buildPins() {\r\n    hotspots.forEach(function (hs, i) {\r\n      var key = hs.dataset.key;\r\n      var top = parseFloat(hs.style.top);\r\n      var left = parseFloat(hs.style.left);\r\n      var width = parseFloat(hs.style.width);\r\n\r\n      var pin = document.createElement('div');\r\n      pin.className = 'pin';\r\n      pin.dataset.key = key;\r\n      pin.style.left = (left + width \/ 2) + '%';\r\n      pin.style.top = top + '%';\r\n      pin.style.setProperty('--delay', (i * 0.35) + 's');\r\n\r\n      var dot = document.createElement('div');\r\n      dot.className = 'pin-dot';\r\n      var num = document.createElement('span');\r\n      num.textContent = String(i + 1);\r\n      dot.appendChild(num);\r\n\r\n      var line = document.createElement('div');\r\n      line.className = 'pin-line';\r\n\r\n      pin.appendChild(dot);\r\n      pin.appendChild(line);\r\n      pinLayer.appendChild(pin);\r\n    });\r\n  }\r\n\r\n  function getPin(key) {\r\n    return pinLayer.querySelector('.pin[data-key=\"' + key + '\"]');\r\n  }\r\n\r\n  \/* &#9472;&#9472; 3. HOVER \/ SHINE-EFFEKT &#9472;&#9472; *\/\r\n  function attachHover(hs) {\r\n    var pin = getPin(hs.dataset.key);\r\n    var shineTimeout;\r\n\r\n    function showShine() {\r\n      hs.classList.remove('shining');\r\n      if (pin) pin.classList.remove('shining');\r\n      void hs.offsetWidth; \/\/ Reflow erzwingen, Animation neu starten\r\n      hs.classList.add('shining');\r\n      if (pin) pin.classList.add('shining');\r\n\r\n      clearTimeout(shineTimeout);\r\n      shineTimeout = setTimeout(function () {\r\n        hs.classList.remove('shining');\r\n        if (pin) pin.classList.remove('shining');\r\n      }, 2200);\r\n    }\r\n\r\n    hs.addEventListener('mouseenter', showShine);\r\n\r\n    \/\/ Touch: erster Tap zeigt den Hover-Effekt, ohne sofort zu blockieren\r\n    hs.addEventListener('touchstart', function () {\r\n      hs.classList.add('touch-hover');\r\n      showShine();\r\n    }, { passive: true });\r\n\r\n    hs.addEventListener('touchend', function () {\r\n      setTimeout(function () { hs.classList.remove('touch-hover'); }, 250);\r\n    }, { passive: true });\r\n  }\r\n\r\n  \/* &#9472;&#9472; 4. PANEL \/ KLICK-LOGIK &#9472;&#9472; *\/\r\n\r\n  \/\/ Manche CMS\/Editoren wandeln Sonderzeichen (&uuml;, &ouml;, &auml; ...) beim Speichern\r\n  \/\/ in HTML-Entities um (z.B. \"&uuml;\"). Da <script>-Inhalte vom Browser\r\n  \/\/ NICHT entity-dekodiert werden, w&uuml;rde das sonst w&ouml;rtlich als \"&uuml;\"\r\n  \/\/ angezeigt. decodeEntities() wandelt das zuverl&auml;ssig zur&uuml;ck in \"&uuml;\".\r\n  function decodeEntities(str) {\r\n    if (!str) return str;\r\n    var el = document.createElement('textarea');\r\n    el.innerHTML = str;\r\n    return el.value;\r\n  }\r\n\r\n  function renderPanel(index, isNav) {\r\n    var key = keys[index];\r\n    var data = CONTENT[key] || {};\r\n    var hs = hotspots[index];\r\n    var img = data.img || hs.querySelector('.hs__img').getAttribute('src');\r\n    var title = decodeEntities(data.title) || hs.querySelector('.hs__img').alt;\r\n\r\n    if (isNav) {\r\n      panelImg.classList.add('out');\r\n      setTimeout(function () {\r\n        panelImg.src = img;\r\n        panelImg.alt = title;\r\n        panelImg.classList.remove('out');\r\n      }, 200);\r\n    } else {\r\n      panelImg.src = img;\r\n      panelImg.alt = title;\r\n    }\r\n\r\n    panelIndex.textContent = String(index + 1).padStart(2, '0') + ' \/ ' + String(keys.length).padStart(2, '0');\r\n    panelCat.textContent = decodeEntities(data.category) || 'Kompetenz';\r\n    panelTitle.textContent = title;\r\n    panelText.textContent = decodeEntities(data.text) || '';\r\n  }\r\n\r\n  function setActive(index) {\r\n    hotspots.forEach(function (hs, i) {\r\n      hs.classList.toggle('active', i === index);\r\n    });\r\n    Array.prototype.forEach.call(pinLayer.querySelectorAll('.pin'), function (pin, i) {\r\n      pin.classList.toggle('active', i === index);\r\n    });\r\n    Array.prototype.forEach.call(dotNav.querySelectorAll('.dot'), function (dot, i) {\r\n      dot.classList.toggle('active', i === index);\r\n    });\r\n  }\r\n\r\n  function openPanel(index) {\r\n    var isNav = widget.classList.contains('panel-open');\r\n    activeIndex = index;\r\n    setActive(index);\r\n    renderPanel(index, isNav);\r\n    widget.classList.add('panel-open');\r\n    panel.classList.add('visible');\r\n    layoutStage();\r\n  }\r\n\r\n  function closePanel() {\r\n    widget.classList.remove('panel-open');\r\n    panel.classList.remove('visible');\r\n    activeIndex = -1;\r\n    setActive(-1);\r\n    layoutStage();\r\n  }\r\n\r\n  function goTo(delta) {\r\n    if (activeIndex === -1) return;\r\n    var next = (activeIndex + delta + keys.length) % keys.length;\r\n    openPanel(next);\r\n  }\r\n\r\n  hotspots.forEach(function (hs, i) {\r\n    attachHover(hs);\r\n    hs.addEventListener('click', function () { openPanel(i); });\r\n    hs.setAttribute('tabindex', '0');\r\n    hs.setAttribute('role', 'button');\r\n    hs.addEventListener('keydown', function (e) {\r\n      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openPanel(i); }\r\n    });\r\n  });\r\n\r\n  closeBtn.addEventListener('click', closePanel);\r\n  dim.addEventListener('click', closePanel);\r\n  btnPrev.addEventListener('click', function () { goTo(-1); });\r\n  btnNext.addEventListener('click', function () { goTo(1); });\r\n\r\n  document.addEventListener('keydown', function (e) {\r\n    if (!widget.classList.contains('panel-open')) return;\r\n    if (e.key === 'Escape') closePanel();\r\n    if (e.key === 'ArrowRight') goTo(1);\r\n    if (e.key === 'ArrowLeft') goTo(-1);\r\n  });\r\n\r\n  \/* &#9472;&#9472; 5. DOT-NAVIGATION &#9472;&#9472; *\/\r\n  function buildDots() {\r\n    keys.forEach(function (key, i) {\r\n      var dot = document.createElement('button');\r\n      dot.className = 'dot';\r\n      dot.setAttribute('aria-label', decodeEntities(CONTENT[key] && CONTENT[key].title) || key);\r\n      dot.addEventListener('click', function () { openPanel(i); });\r\n      dotNav.appendChild(dot);\r\n    });\r\n  }\r\n\r\n  \/* &#9472;&#9472; 6. INIT &#9472;&#9472; *\/\r\n  buildPins();\r\n  buildDots();\r\n\r\n  if (stageBg.complete && stageBg.naturalWidth > 0) {\r\n    layoutStage();\r\n  } else {\r\n    stageBg.addEventListener('load', layoutStage);\r\n  }\r\n\r\n} catch (err) {\r\n  console.error('Studio Tour Widget Fehler:', err);\r\n}\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-d1bf39f e-con e-atomic-element e-div-block-base e-d1bf39f-0b40405 \" data-id=\"d1bf39f\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"d1bf39f\">\n    \n<\/div>\n<div class=\"elementor-element elementor-element-4120131 e-con e-atomic-element e-flexbox-base e-4120131-b091ad4 \" data-id=\"4120131\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"4120131\">\n    \t\t<div class=\"elementor-element elementor-element-3fa89eb elementor-view-default elementor-widget elementor-widget-icon\" data-id=\"3fa89eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<div class=\"elementor-icon\">\n\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-arrow-left\" viewbox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e4f610f elementor-widget elementor-widget-text-editor\" data-id=\"e4f610f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p><a href=\"https:\/\/lippert-studios.com\/studio\/\">Zur&uuml;ck zur Studio Seite<\/a><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":85,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"tags":[],"class_list":["post-14554","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/pages\/14554","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/comments?post=14554"}],"version-history":[{"count":164,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/pages\/14554\/revisions"}],"predecessor-version":[{"id":15421,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/pages\/14554\/revisions\/15421"}],"up":[{"embeddable":true,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/pages\/85"}],"wp:attachment":[{"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/media?parent=14554"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lippert-studios.com\/en\/wp-json\/wp\/v2\/tags?post=14554"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}