{"id":7,"date":"2026-08-16T22:30:50","date_gmt":"2026-08-16T19:30:50","guid":{"rendered":"https:\/\/arcareon.fi\/?page_id=7"},"modified":"2026-09-03T04:56:21","modified_gmt":"2026-09-03T01:56:21","slug":"home-page","status":"publish","type":"page","link":"https:\/\/arcareon.fi\/en\/","title":{"rendered":"Home"},"content":{"rendered":"\r\n        <section\r\n            class=\"arcareon-home\"\r\n            style=\"--arcareon-hero-image:url('https:\/\/arcareon.fi\/wp-content\/uploads\/2026\/09\/arcareon-hero-brand-juhlat.webp');\"\r\n            data-hero-images=\"{&quot;for parties&quot;:&quot;https:\\\/\\\/arcareon.fi\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/arcareon-hero-brand-juhlat.webp&quot;,&quot;for home and garden&quot;:&quot;https:\\\/\\\/arcareon.fi\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/arcareon-hero-brand-koti-ja-piha.webp&quot;,&quot;for camping and sports&quot;:&quot;https:\\\/\\\/arcareon.fi\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/arcareon-hero-brand-retkeily-ja-urheilu.webp&quot;,&quot;for work and projects&quot;:&quot;https:\\\/\\\/arcareon.fi\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/arcareon-hero-brand-tyokalut.webp&quot;,&quot;for games and entertainment&quot;:&quot;https:\\\/\\\/arcareon.fi\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/arcareon-hero-brand-pelit-ja-viihde.webp&quot;}\"\r\n            data-hero-fallback=\"https:\/\/arcareon.fi\/wp-content\/uploads\/2026\/09\/arcareon-hero-brand-juhlat.webp\"\r\n        >\r\n\r\n            <div class=\"arcareon-home-hero\">\r\n\r\n                <div\r\n                    class=\"arcareon-home-background is-active\"\r\n                    style=\"background-image:url('https:\/\/arcareon.fi\/wp-content\/uploads\/2026\/09\/arcareon-hero-brand-juhlat.webp'),url('https:\/\/arcareon.fi\/wp-content\/uploads\/2026\/09\/arcareon-hero-brand-juhlat.webp');\"\r\n                    aria-hidden=\"true\"\r\n                ><\/div>\r\n\r\n                <div\r\n                    class=\"arcareon-home-background\"\r\n                    aria-hidden=\"true\"\r\n                ><\/div>\r\n\r\n                <div\r\n                    class=\"arcareon-home-overlay\"\r\n                    aria-hidden=\"true\"\r\n                ><\/div>\r\n\r\n                <div class=\"arcareon-home-inner\">\r\n\r\n                    <div class=\"arcareon-home-heading\">\r\n\r\n                        <p class=\"arcareon-home-eyebrow\">\r\n                            VUOKRAA FIKSUMMIN\r\n                        <\/p>\r\n\r\n                        <h1>\r\n                            Kaikki tarvittava vuokralle\r\n                        <\/h1>\r\n\r\n                        <p class=\"arcareon-home-highlight\">\r\n\r\n                            <span class=\"arcareon-home-highlight-main\">\r\n                                V\u00e4lineet\r\n                            <\/span>\r\n\r\n                            <span\r\n                                class=\"arcareon-home-rotating\"\r\n                                aria-live=\"polite\"\r\n                            >\r\n                                for parties                            <\/span>\r\n\r\n                        <\/p>\r\n\r\n                        <p class=\"arcareon-home-description\">\r\n                            Laadukkaat ja k\u00e4ytt\u00f6valmiit vuokrav\u00e4lineet\r\n                            helposti p\u00e4\u00e4kaupunkiseudulla.\r\n                        <\/p>\r\n\r\n                    <\/div>\r\n\r\n                    <form\r\n                        class=\"arcareon-home-search\"\r\n                        action=\"https:\/\/arcareon.fi\/en\/\"\r\n                        method=\"get\"\r\n                        role=\"search\"\r\n                    >\r\n\r\n                        <div class=\"arcareon-home-search-box\">\r\n\r\n                            <input\r\n                                type=\"search\"\r\n                                name=\"s\"\r\n                                placeholder=\"Mit\u00e4 haluat vuokrata?\"\r\n                                autocomplete=\"off\"\r\n                                aria-label=\"Hae vuokratuotteita\"\r\n                                data-arcareon-category-placeholder=\"1\"\r\n                            >\r\n\r\n                            <input\r\n                                type=\"hidden\"\r\n                                name=\"post_type\"\r\n                                value=\"rbfw_item\"\r\n                            >\r\n\r\n                            <button\r\n                                type=\"submit\"\r\n                                class=\"arcareon-home-search-submit\"\r\n                                aria-label=\"Hae\"\r\n                            >\r\n                                <span\r\n                                    class=\"arcareon-home-search-submit-icon\"\r\n                                    aria-hidden=\"true\"\r\n                                ><\/span>\r\n                            <\/button>\r\n\r\n                        <\/div>\r\n\r\n                        <div\r\n                            class=\"arcareon-home-live-results\"\r\n                            aria-live=\"polite\"\r\n                        ><\/div>\r\n\r\n                    <\/form>\r\n\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/section>\r\n\r\n        <style>\r\n\r\n            \/* =============================================\r\n               VARIABLES + WRAPPER\r\n            ============================================= *\/\r\n\r\n            .arcareon-home {\r\n                --gold: #D9B335;\r\n                --gold-hover: #C8A42E;\r\n                --black: #111111;\r\n                --white: #FFFFFF;\r\n\r\n                width: 100% !important;\r\n                max-width: none !important;\r\n                margin-left: 0 !important;\r\n                margin-right: 0 !important;\r\n                box-sizing: border-box !important;\r\n            }\r\n\r\n            .arcareon-home,\r\n            .arcareon-home * {\r\n                box-sizing: border-box !important;\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               HERO \u2014 COMPACT DESKTOP\r\n            ============================================= *\/\r\n\r\n            .arcareon-home-hero {\r\n                position: relative !important;\r\n                display: flex !important;\r\n                align-items: center !important;\r\n                width: 100% !important;\r\n\r\n                min-height:\r\n                    min(\r\n                        680px,\r\n                        calc(100svh - 80px)\r\n                    ) !important;\r\n\r\n                overflow: visible !important;\r\n                background-color: var(--black) !important;\r\n\r\n                background-image:\r\n                    linear-gradient(\r\n                        180deg,\r\n                        rgba(0, 0, 0, 0.24),\r\n                        rgba(0, 0, 0, 0.72)\r\n                    ),\r\n                    var(--arcareon-hero-image) !important;\r\n\r\n                background-repeat: no-repeat !important;\r\n                background-size: cover !important;\r\n                background-position: center 58% !important;\r\n            }\r\n\r\n            .arcareon-home-background {\r\n                position: absolute !important;\r\n                inset: 0 !important;\r\n                z-index: 0 !important;\r\n                opacity: 0 !important;\r\n                background-color: var(--black) !important;\r\n                background-repeat: no-repeat !important;\r\n                background-size: cover !important;\r\n                background-position: center center !important;\r\n                transform: none !important;\r\n                transition: opacity 720ms ease !important;\r\n                pointer-events: none !important;\r\n                will-change: opacity;\r\n            }\r\n\r\n            .arcareon-home-background.is-active {\r\n                opacity: 1 !important;\r\n            }\r\n\r\n            .arcareon-home-overlay {\r\n                position: absolute !important;\r\n                inset: 0 !important;\r\n                z-index: 1 !important;\r\n\r\n                background:\r\n                    radial-gradient(\r\n                        circle at 50% 28%,\r\n                        rgba(0, 0, 0, 0.02),\r\n                        rgba(0, 0, 0, 0.36) 62%,\r\n                        rgba(0, 0, 0, 0.68) 100%\r\n                    ) !important;\r\n\r\n                pointer-events: none !important;\r\n            }\r\n\r\n            .arcareon-home-inner {\r\n                position: relative !important;\r\n                z-index: 2 !important;\r\n\r\n                width:\r\n                    min(\r\n                        1180px,\r\n                        calc(100% - 48px)\r\n                    ) !important;\r\n\r\n                margin: 0 auto !important;\r\n                padding: 48px 0 52px !important;\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               HEADING\r\n            ============================================= *\/\r\n\r\n            .arcareon-home-heading {\r\n                width: 100% !important;\r\n                max-width: 1100px !important;\r\n                margin: 0 auto 24px !important;\r\n                text-align: center !important;\r\n            }\r\n\r\n            .arcareon-home-eyebrow {\r\n                margin: 0 0 11px !important;\r\n                color: var(--gold) !important;\r\n                font-size: 14px !important;\r\n                font-weight: 700 !important;\r\n                line-height: 1.2 !important;\r\n                letter-spacing: 0.12em !important;\r\n            }\r\n\r\n            .arcareon-home-heading h1 {\r\n                width: 100% !important;\r\n                max-width: none !important;\r\n                margin: 0 !important;\r\n                color: var(--white) !important;\r\n                font-size: clamp(38px, 5vw, 64px) !important;\r\n                font-weight: 750 !important;\r\n                line-height: 1.05 !important;\r\n                letter-spacing: -0.035em !important;\r\n                text-align: center !important;\r\n                white-space: nowrap !important;\r\n            }\r\n\r\n            .arcareon-home-highlight {\r\n                display: flex !important;\r\n                align-items: center !important;\r\n                justify-content: center !important;\r\n                flex-wrap: nowrap !important;\r\n                width: 100% !important;\r\n                gap: 12px !important;\r\n                min-height: 64px !important;\r\n                margin: 9px 0 0 !important;\r\n                color: var(--gold) !important;\r\n                font-size: clamp(30px, 4.2vw, 54px) !important;\r\n                font-weight: 750 !important;\r\n                line-height: 1.08 !important;\r\n                white-space: nowrap !important;\r\n            }\r\n\r\n            .arcareon-home-highlight-main {\r\n                display: inline-block !important;\r\n                flex: 0 0 auto !important;\r\n            }\r\n\r\n            .arcareon-home-rotating {\r\n                display: inline-block !important;\r\n                flex: 0 0 auto !important;\r\n                min-width: 320px !important;\r\n                color: var(--gold) !important;\r\n                text-align: left !important;\r\n                opacity: 1;\r\n                transform: translateY(0);\r\n\r\n                transition:\r\n                    opacity 0.24s ease,\r\n                    transform 0.24s ease !important;\r\n            }\r\n\r\n            .arcareon-home-rotating.is-changing {\r\n                opacity: 0 !important;\r\n                transform: translateY(8px) !important;\r\n            }\r\n\r\n            .arcareon-home-description {\r\n                width: 100% !important;\r\n                max-width: 700px !important;\r\n                margin: 14px auto 0 !important;\r\n                color: rgba(255, 255, 255, 0.84) !important;\r\n                font-size: 18px !important;\r\n                font-weight: 400 !important;\r\n                line-height: 1.55 !important;\r\n                text-align: center !important;\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               SEARCH\r\n            ============================================= *\/\r\n\r\n            .arcareon-home-search {\r\n                position: relative !important;\r\n                width: min(760px, 100%) !important;\r\n                margin: 0 auto !important;\r\n                z-index: 20 !important;\r\n            }\r\n\r\n            .arcareon-home-search-box {\r\n                display: grid !important;\r\n\r\n                grid-template-columns:\r\n                    minmax(0, 1fr)\r\n                    64px !important;\r\n\r\n                align-items: center !important;\r\n                min-height: 74px !important;\r\n                padding: 7px 9px 7px 18px !important;\r\n                background: var(--white) !important;\r\n                border: 1px solid rgba(255, 255, 255, 0.5) !important;\r\n                border-radius: 22px !important;\r\n                box-shadow: 0 18px 55px rgba(0, 0, 0, 0.25) !important;\r\n            }\r\n\r\n            .arcareon-home-search input[type=\"search\"] {\r\n                width: 100% !important;\r\n                min-width: 0 !important;\r\n                height: 58px !important;\r\n                margin: 0 !important;\r\n                padding: 0 10px !important;\r\n                color: var(--black) !important;\r\n                background: transparent !important;\r\n                border: 0 !important;\r\n                outline: 0 !important;\r\n                box-shadow: none !important;\r\n                font-family: inherit !important;\r\n                font-size: 19px !important;\r\n                font-weight: 500 !important;\r\n            }\r\n\r\n            .arcareon-home-search input[type=\"search\"]::placeholder {\r\n                color: #777777 !important;\r\n                opacity: 1 !important;\r\n            }\r\n\r\n            .arcareon-home-search-submit {\r\n                display: flex !important;\r\n                align-items: center !important;\r\n                justify-content: center !important;\r\n                width: 60px !important;\r\n                height: 60px !important;\r\n                margin: 0 !important;\r\n                padding: 0 !important;\r\n                background: transparent !important;\r\n                border: 0 !important;\r\n                border-radius: 50% !important;\r\n                cursor: pointer !important;\r\n                transition: transform 0.2s ease !important;\r\n            }\r\n\r\n            .arcareon-home-search-submit-icon {\r\n                display: block !important;\r\n                width: 27px !important;\r\n                height: 27px !important;\r\n                background: var(--gold) !important;\r\n\r\n                -webkit-mask-image:\r\n                    url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'\/%3E%3Cpath d='m21 21-4.35-4.35'\/%3E%3C\/svg%3E\") !important;\r\n\r\n                mask-image:\r\n                    url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'\/%3E%3Cpath d='m21 21-4.35-4.35'\/%3E%3C\/svg%3E\") !important;\r\n\r\n                -webkit-mask-repeat: no-repeat !important;\r\n                mask-repeat: no-repeat !important;\r\n                -webkit-mask-position: center !important;\r\n                mask-position: center !important;\r\n                -webkit-mask-size: contain !important;\r\n                mask-size: contain !important;\r\n            }\r\n\r\n            .arcareon-home-search-submit:hover .arcareon-home-search-submit-icon,\r\n            .arcareon-home-search-submit:focus-visible .arcareon-home-search-submit-icon {\r\n                background: var(--gold-hover) !important;\r\n            }\r\n\r\n            .arcareon-home-search-submit:focus-visible {\r\n                outline: 2px solid var(--gold) !important;\r\n                outline-offset: 2px !important;\r\n            }\r\n\r\n            .arcareon-home-search-submit:active {\r\n                transform: scale(0.94) !important;\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               LIVE RESULTS\r\n            ============================================= *\/\r\n\r\n            .arcareon-home-live-results {\r\n                position: absolute !important;\r\n                top: calc(100% + 10px) !important;\r\n                left: 0 !important;\r\n                right: 0 !important;\r\n                display: none !important;\r\n                overflow: hidden !important;\r\n                padding: 8px !important;\r\n                background: var(--white) !important;\r\n                border: 1px solid #E5E5E5 !important;\r\n                border-radius: 18px !important;\r\n                box-shadow: 0 18px 55px rgba(0, 0, 0, 0.22) !important;\r\n                z-index: 9999 !important;\r\n            }\r\n\r\n            .arcareon-home-live-results.is-open {\r\n                display: block !important;\r\n            }\r\n\r\n            .arcareon-home-live-item {\r\n                display: flex !important;\r\n                align-items: center !important;\r\n                gap: 14px !important;\r\n                min-height: 72px !important;\r\n                padding: 8px !important;\r\n                color: var(--black) !important;\r\n                border-radius: 13px !important;\r\n                text-decoration: none !important;\r\n            }\r\n\r\n            .arcareon-home-live-item:hover,\r\n            .arcareon-home-live-item:focus {\r\n                background: #FAFAFA !important;\r\n                outline: none !important;\r\n            }\r\n\r\n            .arcareon-home-live-image {\r\n                flex: 0 0 56px !important;\r\n                width: 56px !important;\r\n                height: 56px !important;\r\n                overflow: hidden !important;\r\n                background: #F5F5F5 !important;\r\n                border-radius: 11px !important;\r\n            }\r\n\r\n            .arcareon-home-live-image img {\r\n                display: block !important;\r\n                width: 100% !important;\r\n                height: 100% !important;\r\n                object-fit: cover !important;\r\n            }\r\n\r\n            .arcareon-home-live-title {\r\n                color: var(--black) !important;\r\n                font-size: 16px !important;\r\n                font-weight: 650 !important;\r\n                line-height: 1.35 !important;\r\n            }\r\n\r\n            .arcareon-home-live-empty {\r\n                margin: 0 !important;\r\n                padding: 16px !important;\r\n                color: #666666 !important;\r\n                text-align: center !important;\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               TABLET + DESKTOP \u2014 MATCH HERO IMAGE RATIO\r\n            ============================================= *\/\r\n\r\n            @media (min-width: 701px) {\r\n\r\n                .arcareon-home-hero {\r\n                    width: 100% !important;\r\n                    height: auto !important;\r\n                    min-height: 0 !important;\r\n                    aspect-ratio: 1672 \/ 941 !important;\r\n                    background-size: cover !important;\r\n                    background-position: center center !important;\r\n                }\r\n\r\n                .arcareon-home-background {\r\n                    background-position: center center !important;\r\n                }\r\n            }\r\n\r\n\r\n            \/* =============================================\r\n               MOBILE\r\n            ============================================= *\/\r\n\r\n            @media (max-width: 700px) {\r\n\r\n                .arcareon-home {\r\n                    width: 100vw !important;\r\n                    max-width: none !important;\r\n                    margin-left: calc(50% - 50vw) !important;\r\n                    margin-right: calc(50% - 50vw) !important;\r\n                }\r\n\r\n                .arcareon-home-hero {\r\n                    min-height: 0 !important;\r\n                    height: auto !important;\r\n                    align-items: flex-start !important;\r\n                    background-position: center center !important;\r\n                }\r\n\r\n                .arcareon-home-inner {\r\n                    width: calc(100% - 24px) !important;\r\n                    padding: 20px 0 22px !important;\r\n                }\r\n\r\n                .arcareon-home-heading {\r\n                    width: 100% !important;\r\n                    max-width: 100% !important;\r\n                    margin: 0 auto 14px !important;\r\n                    padding: 0 !important;\r\n                }\r\n\r\n                .arcareon-home-eyebrow {\r\n                    width: 100% !important;\r\n                    margin: 0 0 7px !important;\r\n                    font-size: 10px !important;\r\n                    letter-spacing: 0.15em !important;\r\n                }\r\n\r\n                .arcareon-home-heading h1 {\r\n                    width: 100% !important;\r\n                    max-width: 100% !important;\r\n                    margin: 0 auto !important;\r\n                    font-size: clamp(20px, 6.1vw, 24px) !important;\r\n                    font-weight: 750 !important;\r\n                    line-height: 1.1 !important;\r\n                    letter-spacing: -0.035em !important;\r\n                    white-space: nowrap !important;\r\n                }\r\n\r\n                .arcareon-home-highlight {\r\n                    display: flex !important;\r\n                    align-items: center !important;\r\n                    justify-content: center !important;\r\n                    flex-wrap: nowrap !important;\r\n                    width: 100% !important;\r\n                    max-width: 100% !important;\r\n                    min-height: 31px !important;\r\n                    margin: 8px auto 0 !important;\r\n                    gap: 7px !important;\r\n                    font-size: clamp(19px, 5.8vw, 23px) !important;\r\n                    line-height: 1.08 !important;\r\n                    white-space: nowrap !important;\r\n                }\r\n\r\n                .arcareon-home-highlight-main,\r\n                .arcareon-home-rotating {\r\n                    display: inline-block !important;\r\n                    flex: 0 0 auto !important;\r\n                    width: auto !important;\r\n                }\r\n\r\n                .arcareon-home-rotating {\r\n                    min-width: 0 !important;\r\n                    min-height: 0 !important;\r\n                    margin: 0 !important;\r\n                    text-align: left !important;\r\n                }\r\n\r\n                .arcareon-home-description {\r\n                    width: 100% !important;\r\n                    max-width: 100% !important;\r\n                    margin: 10px auto 0 !important;\r\n                    font-size: 13px !important;\r\n                    line-height: 1.4 !important;\r\n                }\r\n\r\n                .arcareon-home-search {\r\n                    width: 100% !important;\r\n                    margin: 0 auto !important;\r\n                }\r\n\r\n                .arcareon-home-search-box {\r\n                    grid-template-columns:\r\n                        minmax(0, 1fr)\r\n                        48px !important;\r\n\r\n                    min-height: 58px !important;\r\n                    padding: 5px 7px 5px 14px !important;\r\n                    border-radius: 17px !important;\r\n                }\r\n\r\n                .arcareon-home-search input[type=\"search\"] {\r\n                    height: 46px !important;\r\n                    padding: 0 6px 0 0 !important;\r\n                    font-size: 15px !important;\r\n                }\r\n\r\n                .arcareon-home-search-submit {\r\n                    width: 46px !important;\r\n                    height: 46px !important;\r\n                }\r\n\r\n                .arcareon-home-search-submit-icon {\r\n                    width: 24px !important;\r\n                    height: 24px !important;\r\n                }\r\n\r\n                .arcareon-home-live-results {\r\n                    top: calc(100% + 7px) !important;\r\n                    padding: 6px !important;\r\n                    border-radius: 15px !important;\r\n                }\r\n\r\n                .arcareon-home-live-item {\r\n                    min-height: 60px !important;\r\n                    gap: 10px !important;\r\n                    padding: 6px !important;\r\n                }\r\n\r\n                .arcareon-home-live-image {\r\n                    flex-basis: 46px !important;\r\n                    width: 46px !important;\r\n                    height: 46px !important;\r\n                    border-radius: 10px !important;\r\n                }\r\n\r\n                .arcareon-home-live-title {\r\n                    font-size: 14px !important;\r\n                }\r\n            }\r\n\r\n            @media (max-width: 390px) {\r\n\r\n                .arcareon-home-inner {\r\n                    padding-top: 18px !important;\r\n                    padding-bottom: 20px !important;\r\n                }\r\n\r\n                .arcareon-home-heading h1 {\r\n                    font-size: 20px !important;\r\n                }\r\n\r\n                .arcareon-home-highlight {\r\n                    gap: 6px !important;\r\n                    font-size: 19px !important;\r\n                }\r\n            }\r\n\r\n            @media (prefers-reduced-motion: reduce) {\r\n\r\n                .arcareon-home-rotating {\r\n                    transition: none !important;\r\n                }\r\n\r\n                .arcareon-home-background {\r\n                    transition: none !important;\r\n                }\r\n            }\r\n\r\n        <\/style>\r\n\r\n        <script>\r\n\r\n            document.addEventListener(\r\n                'DOMContentLoaded',\r\n                function () {\r\n\r\n                    'use strict';\r\n\r\n                    const rotatingText =\r\n                        document.querySelector(\r\n                            '.arcareon-home-rotating'\r\n                        );\r\n\r\n                    const rotatingWords =\r\n                        [\"for parties\",\"for home and garden\",\"for camping and sports\",\"for games and entertainment\",\"for work and projects\"];\r\n\r\n                    const heroSection =\r\n                        document.querySelector('.arcareon-home');\r\n\r\n                    const heroLayers =\r\n                        heroSection\r\n                            ? Array.from(\r\n                                heroSection.querySelectorAll(\r\n                                    '.arcareon-home-background'\r\n                                )\r\n                            )\r\n                            : [];\r\n\r\n                    let heroImages = {};\r\n\r\n                    if (heroSection) {\r\n\r\n                        try {\r\n                            heroImages = JSON.parse(\r\n                                heroSection.dataset.heroImages || '{}'\r\n                            );\r\n                        } catch (error) {\r\n                            heroImages = {};\r\n                        }\r\n                    }\r\n\r\n                    if (\r\n                        rotatingText &&\r\n                        Array.isArray(rotatingWords) &&\r\n                        rotatingWords.length > 1\r\n                    ) {\r\n\r\n                        let rotatingIndex = 0;\r\n                        let activeHeroLayer = 0;\r\n                        let heroRequest = 0;\r\n\r\n                        const changeHeroImage =\r\n                            function (word) {\r\n\r\n                                if (\r\n                                    heroLayers.length !== 2 ||\r\n                                    !heroImages[word]\r\n                                ) {\r\n                                    return;\r\n                                }\r\n\r\n                                const request = ++heroRequest;\r\n                                const nextLayerIndex =\r\n                                    activeHeroLayer === 0 ? 1 : 0;\r\n                                const currentLayer =\r\n                                    heroLayers[activeHeroLayer];\r\n                                const nextLayer =\r\n                                    heroLayers[nextLayerIndex];\r\n                                const image = new Image();\r\n\r\n                                image.onload = function () {\r\n\r\n                                    if (request !== heroRequest) {\r\n                                        return;\r\n                                    }\r\n\r\n                                    const fallback =\r\n                                        heroSection.dataset.heroFallback || '';\r\n\r\n                                    nextLayer.style.backgroundImage =\r\n                                        'url(\"' + heroImages[word] + '\")' +\r\n                                        (\r\n                                            fallback\r\n                                                ? ',url(\"' + fallback + '\")'\r\n                                                : ''\r\n                                        );\r\n\r\n                                    nextLayer.classList.add('is-active');\r\n                                    currentLayer.classList.remove('is-active');\r\n                                    activeHeroLayer = nextLayerIndex;\r\n                                };\r\n\r\n                                image.onerror = function () {\r\n\r\n                                    const fallback =\r\n                                        heroSection\r\n                                            ? heroSection.dataset.heroFallback\r\n                                            : '';\r\n\r\n                                    if (request === heroRequest && fallback) {\r\n                                        currentLayer.style.backgroundImage =\r\n                                            'url(\"' + fallback + '\")';\r\n                                    }\r\n                                };\r\n\r\n                                image.src = heroImages[word];\r\n                            };\r\n\r\n                        const reducedMotion =\r\n                            window.matchMedia(\r\n                                '(prefers-reduced-motion: reduce)'\r\n                            ).matches;\r\n\r\n                        if (!reducedMotion) {\r\n\r\n                            window.setInterval(\r\n                                function () {\r\n\r\n                                    rotatingText.classList.add(\r\n                                        'is-changing'\r\n                                    );\r\n\r\n                                    window.setTimeout(\r\n                                        function () {\r\n\r\n                                            rotatingIndex =\r\n                                                (\r\n                                                    rotatingIndex + 1\r\n                                                ) %\r\n                                                rotatingWords.length;\r\n\r\n                                            rotatingText.textContent =\r\n                                                rotatingWords[\r\n                                                    rotatingIndex\r\n                                                ];\r\n\r\n                                            changeHeroImage(\r\n                                                rotatingWords[\r\n                                                    rotatingIndex\r\n                                                ]\r\n                                            );\r\n\r\n                                            rotatingText.classList.remove(\r\n                                                'is-changing'\r\n                                            );\r\n\r\n                                        },\r\n                                        240\r\n                                    );\r\n\r\n                                },\r\n                                2600\r\n                            );\r\n                        }\r\n                    }\r\n\r\n                    const form =\r\n                        document.querySelector(\r\n                            '.arcareon-home-search'\r\n                        );\r\n\r\n                    if (!form) {\r\n                        return;\r\n                    }\r\n\r\n                    const input =\r\n                        form.querySelector(\r\n                            'input[name=\"s\"]'\r\n                        );\r\n\r\n                    const results =\r\n                        form.querySelector(\r\n                            '.arcareon-home-live-results'\r\n                        );\r\n\r\n                    if (!input || !results) {\r\n                        return;\r\n                    }\r\n\r\n                    const ajaxUrl =\r\n                        \"https:\\\/\\\/arcareon.fi\\\/wp-admin\\\/admin-ajax.php\";\r\n\r\n                    let timer = null;\r\n                    let controller = null;\r\n\r\n                    function closeResults() {\r\n\r\n                        results.classList.remove('is-open');\r\n                        results.innerHTML = '';\r\n                    }\r\n\r\n                    function openResults() {\r\n                        results.classList.add('is-open');\r\n                    }\r\n\r\n                    function renderResults(items) {\r\n\r\n                        results.innerHTML = '';\r\n\r\n                        if (!items.length) {\r\n\r\n                            const empty =\r\n                                document.createElement('div');\r\n\r\n                            empty.className =\r\n                                'arcareon-home-live-empty';\r\n\r\n                            empty.textContent =\r\n                                'Ei tuloksia';\r\n\r\n                            results.appendChild(empty);\r\n                            openResults();\r\n\r\n                            return;\r\n                        }\r\n\r\n                        items.forEach(\r\n                            function (item) {\r\n\r\n                                const link =\r\n                                    document.createElement('a');\r\n\r\n                                link.className =\r\n                                    'arcareon-home-live-item';\r\n\r\n                                link.href = item.url;\r\n\r\n                                const imageBox =\r\n                                    document.createElement('span');\r\n\r\n                                imageBox.className =\r\n                                    'arcareon-home-live-image';\r\n\r\n                                if (item.image) {\r\n\r\n                                    const productImage =\r\n                                        document.createElement('img');\r\n\r\n                                    productImage.src = item.image;\r\n                                    productImage.alt = '';\r\n                                    productImage.loading = 'lazy';\r\n\r\n                                    imageBox.appendChild(productImage);\r\n                                }\r\n\r\n                                const title =\r\n                                    document.createElement('span');\r\n\r\n                                title.className =\r\n                                    'arcareon-home-live-title';\r\n\r\n                                title.textContent = item.title;\r\n\r\n                                link.append(imageBox, title);\r\n                                results.appendChild(link);\r\n                            }\r\n                        );\r\n\r\n                        openResults();\r\n                    }\r\n\r\n                    function search(value) {\r\n\r\n                        if (controller) {\r\n                            controller.abort();\r\n                        }\r\n\r\n                        controller = new AbortController();\r\n\r\n                        const url =\r\n                            ajaxUrl +\r\n                            '?action=arcareon_home_live_search&q=' +\r\n                            encodeURIComponent(value);\r\n\r\n                        fetch(\r\n                            url,\r\n                            {\r\n                                credentials: 'same-origin',\r\n                                signal: controller.signal\r\n                            }\r\n                        )\r\n                        .then(\r\n                            function (response) {\r\n\r\n                                if (!response.ok) {\r\n                                    throw new Error(\r\n                                        'Search request failed'\r\n                                    );\r\n                                }\r\n\r\n                                return response.json();\r\n                            }\r\n                        )\r\n                        .then(\r\n                            function (response) {\r\n\r\n                                if (\r\n                                    !response ||\r\n                                    !response.success ||\r\n                                    !Array.isArray(response.data)\r\n                                ) {\r\n\r\n                                    closeResults();\r\n                                    return;\r\n                                }\r\n\r\n                                if (\r\n                                    input.value.trim().toLowerCase() !==\r\n                                    value.toLowerCase()\r\n                                ) {\r\n                                    return;\r\n                                }\r\n\r\n                                renderResults(response.data);\r\n                            }\r\n                        )\r\n                        .catch(\r\n                            function (error) {\r\n\r\n                                if (error.name !== 'AbortError') {\r\n                                    closeResults();\r\n                                }\r\n                            }\r\n                        );\r\n                    }\r\n\r\n                    input.addEventListener(\r\n                        'input',\r\n                        function () {\r\n\r\n                            window.clearTimeout(timer);\r\n\r\n                            const value = input.value.trim();\r\n\r\n                            if (value.length < 2) {\r\n\r\n                                if (controller) {\r\n                                    controller.abort();\r\n                                }\r\n\r\n                                closeResults();\r\n                                return;\r\n                            }\r\n\r\n                            timer = window.setTimeout(\r\n                                function () {\r\n                                    search(value);\r\n                                },\r\n                                250\r\n                            );\r\n                        }\r\n                    );\r\n\r\n                    input.addEventListener(\r\n                        'keydown',\r\n                        function (event) {\r\n\r\n                            if (event.key === 'Escape') {\r\n                                closeResults();\r\n                            }\r\n                        }\r\n                    );\r\n\r\n                    document.addEventListener(\r\n                        'click',\r\n                        function (event) {\r\n\r\n                            if (!form.contains(event.target)) {\r\n                                closeResults();\r\n                            }\r\n                        }\r\n                    );\r\n                }\r\n            );\r\n\r\n        <\/script>\r\n\r\n        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-no-title","meta":{"_zipai_imported":false,"_zipai_import_id":"","footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"spectra_blocks_featured_image_url":null,"spectra_blocks_author_info":{"display_name":"arcareon","avatar_url":"https:\/\/arcareon.fi\/wp-content\/uploads\/nsl_avatars\/86cf81162f679cb6a35819c99da46356.png","author_link":"https:\/\/arcareon.fi\/en\/author\/arcareonoy\/","description":""},"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/comments?post=7"}],"version-history":[{"count":21,"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":682,"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/pages\/7\/revisions\/682"}],"wp:attachment":[{"href":"https:\/\/arcareon.fi\/en\/wp-json\/wp\/v2\/media?parent=7"}],"curies":[{"name":"well played","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}