{"id":6,"date":"2026-09-06T11:22:56","date_gmt":"2026-09-06T11:22:56","guid":{"rendered":"https:\/\/project-clayo.at\/?page_id=6"},"modified":"2026-09-29T22:31:54","modified_gmt":"2026-09-29T20:31:54","slug":"home","status":"publish","type":"page","link":"https:\/\/project-clayo.at\/en\/","title":{"rendered":"Home"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"6\" class=\"elementor elementor-6\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2eb95d2 e-flex e-con-boxed e-con e-parent\" data-id=\"2eb95d2\" 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-1587829 elementor-widget elementor-widget-heading\" data-id=\"1587829\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Gib hier deine \u00dcberschrift ein<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4139e6f elementor-widget elementor-widget-html\" data-id=\"4139e6f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"de\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Clayo - Unsere L\u00f6sung<\/title>\r\n    <style>\r\n        :root {\r\n            --primary-color: #ff7800;\r\n            --text-color: #111;\r\n            --text-muted: #666;\r\n            --bg-color: #ffffff;\r\n            --card-bg: #f8f9fa;\r\n            --font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        * {\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        \/* Container f\u00fcr das Custom HTML Widget in Elementor *\/\r\n        .clayo-timeline-section {\r\n            padding: 5vh 2%;\r\n            font-family: var(--font-family);\r\n            background-color: transparent;\r\n            color: var(--text-color);\r\n            overflow-x: hidden;\r\n        }\r\n\r\n        .timeline-title {\r\n            text-align: center;\r\n            font-size: 3.8rem;\r\n            font-weight: 900;\r\n            margin-bottom: 8vh;\r\n            letter-spacing: -0.02em;\r\n        }\r\n\r\n        .timeline-wrapper {\r\n            max-width: 1100px; \/* Etwas breiter gemacht, damit Text & Bild Platz haben *\/\r\n            margin: 0 auto;\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 5vh;\r\n            padding-bottom: 10vh;\r\n        }\r\n\r\n        \/* Animation: Ausgangszustand *\/\r\n        .timeline-item-container {\r\n            width: 100%;\r\n            opacity: 0;\r\n            transform: translateX(-10vw); \r\n            transition: all 0.9s cubic-bezier(0.25, 1, 0.3, 1);\r\n        }\r\n\r\n        \/* Animation: Endzustand *\/\r\n        .timeline-item-container.in-view {\r\n            opacity: 1;\r\n            transform: translateX(0);\r\n        }\r\n\r\n        \/* Flex-Layout f\u00fcr die Karte (Text links, Bild rechts) *\/\r\n        .timeline-card {\r\n            background: var(--card-bg);\r\n            border-radius: 2.5rem;\r\n            padding: 4%;\r\n            border: 3px solid transparent;\r\n            transition: all 0.4s ease;\r\n            box-shadow: 0 10px 30px rgba(0,0,0,0.05);\r\n            \r\n            display: flex;\r\n            align-items: stretch; \/* Zieht Bild und Text auf gleiche H\u00f6he *\/\r\n            gap: 4%; \/* Abstand zwischen Text und Bild *\/\r\n        }\r\n\r\n        .timeline-item-container.in-view .timeline-card:hover {\r\n            border-color: rgba(255, 120, 0, 0.2);\r\n            background: #fff;\r\n            box-shadow: 0 30px 60px rgba(0,0,0,0.12);\r\n            transform: scale(1.02) translateX(15px);\r\n        }\r\n\r\n        \/* Text-Bereich *\/\r\n        .timeline-content {\r\n            flex: 1; \/* Nimmt den restlichen Platz ein *\/\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: center; \/* Zentriert den Text vertikal *\/\r\n        }\r\n\r\n        \/* Bild-Bereich *\/\r\n        .timeline-img-wrap {\r\n            flex: 0 0 35%; \/* Bild nimmt 35% der Kartenbreite ein *\/\r\n            border-radius: 1.5rem;\r\n            overflow: hidden;\r\n            min-height: 250px;\r\n        }\r\n\r\n        .timeline-img-wrap img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover; \/* Schneidet das Bild perfekt ins Rechteck zu *\/\r\n            display: block;\r\n        }\r\n\r\n        \/* Typografie *\/\r\n        .timeline-tag {\r\n            color: var(--primary-color);\r\n            font-size: 1.2rem;\r\n            font-weight: 800;\r\n            text-transform: uppercase;\r\n            margin-bottom: 1rem;\r\n            letter-spacing: 0.1rem;\r\n        }\r\n\r\n        .timeline-item-title {\r\n            font-size: 2.2rem;\r\n            font-weight: 900;\r\n            margin: 0 0 1.2rem 0;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        .timeline-description {\r\n            font-size: 1.4rem;\r\n            line-height: 1.6;\r\n            color: #444;\r\n            margin: 0;\r\n        }\r\n\r\n        \/* Mobile Anpassungen *\/\r\n        @media (max-width: 900px) {\r\n            .timeline-card {\r\n                flex-direction: column-reverse; \/* Auf dem Handy: Bild oben, Text unten *\/\r\n                gap: 20px;\r\n                padding: 6%;\r\n            }\r\n            .timeline-img-wrap {\r\n                width: 100%;\r\n                height: 220px; \/* Feste H\u00f6he f\u00fcr Bilder auf dem Handy *\/\r\n                flex: none;\r\n            }\r\n            .timeline-item-title {\r\n                font-size: 1.8rem;\r\n            }\r\n            .timeline-description {\r\n                font-size: 1.2rem;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n        <div class=\"timeline-wrapper\" id=\"timeline\">\r\n            \r\n            <!-- Item 1: Erfassung -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">SCHRITT 1<\/div>\r\n                        <h2 class=\"timeline-item-title\">Erfassung durch 3D-Scanner<\/h2>\r\n                        <p class=\"timeline-description\">Der Prozess beginnt mit unserem kosteng\u00fcnstigen 3D-Scanner, der auf dem OpenScan-Konzept basiert. Er erfasst die gefundenen Scherben mit einer Geschwindigkeit von 30 Bildern pro Minute durch pr\u00e4zise Photogrammetrie, um das endg\u00fcltige 3D-Modell als Punktewolke vorzubereiten.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <!-- TAUSCHE HIER DEN SRC LINK MIT DEINEM WORDPRESS BILD-LINK AUS -->\r\n                        <img decoding=\"async\" src=\"https:\/\/project-clayo.at\/wp-content\/uploads\/2026\/09\/PXL_20260112_165639605-1.jpg\" alt=\"3D Scanner\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Item 3: Zusammensetzung -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">SCHRITT 2<\/div>\r\n                        <h2 class=\"timeline-item-title\">Virtuelle Zusammensetzung<\/h2>\r\n                        <p class=\"timeline-description\">Statt stundenlang per Hand zu puzzeln, berechnet die KI die optimalen Rotationen und Verschiebungen. Die Teile werden virtuell am Bildschirm zusammengesetzt, und als Endergebnis erhalten die Forschenden eine fertige obj-Datei als Bauanleitung f\u00fcr den physischen Wiederaufbau.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <img decoding=\"async\" src=\"https:\/\/project-clayo.at\/wp-content\/uploads\/2026\/09\/garf_plate-3.gif\" alt=\"Virtuelle Zusammensetzung\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Item 4: Datensicherheit -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">VORTEIL<\/div>\r\n                        <h2 class=\"timeline-item-title\">Maximale Datensicherheit<\/h2>\r\n                        <p class=\"timeline-description\">Ein entscheidender Faktor unserer L\u00f6sung ist die Datensouver\u00e4nit\u00e4t: Die gesamte Software wird rein lokal betrieben und sendet keine Daten in die Cloud. Dies bietet bei sensiblen oder geheimen Ausgrabungen eine absolute Sicherheit f\u00fcr gesch\u00fctzte Funde.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1563206767-5b18f218e8de?q=80&w=600&auto=format&fit=crop\" alt=\"Datensicherheit\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Item 5: Wirtschaftlichkeit -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">VORTEIL<\/div>\r\n                        <h2 class=\"timeline-item-title\">Kosteneffizienz & Open-Source<\/h2>\r\n                        <p class=\"timeline-description\">Unsere Entwicklung schont durch den Open-Source-Ansatz den Geldbeutel der Institute. Es entstehen keine hohen Software- oder Lizenzkosten, was die finanzielle H\u00fcrde senkt und auch kleineren Museen die M\u00f6glichkeit bietet, diese Innovation direkt in ihre Arbeitsabl\u00e4ufe zu integrieren.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1554224155-6726b3ff858f?q=80&w=600&auto=format&fit=crop\" alt=\"Kosteneffizienz\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Item 6: Inklusion -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">ZUKUNFTSVISION<\/div>\r\n                        <h2 class=\"timeline-item-title\">Inklusion & 3D-Druck<\/h2>\r\n                        <p class=\"timeline-description\">Die gesammelten digitalen Modelle \u00f6ffnen die Geschichte f\u00fcr alle. Wir planen, aus den Datens\u00e4tzen haptische Tastmodelle in 3D zu drucken, wodurch jahrtausendealte Artefakte in Zukunft auch f\u00fcr Menschen mit Sehbehinderung buchst\u00e4blich greifbar und erlebbar werden.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1614983646336-077f5f9038a8?q=80&w=600&auto=format&fit=crop\" alt=\"3D Druck\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            const items = document.querySelectorAll('.timeline-item-container');\r\n\r\n            const observerOptions = {\r\n                root: null,\r\n                rootMargin: '0px 0px -15% 0px', \r\n                threshold: 0.1\r\n            };\r\n\r\n            const observer = new IntersectionObserver((entries) => {\r\n                entries.forEach(entry => {\r\n                    if (entry.isIntersecting) {\r\n                        entry.target.classList.add('in-view');\r\n                    } else {\r\n                        \/\/ Versteckt die Karte wieder, wenn man hochscrollt\r\n                        entry.target.classList.remove('in-view');\r\n                    }\r\n                });\r\n            }, observerOptions);\r\n\r\n            items.forEach(item => {\r\n                observer.observe(item);\r\n            });\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-65ae733 elementor-widget elementor-widget-heading\" data-id=\"65ae733\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Gib hier deine \u00dcberschrift ein<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-737ab87 elementor-widget elementor-widget-html\" data-id=\"737ab87\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"de\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Clayo - Was ist Clayo?<\/title>\r\n    <style>\r\n        :root {\r\n            --primary-color: #ff7800;\r\n            --text-color: #111;\r\n            --text-muted: #666;\r\n            --bg-color: #ffffff;\r\n            --card-bg: #f8f9fa;\r\n            --font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        * {\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        \/* Container f\u00fcr das Custom HTML Widget in Elementor *\/\r\n        .clayo-timeline-section {\r\n            padding: 5vh 2%;\r\n            font-family: var(--font-family);\r\n            background-color: transparent;\r\n            color: var(--text-color);\r\n            overflow-x: hidden;\r\n        }\r\n\r\n        .timeline-wrapper {\r\n            max-width: 1100px;\r\n            margin: 0 auto;\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 5vh;\r\n            padding-bottom: 10vh;\r\n        }\r\n\r\n        \/* Animation: Ausgangszustand *\/\r\n        .timeline-item-container {\r\n            width: 100%;\r\n            opacity: 0;\r\n            transform: translateX(-10vw); \r\n            transition: all 0.9s cubic-bezier(0.25, 1, 0.3, 1);\r\n        }\r\n\r\n        \/* Animation: Endzustand *\/\r\n        .timeline-item-container.in-view {\r\n            opacity: 1;\r\n            transform: translateX(0);\r\n        }\r\n\r\n        \/* Flex-Layout f\u00fcr die Karte *\/\r\n        .timeline-card {\r\n            background: var(--card-bg);\r\n            border-radius: 2.5rem;\r\n            padding: 4%;\r\n            border: 3px solid transparent;\r\n            transition: all 0.4s ease;\r\n            box-shadow: 0 10px 30px rgba(0,0,0,0.05);\r\n            \r\n            display: flex;\r\n            align-items: stretch;\r\n            gap: 4%;\r\n        }\r\n\r\n        .timeline-item-container.in-view .timeline-card:hover {\r\n            border-color: rgba(255, 120, 0, 0.2);\r\n            background: #fff;\r\n            box-shadow: 0 30px 60px rgba(0,0,0,0.12);\r\n            transform: scale(1.02) translateX(15px);\r\n        }\r\n\r\n        \/* Text-Bereich *\/\r\n        .timeline-content {\r\n            flex: 1;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: center;\r\n        }\r\n\r\n        \/* Bild-Bereich *\/\r\n        .timeline-img-wrap {\r\n            flex: 0 0 35%;\r\n            border-radius: 1.5rem;\r\n            overflow: hidden;\r\n            min-height: 250px;\r\n        }\r\n\r\n        .timeline-img-wrap img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            display: block;\r\n        }\r\n\r\n        \/* Typografie *\/\r\n        .timeline-tag {\r\n            color: var(--primary-color);\r\n            font-size: 1.2rem;\r\n            font-weight: 800;\r\n            text-transform: uppercase;\r\n            margin-bottom: 1rem;\r\n            letter-spacing: 0.1rem;\r\n        }\r\n\r\n        .timeline-item-title {\r\n            font-size: 2.2rem;\r\n            font-weight: 900;\r\n            margin: 0 0 1.2rem 0;\r\n            line-height: 1.2;\r\n            color: #5dbce3; \/* Angepasst an das Hellblau aus deinem Screenshot, optional *\/\r\n        }\r\n\r\n        .timeline-description {\r\n            font-size: 1.4rem;\r\n            line-height: 1.6;\r\n            color: #444;\r\n            margin: 0;\r\n        }\r\n\r\n        \/* Mobile Anpassungen *\/\r\n        @media (max-width: 900px) {\r\n            .timeline-card {\r\n                flex-direction: column-reverse;\r\n                gap: 20px;\r\n                padding: 6%;\r\n            }\r\n            .timeline-img-wrap {\r\n                width: 100%;\r\n                height: 220px;\r\n                flex: none;\r\n            }\r\n            .timeline-item-title {\r\n                font-size: 1.8rem;\r\n            }\r\n            .timeline-description {\r\n                font-size: 1.2rem;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"clayo-timeline-section\">\r\n        <div class=\"timeline-wrapper\" id=\"timeline\">\r\n            \r\n            <!-- Neuer Abschnitt: Was ist Clayo? -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">\u00dcBER DAS PROJEKT<\/div>\r\n                        <h2 class=\"timeline-item-title\">What is Clayo?<\/h2>\r\n                        <p class=\"timeline-description\">Clayo ist ein innovatives Projekt, das den arch\u00e4ologischen Arbeitsprozess durch technische Hilfsmittel optimiert. Es ersetzt zeitintensive Handarbeit durch eine Kombination aus einem kosteng\u00fcnstigen 3D-Scanner und lokaler K\u00fcnstlicher Intelligenz, um Fundst\u00fccke zu digitalisieren und den Rekonstruktionsprozess zu automatisieren.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <!-- TAUSCHE HIER DEN SRC LINK MIT DEINEM BILD-LINK AUS -->\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1532053272955-f1261d7dc7b4?q=80&w=600&auto=format&fit=crop\" alt=\"Arch\u00e4ologie und Technologie\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            const items = document.querySelectorAll('.timeline-item-container');\r\n\r\n            const observerOptions = {\r\n                root: null,\r\n                rootMargin: '0px 0px -15% 0px', \r\n                threshold: 0.1\r\n            };\r\n\r\n            const observer = new IntersectionObserver((entries) => {\r\n                entries.forEach(entry => {\r\n                    if (entry.isIntersecting) {\r\n                        entry.target.classList.add('in-view');\r\n                    } else {\r\n                        \/\/ Versteckt die Karte wieder, wenn man hochscrollt\r\n                        entry.target.classList.remove('in-view');\r\n                    }\r\n                });\r\n            }, observerOptions);\r\n\r\n            items.forEach(item => {\r\n                observer.observe(item);\r\n            });\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-593635b elementor-widget elementor-widget-heading\" data-id=\"593635b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Gib hier deine \u00dcberschrift ein<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1e113a3 elementor-widget elementor-widget-html\" data-id=\"1e113a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"de\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Clayo - Was probieren wir zum l\u00f6sen?<\/title>\r\n    <style>\r\n        :root {\r\n            --primary-color: #ff7800;\r\n            --text-color: #111;\r\n            --text-muted: #666;\r\n            --bg-color: #ffffff;\r\n            --card-bg: #f8f9fa;\r\n            --font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        * {\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        \/* Container f\u00fcr das Custom HTML Widget in Elementor *\/\r\n        .clayo-timeline-section {\r\n            padding: 5vh 2%;\r\n            font-family: var(--font-family);\r\n            background-color: transparent;\r\n            color: var(--text-color);\r\n            overflow-x: hidden;\r\n        }\r\n\r\n        .timeline-wrapper {\r\n            max-width: 1100px;\r\n            margin: 0 auto;\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 5vh;\r\n            padding-bottom: 10vh;\r\n        }\r\n\r\n        \/* Animation: Ausgangszustand *\/\r\n        .timeline-item-container {\r\n            width: 100%;\r\n            opacity: 0;\r\n            transform: translateX(-10vw); \r\n            transition: all 0.9s cubic-bezier(0.25, 1, 0.3, 1);\r\n        }\r\n\r\n        \/* Animation: Endzustand *\/\r\n        .timeline-item-container.in-view {\r\n            opacity: 1;\r\n            transform: translateX(0);\r\n        }\r\n\r\n        \/* Flex-Layout f\u00fcr die Karte *\/\r\n        .timeline-card {\r\n            background: var(--card-bg);\r\n            border-radius: 2.5rem;\r\n            padding: 4%;\r\n            border: 3px solid transparent;\r\n            transition: all 0.4s ease;\r\n            box-shadow: 0 10px 30px rgba(0,0,0,0.05);\r\n            \r\n            display: flex;\r\n            align-items: stretch;\r\n            gap: 4%;\r\n        }\r\n\r\n        .timeline-item-container.in-view .timeline-card:hover {\r\n            border-color: rgba(255, 120, 0, 0.2);\r\n            background: #fff;\r\n            box-shadow: 0 30px 60px rgba(0,0,0,0.12);\r\n            transform: scale(1.02) translateX(15px);\r\n        }\r\n\r\n        \/* Text-Bereich *\/\r\n        .timeline-content {\r\n            flex: 1;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: center;\r\n        }\r\n\r\n        \/* Bild-Bereich *\/\r\n        .timeline-img-wrap {\r\n            flex: 0 0 35%;\r\n            border-radius: 1.5rem;\r\n            overflow: hidden;\r\n            min-height: 250px;\r\n        }\r\n\r\n        .timeline-img-wrap img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            display: block;\r\n        }\r\n\r\n        \/* Typografie *\/\r\n        .timeline-tag {\r\n            color: var(--primary-color);\r\n            font-size: 1.2rem;\r\n            font-weight: 800;\r\n            text-transform: uppercase;\r\n            margin-bottom: 1rem;\r\n            letter-spacing: 0.1rem;\r\n        }\r\n\r\n        .timeline-item-title {\r\n            font-size: 2.2rem;\r\n            font-weight: 900;\r\n            margin: 0 0 1.2rem 0;\r\n            line-height: 1.2;\r\n            color: #5dbce3; \/* Hellblau aus deinem Screenshot *\/\r\n        }\r\n\r\n        .timeline-description {\r\n            font-size: 1.4rem;\r\n            line-height: 1.6;\r\n            color: #444;\r\n            margin: 0;\r\n        }\r\n\r\n        \/* Mobile Anpassungen *\/\r\n        @media (max-width: 900px) {\r\n            .timeline-card {\r\n                flex-direction: column-reverse;\r\n                gap: 20px;\r\n                padding: 6%;\r\n            }\r\n            .timeline-img-wrap {\r\n                width: 100%;\r\n                height: 220px;\r\n                flex: none;\r\n            }\r\n            .timeline-item-title {\r\n                font-size: 1.8rem;\r\n            }\r\n            .timeline-description {\r\n                font-size: 1.2rem;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"clayo-timeline-section\">\r\n        <div class=\"timeline-wrapper\" id=\"timeline\">\r\n            \r\n            <!-- Karten-Element: Was probieren wir zum l\u00f6sen? -->\r\n            <div class=\"timeline-item-container\">\r\n                <div class=\"timeline-card\">\r\n                    <div class=\"timeline-content\">\r\n                        <div class=\"timeline-tag\">PROBLEMSTELLUNG<\/div>\r\n                        <h2 class=\"timeline-item-title\">Was probieren wir zum l\u00f6sen?<\/h2>\r\n                        <p class=\"timeline-description\">Die manuelle Suche nach passenden Scherben und das anschlie\u00dfende Zusammensetzen kostet Arch\u00e4ologen enorm viel Zeit. Das Projekt zielt darauf ab, Forschende von diesem zeitintensiven Prozess zu entlasten, damit der Fokus wieder prim\u00e4r auf der Ausgrabung und der eigentlichen wissenschaftlichen Arbeit liegen kann.<\/p>\r\n                    <\/div>\r\n                    <div class=\"timeline-img-wrap\">\r\n                        <!-- ERSETZE DIESEN LINK DURCH DEIN DESIGNIERTES BILD\/GRAPHIK -->\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1584438784894-089d6a62b8fa?q=80&w=600&auto=format&fit=crop\" alt=\"Manuelle Arch\u00e4ologie Arbeit\">\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            const items = document.querySelectorAll('.timeline-item-container');\r\n\r\n            const observerOptions = {\r\n                root: null,\r\n                rootMargin: '0px 0px -15% 0px', \r\n                threshold: 0.1\r\n            };\r\n\r\n            const observer = new IntersectionObserver((entries) => {\r\n                entries.forEach(entry => {\r\n                    if (entry.isIntersecting) {\r\n                        entry.target.classList.add('in-view');\r\n                    } else {\r\n                        entry.target.classList.remove('in-view');\r\n                    }\r\n                });\r\n            }, observerOptions);\r\n\r\n            items.forEach(item => {\r\n                observer.observe(item);\r\n            });\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Gib hier deine \u00dcberschrift ein Clayo &#8211; Unsere L\u00f6sung SCHRITT 1 Erfassung durch 3D-Scanner Der Prozess beginnt mit unserem kosteng\u00fcnstigen 3D-Scanner, der auf dem OpenScan-Konzept basiert. Er erfasst die gefundenen Scherben mit einer Geschwindigkeit von 30 Bildern pro Minute durch pr\u00e4zise Photogrammetrie, um das endg\u00fcltige 3D-Modell als Punktewolke vorzubereiten. SCHRITT 2 Virtuelle Zusammensetzung Statt stundenlang [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ocean_front_end_style_editor":"no","ocean_post_layout":"full-screen","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"","ocean_second_sidebar":"","ocean_disable_margins":"enable","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"off","ocean_display_header":"default","ocean_header_style":"","ocean_center_header_left_menu":"","ocean_custom_header_template":"","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"","ocean_menu_typo_font_family":"","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"on","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"off","ocean_display_footer_bottom":"off","ocean_custom_footer_template":"","footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry","entry"],"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"admin","author_link":"https:\/\/project-clayo.at\/en\/author\/admin\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":"Gib hier deine \u00dcberschrift ein Clayo &#8211; Unsere L\u00f6sung SCHRITT 1 Erfassung durch 3D-Scanner Der Prozess beginnt mit unserem kosteng\u00fcnstigen 3D-Scanner, der auf dem OpenScan-Konzept basiert. Er erfasst die gefundenen Scherben mit einer Geschwindigkeit von 30 Bildern pro Minute durch pr\u00e4zise Photogrammetrie, um das endg\u00fcltige 3D-Modell als Punktewolke vorzubereiten. SCHRITT 2 Virtuelle Zusammensetzung Statt stundenlang&hellip;","_links":{"self":[{"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":158,"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":395,"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/pages\/6\/revisions\/395"}],"wp:attachment":[{"href":"https:\/\/project-clayo.at\/en\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}