InstantOffice \u2014 Uskoro<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700&family=DM+Serif+Display:ital@0;1&display=swap\" rel=\"stylesheet\">\n<style>\n*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}\nhtml,body{height:100%;overflow:hidden}\nbody{\n font-family:'DM Sans',system-ui,sans-serif;\n background:#0c1015;\n display:flex;align-items:center;justify-content:center;\n position:relative;\n}\n\ncanvas{position:fixed;inset:0;z-index:0;pointer-events:none}\n\n.center{\n position:relative;z-index:2;\n display:flex;flex-direction:column;align-items:center;\n gap:0;\n user-select:none;\n}\n\n\/* Logo *\/\n.logo{\n display:flex;align-items:center;\n margin-bottom:48px;\n animation:logoFloat 4s ease-in-out infinite;\n}\n@keyframes logoFloat{\n 0%,100%{transform:translateY(0)}\n 50%{transform:translateY(-8px)}\n}\n.logo-i{\n font-size:clamp(36px,6vw,64px);\n font-weight:700;color:#fff;\n letter-spacing:-1.5px;\n line-height:1;\n}\n.logo-o{\n font-size:clamp(36px,6vw,64px);\n font-weight:300;color:#2a9648;\n letter-spacing:-1px;\n line-height:1;\n}\n.logo-dot{\n width:clamp(6px,1vw,10px);\n height:clamp(6px,1vw,10px);\n background:#2a9648;\n border-radius:50%;\n margin-left:3px;\n margin-bottom:clamp(18px,3vw,32px);\n animation:dotPulse 2s ease-in-out infinite;\n}\n@keyframes dotPulse{\n 0%,100%{\n box-shadow:0 0 0 0 rgba(42,150,72,0.7),\n 0 0 0 0 rgba(42,150,72,0.4);\n }\n 50%{\n box-shadow:0 0 0 8px rgba(42,150,72,0.15),\n 0 0 0 16px rgba(42,150,72,0.05);\n }\n}\n\n\/* Tagline *\/\n.tagline{\n font-family:'DM Serif Display',Georgia,serif;\n font-size:clamp(15px,2vw,22px);\n font-weight:400;\n font-style:italic;\n color:rgba(255,255,255,0.3);\n letter-spacing:0.01em;\n margin-bottom:52px;\n text-align:center;\n}\n\n\/* Progress *\/\n.progress-wrap{\n display:flex;flex-direction:column;align-items:center;gap:10px;\n margin-bottom:44px;\n}\n.progress-label{\n font-size:11px;font-weight:500;\n color:rgba(255,255,255,0.2);\n letter-spacing:0.08em;text-transform:uppercase;\n}\n.progress-bar{\n width:clamp(160px,20vw,240px);\n height:2px;\n background:rgba(255,255,255,0.07);\n border-radius:1px;\n overflow:hidden;\n position:relative;\n}\n.progress-fill{\n height:100%;\n background:#2a9648;\n border-radius:1px;\n animation:progressAnim 3s ease-in-out infinite;\n width:60%;\n}\n@keyframes progressAnim{\n 0%{width:0%;opacity:1}\n 70%{width:75%;opacity:1}\n 85%{width:75%;opacity:1}\n 100%{width:0%;opacity:0}\n}\n\n\/* Status dots *\/\n.status-row{\n display:flex;align-items:center;gap:7px;\n font-size:12px;font-weight:400;\n color:rgba(255,255,255,0.3);\n}\n.status-dot{\n width:6px;height:6px;border-radius:50%;\n background:#2a9648;\n animation:statusBlink 2s ease-in-out infinite;\n}\n@keyframes statusBlink{\n 0%,100%{opacity:1}\n 50%{opacity:0.3}\n}\n\n\/* Bottom info *\/\n.bottom-info{\n position:fixed;bottom:36px;\n display:flex;gap:32px;align-items:center;\n z-index:2;\n}\n.bi-item{\n display:flex;flex-direction:column;align-items:center;gap:3px;\n}\n.bi-label{\n font-size:9px;font-weight:600;\n color:rgba(255,255,255,0.18);\n letter-spacing:0.1em;text-transform:uppercase;\n}\n.bi-val{\n font-size:12px;font-weight:500;\n color:rgba(255,255,255,0.4);\n}\n.bi-sep{width:0.5px;height:28px;background:rgba(255,255,255,0.07)}\n\n\/* Glow rings *\/\n.glow-ring{\n position:fixed;\n border-radius:50%;\n border:0.5px solid rgba(42,150,72,0.06);\n pointer-events:none;z-index:1;\n animation:ringPulse 6s ease-in-out infinite;\n top:50%;left:50%;transform:translate(-50%,-50%);\n}\n.glow-ring:nth-child(1){width:320px;height:320px;animation-delay:0s}\n.glow-ring:nth-child(2){width:520px;height:520px;animation-delay:1s;border-color:rgba(42,150,72,0.04)}\n.glow-ring:nth-child(3){width:720px;height:720px;animation-delay:2s;border-color:rgba(42,150,72,0.025)}\n@keyframes ringPulse{\n 0%,100%{opacity:0.4;transform:translate(-50%,-50%) scale(1)}\n 50%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}\n}\n<\/style>\n<\/head>\n<body>\n\n\n<canvas id=\"grid\"><\/canvas>\n\n\n<div class=\"glow-ring\"><\/div>\n<div class=\"glow-ring\"><\/div>\n<div class=\"glow-ring\"><\/div>\n\n\n<div class=\"center\">\n <div class=\"logo\">\n <span class=\"logo-i\">Instant<\/span>\n <span class=\"logo-o\">Office<\/span>\n <span class=\"logo-dot\"><\/span>\n <\/div>\n\n <div class=\"tagline\">You are in good company.<\/div>\n\n <div class=\"progress-wrap\">\n <div class=\"progress-label\">U izradi<\/div>\n <div class=\"progress-bar\"><div class=\"progress-fill\"><\/div><\/div>\n <\/div>\n\n <div class=\"status-row\">\n <div class=\"status-dot\"><\/div>\n Nova web stranica uskoro\n <\/div>\n<\/div>\n\n\n<div class=\"bottom-info\">\n <div class=\"bi-item\">\n <span class=\"bi-label\">Locations<\/span>\n <span class=\"bi-val\">Zagrebtower \u00b7 Sredi\u0161\u0107e<\/span>\n <\/div>\n <div class=\"bi-sep\"><\/div>\n <div class=\"bi-item\">\n <span class=\"bi-label\">Contact<\/span>\n <span class=\"bi-val\">info@instantoffice.hr<\/span>\n <\/div>\n <div class=\"bi-sep\"><\/div>\n <div class=\"bi-item\">\n <span class=\"bi-label\">Phone<\/span>\n <span class=\"bi-val\">+385 1 5625 700<\/span>\n <\/div>\n<\/div>\n\n<script>\nconst canvas = document.getElementById('grid');\nconst ctx = canvas.getContext('2d');\n\nlet W, H, cols, rows;\nconst CELL = 60;\nconst dots = [];\nconst MAX_DOTS = 18;\n\nfunction resize(){\n W = canvas.width = window.innerWidth;\n H = canvas.height = window.innerHeight;\n cols = Math.ceil(W \/ CELL) + 1;\n rows = Math.ceil(H \/ CELL) + 1;\n}\n\nfunction drawGrid(){\n ctx.clearRect(0,0,W,H);\n\n const t = Date.now() * 0.0004;\n const cx = W\/2, cy = H\/2;\n\n for(let x = 0; x <= cols; x++){\n for(let y = 0; y <= rows; y++){\n const px = x * CELL;\n const py = y * CELL;\n const dist = Math.sqrt((px-cx)**2 + (py-cy)**2);\n const maxDist = Math.sqrt(cx**2 + cy**2);\n const fade = 1 - (dist \/ maxDist);\n const pulse = 0.5 + 0.5 * Math.sin(t - dist * 0.008);\n const alpha = fade * pulse * 0.18;\n\n ctx.beginPath();\n ctx.arc(px, py, 1, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${alpha})`;\n ctx.fill();\n }\n }\n\n ctx.strokeStyle = 'rgba(255,255,255,0.025)';\n ctx.lineWidth = 0.5;\n for(let x = 0; x <= cols; x++){\n ctx.beginPath();\n ctx.moveTo(x * CELL, 0);\n ctx.lineTo(x * CELL, H);\n ctx.stroke();\n }\n for(let y = 0; y <= rows; y++){\n ctx.beginPath();\n ctx.moveTo(0, y * CELL);\n ctx.lineTo(W, y * CELL);\n ctx.stroke();\n }\n\n dots.forEach((d, i) => {\n d.life += 0.012;\n if(d.life > 1){\n dots.splice(i,1);\n return;\n }\n const alpha = d.life < 0.3 ? d.life\/0.3 : d.life > 0.7 ? (1-d.life)\/0.3 : 1;\n ctx.beginPath();\n ctx.arc(d.x, d.y, d.r * alpha, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${0.35 * alpha})`;\n ctx.fill();\n ctx.beginPath();\n ctx.arc(d.x, d.y, d.r * alpha * 2, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${0.08 * alpha})`;\n ctx.fill();\n });\n\n requestAnimationFrame(drawGrid);\n}\n\nfunction spawnDot(){\n if(dots.length < MAX_DOTS){\n const gx = Math.floor(Math.random() * cols);\n const gy = Math.floor(Math.random() * rows);\n dots.push({\n x: gx * CELL,\n y: gy * CELL,\n r: 3 + Math.random() * 3,\n life: 0\n });\n }\n setTimeout(spawnDot, 400 + Math.random() * 800);\n}\n\nwindow.addEventListener('resize', resize);\nresize();\ndrawGrid();\nspawnDot();\n<\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>InstantOffice \u2014 Uskoro Instant Office You are in good company. U izradi Nova web stranica uskoro Lokacije Zagrebtower \u00b7 Sredi\u0161\u0107e Kontakt info@instantoffice.hr Telefon +385 1 5625 700<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":5,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":62,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8\/revisions\/62"}],"wp:attachment":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n\n\nInstantOffice \u2014 Uskoro<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700&family=DM+Serif+Display:ital@0;1&display=swap\" rel=\"stylesheet\">\n<style>\n*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}\nhtml,body{height:100%;overflow:hidden}\nbody{\n font-family:'DM Sans',system-ui,sans-serif;\n background:#0c1015;\n display:flex;align-items:center;justify-content:center;\n position:relative;\n}\n\ncanvas{position:fixed;inset:0;z-index:0;pointer-events:none}\n\n.center{\n position:relative;z-index:2;\n display:flex;flex-direction:column;align-items:center;\n gap:0;\n user-select:none;\n}\n\n\/* Logo *\/\n.logo{\n display:flex;align-items:center;\n margin-bottom:48px;\n animation:logoFloat 4s ease-in-out infinite;\n}\n@keyframes logoFloat{\n 0%,100%{transform:translateY(0)}\n 50%{transform:translateY(-8px)}\n}\n.logo-i{\n font-size:clamp(36px,6vw,64px);\n font-weight:700;color:#fff;\n letter-spacing:-1.5px;\n line-height:1;\n}\n.logo-o{\n font-size:clamp(36px,6vw,64px);\n font-weight:300;color:#2a9648;\n letter-spacing:-1px;\n line-height:1;\n}\n.logo-dot{\n width:clamp(6px,1vw,10px);\n height:clamp(6px,1vw,10px);\n background:#2a9648;\n border-radius:50%;\n margin-left:3px;\n margin-bottom:clamp(18px,3vw,32px);\n animation:dotPulse 2s ease-in-out infinite;\n}\n@keyframes dotPulse{\n 0%,100%{\n box-shadow:0 0 0 0 rgba(42,150,72,0.7),\n 0 0 0 0 rgba(42,150,72,0.4);\n }\n 50%{\n box-shadow:0 0 0 8px rgba(42,150,72,0.15),\n 0 0 0 16px rgba(42,150,72,0.05);\n }\n}\n\n\/* Tagline *\/\n.tagline{\n font-family:'DM Serif Display',Georgia,serif;\n font-size:clamp(15px,2vw,22px);\n font-weight:400;\n font-style:italic;\n color:rgba(255,255,255,0.3);\n letter-spacing:0.01em;\n margin-bottom:52px;\n text-align:center;\n}\n\n\/* Progress *\/\n.progress-wrap{\n display:flex;flex-direction:column;align-items:center;gap:10px;\n margin-bottom:44px;\n}\n.progress-label{\n font-size:11px;font-weight:500;\n color:rgba(255,255,255,0.2);\n letter-spacing:0.08em;text-transform:uppercase;\n}\n.progress-bar{\n width:clamp(160px,20vw,240px);\n height:2px;\n background:rgba(255,255,255,0.07);\n border-radius:1px;\n overflow:hidden;\n position:relative;\n}\n.progress-fill{\n height:100%;\n background:#2a9648;\n border-radius:1px;\n animation:progressAnim 3s ease-in-out infinite;\n width:60%;\n}\n@keyframes progressAnim{\n 0%{width:0%;opacity:1}\n 70%{width:75%;opacity:1}\n 85%{width:75%;opacity:1}\n 100%{width:0%;opacity:0}\n}\n\n\/* Status dots *\/\n.status-row{\n display:flex;align-items:center;gap:7px;\n font-size:12px;font-weight:400;\n color:rgba(255,255,255,0.3);\n}\n.status-dot{\n width:6px;height:6px;border-radius:50%;\n background:#2a9648;\n animation:statusBlink 2s ease-in-out infinite;\n}\n@keyframes statusBlink{\n 0%,100%{opacity:1}\n 50%{opacity:0.3}\n}\n\n\/* Bottom info *\/\n.bottom-info{\n position:fixed;bottom:36px;\n display:flex;gap:32px;align-items:center;\n z-index:2;\n}\n.bi-item{\n display:flex;flex-direction:column;align-items:center;gap:3px;\n}\n.bi-label{\n font-size:9px;font-weight:600;\n color:rgba(255,255,255,0.18);\n letter-spacing:0.1em;text-transform:uppercase;\n}\n.bi-val{\n font-size:12px;font-weight:500;\n color:rgba(255,255,255,0.4);\n}\n.bi-sep{width:0.5px;height:28px;background:rgba(255,255,255,0.07)}\n\n\/* Glow rings *\/\n.glow-ring{\n position:fixed;\n border-radius:50%;\n border:0.5px solid rgba(42,150,72,0.06);\n pointer-events:none;z-index:1;\n animation:ringPulse 6s ease-in-out infinite;\n top:50%;left:50%;transform:translate(-50%,-50%);\n}\n.glow-ring:nth-child(1){width:320px;height:320px;animation-delay:0s}\n.glow-ring:nth-child(2){width:520px;height:520px;animation-delay:1s;border-color:rgba(42,150,72,0.04)}\n.glow-ring:nth-child(3){width:720px;height:720px;animation-delay:2s;border-color:rgba(42,150,72,0.025)}\n@keyframes ringPulse{\n 0%,100%{opacity:0.4;transform:translate(-50%,-50%) scale(1)}\n 50%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}\n}\n<\/style>\n<\/head>\n<body>\n\n\n<canvas id=\"grid\"><\/canvas>\n\n\n<div class=\"glow-ring\"><\/div>\n<div class=\"glow-ring\"><\/div>\n<div class=\"glow-ring\"><\/div>\n\n\n<div class=\"center\">\n <div class=\"logo\">\n <span class=\"logo-i\">Instant<\/span>\n <span class=\"logo-o\">Office<\/span>\n <span class=\"logo-dot\"><\/span>\n <\/div>\n\n <div class=\"tagline\">You are in good company.<\/div>\n\n <div class=\"progress-wrap\">\n <div class=\"progress-label\">U izradi<\/div>\n <div class=\"progress-bar\"><div class=\"progress-fill\"><\/div><\/div>\n <\/div>\n\n <div class=\"status-row\">\n <div class=\"status-dot\"><\/div>\n Nova web stranica uskoro\n <\/div>\n<\/div>\n\n\n<div class=\"bottom-info\">\n <div class=\"bi-item\">\n <span class=\"bi-label\">Locations<\/span>\n <span class=\"bi-val\">Zagrebtower \u00b7 Sredi\u0161\u0107e<\/span>\n <\/div>\n <div class=\"bi-sep\"><\/div>\n <div class=\"bi-item\">\n <span class=\"bi-label\">Contact<\/span>\n <span class=\"bi-val\">info@instantoffice.hr<\/span>\n <\/div>\n <div class=\"bi-sep\"><\/div>\n <div class=\"bi-item\">\n <span class=\"bi-label\">Phone<\/span>\n <span class=\"bi-val\">+385 1 5625 700<\/span>\n <\/div>\n<\/div>\n\n<script>\nconst canvas = document.getElementById('grid');\nconst ctx = canvas.getContext('2d');\n\nlet W, H, cols, rows;\nconst CELL = 60;\nconst dots = [];\nconst MAX_DOTS = 18;\n\nfunction resize(){\n W = canvas.width = window.innerWidth;\n H = canvas.height = window.innerHeight;\n cols = Math.ceil(W \/ CELL) + 1;\n rows = Math.ceil(H \/ CELL) + 1;\n}\n\nfunction drawGrid(){\n ctx.clearRect(0,0,W,H);\n\n const t = Date.now() * 0.0004;\n const cx = W\/2, cy = H\/2;\n\n for(let x = 0; x <= cols; x++){\n for(let y = 0; y <= rows; y++){\n const px = x * CELL;\n const py = y * CELL;\n const dist = Math.sqrt((px-cx)**2 + (py-cy)**2);\n const maxDist = Math.sqrt(cx**2 + cy**2);\n const fade = 1 - (dist \/ maxDist);\n const pulse = 0.5 + 0.5 * Math.sin(t - dist * 0.008);\n const alpha = fade * pulse * 0.18;\n\n ctx.beginPath();\n ctx.arc(px, py, 1, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${alpha})`;\n ctx.fill();\n }\n }\n\n ctx.strokeStyle = 'rgba(255,255,255,0.025)';\n ctx.lineWidth = 0.5;\n for(let x = 0; x <= cols; x++){\n ctx.beginPath();\n ctx.moveTo(x * CELL, 0);\n ctx.lineTo(x * CELL, H);\n ctx.stroke();\n }\n for(let y = 0; y <= rows; y++){\n ctx.beginPath();\n ctx.moveTo(0, y * CELL);\n ctx.lineTo(W, y * CELL);\n ctx.stroke();\n }\n\n dots.forEach((d, i) => {\n d.life += 0.012;\n if(d.life > 1){\n dots.splice(i,1);\n return;\n }\n const alpha = d.life < 0.3 ? d.life\/0.3 : d.life > 0.7 ? (1-d.life)\/0.3 : 1;\n ctx.beginPath();\n ctx.arc(d.x, d.y, d.r * alpha, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${0.35 * alpha})`;\n ctx.fill();\n ctx.beginPath();\n ctx.arc(d.x, d.y, d.r * alpha * 2, 0, Math.PI*2);\n ctx.fillStyle = `rgba(42,150,72,${0.08 * alpha})`;\n ctx.fill();\n });\n\n requestAnimationFrame(drawGrid);\n}\n\nfunction spawnDot(){\n if(dots.length < MAX_DOTS){\n const gx = Math.floor(Math.random() * cols);\n const gy = Math.floor(Math.random() * rows);\n dots.push({\n x: gx * CELL,\n y: gy * CELL,\n r: 3 + Math.random() * 3,\n life: 0\n });\n }\n setTimeout(spawnDot, 400 + Math.random() * 800);\n}\n\nwindow.addEventListener('resize', resize);\nresize();\ndrawGrid();\nspawnDot();\n<\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>InstantOffice \u2014 Uskoro Instant Office You are in good company. U izradi Nova web stranica uskoro Lokacije Zagrebtower \u00b7 Sredi\u0161\u0107e Kontakt info@instantoffice.hr Telefon +385 1 5625 700<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":5,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":62,"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/pages\/8\/revisions\/62"}],"wp:attachment":[{"href":"https:\/\/instantof.byimarovic.eu\/en\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}