{"id":2,"date":"2025-12-15T11:28:19","date_gmt":"2025-12-15T10:28:19","guid":{"rendered":"http:\/\/www.kostensky.eu\/?page_id=2"},"modified":"2025-12-16T10:15:11","modified_gmt":"2025-12-16T09:15:11","slug":"home","status":"publish","type":"page","link":"https:\/\/www.kostensky.eu\/en\/","title":{"rendered":""},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2\" class=\"elementor elementor-2\">\n\t\t\t\t<div class=\"elementor-element elementor-element-90a7c29 e-flex e-con-boxed e-con e-parent\" data-id=\"90a7c29\" 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-0d3f3a2 elementor-widget elementor-widget-html\" data-id=\"0d3f3a2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n\n        body {\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n            overflow-x: hidden;\n        }\n\n        .hero-accordion {\n            display: flex;\n            height: 100vh;\n            position: relative;\n            overflow: hidden;\n        }\n\n        .accordion-section {\n            flex: 1;\n            position: relative;\n            overflow: hidden;\n            cursor: pointer;\n            transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .accordion-section:hover {\n            flex: 2;\n        }\n\n        .accordion-section.active {\n            flex: 2.5;\n        }\n\n        \/* Background images *\/\n        .accordion-section::before {\n            content: '';\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background-size: cover;\n            background-position: center;\n            transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);\n            z-index: 1;\n        }\n\n        .accordion-section:hover::before {\n            transform: scale(1.05);\n        }\n\n        \/* Dark overlay *\/\n        .accordion-section::after {\n            content: '';\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background: rgba(0, 0, 0, 0.4);\n            transition: background 0.4s ease;\n            z-index: 2;\n        }\n\n        .accordion-section:hover::after {\n            background: rgba(0, 0, 0, 0.2);\n        }\n\n        \/* Wave separator - SVG clip-path *\/\n        .accordion-section {\n            clip-path: polygon(\n                0 0,\n                100% 0,\n                100% calc(100% - 50px),\n                95% calc(100% - 40px),\n                90% calc(100% - 50px),\n                85% calc(100% - 45px),\n                80% calc(100% - 50px),\n                75% calc(100% - 42px),\n                70% calc(100% - 50px),\n                65% calc(100% - 47px),\n                60% calc(100% - 50px),\n                55% calc(100% - 43px),\n                50% calc(100% - 50px),\n                45% calc(100% - 46px),\n                40% calc(100% - 50px),\n                35% calc(100% - 44px),\n                30% calc(100% - 50px),\n                25% calc(100% - 48px),\n                20% calc(100% - 50px),\n                15% calc(100% - 45px),\n                10% calc(100% - 50px),\n                5% calc(100% - 47px),\n                0 calc(100% - 50px)\n            );\n        }\n\n        \/* Content wrapper *\/\n        .section-content {\n            position: relative;\n            z-index: 3;\n            text-align: center;\n            color: white;\n            padding: 20px;\n            transform: translateY(20px);\n            opacity: 0.9;\n            transition: all 0.4s ease;\n        }\n\n        .accordion-section:hover .section-content {\n            transform: translateY(0);\n            opacity: 1;\n        }\n\n        .section-title {\n            font-size: clamp(1.5rem, 4vw, 3rem);\n            font-weight: 700;\n            color: var(--ast-global-color-5) !important;\n            margin-bottom: 10px;\n            text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);\n            writing-mode: vertical-rl;\n            text-orientation: mixed;\n            transition: all 0.4s ease;\n        }\n\n        .accordion-section:hover .section-title {\n            writing-mode: horizontal-tb;\n            font-size: clamp(2rem, 5vw, 4rem);\n        }\n\n        .section-subtitle {\n            font-size: clamp(0.9rem, 2vw, 1.2rem);\n            opacity: 0;\n            max-height: 0;\n            overflow: hidden;\n            transition: all 0.4s ease;\n            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.7);\n        }\n\n        .accordion-section:hover .section-subtitle {\n            opacity: 1;\n            max-height: 100px;\n            margin-top: 15px;\n        }\n\n        \/* Background colors (fallback ak fotky nena\u010d\u00edtaj\u00fa) *\/\n        .section-it-dev::before {\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%), \n                        url('https:\/\/images.unsplash.com\/photo-1461749280684-dccba630e2f6?w=1200');\n            background-size: cover;\n            background-blend-mode: overlay;\n        }\n\n        .section-pm::before {\n            background: url('\/wp-content\/uploads\/2025\/12\/management.jpg');\n            background-size: cover;\n            background-blend-mode: overlay;\n        }\n\n        .section-ski::before {\n            background: url('\/wp-content\/uploads\/2025\/12\/lyzovanie.jpg');\n            background-size: cover;\n            background-blend-mode: overlay;\n        }\n\n        .section-kayak::before {\n            background: url('\/wp-content\/uploads\/2025\/12\/kayaking.webp');\n            background-size: cover;\n            background-blend-mode: overlay;\n        }\n\n        \/* Mobile responsive *\/\n        @media (max-width: 768px) {\n            .hero-accordion {\n                flex-direction: column;\n                height: auto;\n                min-height: 100vh;\n            }\n\n            .accordion-section {\n                min-height: 25vh;\n                clip-path: none !important;\n            }\n\n            .accordion-section:hover {\n                flex: 1.5;\n            }\n\n            .section-title {\n                writing-mode: horizontal-tb;\n                font-size: 2rem;\n            }\n\n            .section-subtitle {\n                opacity: 1;\n                max-height: none;\n                margin-top: 10px;\n            }\n        }\n\n        \/* Loading animation *\/\n        @keyframes fadeInUp {\n            from {\n                opacity: 0;\n                transform: translateY(30px);\n            }\n            to {\n                opacity: 1;\n                transform: translateY(0);\n            }\n        }\n\n        .accordion-section {\n            animation: fadeInUp 0.8s ease forwards;\n        }\n\n        .accordion-section:nth-child(1) { animation-delay: 0.1s; }\n        .accordion-section:nth-child(2) { animation-delay: 0.2s; }\n        .accordion-section:nth-child(3) { animation-delay: 0.3s; }\n        .accordion-section:nth-child(4) { animation-delay: 0.4s; }\n    <\/style>\n<\/head>\n<body>\n\n<div class=\"hero-accordion\">\n    <!-- Section 1: IT Developer -->\n    <div class=\"accordion-section section-it-dev\" onclick=\"window.location.href='\/it-vyvojar'\">\n        <div class=\"section-content\">\n            <h2 class=\"section-title\">IT Developer<\/h2>\n            <p class=\"section-subtitle\">GoLang \u2022 Python \u2022 AWS<\/p>\n        <\/div>\n    <\/div>\n\n    <!-- Section 2: Project Management -->\n    <div class=\"accordion-section section-pm\" onclick=\"window.location.href='\/project-managment-team-lead\/'\">\n        <div class=\"section-content\">\n            <h2 class=\"section-title\">Project Manager<\/h2>\n            <p class=\"section-subtitle\">Interreg SKHU \u2022 Agile \u2022 Scrum \u2022 Team Leadership<\/p>\n        <\/div>\n    <\/div>\n\n    <!-- Section 3: Ski Instructor -->\n    <div class=\"accordion-section section-ski\" onclick=\"window.location.href='\/ski-instructor'\">\n        <div class=\"section-content\">\n            <h2 class=\"section-title\">Ski Instructor<\/h2>\n            <p class=\"section-subtitle\">ZSL IAD 1 \u2022 Children &amp; Adults<\/p>\n        <\/div>\n    <\/div>\n\n    <!-- Section 4: Kayak Instructor -->\n    <div class=\"accordion-section section-kayak\" onclick=\"window.location.href='\/kayak-instructor'\">\n        <div class=\"section-content\">\n            <h2 class=\"section-title\">Watersports Instructor<\/h2>\n            <p class=\"section-subtitle\">Kayak \u2022 Rafting \u2022 Safety<\/p>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\n    \/\/ Optional: Add active class on click (pre lep\u0161\u00ed UX)\n    document.querySelectorAll('.accordion-section').forEach(section => {\n        section.addEventListener('click', function() {\n            document.querySelectorAll('.accordion-section').forEach(s => s.classList.remove('active'));\n            this.classList.add('active');\n        });\n    });\n\n    \/\/ Optional: Touch device support\n    if ('ontouchstart' in window) {\n        document.querySelectorAll('.accordion-section').forEach(section => {\n            section.addEventListener('touchstart', function() {\n                document.querySelectorAll('.accordion-section').forEach(s => s.classList.remove('active'));\n                this.classList.add('active');\n            });\n        });\n    }\n<\/script>\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>IT V\u00fdvoj\u00e1r GoLang \u2022 Python \u2022 AWS Projekt Mana\u017e\u00e9r Interreg SKHU \u2022 Agile \u2022 Scrum \u2022 Team Leadership Ly\u017eiarsky In\u0161truktor [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/comments?post=2"}],"version-history":[{"count":32,"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":139,"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/pages\/2\/revisions\/139"}],"wp:attachment":[{"href":"https:\/\/www.kostensky.eu\/en\/wp-json\/wp\/v2\/media?parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}