{"id":2928,"date":"2025-08-03T12:26:32","date_gmt":"2025-08-03T12:26:32","guid":{"rendered":"https:\/\/www.coray-vallat.ch\/?page_id=2928"},"modified":"2025-11-23T14:17:38","modified_gmt":"2025-11-23T14:17:38","slug":"home","status":"publish","type":"page","link":"https:\/\/www.coray-vallat.ch\/de\/","title":{"rendered":"Startseite"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2928\" class=\"elementor elementor-2928\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e9c0437 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"e9c0437\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-db6c5ad elementor-widget elementor-widget-html\" data-id=\"db6c5ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!doctype html>\r\n\r\n  <style>\r\n    html, body {\r\n      margin: 0; padding: 0; height: 100%;\r\n      background: #000; overflow: hidden; \/* lib\u00e9r\u00e9 apr\u00e8s l'intro *\/\r\n      font-family: Arial, sans-serif;\r\n    }\r\n\r\n    \/* ========= BLEND ROOT =========\r\n       On regroupe slider + Rive intro + Rive outro dans le m\u00eame\r\n       contexte pour que mix-blend fonctionne. *\/\r\n    .blend-root{\r\n      position: fixed;      \/* plein \u00e9cran *\/\r\n      inset: 0;\r\n      isolation: isolate;   \/* cl\u00e9 pour le blend *\/\r\n      pointer-events: none; \/* le clic global est g\u00e9r\u00e9 par le JS *\/\r\n      z-index: 0;\r\n    }\r\n    .blend-root .intro-slider,\r\n    .blend-root #rive-overlay,\r\n    .blend-root #outro-layer{\r\n      position: absolute;\r\n      inset: 0;\r\n    }\r\n    \/* ordre des couches dans le groupe *\/\r\n    .blend-root .intro-slider { z-index: 1; }\r\n    .blend-root #rive-overlay { z-index: 2; }\r\n    .blend-root #outro-layer  { z-index: 3; }\r\n\r\n    \/* ========= SLIDER ========= *\/\r\n    .intro-slider {\r\n      width: 100%; height: 100%;\r\n      overflow: hidden;\r\n    }\r\n    .slide-bg {\r\n      position: absolute; inset: 0;\r\n      background-size: cover; background-position: center;\r\n      opacity: 0; transition: opacity 1.5s ease-in-out;\r\n    }\r\n    .slide-bg.active { opacity: 1; }\r\n\r\n    \/* ========= RIVE INTRO ========= *\/\r\n    #rive-overlay { background: transparent; }\r\n    #riveCanvas {\r\n      width: 100%; height: 100%;\r\n      display: block; background: transparent !important;\r\n      \/* \u279c blend + inversion pour rendre visible sur fond sombre *\/\r\n      mix-blend-mode: difference;\r\n      filter: invert(1) brightness(1.06) contrast(1.04);\r\n      will-change: opacity, transform;\r\n    }\r\n\r\n    \/* ========= RIVE OUTRO ========= *\/\r\n    #outro-layer { display: none; background: transparent; }\r\n    #outroCanvas {\r\n      width: 100vw; height: 100vh;\r\n      display: block; background: transparent !important;\r\n      mix-blend-mode: difference;\r\n      filter: invert(1) brightness(1.06) contrast(1.04);\r\n      will-change: opacity, transform;\r\n    }\r\n  <\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n  <!-- \u2705 UN SEUL wrapper qui contient TOUT (slider + 2 Rive) -->\r\n  <div class=\"blend-root\">\r\n    <!-- SLIDER -->\r\n    <div class=\"intro-slider\" id=\"sliderRoot\">\r\n      <div class=\"slide-bg active\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-6.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-5.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-4.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-1-1.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-3.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-2.avif');\"><\/div>\r\n      <div class=\"slide-bg\" style=\"background-image:url('https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/06\/hero-1.avif');\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- RIVE INTRO -->\r\n    <div id=\"rive-overlay\"><canvas id=\"riveCanvas\"><\/canvas><\/div>\r\n\r\n    <!-- RIVE OUTRO -->\r\n    <div id=\"outro-layer\"><canvas id=\"outroCanvas\"><\/canvas><\/div>\r\n  <\/div>\r\n\r\n  <!-- Rive runtime -->\r\n  <script src=\"https:\/\/unpkg.com\/@rive-app\/canvas@2.9.1\"><\/script>\r\n\r\n  <script>\r\n    \/* ========= PARAMS ========= *\/\r\n    const TARGET_URL          = '\/projets\/'; \/\/ \u2190 remplace si besoin\r\n    const INTRO_SRC           = 'https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/10\/coray_vallat-final.riv';\r\n    const OUTRO_SRC           = 'https:\/\/www.coray-vallat.ch\/wp-content\/uploads\/2025\/10\/coray_vallat-outro_FINAL2.riv';\r\n    const INTRO_DURATION_MS   = 3000;  \/\/ \u2190 mets la vraie dur\u00e9e si \u2260 3000ms\r\n    const OUTRO_DURATION_MS   = 1500;  \/\/ \u2190 ta dur\u00e9e de sortie\r\n    const FAILSAFE_RELEASE_MS = 4000;  \/\/ s\u00e9curit\u00e9\r\n\r\n    \/* ========= SLIDER ========= *\/\r\n    (function(){\r\n      const slides = document.querySelectorAll('.slide-bg');\r\n      let i = 0;\r\n      setInterval(() => {\r\n        slides[i].classList.remove('active');\r\n        i = (i + 1) % slides.length;\r\n        slides[i].classList.add('active');\r\n      }, 4000);\r\n    })();\r\n\r\n    \/* ========= INTRO RIVE ========= *\/\r\n    document.addEventListener('DOMContentLoaded', function () {\r\n      const canvasIntro = document.getElementById('riveCanvas');\r\n\r\n      function resizeIntro(r){\r\n        const dpr = Math.min(window.devicePixelRatio || 1, 2);\r\n        const rect = canvasIntro.getBoundingClientRect();\r\n        canvasIntro.width  = Math.round(rect.width  * dpr);\r\n        canvasIntro.height = Math.round(rect.height * dpr);\r\n        if (r) r.resizeDrawingSurfaceToCanvas();\r\n      }\r\n\r\n      const intro = new rive.Rive({\r\n        src: INTRO_SRC,\r\n        canvas: canvasIntro,\r\n        autoplay: false,\r\n        fit: rive.Fit.COVER,\r\n        alignment: rive.Alignment.CENTER,\r\n        onLoad: () => {\r\n          resizeIntro(intro);\r\n          try {\r\n            const anims = intro.animationNames || [];\r\n            if (anims.length) intro.play(anims[0]); else intro.play();\r\n          } catch {}\r\n\r\n          \/\/ Event Rive optionnel\r\n          if (typeof intro.on === 'function') {\r\n            intro.on('event', (e) => {\r\n              if (e?.data?.name === 'intro_done') {\r\n                try { intro.stop(); } catch {}\r\n                armGlobalClickOutroThenGo();\r\n              }\r\n            });\r\n          }\r\n          \/\/ Fallback temporel\r\n          setTimeout(() => { try { intro.stop(); } catch {} armGlobalClickOutroThenGo(); }, INTRO_DURATION_MS);\r\n        }\r\n      });\r\n\r\n      window.addEventListener('resize', () => resizeIntro(intro));\r\n    });\r\n\r\n    \/* ========= OUTRO : clic partout \u2192 joue 'Outro' \u2192 redirige ========= *\/\r\n    let outro = null, outroLoaded = false, failTimer = null;\r\n\r\n    function armGlobalClickOutroThenGo(){\r\n      \/\/ lib\u00e8re le scroll une fois l\u2019intro termin\u00e9e\r\n      document.documentElement.style.overflow = 'auto';\r\n      document.body.style.overflow = 'auto';\r\n\r\n      const introOverlay = document.getElementById('rive-overlay');   \/\/ sera masqu\u00e9 au d\u00e9marrage de l\u2019outro\r\n      const layer        = document.getElementById('outro-layer');\r\n      const canvasOutro  = document.getElementById('outroCanvas');\r\n\r\n      function resizeOutro(r){\r\n        const dpr = Math.min(window.devicePixelRatio || 1, 2);\r\n        const rect = canvasOutro.getBoundingClientRect();\r\n        canvasOutro.width  = Math.round(rect.width  * dpr);\r\n        canvasOutro.height = Math.round(rect.height * dpr);\r\n        if (r) r.resizeDrawingSurfaceToCanvas();\r\n      }\r\n\r\n      \/\/ Pr\u00e9charge l\u2019outro\r\n      if (!outro) {\r\n        outro = new rive.Rive({\r\n          src: OUTRO_SRC,\r\n          canvas: canvasOutro,\r\n          autoplay: false,\r\n          fit: rive.Fit.COVER,                \/\/ passe \u00e0 CONTAIN si besoin\r\n          alignment: rive.Alignment.CENTER,\r\n          onLoad: () => { outroLoaded = true; resizeOutro(outro); },\r\n          onError: (e) => console.error('Rive outro load error:', e)\r\n        });\r\n      }\r\n\r\n      function playAndGo(){\r\n        \/\/ masque l\u2019intro\r\n        if (introOverlay) introOverlay.style.display = 'none';\r\n        \/\/ affiche l\u2019outro\r\n        layer.style.display = 'block';\r\n        resizeOutro(outro);\r\n\r\n        \/\/ joue explicitement l\u2019animation \"Outro\"\r\n        try {\r\n          outro.play('Outro');\r\n          if (typeof outro.startRendering === 'function') outro.startRendering();\r\n        } catch (e) {\r\n          console.warn('outro.play(\"Outro\") a \u00e9chou\u00e9, on tente play()', e);\r\n          try { outro.play(); } catch {}\r\n        }\r\n\r\n        \/\/ redirection apr\u00e8s la dur\u00e9e + failsafe\r\n        const go = () => {\r\n          layer.style.display = 'none';\r\n          window.location.href = TARGET_URL;\r\n        };\r\n        setTimeout(go, OUTRO_DURATION_MS);\r\n        failTimer = setTimeout(go, FAILSAFE_RELEASE_MS);\r\n      }\r\n\r\n      function onAnyClick(e){\r\n        e.preventDefault();\r\n        e.stopPropagation();\r\n        document.removeEventListener('click', onAnyClick, true); \/\/ un seul clic\r\n\r\n        if (outroLoaded) {\r\n          playAndGo();\r\n        } else {\r\n          setTimeout(playAndGo, 120);\r\n        }\r\n      }\r\n\r\n      function onResize(){ if (outroLoaded) resizeOutro(outro); }\r\n\r\n      document.addEventListener('click', onAnyClick, true); \/\/ clic n\u2019importe o\u00f9\r\n      window.addEventListener('resize', onResize);\r\n    }\r\n  <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fe1cb31 elementor-widget elementor-widget-html\" data-id=\"fe1cb31\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"outro-layer\"><canvas id=\"outroCanvas\"><\/canvas><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6c52afc elementor-widget elementor-widget-html\" data-id=\"6c52afc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 style=\"position:absolute; left:-9999px; top:-9999px;\">Coray-Vallat, bureau d'architecture Jura et Neuch\u00e2tel<\/h1>\n\n<!-- Curseur type \"verre givr\u00e9\" avec interactions -->\n<div class=\"custom-cursor\">\n  <div class=\"cursor-halo\"><\/div>\n  <div class=\"cursor-core\"><\/div>\n<\/div>\n\n<script>\n  const cursor = document.querySelector('.custom-cursor');\n  document.addEventListener('mousemove', e => {\n    cursor.style.left = `${e.clientX}px`;\n    cursor.style.top = `${e.clientY}px`;\n  });\n  document.addEventListener('mouseover', e => {\n    if (e.target.closest('a, button, .clickable')) {\n      cursor.classList.add('cursor-hover');\n    } else {\n      cursor.classList.remove('cursor-hover');\n    }\n  });\n<\/script>\n\n<style>\n\/* MASQUER le curseur syst\u00e8me *\/\nbody, a, button {\n  cursor: none !important;\n}\n\n\/* SUPPRIMER l'ancien curseur croix s\u2019il existe *\/\n.cursor,\n.cursor-inner,\n.cursor-outer {\n  display: none !important;\n}\n\n\/* Conteneur du curseur personnalis\u00e9 *\/\n.custom-cursor {\n  position: fixed;\n  width: 60px;\n  height: 60px;\n  pointer-events: none;\n  transform: translate(-50%, -50%);\n  z-index: 999999;\n}\n\n\/* Halo style verre flout\u00e9, diam\u00e8tre r\u00e9duit *\/\n.cursor-halo {\n  position: absolute;\n  top: 50%; left: 50%;\n  width: 40px; height: 40px;\n  border-radius: 50%;\n  background-color: rgba(255, 255, 255, 0.06);\n  backdrop-filter: blur(20px);\n  -webkit-backdrop-filter: blur(20px);\n  transform: translate(-50%, -50%);\n  z-index: 1;\n  transition: width 0.2s ease, height 0.2s ease;\n}\n\n\/* Point noir central plus visible *\/\n.cursor-core {\n  position: absolute;\n  top: 50%; left: 50%;\n  width: 8px; height: 8px;\n  background-color: black;\n  border-radius: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 2;\n  transition: width 0.2s ease, height 0.2s ease;\n}\n<\/style>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-90df7b3 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"90df7b3\" 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-99eb906 elementor-widget elementor-widget-html\" data-id=\"99eb906\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Curseur type \"verre givr\u00e9\" avec interactions -->\r\n<div class=\"custom-cursor\">\r\n  <div class=\"cursor-halo\"><\/div>\r\n  <div class=\"cursor-core\"><\/div>\r\n<\/div>\r\n\r\n<script>\r\n  const cursor = document.querySelector('.custom-cursor');\r\n  document.addEventListener('mousemove', e => {\r\n    cursor.style.left = `${e.clientX}px`;\r\n    cursor.style.top = `${e.clientY}px`;\r\n  });\r\n  document.addEventListener('mouseover', e => {\r\n    if (e.target.closest('a, button, .clickable')) {\r\n      cursor.classList.add('cursor-hover');\r\n    } else {\r\n      cursor.classList.remove('cursor-hover');\r\n    }\r\n  });\r\n<\/script>\r\n\r\n<style>\r\n\/* MASQUER le curseur syst\u00e8me *\/\r\nbody, a, button {\r\n  cursor: none !important;\r\n}\r\n\r\n\/* SUPPRIMER l'ancien curseur croix s\u2019il existe *\/\r\n.cursor,\r\n.cursor-inner,\r\n.cursor-outer {\r\n  display: none !important;\r\n}\r\n\r\n\/* Conteneur du curseur personnalis\u00e9 *\/\r\n.custom-cursor {\r\n  position: fixed;\r\n  width: 50px;\r\n  height: 50px;\r\n  pointer-events: none;\r\n  transform: translate(-50%, -50%);\r\n  z-index: 999999;\r\n}\r\n\r\n\/* Halo style verre flout\u00e9, diam\u00e8tre r\u00e9duit *\/\r\n.cursor-halo {\r\n  position: absolute;\r\n  top: 50%; left: 50%;\r\n  width: 20px; height: 20px;\r\n  border-radius: 50%;\r\n  background-color: rgba(255, 255, 255, 0.06);\r\n  backdrop-filter: blur(20px);\r\n  -webkit-backdrop-filter: blur(20px);\r\n  transform: translate(-50%, -50%);\r\n  z-index: 1;\r\n  transition: width 0.2s ease, height 0.2s ease;\r\n}\r\n\r\n\/* Point noir central plus visible *\/\r\n.cursor-core {\r\n  position: absolute;\r\n  top: 50%; left: 50%;\r\n  width: 8px; height: 8px;\r\n  background-color: black;\r\n  border-radius: 50%;\r\n  transform: translate(-50%, -50%);\r\n  z-index: 2;\r\n  transition: width 0.2s ease, height 0.2s ease;\r\n}\r\n\r\n\/* Au survol d\u2019un \u00e9l\u00e9ment cliquable *\/\r\n.custom-cursor.cursor-hover .cursor-halo {\r\n  width: 45px;\r\n  height: 45px;\r\n}\r\n.custom-cursor.cursor-hover .cursor-core {\r\n  width: 10px;\r\n  height: 10px;\r\n}\r\n\r\n\/* Cacher le curseur sur tablette\/mobile *\/\r\n@media (max-width: 1024px) {\r\n  .custom-cursor {\r\n    display: none;\r\n  }\r\n}\r\n<\/style>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Coray-Vallat, Architekturb\u00fcro Jura und Neuch\u00e2tel<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2928","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/pages\/2928","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/comments?post=2928"}],"version-history":[{"count":55,"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/pages\/2928\/revisions"}],"predecessor-version":[{"id":4593,"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/pages\/2928\/revisions\/4593"}],"wp:attachment":[{"href":"https:\/\/www.coray-vallat.ch\/de\/wp-json\/wp\/v2\/media?parent=2928"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}