{"id":6,"date":"2026-05-31T22:58:46","date_gmt":"2026-05-31T22:58:46","guid":{"rendered":"https:\/\/segproductions.nl\/wordpress\/?page_id=6"},"modified":"2026-06-29T22:20:13","modified_gmt":"2026-06-29T22:20:13","slug":"home","status":"publish","type":"page","link":"https:\/\/segproductions.nl\/","title":{"rendered":""},"content":{"rendered":"


\n
\n
\n
\n
\n SEG Productions<\/title>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:wght@300;400&family=Inter:wght@300;400&display=swap\" rel=\"stylesheet\">\n<style>\n * { box-sizing: border-box; margin: 0; padding: 0; }\n html, body {\n width: 100%; height: 100%;\n min-height: 100vh;\n background: #060606;\n display: flex; align-items: center; justify-content: center;\n overflow: hidden; font-family: 'Inter', sans-serif;\n transition: background 3s ease;\n }\n .bg-layer {\n position: fixed; inset: 0;\n pointer-events: none; z-index: 0;\n transition: opacity 3s ease;\n opacity: 0;\n }\n .content {\n position: relative; z-index: 2;\n display: flex; flex-direction: column;\n align-items: center; text-align: center;\n padding: 2rem 2rem 5rem 2rem;\n width: 100%;\n max-width: 400px;\n }\n .logo-outer {\n width: 180px; height: 180px;\n display: flex; align-items: center; justify-content: center;\n margin-bottom: 2.5rem; cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n }\n .logo-wrap {\n width: 180px; height: 180px;\n border-radius: 50%; overflow: hidden;\n animation: slowspin 35s linear infinite;\n }\n .logo-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }\n .logo-wrap.beat { animation: none; transform: scale(1.08); transition: transform 0.1s; }\n .logo-wrap.beat-back { animation: none; transform: scale(1.0); transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); }\n .logo-wrap.resume { animation: slowspin 35s linear infinite; }\n .logo-wrap.spinout { animation: spincrazy 3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; }\n @keyframes slowspin {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n }\n @keyframes spincrazy {\n 0% { transform: rotate(0deg) scale(1); }\n 20% { transform: rotate(180deg) scale(1.15); }\n 50% { transform: rotate(900deg) scale(0.9); }\n 80% { transform: rotate(1260deg) scale(1.1); }\n 100% { transform: rotate(1440deg) scale(1); }\n }\n .pulse-ring {\n position: fixed; width: 180px; height: 180px;\n border-radius: 50%;\n border: 1px solid rgba(255,255,255,0.15);\n top: 50%; left: 50%;\n transform: translate(-50%, -50%) scale(1);\n opacity: 0; pointer-events: none; z-index: 2;\n }\n .pulse-ring.fire {\n animation: pulseout 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards;\n }\n @keyframes pulseout {\n 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }\n 100% { transform: translate(-50%, -50%) scale(1.8); opacity: 0; }\n }\n .name {\n font-family: 'Cormorant Garamond', Georgia, serif;\n font-size: 1.8rem; font-weight: 300;\n color: rgba(255,255,255,0.88);\n letter-spacing: 0.3em; text-transform: uppercase;\n margin-bottom: 3rem;\n width: 100%;\n }\n .line {\n width: 1px; height: 40px;\n background: linear-gradient(to bottom, rgba(255,255,255,0.20), transparent);\n margin-bottom: 2rem;\n }\n .email-wrap {\n display: flex; flex-direction: column; align-items: center; gap: 6px;\n width: 100%; padding: 0 1rem;\n }\n .email-label {\n font-size: 9px; font-weight: 300;\n color: rgba(255,255,255,0.20);\n letter-spacing: 0.35em; text-transform: uppercase;\n }\n .email {\n font-size: 13px; font-weight: 300;\n color: rgba(255,255,255,0.45);\n letter-spacing: 0.04em; text-decoration: none;\n transition: color 0.3s;\n word-break: break-all;\n text-align: center;\n }\n .email:hover { color: rgba(255,255,255,0.85); }\n .time-display {\n position: fixed; bottom: 1.2rem; right: 1.2rem;\n font-size: 10px; font-weight: 300;\n color: rgba(255,255,255,0.12);\n letter-spacing: 0.15em;\n font-family: 'Inter', sans-serif;\n z-index: 10;\n }\n .weather-display {\n position: fixed; bottom: 1.2rem; left: 1.2rem;\n font-size: 10px; font-weight: 300;\n color: rgba(255,255,255,0.12);\n letter-spacing: 0.10em;\n font-family: 'Inter', sans-serif;\n z-index: 10;\n }\n @media (max-width: 480px) {\n .logo-outer { width: 140px; height: 140px; }\n .logo-wrap { width: 140px; height: 140px; }\n .name { font-size: 1.2rem; letter-spacing: 0.15em; }\n .email { font-size: 12px; }\n }\n <\/style>\n<p><\/head><br \/>\n<body><\/p>\n<div class=\"bg-layer\" id=\"bgLayer\"><\/div>\n<div class=\"pulse-ring\" id=\"pulse\"><\/div>\n<div class=\"content\">\n<div class=\"logo-outer\" id=\"logoOuter\">\n<div class=\"logo-wrap\" id=\"logo\">\n <img decoding=\"async\" src=\"https:\/\/segproductions.nl\/wp-content\/uploads\/2026\/05\/LOGO_SEGPRODUCTIONS.png\" alt=\"SEG Productions\">\n <\/div>\n<\/p><\/div>\n<div class=\"name\">SEG Productions<\/div>\n<div class=\"line\"><\/div>\n<div class=\"email-wrap\">\n <span class=\"email-label\">Contact<\/span><br \/>\n <a class=\"email\" href=\"mailto:shay@segproductions.nl\">shay@segproductions.nl<\/a>\n <\/div>\n<\/p><\/div>\n<div class=\"time-display\" id=\"timeDisplay\"><\/div>\n<div class=\"weather-display\" id=\"weatherDisplay\"><\/div>\n<p> <script>\n const logo = document.getElementById('logo');\n const pulse = document.getElementById('pulse');\n const bgLayer = document.getElementById('bgLayer');\n const isTouch = 'ontouchstart' in window;<\/p>\n<p> function updateTime() {\n const now = new Date();\n const h = String(now.getHours()).padStart(2, '0');\n const m = String(now.getMinutes()).padStart(2, '0');\n const s = String(now.getSeconds()).padStart(2, '0');\n document.getElementById('timeDisplay').textContent = h + ':' + m + ':' + s;\n }\n updateTime();\n setInterval(updateTime, 1000);<\/p>\n<p> fetch('https:\/\/api.open-meteo.com\/v1\/forecast?latitude=52.3676&longitude=4.9041¤t=temperature_2m,weathercode,precipitation&timezone=Europe\/Amsterdam')\n .then(r => r.json())\n .then(data => {\n const temp = Math.round(data.current.temperature_2m);\n const code = data.current.weathercode;\n const rain = data.current.precipitation > 0;\n let condition = '';\n let bgGradient = '';\n if (code === 0) {\n condition = 'clear';\n bgGradient = 'radial-gradient(ellipse at 50% 0%, rgba(30,20,5,0.6) 0%, transparent 70%)';\n } else if (code <= 3) {\n condition = 'partly cloudy';\n bgGradient = 'radial-gradient(ellipse at 50% 0%, rgba(15,15,25,0.5) 0%, transparent 70%)';\n } else if (code <= 49) {\n condition = 'foggy';\n bgGradient = 'radial-gradient(ellipse at 50% 50%, rgba(20,20,20,0.8) 0%, transparent 80%)';\n } else if (code <= 67 || rain) {\n condition = 'rain';\n bgGradient = 'radial-gradient(ellipse at 30% 20%, rgba(5,10,25,0.7) 0%, transparent 60%), radial-gradient(ellipse at 70% 80%, rgba(5,5,20,0.5) 0%, transparent 60%)';\n } else if (code <= 77) {\n condition = 'snow';\n bgGradient = 'radial-gradient(ellipse at 50% 30%, rgba(20,25,35,0.6) 0%, transparent 70%)';\n } else {\n condition = 'stormy';\n bgGradient = 'radial-gradient(ellipse at 20% 20%, rgba(15,5,5,0.8) 0%, transparent 50%), radial-gradient(ellipse at 80% 80%, rgba(5,5,15,0.7) 0%, transparent 50%)';\n }\n bgLayer.style.background = bgGradient;\n bgLayer.style.opacity = '1';\n document.getElementById('weatherDisplay').textContent = 'AMS \u00b7 ' + temp + '\u00b0C \u00b7 ' + condition;\n })\n .catch(() => {});<\/p>\n<p> function heartbeat() {\n if (logo.classList.contains('spinout')) return;\n logo.classList.remove('resume', 'beat-back');\n logo.classList.add('beat');\n pulse.classList.remove('fire');\n void pulse.offsetWidth;\n pulse.classList.add('fire');\n setTimeout(() => {\n logo.classList.remove('beat');\n logo.classList.add('beat-back');\n setTimeout(() => {\n logo.classList.remove('beat-back');\n logo.classList.add('resume');\n }, 400);\n }, 120);\n }<\/p>\n<p> let clickCount = 0;\n let clickTimer = null;\n const outer = document.getElementById('logoOuter');\n outer.addEventListener('click', () => {\n clickCount++;\n clearTimeout(clickTimer);\n clickTimer = setTimeout(() => { clickCount = 0; }, 1500);\n if (clickCount >= 7) {\n clickCount = 0;\n logo.classList.remove('resume', 'beat', 'beat-back');\n logo.classList.add('spinout');\n setTimeout(() => {\n logo.classList.remove('spinout');\n logo.classList.add('resume');\n }, 3000);\n return;\n }\n heartbeat();\n });<\/p>\n<p> if (!isTouch) outer.addEventListener('mouseenter', heartbeat);\n <\/script><br \/>\n<\/body><br \/>\n<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"<p>SEG Productions SEG Productions Contact shay@segproductions.nl<\/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-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/segproductions.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6"}],"version-history":[{"count":19,"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":35,"href":"https:\/\/segproductions.nl\/index.php?rest_route=\/wp\/v2\/pages\/6\/revisions\/35"}],"wp:attachment":[{"href":"https:\/\/segproductions.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}