{"product_id":"glow-eye-therapy","title":"Glow Eye Therapy","description":"\u003c!-- ============================================================\n     GLOW EYE THERAPY — 3D Video-Karussell (nur Videos)\n     Mode A: in die Produktbeschreibung einfügen (Ansicht \u003c\u003e HTML).\n     Reines CSS, kein JavaScript. Rotiert automatisch in 3D.\n     → 3 Videos unter Einstellungen → Dateien hochladen und die\n       PLATZHALTER-URLs unten ersetzen.\n     ============================================================ --\u003e\n\u003cdiv class=\"pixo-reel3d\"\u003e\n  \u003cstyle\u003e\n    .pixo-reel3d,.pixo-reel3d *{box-sizing:border-box;margin:0;padding:0}\n    .pixo-reel3d{\n      --card:clamp(150px,46vw,210px);   \/* Kartenbreite      *\/\n      --radius:clamp(190px,58vw,280px);  \/* Ring-Radius       *\/\n      --speed:22s;                       \/* Umdrehungsdauer   *\/\n      font-family:ui-sans-serif,system-ui,-apple-system,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif;\n      color:#ECECEC;text-align:center;\n      padding:clamp(26px,7vw,52px) 0;overflow:hidden;\n      background:#0A0A0C;\n      background-image:radial-gradient(70% 55% at 50% 42%,rgba(255,77,94,.20),transparent 70%);\n    }\n    .pixo-reel3d .cap{display:inline-block;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;\n      font-weight:700;color:#E8C9A0;margin-bottom:6px}\n    .pixo-reel3d h3{font-size:clamp(1.5rem,5.4vw,2.1rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;\n      color:#fff;margin-bottom:clamp(20px,6vw,34px)}\n    .pixo-reel3d h3 b{background:linear-gradient(90deg,#FF4D5E,#FF9A8B);-webkit-background-clip:text;background-clip:text;color:transparent}\n\n    \/* --- 3D scene --- *\/\n    .pixo-reel3d .scene{\n      position:relative;width:100%;\n      height:calc(var(--card) * 16 \/ 9 + 40px);\n      perspective:1100px;perspective-origin:50% 45%;\n    }\n    .pixo-reel3d .stage{\n      position:absolute;top:50%;left:50%;width:var(--card);height:calc(var(--card)*16\/9);\n      margin:calc(var(--card)*-8\/9) 0 0 calc(var(--card)\/-2);\n      transform-style:preserve-3d;\n      animation:pixoSpin var(--speed) linear infinite;\n    }\n    @keyframes pixoSpin{\n      from{transform:rotateY(0deg)}\n      to{transform:rotateY(360deg)}\n    }\n    .pixo-reel3d .face{\n      position:absolute;inset:0;border-radius:16px;overflow:hidden;background:#000;\n      border:1px solid rgba(255,255,255,.14);\n      box-shadow:0 18px 50px -18px rgba(255,77,94,.55);\n      backface-visibility:hidden;\n    }\n    .pixo-reel3d .face:nth-child(1){transform:rotateY(0deg)   translateZ(var(--radius))}\n    .pixo-reel3d .face:nth-child(2){transform:rotateY(120deg) translateZ(var(--radius))}\n    .pixo-reel3d .face:nth-child(3){transform:rotateY(240deg) translateZ(var(--radius))}\n    .pixo-reel3d video{display:block;width:100%;height:100%;object-fit:cover;background:#000}\n\n    \/* Desktop: bei Hover anhalten *\/\n    @media(hover:hover){.pixo-reel3d .scene:hover .stage{animation-play-state:paused}}\n\n    \/* Reduced motion \/ kein 3D: Videos einfach untereinander *\/\n    @media(prefers-reduced-motion:reduce){\n      .pixo-reel3d .scene{height:auto;perspective:none}\n      .pixo-reel3d .stage{position:static;width:min(320px,86%);height:auto;margin:0 auto;\n        transform:none;animation:none;display:grid;gap:14px}\n      .pixo-reel3d .face{position:static;inset:auto;aspect-ratio:9\/16;transform:none!important;backface-visibility:visible}\n    }\n  \u003c\/style\u003e\n\n  \u003cspan class=\"cap\"\u003eGlow Eye Therapy\u003c\/span\u003e\n  \u003ch3\u003eIn Aktion — \u003cb\u003eechte Momente.\u003c\/b\u003e\n\u003c\/h3\u003e\n\n  \u003cdiv class=\"scene\"\u003e\n    \u003cdiv class=\"stage\"\u003e\n      \u003cdiv class=\"face\"\u003e\u003cvideo src=\"PLATZHALTER_VIDEO_1.mp4\" autoplay muted loop playsinline preload=\"metadata\"\u003e\u003c\/video\u003e\u003c\/div\u003e\n      \u003cdiv class=\"face\"\u003e\u003cvideo src=\"PLATZHALTER_VIDEO_2.mp4\" autoplay muted loop playsinline preload=\"metadata\"\u003e\u003c\/video\u003e\u003c\/div\u003e\n      \u003cdiv class=\"face\"\u003e\u003cvideo src=\"PLATZHALTER_VIDEO_3.mp4\" autoplay muted loop playsinline preload=\"metadata\"\u003e\u003c\/video\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\u003c\/div\u003e\n\u003c!-- ============================================================\n     PLATZHALTER ersetzen (Einstellungen → Dateien):\n       PLATZHALTER_VIDEO_1.mp4  → oculis_video1_720p.mp4\n       PLATZHALTER_VIDEO_2.mp4  → oculis_video2_1080p.mp4\n       PLATZHALTER_VIDEO_3.mp4  → oculis_video3_720p.mp4\n     Tipps: --speed = Umdrehungsdauer, --radius = Ring-Größe,\n            --card = Videobreite (oben im CSS anpassbar).\n     ============================================================ --\u003e","brand":"DELVENCE","offers":[{"title":"Default Title","offer_id":62877463052618,"sku":null,"price":39.9,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1054\/4955\/4250\/files\/Modalita-Tedesco.png?v=1785843344","url":"https:\/\/delvence.com\/products\/glow-eye-therapy","provider":"DELVENCE","version":"1.0","type":"link"}