{"id":2,"date":"2025-10-15T06:03:05","date_gmt":"2025-10-15T06:03:05","guid":{"rendered":"https:\/\/dev.royalstreu.thecodefoxes.com\/?page_id=2"},"modified":"2026-01-31T15:53:51","modified_gmt":"2026-01-31T15:53:51","slug":"sample-page","status":"publish","type":"page","link":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/","title":{"rendered":"Sample Page"},"content":{"rendered":"<div class=\"main-page-header bg-cod-gray-950 relative overflow-hidden -mt-[150px] lg:-mt-[100px] pt-[100px] border-b border-gray-100\">\n            <div class=\"absolute inset-0 z-0\">\n                            <img decoding=\"async\"\n                        src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/slodki-kon-w-alpach-jedzacy-trawe-1-1-1.jpg\"\n                        alt=\"\"\n                        class=\"w-full h-full object-cover\"\n                        loading=\"lazy\"\n                >\n                    <\/div>\n        <div class=\"absolute inset-0 z-0 bg-black\/70\"><\/div>\n    \n    <div class=\"container mx-auto grid-cols-1 xl:grid-cols-2 h-[80vh] md:h-[90vh] lg:h-[90vh] mt-0 relative z-10\">\n        <div class=\"relative z-10 h-[85vh] lg:h-full mx-auto flex flex-col justify-between py-12 lg:py-16\">\n            <div class=\"mt-12 lg:mt-20 relative\">\n                <h1 class=\"text-white text-6xl md:text-8xl lg:text-[10em] font-thin tracking-wider uppercase leading-none\">\n                    ROYALSTREU                <\/h1>\n            <\/div>\n            <div class=\"flex flex-col md:flex-row justify-between items-end gap-12 pb-8\">\n                <div class=\"max-w-md text-white\">\n                    <h3 class=\"text-xl lg:text-2xl font-medium mb-4 uppercase tracking-wide\">LOREM IPSUM<\/h3>\n                    <p class=\"text-lg lg:text-xl text-gray-300 font-light mb-12 leading-relaxed\">\n                        Scroll down to learn more about the RoyalStreu complex services                    <\/p>\n                    <a href=\"https:\/\/dev.sklep.royalstreu.thecodefoxes.com\/\" class=\"bg-gray-200 hover:bg-white text-black px-8 py-5 rounded-full text-sm tracking-wide transition-colors uppercase\">\n                        Sprawdz nasze produkty                    <\/a>\n                <\/div>\n                <div class=\"flex items-center gap-6 text-white max-w-xs\">\n                    <div class=\"bg-gray-200 hover:bg-white text-black w-12 h-12 flex items-center justify-center rounded-lg transition-colors shrink-0\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"><\/line><polyline points=\"19 12 12 19 5 12\"><\/polyline><\/svg>\n                    <\/div>\n                    <p class=\"text-md text-gray-300 font-light leading-relaxed hidden md:block\">\n                           Scroll down to learn more about the RoyalStreu complex services                    <\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<section class=\"relative w-full h-[50vh] md:h-[55vh] overflow-hidden\">\n    <div class=\"absolute inset-0 w-full h-full\">\n                    <div class=\"absolute inset-0 z-0\">\n                                    <img decoding=\"async\"\n                            src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/custom_resized_1cc2e5e7-0533-4a07-8405-ea0fb000cb86-scaled.webp\"\n                            alt=\"\"\n                            class=\"w-full h-full object-cover\"\n                            loading=\"lazy\"\n                    >\n                            <\/div>\n            <div class=\"absolute inset-0 z-0 bg-black\/70\"><\/div>\n            <\/div>\n\n    <div class=\"relative z-10 container mx-auto px-6 h-full flex items-center\">\n        <div class=\"max-w-2xl\">\n            <h1 class=\"font-inter text-white font-extrabold text-4xl sm:text-5xl md:text-6xl uppercase tracking-tight mb-4 md:mb-6 leading-tight\">\n                Lorem Ipsum            <\/h1>\n            <p class=\"font-poppins text-white text-lg sm:text-xl md:text-2xl font-normal leading-relaxed text-gray-200\">\n                Scroll down to learn more about the\r\nRoyalStreu complex services            <\/p>\n        <\/div>\n    <\/div>\n<\/section>\n\n\n<section class=\"container mx-auto w-full px-4 sm:px-6 lg:px-8 py-12 lg:py-20\">\n\n            <div class=\"mb-8 lg:mb-12 text-left\">\n                            <h2 class=\"text-4xl sm:text-5xl lg:text-6xl font-light text-primary-950 mb-6 tracking-tight\">\n                    Produkty                <\/h2>\n            \n                            <p class=\"text-gray-500 text-lg leading-relaxed max-w-2xl mx-auto lg:mx-0\">\n                    csdacdsacasd                <\/p>\n                    <\/div>\n    \n            <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-10 lg:gap-16\">\n\n                            \n<div class=\"bg-white rounded-3xl overflow-hidden flex flex-col transition-all duration-500 group\">\n\n            <div class=\"relative w-full aspect-[4\/3] overflow-hidden bg-white flex items-center justify-center p-8\">\n            <a href=\"https:\/\/dev.sklep.royalstreu.thecodefoxes.com\/22-sciolka-z-odpylonej-slomy-rzepakowej.html\" class=\"block w-full h-full\">\n                <img decoding=\"async\" src=\"https:\/\/dev.sklep.royalstreu.thecodefoxes.com\/52-large_default\/sciolka-z-odpylonej-slomy-rzepakowej.jpg\" alt=\"\u015aci\u00f3\u0142ka z Odpylonej S\u0142omy Rzepakowej\"\n                    class=\"w-full h-full object-contain\" loading=\"lazy\">\n            <\/a>\n        <\/div>\n    \n    <div class=\"pb-8 px-8 flex flex-col flex-grow\">\n                    <h3 class=\"text-xl sm:text-2xl font-light text-primary-950 mb-2 leading-tight\">\n                <a href=\"https:\/\/dev.sklep.royalstreu.thecodefoxes.com\/22-sciolka-z-odpylonej-slomy-rzepakowej.html\" class=\"hover:text-primary-600 transition-colors\">\n                    \u015aci\u00f3\u0142ka z Odpylonej S\u0142omy Rzepakowej                <\/a>\n            <\/h3>\n        \n        \n        <div class=\"flex items-end justify-between mt-auto pt-4 border-t border-secondary-100\/30\">\n                            <div>\n                    <span class=\"text-lg font-normal text-primary-950 block tracking-wide\">\n                        50,00 PLN                    <\/span>\n                <\/div>\n            \n            <div class=\"mb-2\">\n                <a href=\"https:\/\/dev.sklep.royalstreu.thecodefoxes.com\/22-sciolka-z-odpylonej-slomy-rzepakowej.html\"\n                    class=\"inline-flex items-center text-sm font-light tracking-wide text-primary-950 transition-colors group\/btn\">\n                    <span\n                        class=\"border-b border-transparent group-hover\/btn:border-primary-950 pb-0.5 transition-all\">Zobacz\n                        produkt<\/span>\n                    <i data-lucide=\"arrow-up-right\"\n                        class=\"ml-2 w-4 h-4 text-primary-500 transition-transform group-hover\/btn:translate-x-1 group-hover\/btn:-translate-y-1\"><\/i>\n                <\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>            \n        <\/div>\n\n                    <div class=\"mt-16 lg:mt-24 flex justify-end\">\n                <a href=\"http:\/\/dcacsad\"\n                    class=\"inline-flex items-center font-light tracking-wide text-primary-950 hover:text-white transition-all duration-300 group py-4 px-10 rounded-full border border-primary-950 hover:bg-primary-950\">\n                    Zobacz wi\u0119cej produkt\u00f3w                    <i data-lucide=\"arrow-up-right\"\n                        class=\"ml-3 w-5 h-5 transform group-hover:translate-x-1 group-hover:-translate-y-1 transition-transform\"><\/i>\n                <\/a>\n            <\/div>\n            \n<\/section>\n\n\n<div class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-12 lg:py-20\">\n\n    <div class=\"flex flex-col lg:flex-row justify-between items-start mb-20 gap-12\">\n                    <h1 class=\"text-primary-950 text-4xl lg:text-5xl font-light tracking-tight max-w-lg leading-tight\">\n                Takie sobie faq            <\/h1>\n        \n                    <p class=\"text-secondary-600 max-w-md text-lg leading-relaxed opacity-80\">\n                test            <\/p>\n            <\/div>\n\n            <div class=\"border-t border-secondary-200\/50 mb-24\" id=\"block-f3513dce6e8883e9b1e7c58010165685\" data-accordion>\n                            <div class=\"accordion-item border-b border-secondary-200\/50\" data-acc-id=\"1\">\n                    <button\n                        class=\"accordion-header w-full py-10 text-left group flex items-start justify-between focus:outline-none hover:opacity-70 transition-opacity duration-300\"\n                        type=\"button\" data-acc-toggle aria-expanded=\"false\"\n                        aria-controls=\"content-block-f3513dce6e8883e9b1e7c58010165685-1\"\n                        id=\"header-block-f3513dce6e8883e9b1e7c58010165685-1\">\n                        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6 w-full\">\n                            <div class=\"flex flex-row gap-6\">\n                                <span\n                                    class=\"text-2xl font-normal text-primary-950 w-8 py-1\">1.<\/span>\n                                <div>\n                                                                            <h2 class=\"text-2xl lg:text-3xl font-normal text-primary-950\">\n                                            Czy jestem fajny?                                        <\/h2>\n                                                                    <\/div>\n                            <\/div>\n                            <div class=\"hidden md:flex items-center justify-end pointer-events-none\">\n                                <div class=\"rotate-icon transition-all duration-300 p-2\"\n                                    id=\"icon-block-f3513dce6e8883e9b1e7c58010165685-1\">\n                                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\" viewbox=\"0 0 24 24\"\n                                        fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n                                        stroke-linejoin=\"round\" class=\"text-primary-950\">\n                                        <line x1=\"7\" y1=\"17\" x2=\"17\" y2=\"7\"><\/line>\n                                        <polyline points=\"7 7 17 7 17 17\"><\/polyline>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/button>\n\n                    <div id=\"content-block-f3513dce6e8883e9b1e7c58010165685-1\"\n                        class=\"overflow-hidden opacity-0 transition-[max-height,opacity] duration-300 max-h-0\" role=\"region\"\n                        aria-labelledby=\"header-block-f3513dce6e8883e9b1e7c58010165685-1\">\n                        <div class=\"min-h-0\">\n                            <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6 w-full pb-10\">\n                                <div class=\"flex flex-col justify-between gap-6 pl-14 mb-4\">\n                                                                            <p\n                                            class=\"text-base lg:text-lg text-primary-900 leading-relaxed relative inline-block opacity-80\">\n                                            Testowa odpowiedz 123                                        <\/p>\n                                                                                                                <div>\n                                            <a href=\"https:\/\/test.com\"\n                                                class=\"inline-flex items-center font-normal text-white hover:text-white transition-all group py-3 px-6 rounded-full border border-primary-500 bg-primary-500 hover:bg-primary-600 hover:border-primary-600\">\n                                                Test                                                <i data-lucide=\"arrow-up-right\"\n                                                    class=\"ml-2 w-5 h-5 transform group-hover:translate-x-1 group-hover:-translate-y-1 transition-transform\"><\/i>\n                                            <\/a>\n                                        <\/div>\n                                                                    <\/div>\n                                <div class=\"flex w-full\">\n                                    <div class=\"rounded-2xl overflow-hidden h-64 lg:h-56 w-full relative bg-secondary-50\">\n                                                                                    <img decoding=\"async\" src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/custom_resized_1cc2e5e7-0533-4a07-8405-ea0fb000cb86-scaled.webp\"\n                                                alt=\"\"\n                                                class=\"w-full h-full object-cover\" \/>\n                                                                            <\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                            <div class=\"accordion-item border-b border-secondary-200\/50\" data-acc-id=\"2\">\n                    <button\n                        class=\"accordion-header w-full py-10 text-left group flex items-start justify-between focus:outline-none hover:opacity-70 transition-opacity duration-300\"\n                        type=\"button\" data-acc-toggle aria-expanded=\"false\"\n                        aria-controls=\"content-block-f3513dce6e8883e9b1e7c58010165685-2\"\n                        id=\"header-block-f3513dce6e8883e9b1e7c58010165685-2\">\n                        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6 w-full\">\n                            <div class=\"flex flex-row gap-6\">\n                                <span\n                                    class=\"text-2xl font-normal text-primary-950 w-8 py-1\">2.<\/span>\n                                <div>\n                                                                            <h2 class=\"text-2xl lg:text-3xl font-normal text-primary-950\">\n                                            Eleo elo o                                        <\/h2>\n                                                                    <\/div>\n                            <\/div>\n                            <div class=\"hidden md:flex items-center justify-end pointer-events-none\">\n                                <div class=\"rotate-icon transition-all duration-300 p-2\"\n                                    id=\"icon-block-f3513dce6e8883e9b1e7c58010165685-2\">\n                                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\" viewbox=\"0 0 24 24\"\n                                        fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n                                        stroke-linejoin=\"round\" class=\"text-primary-950\">\n                                        <line x1=\"7\" y1=\"17\" x2=\"17\" y2=\"7\"><\/line>\n                                        <polyline points=\"7 7 17 7 17 17\"><\/polyline>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/button>\n\n                    <div id=\"content-block-f3513dce6e8883e9b1e7c58010165685-2\"\n                        class=\"overflow-hidden opacity-0 transition-[max-height,opacity] duration-300 max-h-0\" role=\"region\"\n                        aria-labelledby=\"header-block-f3513dce6e8883e9b1e7c58010165685-2\">\n                        <div class=\"min-h-0\">\n                            <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6 w-full pb-10\">\n                                <div class=\"flex flex-col justify-between gap-6 pl-14 mb-4\">\n                                                                            <p\n                                            class=\"text-base lg:text-lg text-primary-900 leading-relaxed relative inline-block opacity-80\">\n                                            qcewcqew ewcewc ewccs cwer                                        <\/p>\n                                                                                                                <div>\n                                            <a href=\"http:\/\/asddas\"\n                                                class=\"inline-flex items-center font-normal text-white hover:text-white transition-all group py-3 px-6 rounded-full border border-primary-500 bg-primary-500 hover:bg-primary-600 hover:border-primary-600\">\n                                                asdasd                                                <i data-lucide=\"arrow-up-right\"\n                                                    class=\"ml-2 w-5 h-5 transform group-hover:translate-x-1 group-hover:-translate-y-1 transition-transform\"><\/i>\n                                            <\/a>\n                                        <\/div>\n                                                                    <\/div>\n                                <div class=\"flex w-full\">\n                                    <div class=\"rounded-2xl overflow-hidden h-64 lg:h-56 w-full relative bg-secondary-50\">\n                                                                                    <img decoding=\"async\" src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/slodki-kon-w-alpach-jedzacy-trawe-1-1-1.jpg\"\n                                                alt=\"\"\n                                                class=\"w-full h-full object-cover\" \/>\n                                                                            <\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                    <\/div>\n    \n<\/div>\n\n<script>\n    (function () {\n        const container = document.getElementById('block-f3513dce6e8883e9b1e7c58010165685');\n        if (!container) return;\n\n        let openId = null; \/\/ none open by default\n\n        function updateUI() {\n            const items = container.querySelectorAll('.accordion-item');\n            items.forEach((item) => {\n                const id = parseInt(item.getAttribute('data-acc-id'));\n                const content = container.querySelector(`#content-block-f3513dce6e8883e9b1e7c58010165685-${id}`);\n                const icon = container.querySelector(`#icon-block-f3513dce6e8883e9b1e7c58010165685-${id}`);\n                const header = container.querySelector(`#header-block-f3513dce6e8883e9b1e7c58010165685-${id}`);\n                if (!content) return;\n                const isOpen = id === openId;\n                content.style.maxHeight = isOpen ? (content.scrollHeight + 'px') : '0px';\n                content.classList.toggle('opacity-100', isOpen);\n                content.classList.toggle('opacity-0', !isOpen);\n                if (icon) icon.style.transform = isOpen ? 'rotate(45deg)' : '';\n                if (header) header.setAttribute('aria-expanded', isOpen ? 'true' : 'false');\n            });\n        }\n\n        container.addEventListener('click', function (e) {\n            const btn = e.target.closest('[data-acc-toggle]');\n            if (!btn || !container.contains(btn)) return;\n            const item = btn.closest('.accordion-item');\n            if (!item) return;\n            const id = parseInt(item.getAttribute('data-acc-id'));\n            openId = (openId === id) ? null : id;\n            updateUI();\n        });\n\n        updateUI();\n    })();\n<\/script>\n\n\n<section class=\"container mx-auto w-full overflow-hidden px-4 sm:px-6 lg:px-8 py-12 lg:py-20\">\n    <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-center\">\n\n        <div class=\"flex flex-col justify-center order-2 lg:order-1 sm:px-0\">\n\n            <div class=\"mb-6\">\n                                    <h3 class=\"text-3xl lg:text-4xl font-light text-primary-950 leading-tight\">\n                        \u201cPeople now recognise that having a good performance conversation means that something happens as a result.\u201d                    <\/h3>\n                            <\/div>\n\n                            <p class=\"text-primary-900 text-base lg:text-lg leading-relaxed mb-10 opacity-80\">\n                    \u201cWith Landingfolio, the design team can now build design which identifies employees\u2019 career aspirations and goals and from which we approach managers and check to see what is happening.\u201d                <\/p>\n            \n                            <a href=\"http:\/\/XD\"\n                    class=\"inline-flex items-center font-normal text-primary-500 hover:text-primary-600 transition-colors group\">\n                    Czytaj wiecej                    <i data-lucide=\"arrow-up-right\"\n                        class=\"ml-2 w-5 h-5 transform group-hover:translate-x-1 group-hover:-translate-y-1 transition-transform\"><\/i>\n                <\/a>\n                    <\/div>\n\n        <div class=\"relative w-full h-80 sm:h-96 lg:h-[55vh] rounded-3xl overflow-hidden order-1 lg:order-2\">\n                            <img decoding=\"async\" src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/custom_resized_1cc2e5e7-0533-4a07-8405-ea0fb000cb86-scaled.webp\" alt=\"\"\n                    class=\"absolute inset-0 w-full h-full object-cover object-top\">\n            \n            <div class=\"absolute inset-0 bg-gradient-to-t from-black\/70 via-black\/10 to-transparent\"><\/div>\n\n                            <div class=\"absolute bottom-0 left-0 w-full p-8 sm:p-10\">\n                                            <h3 class=\"text-white text-2xl lg:text-3xl font-light mb-2\">Ania<\/h3>\n                                                                <p class=\"text-white\/80 text-sm sm:text-base font-normal\">Koniara z Krapkowic<\/p>\n                                    <\/div>\n                    <\/div>\n\n    <\/div>\n<\/section>\n\n\n<section class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-12 lg:py-20\">\n    <div class=\"flex flex-col lg:flex-row justify-between items-start mb-20 gap-12\">\n                    <h1 class=\"text-4xl lg:text-5xl font-light tracking-tight max-w-lg leading-tight text-primary-950\">\n                Lorem ipsum dolor sit amet, consectetur adipiscing elit.             <\/h1>\n        \n                    <p class=\"text-secondary-700 max-w-xl text-lg leading-relaxed opacity-80\">\n                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.             <\/p>\n            <\/div>\n\n    <div class=\"relative w-full h-[40vh] md:h-[70vh] bg-secondary-50 rounded-3xl overflow-hidden group\"\n        id=\"video-container\">\n\n        <div id=\"video-thumbnail\" class=\"absolute inset-0 z-10 transition-opacity duration-500\">\n                            <img decoding=\"async\" src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/custom_resized_1cc2e5e7-0533-4a07-8405-ea0fb000cb86-scaled.webp\" alt=\"\"\n                    class=\"absolute inset-0 w-full h-full object-cover\">\n            \n            <div class=\"absolute inset-0 bg-gradient-to-t from-black\/60 via-transparent to-transparent\"><\/div>\n\n            <div class=\"absolute inset-0 flex items-center justify-center\">\n                <button id=\"video-play-button\"\n                    class=\"w-20 h-20 md:w-24 md:h-24 flex items-center justify-center rounded-full border border-white\/40 bg-white\/15 backdrop-blur-sm text-white hover:bg-white\/25 hover:border-white\/60 transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-white\/50 hover:scale-105\"\n                    aria-label=\"Odtw\u00f3rz: Sprawd\u017a jak produkujemy \u015bci\u00f3\u0142k\u0119 RoyalStreu\"\n                    type=\"button\">\n                    <svg width=\"24\" height=\"24\" viewbox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"currentColor\"\n                        stroke-width=\"0\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                        class=\"w-8 h-8 md:w-10 md:h-10 ml-1\">\n                        <polygon points=\"5 3 19 12 5 21 5 3\"><\/polygon>\n                    <\/svg>\n                <\/button>\n            <\/div>\n\n                            <div class=\"absolute bottom-8 left-0 right-0 text-center px-4 max-w-3\/4 mx-auto\">\n                    <p class=\"text-white font-normal text-lg md:text-2xl drop-shadow-lg\">\n                        Sprawd\u017a jak produkujemy \u015bci\u00f3\u0142k\u0119 RoyalStreu                    <\/p>\n                <\/div>\n                    <\/div>\n\n        <div id=\"video-player-wrapper\"\n            class=\"absolute inset-0 opacity-0 pointer-events-none transition-opacity duration-500\">\n            <video id=\"video-player\" class=\"w-full h-full object-cover\" playsinline poster=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/custom_resized_1cc2e5e7-0533-4a07-8405-ea0fb000cb86-scaled.webp\">\n                                    <source src=\"https:\/\/dev.royalstreu.thecodefoxes.com\/wp-content\/uploads\/2025\/12\/My-placeholder-video-1920x1080-30.mp4\" type=\"video\/mp4\">\n                                Twoja przegl\u0105darka nie obs\u0142uguje odtwarzacza wideo.\n            <\/video>\n        <\/div>\n    <\/div>\n<\/section>\n\n<script>\n    (function () {\n        const playBtn = document.getElementById('video-play-button');\n        const thumb = document.getElementById('video-thumbnail');\n        const wrapper = document.getElementById('video-player-wrapper');\n        const video = document.getElementById('video-player');\n\n        if (!playBtn || !thumb || !wrapper || !video) return;\n\n        function startVideo() {\n            thumb.classList.add('opacity-0', 'pointer-events-none');\n            wrapper.classList.remove('pointer-events-none');\n            wrapper.classList.add('opacity-100');\n            video.setAttribute('controls', 'controls');\n            try {\n                const playPromise = video.play();\n                if (playPromise && typeof playPromise.then === 'function') {\n                    playPromise.catch(() => { });\n                }\n            } catch (e) { }\n        }\n\n        playBtn.addEventListener('click', startVideo);\n        playBtn.addEventListener('keydown', function (e) {\n            if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault();\n                startVideo();\n            }\n        });\n    })();\n<\/script>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"pages\/main.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/comments?post=2"}],"version-history":[{"count":21,"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":145,"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/pages\/2\/revisions\/145"}],"wp:attachment":[{"href":"https:\/\/dev.royalstreu.thecodefoxes.com\/de\/wp-json\/wp\/v2\/media?parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}