ECLORE \u2014 Opening Soon<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Montserrat:wght@200;300;400&display=swap\" rel=\"stylesheet\"\/>\n <style>\n *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n\n :root {\n --cream: #f5f0e8;\n --sand: #e8dfd0;\n --gold: #b8956a;\n --gold-light: #d4b483;\n --deep: #1a1410;\n --brown: #3d2b1f;\n --muted: #8a7560;\n }\n\n html, body {\n height: 100%;\n overflow: hidden;\n }\n\n body {\n background: var(--deep);\n font-family: 'Montserrat', sans-serif;\n color: var(--cream);\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n cursor: none;\n }\n\n \/* Custom cursor *\/\n .cursor {\n position: fixed;\n width: 8px;\n height: 8px;\n background: var(--gold);\n border-radius: 50%;\n pointer-events: none;\n z-index: 9999;\n transform: translate(-50%, -50%);\n transition: transform 0.1s ease;\n }\n .cursor-ring {\n position: fixed;\n width: 36px;\n height: 36px;\n border: 1px solid rgba(184,149,106,0.4);\n border-radius: 50%;\n pointer-events: none;\n z-index: 9998;\n transform: translate(-50%, -50%);\n transition: all 0.18s ease;\n }\n\n \/* Background texture *\/\n .bg-texture {\n position: fixed;\n inset: 0;\n background:\n radial-gradient(ellipse 80% 60% at 20% 80%, rgba(184,149,106,0.07) 0%, transparent 60%),\n radial-gradient(ellipse 60% 80% at 80% 20%, rgba(184,149,106,0.05) 0%, transparent 50%),\n radial-gradient(ellipse 100% 100% at 50% 50%, #1a1410 0%, #0d0a07 100%);\n z-index: 0;\n }\n\n \/* Grain overlay *\/\n .grain {\n position: fixed;\n inset: -50%;\n width: 200%;\n height: 200%;\n background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'\/%3E%3C\/svg%3E\");\n opacity: 0.4;\n pointer-events: none;\n z-index: 1;\n animation: grain-move 8s steps(2) infinite;\n }\n @keyframes grain-move {\n 0%,100% { transform: translate(0,0); }\n 20% { transform: translate(-2%,-3%); }\n 40% { transform: translate(3%,2%); }\n 60% { transform: translate(-1%,3%); }\n 80% { transform: translate(2%,-1%); }\n }\n\n \/* Decorative lines *\/\n .line-h {\n position: fixed;\n left: 0; right: 0;\n height: 1px;\n background: linear-gradient(90deg, transparent, rgba(184,149,106,0.2), transparent);\n z-index: 2;\n }\n .line-h.top { top: 60px; }\n .line-h.bottom { bottom: 60px; }\n .line-v {\n position: fixed;\n top: 0; bottom: 0;\n width: 1px;\n background: linear-gradient(180deg, transparent, rgba(184,149,106,0.2), transparent);\n z-index: 2;\n }\n .line-v.left { left: 60px; }\n .line-v.right { right: 60px; }\n\n \/* Corner marks *\/\n .corner {\n position: fixed;\n width: 20px;\n height: 20px;\n z-index: 3;\n opacity: 0;\n animation: fade-in 1.2s ease 0.8s forwards;\n }\n .corner::before, .corner::after {\n content: '';\n position: absolute;\n background: var(--gold);\n opacity: 0.5;\n }\n .corner::before { width: 100%; height: 1px; top: 0; left: 0; }\n .corner::after { width: 1px; height: 100%; top: 0; left: 0; }\n .corner.tl { top: 52px; left: 52px; }\n .corner.tr { top: 52px; right: 52px; transform: scaleX(-1); }\n .corner.bl { bottom: 52px; left: 52px; transform: scaleY(-1); }\n .corner.br { bottom: 52px; right: 52px; transform: scale(-1); }\n\n \/* Main container *\/\n .container {\n position: relative;\n z-index: 10;\n text-align: center;\n padding: 60px 40px;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0;\n }\n\n \/* Top label *\/\n .label-top {\n font-family: 'Montserrat', sans-serif;\n font-size: 9px;\n font-weight: 300;\n letter-spacing: 0.5em;\n color: var(--gold);\n text-transform: uppercase;\n opacity: 0;\n animation: slide-down 1s ease 0.3s forwards;\n margin-bottom: 48px;\n }\n\n \/* Decorative divider *\/\n .divider {\n display: flex;\n align-items: center;\n gap: 16px;\n opacity: 0;\n animation: fade-in 1s ease 0.6s forwards;\n margin-bottom: 36px;\n }\n .divider-line {\n width: 60px;\n height: 1px;\n background: linear-gradient(90deg, transparent, var(--gold));\n }\n .divider-line.right { background: linear-gradient(90deg, var(--gold), transparent); }\n .divider-diamond {\n width: 5px;\n height: 5px;\n background: var(--gold);\n transform: rotate(45deg);\n }\n\n \/* Main title *\/\n .title {\n font-family: 'Cormorant Garamond', serif;\n font-size: clamp(72px, 12vw, 140px);\n font-weight: 300;\n line-height: 0.9;\n letter-spacing: 0.12em;\n color: var(--cream);\n opacity: 0;\n animation: title-reveal 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.5s forwards;\n position: relative;\n margin-bottom: 12px;\n }\n .title span {\n display: block;\n background: linear-gradient(135deg, var(--cream) 0%, var(--gold-light) 50%, var(--cream) 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n @keyframes title-reveal {\n from { opacity: 0; transform: translateY(30px) skewY(2deg); filter: blur(8px); }\n to { opacity: 1; transform: translateY(0) skewY(0); filter: blur(0); }\n }\n\n \/* Subtitle *\/\n .subtitle {\n font-family: 'Cormorant Garamond', serif;\n font-size: clamp(13px, 2vw, 17px);\n font-weight: 300;\n font-style: italic;\n letter-spacing: 0.3em;\n color: var(--muted);\n opacity: 0;\n animation: slide-up 1s ease 1s forwards;\n margin-bottom: 60px;\n margin-top: 8px;\n }\n\n \/* Opening soon badge *\/\n .badge {\n display: inline-flex;\n align-items: center;\n gap: 14px;\n border: 1px solid rgba(184,149,106,0.3);\n padding: 14px 32px;\n opacity: 0;\n animation: fade-in 1s ease 1.3s forwards;\n position: relative;\n margin-bottom: 64px;\n background: rgba(184,149,106,0.04);\n }\n .badge::before, .badge::after {\n content: '';\n position: absolute;\n width: 6px;\n height: 6px;\n border: 1px solid var(--gold);\n opacity: 0.6;\n }\n .badge::before { top: -3px; left: -3px; border-right: none; border-bottom: none; }\n .badge::after { bottom: -3px; right: -3px; border-left: none; border-top: none; }\n .badge-dot {\n width: 4px;\n height: 4px;\n background: var(--gold);\n border-radius: 50%;\n animation: pulse 2s ease infinite;\n }\n @keyframes pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.4; transform: scale(0.6); }\n }\n .badge-text {\n font-size: 9px;\n font-weight: 300;\n letter-spacing: 0.5em;\n text-transform: uppercase;\n color: var(--gold-light);\n }\n\n \/* Email form *\/\n .notify-section {\n opacity: 0;\n animation: slide-up 1s ease 1.6s forwards;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n }\n .notify-label {\n font-size: 8px;\n font-weight: 300;\n letter-spacing: 0.45em;\n text-transform: uppercase;\n color: var(--muted);\n }\n .notify-form {\n display: flex;\n gap: 0;\n border: 1px solid rgba(184,149,106,0.25);\n overflow: hidden;\n }\n .notify-input {\n background: transparent;\n border: none;\n outline: none;\n padding: 14px 24px;\n font-family: 'Montserrat', sans-serif;\n font-size: 10px;\n font-weight: 300;\n letter-spacing: 0.2em;\n color: var(--cream);\n width: 240px;\n }\n .notify-input::placeholder { color: rgba(138,117,96,0.6); }\n .notify-btn {\n background: rgba(184,149,106,0.15);\n border: none;\n border-left: 1px solid rgba(184,149,106,0.25);\n padding: 14px 24px;\n font-family: 'Montserrat', sans-serif;\n font-size: 8px;\n font-weight: 400;\n letter-spacing: 0.4em;\n text-transform: uppercase;\n color: var(--gold-light);\n cursor: none;\n transition: background 0.3s ease, color 0.3s ease;\n }\n .notify-btn:hover {\n background: rgba(184,149,106,0.25);\n color: var(--cream);\n }\n\n \/* Bottom label *\/\n .label-bottom {\n position: fixed;\n bottom: 30px;\n left: 50%;\n transform: translateX(-50%);\n font-size: 8px;\n font-weight: 300;\n letter-spacing: 0.4em;\n text-transform: uppercase;\n color: rgba(138,117,96,0.4);\n z-index: 10;\n opacity: 0;\n animation: fade-in 1s ease 2s forwards;\n white-space: nowrap;\n }\n\n \/* Floating particles *\/\n .particles {\n position: fixed;\n inset: 0;\n z-index: 2;\n pointer-events: none;\n overflow: hidden;\n }\n .particle {\n position: absolute;\n width: 1px;\n height: 1px;\n background: var(--gold);\n border-radius: 50%;\n animation: float-up linear infinite;\n opacity: 0;\n }\n\n @keyframes float-up {\n 0% { transform: translateY(100vh) translateX(0); opacity: 0; }\n 10% { opacity: 0.6; }\n 90% { opacity: 0.2; }\n 100% { transform: translateY(-10vh) translateX(20px); opacity: 0; }\n }\n\n \/* Animations *\/\n @keyframes fade-in {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n @keyframes slide-down {\n from { opacity: 0; transform: translateY(-16px); }\n to { opacity: 1; transform: translateY(0); }\n }\n @keyframes slide-up {\n from { opacity: 0; transform: translateY(16px); }\n to { opacity: 1; transform: translateY(0); }\n }\n\n \/* Thank you message *\/\n .thanks {\n display: none;\n font-family: 'Cormorant Garamond', serif;\n font-style: italic;\n font-size: 15px;\n letter-spacing: 0.2em;\n color: var(--gold-light);\n animation: fade-in 0.6s ease forwards;\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"cursor\" id=\"cursor\"><\/div>\n <div class=\"cursor-ring\" id=\"cursor-ring\"><\/div>\n\n <div class=\"bg-texture\"><\/div>\n <div class=\"grain\"><\/div>\n\n <div class=\"line-h top\"><\/div>\n <div class=\"line-h bottom\"><\/div>\n <div class=\"line-v left\"><\/div>\n <div class=\"line-v right\"><\/div>\n\n <div class=\"corner tl\"><\/div>\n <div class=\"corner tr\"><\/div>\n <div class=\"corner bl\"><\/div>\n <div class=\"corner br\"><\/div>\n\n \n <div class=\"particles\" id=\"particles\"><\/div>\n\n <div class=\"container\">\n <p class=\"label-top\">Bienvenue \u00b7 Welcome \u00b7 \u0645\u0631\u062d\u0628\u0627\u064b<\/p>\n\n <div class=\"divider\">\n <div class=\"divider-line\"><\/div>\n <div class=\"divider-diamond\"><\/div>\n <div class=\"divider-line right\"><\/div>\n <\/div>\n\n <h1 class=\"title\"><span>ECLORE<\/span><\/h1>\n <p class=\"subtitle\">opening soon<\/p>\n\n <div class=\"badge\">\n <div class=\"badge-dot\"><\/div>\n <span class=\"badge-text\">Something beautiful is coming<\/span>\n <div class=\"badge-dot\"><\/div>\n <\/div>\n\n <div class=\"notify-section\">\n <p class=\"notify-label\">Be the first to know<\/p>\n <div class=\"notify-form\">\n <input class=\"notify-input\" type=\"email\" placeholder=\"your@email.com\" id=\"email-input\"\/>\n <button class=\"notify-btn\" onclick=\"handleNotify()\">Notify me<\/button>\n <\/div>\n <p class=\"thanks\" id=\"thanks-msg\">Thank you \u2014 we’ll be in touch \u2726<\/p>\n <\/div>\n <\/div>\n\n <p class=\"label-bottom\">\u00a9 2025 ECLORE \u00b7 All rights reserved<\/p>\n\n <script>\n \/\/ Custom cursor\n const cursor = document.getElementById('cursor');\n const ring = document.getElementById('cursor-ring');\n let mx = 0, my = 0, rx = 0, ry = 0;\n\n document.addEventListener('mousemove', e => {\n mx = e.clientX; my = e.clientY;\n cursor.style.left = mx + 'px';\n cursor.style.top = my + 'px';\n });\n\n function animateRing() {\n rx += (mx - rx) * 0.12;\n ry += (my - ry) * 0.12;\n ring.style.left = rx + 'px';\n ring.style.top = ry + 'px';\n requestAnimationFrame(animateRing);\n }\n animateRing();\n\n document.querySelectorAll('button, input').forEach(el => {\n el.addEventListener('mouseenter', () => {\n cursor.style.transform = 'translate(-50%,-50%) scale(2)';\n ring.style.transform = 'translate(-50%,-50%) scale(1.5)';\n ring.style.borderColor = 'rgba(184,149,106,0.7)';\n });\n el.addEventListener('mouseleave', () => {\n cursor.style.transform = 'translate(-50%,-50%) scale(1)';\n ring.style.transform = 'translate(-50%,-50%) scale(1)';\n ring.style.borderColor = 'rgba(184,149,106,0.4)';\n });\n });\n\n \/\/ Particles\n const container = document.getElementById('particles');\n for (let i = 0; i < 18; i++) {\n const p = document.createElement('div');\n p.className = 'particle';\n p.style.left = Math.random() * 100 + '%';\n p.style.animationDuration = (12 + Math.random() * 20) + 's';\n p.style.animationDelay = (Math.random() * 15) + 's';\n p.style.width = p.style.height = (Math.random() > 0.7 ? '2px' : '1px');\n container.appendChild(p);\n }\n\n \/\/ Notify form\n function handleNotify() {\n const input = document.getElementById('email-input');\n const thanks = document.getElementById('thanks-msg');\n if (input.value && input.value.includes('@')) {\n input.parentElement.style.display = 'none';\n thanks.style.display = 'block';\n } else {\n input.style.borderBottom = '1px solid rgba(184,149,106,0.5)';\n input.focus();\n }\n }\n\n document.getElementById('email-input').addEventListener('keydown', e => {\n if (e.key === 'Enter') handleNotify();\n });\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>ECLORE \u2014 Opening Soon Bienvenue \u00b7 Welcome \u00b7 \u0645\u0631\u062d\u0628\u0627\u064b ECLORE opening soon Something beautiful is coming Be the first to know Notify me Thank you \u2014 we’ll be in touch \u2726 \u00a9 2025 ECLORE \u00b7 All rights reserved<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":2,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":9,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/9"}],"wp:attachment":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":7,"date":"2026-05-06T15:36:11","date_gmt":"2026-05-06T15:36:11","guid":{"rendered":"https:\/\/eclorelabs.com\/?page_id=7"},"modified":"2026-05-06T15:37:35","modified_gmt":"2026-05-06T15:37:35","slug":"7-2","status":"publish","type":"page","link":"https:\/\/eclorelabs.com\/","title":{"rendered":"ComingSoon"},"content":{"rendered":"\n\n\n\n \n \n ECLORE \u2014 Opening Soon<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Montserrat:wght@200;300;400&display=swap\" rel=\"stylesheet\"\/>\n <style>\n *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n\n :root {\n --cream: #f5f0e8;\n --sand: #e8dfd0;\n --gold: #b8956a;\n --gold-light: #d4b483;\n --deep: #1a1410;\n --brown: #3d2b1f;\n --muted: #8a7560;\n }\n\n html, body {\n height: 100%;\n overflow: hidden;\n }\n\n body {\n background: var(--deep);\n font-family: 'Montserrat', sans-serif;\n color: var(--cream);\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n cursor: none;\n }\n\n \/* Custom cursor *\/\n .cursor {\n position: fixed;\n width: 8px;\n height: 8px;\n background: var(--gold);\n border-radius: 50%;\n pointer-events: none;\n z-index: 9999;\n transform: translate(-50%, -50%);\n transition: transform 0.1s ease;\n }\n .cursor-ring {\n position: fixed;\n width: 36px;\n height: 36px;\n border: 1px solid rgba(184,149,106,0.4);\n border-radius: 50%;\n pointer-events: none;\n z-index: 9998;\n transform: translate(-50%, -50%);\n transition: all 0.18s ease;\n }\n\n \/* Background texture *\/\n .bg-texture {\n position: fixed;\n inset: 0;\n background:\n radial-gradient(ellipse 80% 60% at 20% 80%, rgba(184,149,106,0.07) 0%, transparent 60%),\n radial-gradient(ellipse 60% 80% at 80% 20%, rgba(184,149,106,0.05) 0%, transparent 50%),\n radial-gradient(ellipse 100% 100% at 50% 50%, #1a1410 0%, #0d0a07 100%);\n z-index: 0;\n }\n\n \/* Grain overlay *\/\n .grain {\n position: fixed;\n inset: -50%;\n width: 200%;\n height: 200%;\n background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'\/%3E%3C\/svg%3E\");\n opacity: 0.4;\n pointer-events: none;\n z-index: 1;\n animation: grain-move 8s steps(2) infinite;\n }\n @keyframes grain-move {\n 0%,100% { transform: translate(0,0); }\n 20% { transform: translate(-2%,-3%); }\n 40% { transform: translate(3%,2%); }\n 60% { transform: translate(-1%,3%); }\n 80% { transform: translate(2%,-1%); }\n }\n\n \/* Decorative lines *\/\n .line-h {\n position: fixed;\n left: 0; right: 0;\n height: 1px;\n background: linear-gradient(90deg, transparent, rgba(184,149,106,0.2), transparent);\n z-index: 2;\n }\n .line-h.top { top: 60px; }\n .line-h.bottom { bottom: 60px; }\n .line-v {\n position: fixed;\n top: 0; bottom: 0;\n width: 1px;\n background: linear-gradient(180deg, transparent, rgba(184,149,106,0.2), transparent);\n z-index: 2;\n }\n .line-v.left { left: 60px; }\n .line-v.right { right: 60px; }\n\n \/* Corner marks *\/\n .corner {\n position: fixed;\n width: 20px;\n height: 20px;\n z-index: 3;\n opacity: 0;\n animation: fade-in 1.2s ease 0.8s forwards;\n }\n .corner::before, .corner::after {\n content: '';\n position: absolute;\n background: var(--gold);\n opacity: 0.5;\n }\n .corner::before { width: 100%; height: 1px; top: 0; left: 0; }\n .corner::after { width: 1px; height: 100%; top: 0; left: 0; }\n .corner.tl { top: 52px; left: 52px; }\n .corner.tr { top: 52px; right: 52px; transform: scaleX(-1); }\n .corner.bl { bottom: 52px; left: 52px; transform: scaleY(-1); }\n .corner.br { bottom: 52px; right: 52px; transform: scale(-1); }\n\n \/* Main container *\/\n .container {\n position: relative;\n z-index: 10;\n text-align: center;\n padding: 60px 40px;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0;\n }\n\n \/* Top label *\/\n .label-top {\n font-family: 'Montserrat', sans-serif;\n font-size: 9px;\n font-weight: 300;\n letter-spacing: 0.5em;\n color: var(--gold);\n text-transform: uppercase;\n opacity: 0;\n animation: slide-down 1s ease 0.3s forwards;\n margin-bottom: 48px;\n }\n\n \/* Decorative divider *\/\n .divider {\n display: flex;\n align-items: center;\n gap: 16px;\n opacity: 0;\n animation: fade-in 1s ease 0.6s forwards;\n margin-bottom: 36px;\n }\n .divider-line {\n width: 60px;\n height: 1px;\n background: linear-gradient(90deg, transparent, var(--gold));\n }\n .divider-line.right { background: linear-gradient(90deg, var(--gold), transparent); }\n .divider-diamond {\n width: 5px;\n height: 5px;\n background: var(--gold);\n transform: rotate(45deg);\n }\n\n \/* Main title *\/\n .title {\n font-family: 'Cormorant Garamond', serif;\n font-size: clamp(72px, 12vw, 140px);\n font-weight: 300;\n line-height: 0.9;\n letter-spacing: 0.12em;\n color: var(--cream);\n opacity: 0;\n animation: title-reveal 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.5s forwards;\n position: relative;\n margin-bottom: 12px;\n }\n .title span {\n display: block;\n background: linear-gradient(135deg, var(--cream) 0%, var(--gold-light) 50%, var(--cream) 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n @keyframes title-reveal {\n from { opacity: 0; transform: translateY(30px) skewY(2deg); filter: blur(8px); }\n to { opacity: 1; transform: translateY(0) skewY(0); filter: blur(0); }\n }\n\n \/* Subtitle *\/\n .subtitle {\n font-family: 'Cormorant Garamond', serif;\n font-size: clamp(13px, 2vw, 17px);\n font-weight: 300;\n font-style: italic;\n letter-spacing: 0.3em;\n color: var(--muted);\n opacity: 0;\n animation: slide-up 1s ease 1s forwards;\n margin-bottom: 60px;\n margin-top: 8px;\n }\n\n \/* Opening soon badge *\/\n .badge {\n display: inline-flex;\n align-items: center;\n gap: 14px;\n border: 1px solid rgba(184,149,106,0.3);\n padding: 14px 32px;\n opacity: 0;\n animation: fade-in 1s ease 1.3s forwards;\n position: relative;\n margin-bottom: 64px;\n background: rgba(184,149,106,0.04);\n }\n .badge::before, .badge::after {\n content: '';\n position: absolute;\n width: 6px;\n height: 6px;\n border: 1px solid var(--gold);\n opacity: 0.6;\n }\n .badge::before { top: -3px; left: -3px; border-right: none; border-bottom: none; }\n .badge::after { bottom: -3px; right: -3px; border-left: none; border-top: none; }\n .badge-dot {\n width: 4px;\n height: 4px;\n background: var(--gold);\n border-radius: 50%;\n animation: pulse 2s ease infinite;\n }\n @keyframes pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.4; transform: scale(0.6); }\n }\n .badge-text {\n font-size: 9px;\n font-weight: 300;\n letter-spacing: 0.5em;\n text-transform: uppercase;\n color: var(--gold-light);\n }\n\n \/* Email form *\/\n .notify-section {\n opacity: 0;\n animation: slide-up 1s ease 1.6s forwards;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n }\n .notify-label {\n font-size: 8px;\n font-weight: 300;\n letter-spacing: 0.45em;\n text-transform: uppercase;\n color: var(--muted);\n }\n .notify-form {\n display: flex;\n gap: 0;\n border: 1px solid rgba(184,149,106,0.25);\n overflow: hidden;\n }\n .notify-input {\n background: transparent;\n border: none;\n outline: none;\n padding: 14px 24px;\n font-family: 'Montserrat', sans-serif;\n font-size: 10px;\n font-weight: 300;\n letter-spacing: 0.2em;\n color: var(--cream);\n width: 240px;\n }\n .notify-input::placeholder { color: rgba(138,117,96,0.6); }\n .notify-btn {\n background: rgba(184,149,106,0.15);\n border: none;\n border-left: 1px solid rgba(184,149,106,0.25);\n padding: 14px 24px;\n font-family: 'Montserrat', sans-serif;\n font-size: 8px;\n font-weight: 400;\n letter-spacing: 0.4em;\n text-transform: uppercase;\n color: var(--gold-light);\n cursor: none;\n transition: background 0.3s ease, color 0.3s ease;\n }\n .notify-btn:hover {\n background: rgba(184,149,106,0.25);\n color: var(--cream);\n }\n\n \/* Bottom label *\/\n .label-bottom {\n position: fixed;\n bottom: 30px;\n left: 50%;\n transform: translateX(-50%);\n font-size: 8px;\n font-weight: 300;\n letter-spacing: 0.4em;\n text-transform: uppercase;\n color: rgba(138,117,96,0.4);\n z-index: 10;\n opacity: 0;\n animation: fade-in 1s ease 2s forwards;\n white-space: nowrap;\n }\n\n \/* Floating particles *\/\n .particles {\n position: fixed;\n inset: 0;\n z-index: 2;\n pointer-events: none;\n overflow: hidden;\n }\n .particle {\n position: absolute;\n width: 1px;\n height: 1px;\n background: var(--gold);\n border-radius: 50%;\n animation: float-up linear infinite;\n opacity: 0;\n }\n\n @keyframes float-up {\n 0% { transform: translateY(100vh) translateX(0); opacity: 0; }\n 10% { opacity: 0.6; }\n 90% { opacity: 0.2; }\n 100% { transform: translateY(-10vh) translateX(20px); opacity: 0; }\n }\n\n \/* Animations *\/\n @keyframes fade-in {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n @keyframes slide-down {\n from { opacity: 0; transform: translateY(-16px); }\n to { opacity: 1; transform: translateY(0); }\n }\n @keyframes slide-up {\n from { opacity: 0; transform: translateY(16px); }\n to { opacity: 1; transform: translateY(0); }\n }\n\n \/* Thank you message *\/\n .thanks {\n display: none;\n font-family: 'Cormorant Garamond', serif;\n font-style: italic;\n font-size: 15px;\n letter-spacing: 0.2em;\n color: var(--gold-light);\n animation: fade-in 0.6s ease forwards;\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"cursor\" id=\"cursor\"><\/div>\n <div class=\"cursor-ring\" id=\"cursor-ring\"><\/div>\n\n <div class=\"bg-texture\"><\/div>\n <div class=\"grain\"><\/div>\n\n <div class=\"line-h top\"><\/div>\n <div class=\"line-h bottom\"><\/div>\n <div class=\"line-v left\"><\/div>\n <div class=\"line-v right\"><\/div>\n\n <div class=\"corner tl\"><\/div>\n <div class=\"corner tr\"><\/div>\n <div class=\"corner bl\"><\/div>\n <div class=\"corner br\"><\/div>\n\n \n <div class=\"particles\" id=\"particles\"><\/div>\n\n <div class=\"container\">\n <p class=\"label-top\">Bienvenue \u00b7 Welcome \u00b7 \u0645\u0631\u062d\u0628\u0627\u064b<\/p>\n\n <div class=\"divider\">\n <div class=\"divider-line\"><\/div>\n <div class=\"divider-diamond\"><\/div>\n <div class=\"divider-line right\"><\/div>\n <\/div>\n\n <h1 class=\"title\"><span>ECLORE<\/span><\/h1>\n <p class=\"subtitle\">opening soon<\/p>\n\n <div class=\"badge\">\n <div class=\"badge-dot\"><\/div>\n <span class=\"badge-text\">Something beautiful is coming<\/span>\n <div class=\"badge-dot\"><\/div>\n <\/div>\n\n <div class=\"notify-section\">\n <p class=\"notify-label\">Be the first to know<\/p>\n <div class=\"notify-form\">\n <input class=\"notify-input\" type=\"email\" placeholder=\"your@email.com\" id=\"email-input\"\/>\n <button class=\"notify-btn\" onclick=\"handleNotify()\">Notify me<\/button>\n <\/div>\n <p class=\"thanks\" id=\"thanks-msg\">Thank you \u2014 we’ll be in touch \u2726<\/p>\n <\/div>\n <\/div>\n\n <p class=\"label-bottom\">\u00a9 2025 ECLORE \u00b7 All rights reserved<\/p>\n\n <script>\n \/\/ Custom cursor\n const cursor = document.getElementById('cursor');\n const ring = document.getElementById('cursor-ring');\n let mx = 0, my = 0, rx = 0, ry = 0;\n\n document.addEventListener('mousemove', e => {\n mx = e.clientX; my = e.clientY;\n cursor.style.left = mx + 'px';\n cursor.style.top = my + 'px';\n });\n\n function animateRing() {\n rx += (mx - rx) * 0.12;\n ry += (my - ry) * 0.12;\n ring.style.left = rx + 'px';\n ring.style.top = ry + 'px';\n requestAnimationFrame(animateRing);\n }\n animateRing();\n\n document.querySelectorAll('button, input').forEach(el => {\n el.addEventListener('mouseenter', () => {\n cursor.style.transform = 'translate(-50%,-50%) scale(2)';\n ring.style.transform = 'translate(-50%,-50%) scale(1.5)';\n ring.style.borderColor = 'rgba(184,149,106,0.7)';\n });\n el.addEventListener('mouseleave', () => {\n cursor.style.transform = 'translate(-50%,-50%) scale(1)';\n ring.style.transform = 'translate(-50%,-50%) scale(1)';\n ring.style.borderColor = 'rgba(184,149,106,0.4)';\n });\n });\n\n \/\/ Particles\n const container = document.getElementById('particles');\n for (let i = 0; i < 18; i++) {\n const p = document.createElement('div');\n p.className = 'particle';\n p.style.left = Math.random() * 100 + '%';\n p.style.animationDuration = (12 + Math.random() * 20) + 's';\n p.style.animationDelay = (Math.random() * 15) + 's';\n p.style.width = p.style.height = (Math.random() > 0.7 ? '2px' : '1px');\n container.appendChild(p);\n }\n\n \/\/ Notify form\n function handleNotify() {\n const input = document.getElementById('email-input');\n const thanks = document.getElementById('thanks-msg');\n if (input.value && input.value.includes('@')) {\n input.parentElement.style.display = 'none';\n thanks.style.display = 'block';\n } else {\n input.style.borderBottom = '1px solid rgba(184,149,106,0.5)';\n input.focus();\n }\n }\n\n document.getElementById('email-input').addEventListener('keydown', e => {\n if (e.key === 'Enter') handleNotify();\n });\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>ECLORE \u2014 Opening Soon Bienvenue \u00b7 Welcome \u00b7 \u0645\u0631\u062d\u0628\u0627\u064b ECLORE opening soon Something beautiful is coming Be the first to know Notify me Thank you \u2014 we’ll be in touch \u2726 \u00a9 2025 ECLORE \u00b7 All rights reserved<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":2,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":9,"href":"https:\/\/eclorelabs.com\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/9"}],"wp:attachment":[{"href":"https:\/\/eclorelabs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}