{"id":29505,"date":"2026-01-08T13:31:42","date_gmt":"2026-01-08T13:31:42","guid":{"rendered":"https:\/\/unicare.com.tr\/?page_id=29505"},"modified":"2026-01-08T15:17:37","modified_gmt":"2026-01-08T15:17:37","slug":"mediora","status":"publish","type":"page","link":"https:\/\/unicare.com.tr\/?page_id=29505","title":{"rendered":"mediora"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"29505\" class=\"elementor elementor-29505\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"wd-negative-gap elementor-element elementor-element-a37ce57 e-flex e-con-boxed e-con e-parent\" data-id=\"a37ce57\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3527f67 elementor-widget elementor-widget-html\" data-id=\"3527f67\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Tailwind CSS (Zaruri baraye style ha) -->\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n<script>\n    tailwind.config = {\n        theme: {\n            extend: {\n                colors: {\n                    slate: { 800: '#1e293b', 900: '#0f172a', 950: '#020617' },\n                    teal: { 400: '#2dd4bf', 500: '#14b8a6' },\n                    accent: '#38bdf8'\n                },\n                fontFamily: { sans: ['Inter', 'sans-serif'] }\n            }\n        }\n    }\n<\/script>\n\n<!-- Icons & Fonts -->\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;600;800;900&display=swap\" rel=\"stylesheet\">\n\n<!-- Header Specific Styles -->\n<style>\n    \/* Glass Effect baraye Header *\/\n    .glass-header {\n        background: rgba(2, 6, 23, 0.6);\n        backdrop-filter: blur(12px);\n        -webkit-backdrop-filter: blur(12px);\n        border-bottom: 1px solid rgba(255, 255, 255, 0.05);\n    }\n    \n    \/* Vaghti scroll mishe (Solid) *\/\n    .header-solid {\n        background: rgba(2, 6, 23, 0.95) !important;\n        box-shadow: 0 4px 20px rgba(0,0,0,0.5);\n        border-bottom: 1px solid rgba(45, 212, 191, 0.1);\n    }\n<\/style>\n\n<!-- HEADER START -->\n<nav class=\"fixed top-0 left-0 w-full z-[9999] glass-header transition-all duration-300\" id=\"main-nav\">\n    <div class=\"container mx-auto px-6 h-20 flex justify-between items-center\">\n        <!-- Brand \/ Logo -->\n        <a href=\"https:\/\/unicare.com.tr\/\" class=\"flex items-center gap-2 group shrink-0\">\n            <img decoding=\"async\" src=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/85982dc2-de7d-49f7-88b3-e3f1d5239c4f-removebg-preview-e1767882088247.png\" \n                 alt=\"Unicare\" \n                 class=\"h-auto max-h-14 w-auto object-contain transition-transform group-hover:scale-105 filter brightness-0 invert drop-shadow-[0_0_8px_rgba(45,212,191,0.5)]\">\n        <\/a>\n\n        <!-- Desktop Links -->\n        <div class=\"hidden lg:flex items-center gap-8\">\n            <a href=\"#mission\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors\">Mission<\/a>\n            <a href=\"#categories\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors\">Categories<\/a>\n            <a href=\"#technology\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors\">Tech<\/a>\n            <a href=\"#contact\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors\">Contact<\/a>\n        <\/div>\n\n        <!-- CTA & Mobile Toggle -->\n        <div class=\"flex items-center gap-4\">\n            <a href=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf\" target=\"_blank\" class=\"hidden md:flex items-center gap-2 text-xs font-bold uppercase tracking-widest text-teal-400 border border-teal-500\/30 px-4 py-2 rounded hover:bg-teal-500\/10 transition-colors\">\n                <i data-lucide=\"file-down\" class=\"w-4 h-4\"><\/i> Catalogue\n            <\/a>\n            \n            <!-- Mobile Menu Button -->\n            <button class=\"lg:hidden text-white p-2 hover:text-teal-400 transition-colors\" onclick=\"document.getElementById('mobile-menu').classList.remove('translate-x-full')\">\n                <i data-lucide=\"menu\" class=\"w-8 h-8\"><\/i>\n            <\/button>\n        <\/div>\n    <\/div>\n<\/nav>\n\n<!-- MOBILE MENU OVERLAY -->\n<div id=\"mobile-menu\" class=\"fixed inset-0 bg-slate-950 z-[10000] transform translate-x-full transition-transform duration-300 flex flex-col items-center justify-center space-y-8\">\n    <button class=\"absolute top-6 right-6 text-white p-2 hover:text-teal-400\" onclick=\"document.getElementById('mobile-menu').classList.add('translate-x-full')\">\n        <i data-lucide=\"x\" class=\"w-10 h-10\"><\/i>\n    <\/button>\n    \n    <a href=\"https:\/\/unicare.com.tr\/\" class=\"text-3xl font-black text-white hover:text-teal-400 transition-colors\" onclick=\"document.getElementById('mobile-menu').classList.add('translate-x-full')\">HOME<\/a>\n    <a href=\"#mission\" class=\"text-2xl font-bold text-slate-300 hover:text-white transition-colors\" onclick=\"document.getElementById('mobile-menu').classList.add('translate-x-full')\">Mission<\/a>\n    <a href=\"#categories\" class=\"text-2xl font-bold text-slate-300 hover:text-white transition-colors\" onclick=\"document.getElementById('mobile-menu').classList.add('translate-x-full')\">Categories<\/a>\n    <a href=\"#technology\" class=\"text-2xl font-bold text-slate-300 hover:text-white transition-colors\" onclick=\"document.getElementById('mobile-menu').classList.add('translate-x-full')\">Technology<\/a>\n    \n    <a href=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf\" target=\"_blank\" class=\"mt-8 px-8 py-3 border border-teal-500 text-teal-400 font-bold uppercase tracking-widest flex items-center gap-2\">\n        <i data-lucide=\"download\" class=\"w-5 h-5\"><\/i> Download PDF\n    <\/a>\n<\/div>\n\n<!-- SCRIPTS (Lazeme baraye icon ha va scroll effect) -->\n<script>\n    \/\/ Initialize Icons\n    lucide.createIcons();\n\n    \/\/ Scroll Logic (Header background change)\n    window.addEventListener('scroll', () => {\n        const nav = document.getElementById('main-nav');\n        if (window.scrollY > 50) {\n            nav.classList.add('header-solid');\n            nav.classList.remove('glass-header');\n        } else {\n            nav.classList.add('glass-header');\n            nav.classList.remove('header-solid');\n        }\n    });\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-5d20d6f e-flex e-con-boxed e-con e-parent\" data-id=\"5d20d6f\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a07db8 elementor-widget elementor-widget-html\" data-id=\"3a07db8\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Tailwind CSS & Config -->\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n<script>\n    tailwind.config = {\n        theme: {\n            extend: {\n                colors: {\n                    slate: { 800: '#1e293b', 900: '#0f172a', 950: '#020617' },\n                    teal: { 400: '#2dd4bf', 500: '#14b8a6', 600: '#0d9488' },\n                    accent: '#38bdf8'\n                },\n                fontFamily: { sans: ['Inter', 'sans-serif'] },\n                animation: {\n                    'blob': 'blob 10s infinite',\n                    'float-slow': 'float 8s ease-in-out infinite',\n                    'float-delayed': 'float 8s ease-in-out 4s infinite',\n                    'pulse-glow': 'pulse-glow 3s infinite',\n                    'spin-slow': 'spin 15s linear infinite',\n                },\n                keyframes: {\n                    blob: {\n                        '0%': { transform: 'translate(0px, 0px) scale(1)' },\n                        '33%': { transform: 'translate(30px, -50px) scale(1.1)' },\n                        '66%': { transform: 'translate(-20px, 20px) scale(0.9)' },\n                        '100%': { transform: 'translate(0px, 0px) scale(1)' },\n                    },\n                    float: {\n                        '0%, 100%': { transform: 'translateY(0)' },\n                        '50%': { transform: 'translateY(-20px)' },\n                    },\n                    'pulse-glow': {\n                        '0%, 100%': { opacity: 1, boxShadow: '0 0 20px rgba(45, 212, 191, 0.5)' },\n                        '50%': { opacity: 0.7, boxShadow: '0 0 10px rgba(45, 212, 191, 0.2)' },\n                    }\n                }\n            }\n        }\n    }\n<\/script>\n\n<!-- Icons & Fonts -->\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;600;800;900&display=swap\" rel=\"stylesheet\">\n\n<style>\n    body { background: #020617; overflow-x: hidden; }\n    \n    \/* Glass Styles *\/\n    .glass-header {\n        background: rgba(2, 6, 23, 0.6);\n        backdrop-filter: blur(12px);\n        -webkit-backdrop-filter: blur(12px);\n        border-bottom: 1px solid rgba(255, 255, 255, 0.05);\n    }\n    .glass-card {\n        background: rgba(15, 23, 42, 0.6);\n        backdrop-filter: blur(20px);\n        -webkit-backdrop-filter: blur(20px);\n        border: 1px solid rgba(255, 255, 255, 0.08);\n        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);\n    }\n\n    \/* 3D Tilt *\/\n    .hero-tilt-container {\n        perspective: 1000px;\n        transform-style: preserve-3d;\n    }\n    .hero-tilt-card {\n        transform-style: preserve-3d;\n        transition: transform 0.1s ease-out; \/* Smooth follow *\/\n    }\n    .hero-element {\n        transform: translateZ(30px);\n        transition: transform 0.3s ease;\n    }\n    .hero-element-deep {\n        transform: translateZ(60px);\n    }\n\n    \/* Glow Text *\/\n    .text-glow-teal {\n        text-shadow: 0 0 30px rgba(45, 212, 191, 0.4);\n    }\n<\/style>\n\n<!-- NAVBAR -->\n<nav class=\"fixed top-0 left-0 w-full z-[9999] glass-header transition-all duration-300\" id=\"main-nav\">\n    <div class=\"container mx-auto px-6 h-24 flex justify-between items-center\">\n        <!-- Brand -->\n        <a href=\"https:\/\/unicare.com.tr\/\" class=\"flex items-center gap-2 group shrink-0\">\n            <img decoding=\"async\" src=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/85982dc2-de7d-49f7-88b3-e3f1d5239c4f-removebg-preview-e1767882088247.png\" \n                 alt=\"Unicare\" \n                 class=\"h-auto max-h-16 w-auto object-contain transition-transform group-hover:scale-105 filter brightness-0 invert drop-shadow-[0_0_15px_rgba(45,212,191,0.4)]\">\n        <\/a>\n\n        <!-- Desktop Links -->\n        <div class=\"hidden lg:flex items-center gap-10\">\n            <a href=\"#mission\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors relative group\">\n                Mission <span class=\"absolute bottom-0 left-0 w-0 h-0.5 bg-teal-400 transition-all group-hover:w-full\"><\/span>\n            <\/a>\n            <a href=\"#products\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors relative group\">\n                Products <span class=\"absolute bottom-0 left-0 w-0 h-0.5 bg-teal-400 transition-all group-hover:w-full\"><\/span>\n            <\/a>\n            <a href=\"#tech\" class=\"text-sm font-bold uppercase tracking-widest text-slate-400 hover:text-white transition-colors relative group\">\n                Technology <span class=\"absolute bottom-0 left-0 w-0 h-0.5 bg-teal-400 transition-all group-hover:w-full\"><\/span>\n            <\/a>\n        <\/div>\n\n        <!-- Right Side -->\n        <div class=\"flex items-center gap-6\">\n            <a href=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf\" target=\"_blank\" class=\"hidden md:flex items-center gap-2 text-xs font-bold uppercase tracking-widest text-teal-400 border border-teal-500\/30 px-5 py-2.5 rounded-lg hover:bg-teal-500\/10 hover:border-teal-400 transition-all shadow-[0_0_15px_rgba(45,212,191,0.1)]\">\n                <i data-lucide=\"file-text\" class=\"w-4 h-4\"><\/i> Catalogue\n            <\/a>\n            <button class=\"lg:hidden text-white hover:text-teal-400 transition-colors\" onclick=\"toggleMenu()\">\n                <i data-lucide=\"menu\" class=\"w-8 h-8\"><\/i>\n            <\/button>\n        <\/div>\n    <\/div>\n<\/nav>\n\n<!-- MOBILE MENU -->\n<div id=\"mobile-menu\" class=\"fixed inset-0 bg-slate-950\/98 backdrop-blur-xl z-[10000] transform translate-x-full transition-transform duration-300 flex flex-col items-center justify-center gap-8\">\n    <button class=\"absolute top-8 right-8 text-white p-2\" onclick=\"toggleMenu()\">\n        <i data-lucide=\"x\" class=\"w-10 h-10\"><\/i>\n    <\/button>\n    <a href=\"https:\/\/unicare.com.tr\/\" class=\"text-3xl font-black text-white hover:text-teal-400\">HOME<\/a>\n    <a href=\"#products\" class=\"text-2xl font-bold text-slate-300 hover:text-white\">PRODUCTS<\/a>\n    <a href=\"#tech\" class=\"text-2xl font-bold text-slate-300 hover:text-white\">TECHNOLOGY<\/a>\n    <a href=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf\" class=\"mt-4 px-8 py-3 bg-teal-500 text-slate-900 font-bold uppercase\">Download PDF<\/a>\n<\/div>\n\n<!-- ULTRA HERO SECTION -->\n<header class=\"relative min-h-screen flex items-center pt-24 overflow-hidden bg-slate-950\">\n    \n    <!-- Animated Background Blobs -->\n    <div class=\"absolute inset-0 pointer-events-none overflow-hidden\">\n        <div class=\"absolute top-0 -left-20 w-[600px] h-[600px] bg-teal-500\/10 rounded-full blur-[120px] animate-blob\"><\/div>\n        <div class=\"absolute bottom-0 -right-20 w-[600px] h-[600px] bg-blue-600\/10 rounded-full blur-[120px] animate-blob\" style=\"animation-delay: 2s\"><\/div>\n        <div class=\"absolute top-1\/2 left-1\/2 -translate-x-1\/2 -translate-y-1\/2 w-[800px] h-[800px] bg-slate-900\/50 rounded-full blur-[100px]\"><\/div>\n        <!-- Grid Pattern -->\n        <div class=\"absolute inset-0 bg-[linear-gradient(rgba(255,255,255,0.03)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.03)_1px,transparent_1px)] bg-[size:4rem_4rem] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_50%,#000_70%,transparent_100%)]\"><\/div>\n    <\/div>\n\n    <div class=\"container mx-auto px-6 relative z-10 grid lg:grid-cols-2 gap-12 items-center\">\n        \n        <!-- Left Content (Text) -->\n        <div class=\"space-y-10\">\n            <!-- Neon Badge -->\n            <div class=\"inline-flex items-center gap-3 px-4 py-2 bg-slate-900\/80 border border-teal-500\/50 rounded-full shadow-[0_0_20px_rgba(45,212,191,0.2)] backdrop-blur-md\">\n                <span class=\"relative flex h-3 w-3\">\n                  <span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-teal-400 opacity-75\"><\/span>\n                  <span class=\"relative inline-flex rounded-full h-3 w-3 bg-teal-500\"><\/span>\n                <\/span>\n                <span class=\"text-xs font-black text-teal-400 uppercase tracking-widest\">ISO 13485 Medical Certified<\/span>\n            <\/div>\n            \n            <h1 class=\"text-6xl md:text-8xl font-black text-white leading-[0.9] tracking-tighter\">\n                EMPOWERING <br>\n                <span class=\"text-transparent bg-clip-text bg-gradient-to-r from-teal-400 via-teal-200 to-blue-500 text-glow-teal\">MOTION.<\/span>\n            <\/h1>\n            \n            <p class=\"text-xl text-slate-300 max-w-lg leading-relaxed font-light border-l-4 border-teal-500 pl-6\">\n                Redefining rehabilitation with <strong class=\"text-white\">Mediora Series<\/strong>. Precision-engineered supports for professional recovery and elite performance.\n            <\/p>\n            \n            <div class=\"flex flex-col sm:flex-row gap-5 pt-4\">\n                <a href=\"https:\/\/unicare.com.tr\/?page_id=47\" class=\"group relative px-10 py-5 bg-teal-500 text-slate-950 font-black uppercase tracking-widest overflow-hidden hover:scale-105 transition-transform duration-300 shadow-[0_0_30px_rgba(20,184,166,0.5)] text-center rounded-lg\">\n                    <span class=\"relative z-10 flex items-center justify-center gap-2\">\n                        Explore Collection <i data-lucide=\"arrow-right\" class=\"w-5 h-5 group-hover:translate-x-1 transition-transform\"><\/i>\n                    <\/span>\n                    <div class=\"absolute inset-0 bg-white\/20 translate-y-full group-hover:translate-y-0 transition-transform duration-300\"><\/div>\n                <\/a>\n                <a href=\"https:\/\/unicare.com.tr\/?page_id=4439\" class=\"px-10 py-5 bg-slate-900\/50 border border-slate-600 text-white font-bold uppercase tracking-widest hover:border-teal-400 hover:text-teal-400 hover:bg-slate-900 transition-all text-center rounded-lg backdrop-blur-sm flex items-center justify-center gap-2\">\n                    <i data-lucide=\"users\" class=\"w-5 h-5\"><\/i> Partner With Us\n                <\/a>\n            <\/div>\n            \n            <!-- Trust Signals -->\n            <div class=\"flex items-center gap-8 pt-4 border-t border-slate-800\/50\">\n                <div>\n                    <div class=\"text-3xl font-black text-white\">30+<\/div>\n                    <div class=\"text-[10px] text-slate-500 uppercase tracking-widest\">Countries<\/div>\n                <\/div>\n                <div class=\"w-px h-10 bg-slate-800\"><\/div>\n                <div>\n                    <div class=\"text-3xl font-black text-white\">100%<\/div>\n                    <div class=\"text-[10px] text-slate-500 uppercase tracking-widest\">Quality Control<\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- Right Content (3D Visual) -->\n        <div class=\"relative hidden lg:flex justify-center items-center hero-tilt-container\" id=\"hero-tilt-container\">\n            <!-- Background Decoration Circle -->\n            <div class=\"absolute inset-0 flex items-center justify-center pointer-events-none\">\n                <div class=\"w-[600px] h-[600px] border border-slate-800 rounded-full animate-spin-slow opacity-30 border-dashed\"><\/div>\n                <div class=\"absolute w-[450px] h-[450px] border border-teal-500\/20 rounded-full animate-spin-slow opacity-50\" style=\"animation-direction: reverse; animation-duration: 20s;\"><\/div>\n            <\/div>\n\n            <!-- Main 3D Card -->\n            <div class=\"hero-tilt-card relative w-[420px] h-[580px] glass-card rounded-3xl p-4 group\" id=\"hero-card\">\n                <!-- Inner Image -->\n                <div class=\"relative w-full h-full rounded-2xl overflow-hidden hero-element border border-slate-700\/50 bg-slate-900\">\n                    <img decoding=\"async\" src=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp\" \n                         alt=\"Mediora Product\" \n                         class=\"w-full h-full object-cover opacity-90 group-hover:scale-110 transition-transform duration-700\">\n                    \n                    <!-- Overlay Gradient -->\n                    <div class=\"absolute inset-0 bg-gradient-to-t from-slate-950 via-transparent to-transparent opacity-80\"><\/div>\n                    \n                    <!-- Content Inside Card -->\n                    <div class=\"absolute bottom-6 left-6 right-6 hero-element-deep\">\n                        <div class=\"text-xs text-teal-400 font-bold uppercase tracking-widest mb-1\">Featured<\/div>\n                        <h3 class=\"text-2xl font-bold text-white leading-tight\">Pro-Stabilizer Series<\/h3>\n                        <p class=\"text-sm text-slate-400 mt-2\">Maximum support for ligament recovery.<\/p>\n                    <\/div>\n                <\/div>\n\n                <!-- Floating Badges (Outside Card) -->\n                <div class=\"absolute -top-6 -right-6 bg-slate-800\/90 backdrop-blur-xl p-4 rounded-xl border border-teal-500\/30 shadow-2xl hero-element-deep animate-float-slow\">\n                    <i data-lucide=\"shield-check\" class=\"text-teal-400 w-8 h-8 mb-2\"><\/i>\n                    <div class=\"text-white font-bold text-sm\">Medical Grade<\/div>\n                <\/div>\n\n                <div class=\"absolute top-1\/2 -left-12 bg-slate-800\/90 backdrop-blur-xl px-5 py-3 rounded-xl border border-slate-600 shadow-2xl hero-element-deep animate-float-delayed flex items-center gap-3\">\n                    <i data-lucide=\"wind\" class=\"text-teal-400 w-5 h-5\"><\/i>\n                    <div class=\"text-white font-bold text-xs uppercase tracking-widest\">Breathable<br>Technology<\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    \n    <!-- Scroll Down Indicator -->\n    <div class=\"absolute bottom-8 left-1\/2 -translate-x-1\/2 flex flex-col items-center gap-2 animate-bounce opacity-50 pointer-events-none\">\n        <span class=\"text-[10px] uppercase tracking-widest text-white\">Scroll<\/span>\n        <i data-lucide=\"chevrons-down\" class=\"text-teal-400 w-5 h-5\"><\/i>\n    <\/div>\n<\/header>\n\n<script>\n    lucide.createIcons();\n\n    function toggleMenu() {\n        const menu = document.getElementById('mobile-menu');\n        menu.classList.toggle('translate-x-full');\n    }\n\n    \/\/ 3D Tilt Logic\n    const container = document.getElementById('hero-tilt-container');\n    const card = document.getElementById('hero-card');\n\n    if(container && card) {\n        container.addEventListener('mousemove', (e) => {\n            const rect = container.getBoundingClientRect();\n            const x = e.clientX - rect.left;\n            const y = e.clientY - rect.top;\n            \n            \/\/ Calculate rotation (Max 15deg)\n            const centerX = rect.width \/ 2;\n            const centerY = rect.height \/ 2;\n            \n            const rotateX = ((y - centerY) \/ centerY) * -15;\n            const rotateY = ((x - centerX) \/ centerX) * 15;\n\n            card.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;\n        });\n\n        container.addEventListener('mouseleave', () => {\n            card.style.transform = `rotateX(0deg) rotateY(0deg)`;\n        });\n    }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-c146b7e e-flex e-con-boxed e-con e-parent\" data-id=\"c146b7e\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2e4ef12 elementor-widget elementor-widget-html\" data-id=\"2e4ef12\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Styles baraye 3D Hologram, Scanner va Neon Effects -->\n<style>\n    \/* Pas-zamine Space\/Tech *\/\n    .mission-bg {\n        background: radial-gradient(circle at 50% 50%, #0f172a 0%, #020617 100%);\n    }\n\n    \/* 3D Container *\/\n    .holo-perspective {\n        perspective: 2000px;\n    }\n\n    \/* Card Style Asli *\/\n    .holo-card {\n        background: rgba(15, 23, 42, 0.4); \/* Dark Glass *\/\n        backdrop-filter: blur(12px);\n        -webkit-backdrop-filter: blur(12px);\n        border: 1px solid rgba(45, 212, 191, 0.1);\n        transform-style: preserve-3d;\n        transition: transform 0.1s ease-out, box-shadow 0.3s ease, border-color 0.3s ease;\n        position: relative;\n        overflow: hidden;\n    }\n\n    \/* Hover Effects *\/\n    .holo-card:hover {\n        border-color: rgba(45, 212, 191, 0.6);\n        box-shadow: 0 0 50px rgba(45, 212, 191, 0.2), inset 0 0 20px rgba(45, 212, 191, 0.05);\n        z-index: 10;\n    }\n\n    \/* Scanner Laser Effect (Khat-e Sabz) *\/\n    .holo-card::after {\n        content: '';\n        position: absolute;\n        top: -100%;\n        left: 0;\n        width: 100%;\n        height: 40%;\n        background: linear-gradient(to bottom, transparent, rgba(45, 212, 191, 0.5), transparent);\n        opacity: 0;\n        pointer-events: none;\n        transform: translateZ(1px);\n    }\n    \n    .holo-card:hover::after {\n        opacity: 1;\n        animation: scan 1.5s linear infinite;\n    }\n\n    @keyframes scan {\n        0% { top: -40%; }\n        100% { top: 140%; }\n    }\n\n    \/* Tech Corners (Gushe-haye HUD) *\/\n    .hud-corner {\n        position: absolute;\n        width: 12px;\n        height: 12px;\n        border: 2px solid transparent;\n        transition: all 0.3s ease;\n        opacity: 0.5;\n    }\n    .holo-card:hover .hud-corner { opacity: 1; border-color: #2dd4bf; }\n    .tl { top: 0; left: 0; border-top-width: 2px; border-left-width: 2px; }\n    .tr { top: 0; right: 0; border-top-width: 2px; border-right-width: 2px; }\n    .bl { bottom: 0; left: 0; border-bottom-width: 2px; border-left-width: 2px; }\n    .br { bottom: 0; right: 0; border-bottom-width: 2px; border-right-width: 2px; }\n\n    \/* 3D Elements Dakhel Card *\/\n    .holo-content { transform: translateZ(30px); }\n    .holo-icon { \n        transform: translateZ(50px); \n        filter: drop-shadow(0 0 15px rgba(45, 212, 191, 0.5));\n    }\n    .holo-badge {\n        transform: translateZ(40px);\n    }\n<\/style>\n\n<section id=\"mission\" class=\"relative py-32 mission-bg border-y border-slate-900 overflow-hidden\">\n    \n    <!-- Background Animated Blobs -->\n    <div class=\"absolute inset-0 pointer-events-none\">\n        <div class=\"absolute top-0 right-0 w-[800px] h-[800px] bg-teal-500\/5 rounded-full blur-[120px] animate-pulse\"><\/div>\n        <div class=\"absolute bottom-0 left-0 w-[600px] h-[600px] bg-blue-600\/5 rounded-full blur-[120px]\" style=\"animation-delay: 2s\"><\/div>\n        <!-- Grid Pattern -->\n        <div class=\"absolute inset-0 bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:4rem_4rem] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_50%,#000_70%,transparent_100%)]\"><\/div>\n    <\/div>\n\n    <div class=\"container mx-auto px-6 relative z-10\">\n        <div class=\"grid lg:grid-cols-12 gap-16 items-center\">\n            \n            <!-- Left: Mission & Story (5 Columns) -->\n            <div class=\"lg:col-span-5 space-y-10\">\n                <div class=\"inline-flex items-center gap-3 px-4 py-2 bg-slate-900\/80 border border-teal-500\/30 rounded-r-2xl border-l-4 border-l-teal-500 shadow-lg backdrop-blur-md\">\n                    <i data-lucide=\"globe\" class=\"text-teal-400 w-5 h-5 animate-pulse\"><\/i>\n                    <span class=\"text-xs font-black text-white uppercase tracking-[0.2em]\">Global Excellence<\/span>\n                <\/div>\n\n                <h2 class=\"text-5xl md:text-7xl font-black text-white leading-tight\">\n                    OUR <br>\n                    <span class=\"text-transparent bg-clip-text bg-gradient-to-r from-teal-400 via-cyan-400 to-blue-500 filter drop-shadow-[0_0_15px_rgba(45,212,191,0.3)]\">MISSION<\/span>\n                <\/h2>\n                \n                <p class=\"text-xl text-slate-300 leading-relaxed font-light\">\n                    To engineer innovative orthopedic supports combining <b class=\"text-white\">Comfort<\/b>, <b class=\"text-white\">Durability<\/b>, and <b class=\"text-white\">Modern Technology<\/b>.\n                <\/p>\n\n                <!-- Stats Grid -->\n                <div class=\"grid grid-cols-2 gap-4 pt-6\">\n                    <div class=\"bg-slate-900\/60 p-5 rounded-xl border border-slate-800 backdrop-blur-sm hover:border-teal-500\/30 transition-colors\">\n                        <div class=\"text-4xl font-black text-white mb-1\">30+<\/div>\n                        <div class=\"text-[10px] text-slate-500 uppercase tracking-widest font-bold\">Export Countries<\/div>\n                    <\/div>\n                    <div class=\"bg-slate-900\/60 p-5 rounded-xl border border-slate-800 backdrop-blur-sm hover:border-teal-500\/30 transition-colors\">\n                        <div class=\"text-4xl font-black text-white mb-1\">100%<\/div>\n                        <div class=\"text-[10px] text-slate-500 uppercase tracking-widest font-bold\">Quality Control<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Right: 3D Certificates Grid (7 Columns) -->\n            <div class=\"lg:col-span-7 holo-perspective\">\n                <div class=\"grid grid-cols-1 md:grid-cols-2 gap-5\">\n                    \n                    <!-- 1. ISO 9001 -->\n                    <div class=\"holo-card p-6 rounded-2xl flex items-center gap-4 group cursor-pointer\" onmousemove=\"tiltHolo(event, this)\" onmouseleave=\"resetHolo(this)\">\n                        <div class=\"hud-corner tl\"><\/div><div class=\"hud-corner tr\"><\/div><div class=\"hud-corner bl\"><\/div><div class=\"hud-corner br\"><\/div>\n                        <div class=\"holo-icon w-14 h-14 bg-slate-900 rounded-xl flex items-center justify-center border border-slate-700 group-hover:border-teal-400 group-hover:bg-teal-500\/10 transition-all\">\n                            <i data-lucide=\"shield-check\" class=\"w-7 h-7 text-slate-400 group-hover:text-teal-400\"><\/i>\n                        <\/div>\n                        <div class=\"holo-content\">\n                            <h4 class=\"text-lg font-bold text-white group-hover:text-teal-400 transition-colors\">ISO 9001<\/h4>\n                            <p class=\"text-xs text-slate-500 uppercase tracking-widest\">Quality Management<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- 2. ISO 13485 -->\n                    <div class=\"holo-card p-6 rounded-2xl flex items-center gap-4 group cursor-pointer\" onmousemove=\"tiltHolo(event, this)\" onmouseleave=\"resetHolo(this)\">\n                        <div class=\"hud-corner tl\"><\/div><div class=\"hud-corner tr\"><\/div><div class=\"hud-corner bl\"><\/div><div class=\"hud-corner br\"><\/div>\n                        <div class=\"holo-icon w-14 h-14 bg-slate-900 rounded-xl flex items-center justify-center border border-slate-700 group-hover:border-teal-400 group-hover:bg-teal-500\/10 transition-all\">\n                            <i data-lucide=\"activity\" class=\"w-7 h-7 text-slate-400 group-hover:text-teal-400\"><\/i>\n                        <\/div>\n                        <div class=\"holo-content\">\n                            <h4 class=\"text-lg font-bold text-white group-hover:text-teal-400 transition-colors\">ISO 13485<\/h4>\n                            <p class=\"text-xs text-slate-500 uppercase tracking-widest\">Medical Devices<\/p>\n                        <\/div>\n                        <div class=\"holo-badge absolute top-3 right-3 w-2 h-2 bg-green-500 rounded-full animate-pulse shadow-[0_0_10px_#22c55e]\"><\/div>\n                    <\/div>\n\n                    <!-- 3. CE Declaration of Conformity -->\n                    <div class=\"holo-card p-6 rounded-2xl flex items-center gap-4 group cursor-pointer\" onmousemove=\"tiltHolo(event, this)\" onmouseleave=\"resetHolo(this)\">\n                        <div class=\"hud-corner tl\"><\/div><div class=\"hud-corner tr\"><\/div><div class=\"hud-corner bl\"><\/div><div class=\"hud-corner br\"><\/div>\n                        <div class=\"holo-icon w-14 h-14 bg-slate-900 rounded-xl flex items-center justify-center border border-slate-700 group-hover:border-teal-400 group-hover:bg-teal-500\/10 transition-all\">\n                            <i data-lucide=\"file-check-2\" class=\"w-7 h-7 text-slate-400 group-hover:text-teal-400\"><\/i>\n                        <\/div>\n                        <div class=\"holo-content\">\n                            <h4 class=\"text-lg font-bold text-white group-hover:text-teal-400 transition-colors\">CE Declaration<\/h4>\n                            <p class=\"text-xs text-slate-500 uppercase tracking-widest\">Of Conformity<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- 4. CE-MDR -->\n                    <div class=\"holo-card p-6 rounded-2xl flex items-center gap-4 group cursor-pointer\" onmousemove=\"tiltHolo(event, this)\" onmouseleave=\"resetHolo(this)\">\n                        <div class=\"hud-corner tl\"><\/div><div class=\"hud-corner tr\"><\/div><div class=\"hud-corner bl\"><\/div><div class=\"hud-corner br\"><\/div>\n                        <div class=\"holo-icon w-14 h-14 bg-slate-900 rounded-xl flex items-center justify-center border border-slate-700 group-hover:border-teal-400 group-hover:bg-teal-500\/10 transition-all\">\n                            <i data-lucide=\"microscope\" class=\"w-7 h-7 text-slate-400 group-hover:text-teal-400\"><\/i>\n                        <\/div>\n                        <div class=\"holo-content\">\n                            <h4 class=\"text-lg font-bold text-white group-hover:text-teal-400 transition-colors\">CE-MDR<\/h4>\n                            <p class=\"text-xs text-slate-500 uppercase tracking-widest\">Medical Device Reg.<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- 5. Free Sales Certificate (Wide) -->\n                    <div class=\"holo-card md:col-span-2 p-6 rounded-2xl flex items-center justify-between group cursor-pointer bg-gradient-to-r from-slate-900\/90 to-slate-800\/90\" onmousemove=\"tiltHolo(event, this)\" onmouseleave=\"resetHolo(this)\">\n                        <div class=\"hud-corner tl\"><\/div><div class=\"hud-corner tr\"><\/div><div class=\"hud-corner bl\"><\/div><div class=\"hud-corner br\"><\/div>\n                        \n                        <div class=\"flex items-center gap-5\">\n                            <div class=\"holo-icon w-16 h-16 bg-teal-500\/10 rounded-xl flex items-center justify-center border border-teal-500\/30 text-teal-400\">\n                                <i data-lucide=\"plane\" class=\"w-8 h-8\"><\/i>\n                            <\/div>\n                            <div class=\"holo-content\">\n                                <h4 class=\"text-xl font-bold text-white group-hover:text-teal-400 transition-colors\">Free Sales Certificate<\/h4>\n                                <p class=\"text-xs text-slate-400 uppercase tracking-widest\">Authorized for Global Export<\/p>\n                            <\/div>\n                        <\/div>\n                        <i data-lucide=\"check-circle\" class=\"w-8 h-8 text-teal-500 opacity-30 group-hover:opacity-100 group-hover:scale-110 transition-all holo-content\"><\/i>\n                    <\/div>\n\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Script baraye 3D Tilt Pishrafte -->\n<script>\n    function tiltHolo(event, card) {\n        const rect = card.getBoundingClientRect();\n        const x = event.clientX - rect.left;\n        const y = event.clientY - rect.top;\n        \n        const centerX = rect.width \/ 2;\n        const centerY = rect.height \/ 2;\n        \n        \/\/ Tilt bishtar baraye effect khafan tar\n        const rotateX = ((y - centerY) \/ centerY) * -12; \n        const rotateY = ((x - centerX) \/ centerX) * 12;\n\n        card.style.transform = `perspective(1000px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) scale(1.02)`;\n    }\n\n    function resetHolo(card) {\n        card.style.transform = `perspective(1000px) rotateX(0deg) rotateY(0deg) scale(1)`;\n    }\n    \n    \/\/ Refresh Icons (Age load nashode budan)\n    if(typeof lucide !== 'undefined') {\n        lucide.createIcons();\n    }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-c132205 e-flex e-con-boxed e-con e-parent\" data-id=\"c132205\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d827826 elementor-widget elementor-widget-html\" data-id=\"d827826\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ... existing style ... -->\n<style>\n    \/* ... (Styles ghabli sabet mimunan) ... *\/\n    \n    \/* Background Space & Hexagons *\/\n    .product-bg {\n        background-color: #020617;\n        background-image: \n            radial-gradient(circle at 50% 0%, #1e293b 0%, transparent 70%),\n            url(\"data:image\/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2314b8a6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'\/%3E%3C\/g%3E%3C\/g%3E%3C\/svg%3E\");\n    }\n\n    \/* Product Card (Holographic Style) *\/\n    .prod-card {\n        background: rgba(15, 23, 42, 0.6);\n        backdrop-filter: blur(12px);\n        -webkit-backdrop-filter: blur(12px);\n        border: 1px solid rgba(45, 212, 191, 0.2);\n        box-shadow: 0 0 15px rgba(45, 212, 191, 0.05);\n        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n        overflow: hidden;\n        position: relative;\n        clip-path: polygon(\n            0 0, \n            100% 0, \n            100% 85%, \n            90% 100%, \n            0 100%\n        );\n    }\n\n    \/* Hover State *\/\n    .prod-card:hover {\n        transform: translateY(-5px);\n        border-color: #2dd4bf;\n        box-shadow: 0 0 30px rgba(45, 212, 191, 0.2);\n        z-index: 10;\n    }\n\n    \/* Image Effect *\/\n    .prod-img-container {\n        overflow: hidden;\n        position: relative;\n        border-bottom: 1px solid rgba(45, 212, 191, 0.1);\n    }\n    .prod-img {\n        transition: transform 0.5s ease;\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        opacity: 0.8;\n    }\n    .prod-card:hover .prod-img {\n        transform: scale(1.1);\n        opacity: 1;\n    }\n\n    \/* Status Bar *\/\n    .status-bar {\n        font-family: 'Courier New', monospace;\n        background: rgba(15, 23, 42, 0.8);\n        border: 1px solid #1e293b;\n        color: #2dd4bf;\n        padding: 5px 15px;\n        font-size: 12px;\n        border-radius: 4px;\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n    }\n    .status-dot {\n        width: 8px;\n        height: 8px;\n        background: #2dd4bf;\n        border-radius: 50%;\n        box-shadow: 0 0 10px #2dd4bf;\n        animation: pulse 2s infinite;\n    }\n\n    \/* Glitch Title Animation *\/\n    @keyframes glitch {\n        0% { transform: translate(0); }\n        20% { transform: translate(-2px, 2px); }\n        40% { transform: translate(-2px, -2px); }\n        60% { transform: translate(2px, 2px); }\n        80% { transform: translate(2px, -2px); }\n        100% { transform: translate(0); }\n    }\n    .glitch-text:hover {\n        animation: glitch 0.3s cubic-bezier(.25, .46, .45, .94) both infinite;\n        color: #2dd4bf;\n    }\n\n    \/* Loader *\/\n    .cyber-loader {\n        width: 48px;\n        height: 48px;\n        border: 3px solid #2dd4bf;\n        border-radius: 50%;\n        display: inline-block;\n        position: relative;\n        box-sizing: border-box;\n        animation: rotation 1s linear infinite;\n    }\n    .cyber-loader::after {\n        content: '';  \n        box-sizing: border-box;\n        position: absolute;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n        width: 40px;\n        height: 40px;\n        border-radius: 50%;\n        border: 3px solid transparent;\n        border-bottom-color: #38bdf8;\n        animation: rotation 0.5s linear infinite reverse;\n    }\n    @keyframes rotation {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n    }\n<\/style>\n\n<section id=\"categories\" class=\"py-32 relative overflow-hidden product-bg\">\n    \n    <div class=\"container mx-auto px-6 relative z-10\">\n        \n        <!-- Header Section -->\n        <div class=\"flex flex-col md:flex-row justify-between items-end mb-16 gap-6\">\n            <div class=\"max-w-2xl\">\n                <div class=\"status-bar mb-4\">\n                    <div class=\"status-dot\"><\/div>\n                    <span id=\"connection-status\">SYSTEM ONLINE \/\/ SEARCHING PRODUCTS<\/span>\n                <\/div>\n                <h2 class=\"text-4xl md:text-6xl font-black text-white leading-none glitch-text cursor-default\">\n                    PRODUCT <span class=\"text-transparent bg-clip-text bg-gradient-to-r from-teal-400 to-cyan-500\">DATABASE<\/span>\n                <\/h2>\n            <\/div>\n            \n            <a href=\"https:\/\/unicare.com.tr\/?post_type=product\" class=\"group flex items-center gap-3 px-6 py-3 border border-teal-500\/30 bg-teal-500\/5 hover:bg-teal-500 hover:text-slate-900 transition-all clip-path-polygon\">\n                <span class=\"text-teal-400 group-hover:text-slate-900 font-bold uppercase tracking-widest text-xs\">View Full Catalog<\/span>\n                <i data-lucide=\"external-link\" class=\"w-4 h-4 text-teal-500 group-hover:text-slate-900\"><\/i>\n            <\/a>\n        <\/div>\n\n        <!-- LOADER -->\n        <div id=\"product-loader\" class=\"flex flex-col justify-center items-center py-20 min-h-[400px]\">\n            <div class=\"cyber-loader mb-6\"><\/div>\n            <p class=\"text-teal-400 font-mono text-sm animate-pulse tracking-widest\">ESTABLISHING CONNECTION...<\/p>\n        <\/div>\n\n        <!-- PRODUCT GRID -->\n        <div id=\"dynamic-product-grid\" class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-6 opacity-0 transition-opacity duration-700\">\n            <!-- Products will load here -->\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<!-- WooCommerce Fetch Script -->\n<script>\n    document.addEventListener('DOMContentLoaded', () => {\n        fetchProducts();\n    });\n\n    async function fetchProducts() {\n        const grid = document.getElementById('dynamic-product-grid');\n        const loader = document.getElementById('product-loader');\n        const statusText = document.getElementById('connection-status');\n        \n        const apiUrl = 'https:\/\/unicare.com.tr\/wp-json\/wc\/store\/products?per_page=4'; \n\n        try {\n            statusText.innerText = \"PINGING UNICARE SERVER...\";\n            \n            const response = await fetch(apiUrl);\n            \n            if (!response.ok) throw new Error('Network error');\n            \n            const products = await response.json();\n            \n            if (products.length > 0) {\n                statusText.innerText = \"CONNECTION ESTABLISHED: LIVE DATA\";\n                statusText.style.color = \"#4ade80\"; \n                renderProducts(products, \"Live\");\n            } else {\n                throw new Error('Empty response');\n            }\n\n        } catch (error) {\n            console.warn('Live fetch failed, using Backup Data:', error);\n            statusText.innerText = \"CONNECTION FAILED: DISPLAYING OFFLINE CATALOG\";\n            statusText.style.color = \"#fbbf24\"; \n            \n            \/\/ UPDATED BACKUP DATA with WORKING IMAGES\n            const backupProducts = [\n                {\n                    name: \"Patella Knee Stabilizer\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-intl-patella-and-ligament-support-knee-brace-sports-knee-brace\",\n                    \/\/ Use the working banner image as a high-quality fallback\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp\" }],\n                    description: \"High-performance ligament support.\",\n                    prices: { price: \"View Details\" },\n                    categories: [{name: \"Knee\"}]\n                },\n                {\n                    name: \"Pro-Sport Ankle Guard\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-adjustable-ankle-brace-orthopedic-support-ankle-band\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6920-scaled.webp\" }],\n                    description: \"Reinforced ankle protection.\",\n                    prices: { price: \"View Details\" },\n                    categories: [{name: \"Ankle\"}]\n                },\n                {\n                    name: \"Spine Aligner X\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-posture-corrector-back-and-shoulder-brace\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6931-scaled.webp\" }],\n                    description: \"Ergonomic posture correction system.\",\n                    prices: { price: \"View Details\" },\n                    categories: [{name: \"Spine\"}]\n                },\n                {\n                    name: \"Recovery Arm Sling\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-intl-arm-sling\",\n                    \/\/ Reuse one of the good images to avoid broken links\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp\" }],\n                    description: \"Breathable immobilization mesh.\",\n                    prices: { price: \"View Details\" },\n                    categories: [{name: \"Arm\"}]\n                }\n            ];\n            renderProducts(backupProducts, \"Offline\");\n        }\n    }\n\n    function renderProducts(products, mode) {\n        const grid = document.getElementById('dynamic-product-grid');\n        const loader = document.getElementById('product-loader');\n        \n        grid.innerHTML = ''; \n        \n        products.forEach((product, index) => {\n            let imgUrl = 'https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp'; \/\/ Default safe image\n            \n            if (product.images && product.images.length > 0) {\n                imgUrl = product.images[0].src;\n            }\n\n            let catName = \"Medical\";\n            if (product.categories && product.categories.length > 0) {\n                catName = product.categories[0].name;\n            }\n\n            const cardHtml = `\n                <a href=\"${product.permalink}\" class=\"prod-card group flex flex-col h-full animate-fade-in-up\" style=\"animation-delay: ${index * 100}ms\">\n                    \n                    <div class=\"prod-img-container h-64 relative bg-slate-900\">\n                        <!-- Robust Image Loading with Fallback -->\n                        <img decoding=\"async\" src=\"${imgUrl}\" alt=\"${product.name}\" class=\"prod-img\" loading=\"lazy\" \n                             onerror=\"this.onerror=null;this.src='https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp'\">\n                        \n                        <div class=\"absolute inset-0 bg-[linear-gradient(transparent_50%,rgba(45,212,191,0.1)_50%)] bg-[size:100%_4px] pointer-events-none opacity-0 group-hover:opacity-100 transition-opacity\"><\/div>\n                        \n                        <div class=\"absolute top-0 right-0 bg-slate-900\/80 backdrop-blur border-b border-l border-teal-500\/30 px-3 py-1 text-[10px] text-teal-400 font-mono\">\n                            ${catName.toUpperCase()}\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"p-5 flex flex-col flex-grow relative\">\n                        <div class=\"absolute bottom-0 right-0 w-8 h-8 bg-gradient-to-tl from-teal-500\/20 to-transparent clip-path-polygon\"><\/div>\n\n                        <h3 class=\"text-lg font-bold text-white mb-2 leading-tight group-hover:text-teal-400 transition-colors\">\n                            ${product.name}\n                        <\/h3>\n                        \n                        <div class=\"flex items-center justify-between mt-auto pt-4 border-t border-slate-700\/50\">\n                            <span class=\"text-xs font-mono text-slate-400 group-hover:text-white transition-colors\">\n                                ${mode === 'Live' ? 'IN STOCK' : 'AVAILABLE'}\n                            <\/span>\n                            <span class=\"bg-teal-500 text-slate-900 text-xs font-bold px-3 py-1 rounded-sm group-hover:bg-white transition-colors\">\n                                VIEW\n                            <\/span>\n                        <\/div>\n                    <\/div>\n                <\/a>\n            `;\n            grid.innerHTML += cardHtml;\n        });\n\n        loader.style.display = 'none';\n        grid.classList.remove('opacity-0');\n        \n        if(typeof lucide !== 'undefined') {\n            lucide.createIcons();\n        }\n    }\n<\/script>\n\n<!-- WooCommerce Fetch Script (CORS Fixed) -->\n<script>\n    document.addEventListener('DOMContentLoaded', () => {\n        fetchProducts();\n    });\n\n    async function fetchProducts() {\n        const grid = document.getElementById('dynamic-product-grid');\n        const loader = document.getElementById('product-loader');\n        const statusText = document.getElementById('connection-status');\n        \n        \/\/ Main API URL\n        const targetUrl = 'https:\/\/unicare.com.tr\/wp-json\/wc\/store\/products?per_page=4';\n        \n        \/\/ CORS Proxy (Baraye dor zadan mahdudiyat dar halat preview\/local)\n        \/\/ Note: Vaghti in code ro ruye site asli (unicare.com.tr) gozashtid, niazi be proxy nist.\n        \/\/ Vali inja baraye neshon dadan data vaghei lazeme.\n        const proxyUrl = 'https:\/\/api.allorigins.win\/get?url=' + encodeURIComponent(targetUrl);\n\n        try {\n            statusText.innerText = \"ESTABLISHING SECURE CONNECTION...\";\n            \n            \/\/ Try fetching via Proxy\n            const response = await fetch(proxyUrl);\n            \n            if (!response.ok) throw new Error('Network error');\n            \n            const data = await response.json();\n            \/\/ AllOrigins returns data in 'contents' field as string\n            const products = JSON.parse(data.contents);\n            \n            if (products && products.length > 0) {\n                statusText.innerText = \"CONNECTED: LIVE WOOCOMMERCE DATA\";\n                statusText.style.color = \"#4ade80\"; \/\/ Green\n                renderProducts(products, \"Live\");\n            } else {\n                throw new Error('Empty response');\n            }\n\n        } catch (error) {\n            console.warn('Proxy fetch failed, trying direct...', error);\n            \n            \/\/ Try Direct (Might work if CORS is open)\n            try {\n                const directResponse = await fetch(targetUrl);\n                if(directResponse.ok) {\n                    const directProducts = await directResponse.json();\n                    renderProducts(directProducts, \"Live\");\n                    return;\n                }\n            } catch(e) { console.log(\"Direct failed too\"); }\n\n            statusText.innerText = \"CONNECTION FAILED: USING CACHED DATA\";\n            statusText.style.color = \"#fbbf24\"; \n            \n            \/\/ STATIC FALLBACK (Faghat agar internet\/server ghat bud)\n            const backupProducts = [\n                {\n                    name: \"Patella Knee Stabilizer\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-intl-patella-and-ligament-support-knee-brace-sports-knee-brace\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2025\/12\/MD-600.jpg\" }],\n                    description: \"High-performance ligament support.\",\n                    prices: { price: \"View Details\", currency_symbol: \"\" },\n                    categories: [{name: \"Knee\"}]\n                },\n                {\n                    name: \"Pro-Sport Ankle Guard\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-adjustable-ankle-brace-orthopedic-support-ankle-band\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2025\/12\/MD-700.jpg\" }],\n                    description: \"Reinforced ankle protection.\",\n                    prices: { price: \"View Details\", currency_symbol: \"\" },\n                    categories: [{name: \"Ankle\"}]\n                },\n                {\n                    name: \"Spine Aligner X\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-posture-corrector-back-and-shoulder-brace\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2025\/12\/MD-503.jpg\" }],\n                    description: \"Ergonomic posture correction system.\",\n                    prices: { price: \"View Details\", currency_symbol: \"\" },\n                    categories: [{name: \"Spine\"}]\n                },\n                {\n                    name: \"Recovery Arm Sling\",\n                    permalink: \"https:\/\/unicare.com.tr\/?product=unicare-intl-arm-sling\",\n                    images: [{ src: \"https:\/\/unicare.com.tr\/wp-content\/uploads\/2025\/12\/MD-201.jpg\" }],\n                    description: \"Breathable immobilization mesh.\",\n                    prices: { price: \"View Details\", currency_symbol: \"\" },\n                    categories: [{name: \"Arm\"}]\n                }\n            ];\n            renderProducts(backupProducts, \"Offline\");\n        }\n    }\n\n    function renderProducts(products, mode) {\n        const grid = document.getElementById('dynamic-product-grid');\n        const loader = document.getElementById('product-loader');\n        \n        grid.innerHTML = ''; \n        \n        products.forEach((product, index) => {\n            \/\/ Get High Quality Image if available\n            let imgUrl = 'https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp'; \n            \n            if (product.images && product.images.length > 0) {\n                \/\/ WooCommerce API usually gives 'src'\n                imgUrl = product.images[0].src; \n            }\n\n            let catName = \"Medical\";\n            if (product.categories && product.categories.length > 0) {\n                catName = product.categories[0].name;\n            }\n            \n            \/\/ Handle Price (HTML usually comes from API)\n            let priceDisplay = \"View\";\n            if (product.prices) {\n                priceDisplay = (product.prices.currency_symbol || '') + (product.prices.price || 'View');\n            }\n\n            const cardHtml = `\n                <a href=\"${product.permalink}\" class=\"prod-card group flex flex-col h-full animate-fade-in-up\" style=\"animation-delay: ${index * 100}ms\">\n                    \n                    <div class=\"prod-img-container h-64 relative bg-slate-900\">\n                        <!-- Image with Error Handler -->\n                        <img decoding=\"async\" src=\"${imgUrl}\" alt=\"${product.name}\" class=\"prod-img\" loading=\"lazy\" \n                             onerror=\"this.onerror=null;this.src='https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6938.webp'\">\n                        \n                        <div class=\"absolute inset-0 bg-[linear-gradient(transparent_50%,rgba(45,212,191,0.1)_50%)] bg-[size:100%_4px] pointer-events-none opacity-0 group-hover:opacity-100 transition-opacity\"><\/div>\n                        \n                        <div class=\"absolute top-0 right-0 bg-slate-900\/80 backdrop-blur border-b border-l border-teal-500\/30 px-3 py-1 text-[10px] text-teal-400 font-mono\">\n                            ${catName.toUpperCase()}\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"p-5 flex flex-col flex-grow relative\">\n                        <div class=\"absolute bottom-0 right-0 w-8 h-8 bg-gradient-to-tl from-teal-500\/20 to-transparent clip-path-polygon\"><\/div>\n\n                        <h3 class=\"text-lg font-bold text-white mb-2 leading-tight group-hover:text-teal-400 transition-colors\">\n                            ${product.name}\n                        <\/h3>\n                        \n                        <!-- Short Description Strip HTML Tags -->\n                        <p class=\"text-slate-400 text-xs mb-4 line-clamp-2\">\n                             ${(product.short_description || product.description || '').replace(\/<[^>]*>?\/gm, '')}\n                        <\/p>\n                        \n                        <div class=\"flex items-center justify-between mt-auto pt-4 border-t border-slate-700\/50\">\n                            <span class=\"text-xs font-mono text-slate-400 group-hover:text-white transition-colors\">\n                                ${mode === 'Live' ? 'IN STOCK' : 'AVAILABLE'}\n                            <\/span>\n                            <span class=\"bg-teal-500 text-slate-900 text-xs font-bold px-3 py-1 rounded-sm group-hover:bg-white transition-colors\">\n                                ${priceDisplay}\n                            <\/span>\n                        <\/div>\n                    <\/div>\n                <\/a>\n            `;\n            grid.innerHTML += cardHtml;\n        });\n\n        loader.style.display = 'none';\n        grid.classList.remove('opacity-0');\n        \n        if(typeof lucide !== 'undefined') {\n            lucide.createIcons();\n        }\n    }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-7fea48c e-flex e-con-boxed e-con e-parent\" data-id=\"7fea48c\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a3f2c40 elementor-widget elementor-widget-html\" data-id=\"a3f2c40\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    \/* Background Tech Grid *\/\n    .tech-bg {\n        background-color: #020617;\n        background-image: \n            linear-gradient(rgba(45, 212, 191, 0.03) 1px, transparent 1px),\n            linear-gradient(90deg, rgba(45, 212, 191, 0.03) 1px, transparent 1px);\n        background-size: 50px 50px;\n    }\n\n    \/* Scanner Animation *\/\n    .scan-line {\n        width: 100%;\n        height: 2px;\n        background: #2dd4bf;\n        box-shadow: 0 0 10px #2dd4bf, 0 0 20px #2dd4bf;\n        position: absolute;\n        top: 0;\n        left: 0;\n        animation: scan-vertical 3s linear infinite;\n        opacity: 0.8;\n    }\n    @keyframes scan-vertical {\n        0% { top: 0%; opacity: 0; }\n        10% { opacity: 1; }\n        90% { opacity: 1; }\n        100% { top: 100%; opacity: 0; }\n    }\n\n    \/* Pulse Hotspot *\/\n    .hotspot {\n        position: absolute;\n        width: 12px;\n        height: 12px;\n        background: #2dd4bf;\n        border-radius: 50%;\n        box-shadow: 0 0 0 rgba(45, 212, 191, 0.4);\n        animation: pulse-ring 2s infinite;\n        cursor: pointer;\n        z-index: 20;\n    }\n    .hotspot::after {\n        content: '';\n        position: absolute;\n        top: -4px; left: -4px; right: -4px; bottom: -4px;\n        border: 1px solid #2dd4bf;\n        border-radius: 50%;\n        animation: expand 2s infinite;\n    }\n    @keyframes pulse-ring {\n        0% { transform: scale(0.8); box-shadow: 0 0 0 0 rgba(45, 212, 191, 0.7); }\n        70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(45, 212, 191, 0); }\n        100% { transform: scale(0.8); box-shadow: 0 0 0 0 rgba(45, 212, 191, 0); }\n    }\n\n    \/* Feature Card *\/\n    .tech-card {\n        background: rgba(15, 23, 42, 0.6);\n        border: 1px solid rgba(255, 255, 255, 0.05);\n        transition: all 0.3s ease;\n    }\n    .tech-card:hover {\n        background: rgba(45, 212, 191, 0.05);\n        border-color: rgba(45, 212, 191, 0.3);\n        transform: translateX(10px);\n    }\n    .tech-card:hover .icon-box {\n        background: #2dd4bf;\n        color: #0f172a;\n        box-shadow: 0 0 15px rgba(45, 212, 191, 0.5);\n    }\n<\/style>\n\n<section id=\"technology\" class=\"py-32 tech-bg relative overflow-hidden\">\n    \n    <!-- Floating Particles Decoration -->\n    <div class=\"absolute top-20 left-20 w-32 h-32 bg-teal-500\/10 rounded-full blur-[50px] animate-pulse\"><\/div>\n    <div class=\"absolute bottom-20 right-20 w-64 h-64 bg-blue-600\/10 rounded-full blur-[80px]\"><\/div>\n\n    <div class=\"container mx-auto px-6 relative z-10\">\n        <div class=\"grid lg:grid-cols-2 gap-20 items-center\">\n            \n            <!-- LEFT: Scanner Visual -->\n            <div class=\"relative group\">\n                <!-- Frame & Borders -->\n                <div class=\"absolute -inset-1 bg-gradient-to-r from-teal-500\/20 to-blue-600\/20 rounded-2xl blur opacity-30 group-hover:opacity-60 transition duration-1000\"><\/div>\n                \n                <div class=\"relative bg-slate-900 rounded-2xl border border-slate-700 overflow-hidden shadow-2xl\">\n                    <!-- Tech Header inside Image -->\n                    <div class=\"absolute top-0 left-0 w-full p-4 flex justify-between items-center z-20 bg-gradient-to-b from-black\/80 to-transparent\">\n                        <span class=\"text-[10px] font-mono text-teal-400 uppercase\">System: Active<\/span>\n                        <div class=\"flex gap-1\">\n                            <div class=\"w-1 h-1 bg-teal-500 rounded-full\"><\/div>\n                            <div class=\"w-1 h-1 bg-slate-600 rounded-full\"><\/div>\n                            <div class=\"w-1 h-1 bg-slate-600 rounded-full\"><\/div>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Main Image -->\n                    <img decoding=\"async\" src=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6920-scaled.webp\" \n                         class=\"w-full h-[500px] object-cover opacity-60 mix-blend-luminosity group-hover:mix-blend-normal transition-all duration-700\">\n                    \n                    <!-- Scanner Line -->\n                    <div class=\"scan-line\"><\/div>\n\n                    <!-- Hotspots (Interactive Dots) -->\n                    <div class=\"hotspot\" style=\"top: 30%; left: 45%;\" title=\"Compression Zone\"><\/div>\n                    <div class=\"hotspot\" style=\"top: 60%; left: 35%;\" title=\"Breathable Mesh\"><\/div>\n                    <div class=\"hotspot\" style=\"top: 50%; left: 65%;\" title=\"Stabilizer Ring\"><\/div>\n\n                    <!-- Data Overlay -->\n                    <div class=\"absolute bottom-6 left-6 z-20\">\n                        <div class=\"bg-slate-950\/80 backdrop-blur border border-teal-500\/30 p-4 rounded-xl\">\n                            <h4 class=\"text-white font-bold text-lg mb-1 flex items-center gap-2\">\n                                <i data-lucide=\"cpu\" class=\"w-4 h-4 text-teal-400\"><\/i> Material Science\n                            <\/h4>\n                            <div class=\"text-xs text-slate-400 font-mono space-y-1\">\n                                <p>DENSITY: <span class=\"text-teal-400\">High-Grade Foam<\/span><\/p>\n                                <p>ELASTICITY: <span class=\"text-teal-400\">4-Way Stretch<\/span><\/p>\n                                <p>BREATHABILITY: <span class=\"text-teal-400\">98.5%<\/span><\/p>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- RIGHT: Tech Specs -->\n            <div class=\"space-y-12\">\n                <div>\n                    <span class=\"text-teal-500 font-bold tracking-[0.2em] text-sm uppercase mb-2 block\">Innovation Lab<\/span>\n                    <h2 class=\"text-4xl md:text-5xl font-black text-white leading-tight\">\n                        BIO-ENGINEERED <br>\n                        <span class=\"text-transparent bg-clip-text bg-gradient-to-r from-teal-400 to-blue-500\">PRECISION<\/span>\n                    <\/h2>\n                <\/div>\n                \n                <div class=\"space-y-6\">\n                    \n                    <!-- Feature 1 -->\n                    <div class=\"tech-card p-6 rounded-2xl flex items-start gap-6 group\">\n                        <div class=\"icon-box w-14 h-14 bg-slate-800 rounded-xl flex items-center justify-center border border-slate-700 text-teal-400 transition-all duration-300 shrink-0\">\n                            <i data-lucide=\"thermometer\" class=\"w-7 h-7\"><\/i>\n                        <\/div>\n                        <div>\n                            <h3 class=\"text-xl font-bold text-white mb-2 group-hover:text-teal-400 transition-colors\">Therapeutic Warmth<\/h3>\n                            <p class=\"text-slate-400 leading-relaxed text-sm\">Advanced neoprene compounds retain body heat to accelerate blood circulation and reduce recovery time by 30%.<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Feature 2 -->\n                    <div class=\"tech-card p-6 rounded-2xl flex items-start gap-6 group\">\n                        <div class=\"icon-box w-14 h-14 bg-slate-800 rounded-xl flex items-center justify-center border border-slate-700 text-teal-400 transition-all duration-300 shrink-0\">\n                            <i data-lucide=\"scan-face\" class=\"w-7 h-7\"><\/i>\n                        <\/div>\n                        <div>\n                            <h3 class=\"text-xl font-bold text-white mb-2 group-hover:text-teal-400 transition-colors\">Anatomical 3D Fit<\/h3>\n                            <p class=\"text-slate-400 leading-relaxed text-sm\">Laser-scanned ergonomic designs ensure the brace contours perfectly to the body, preventing slippage during high activity.<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Feature 3 -->\n                    <div class=\"tech-card p-6 rounded-2xl flex items-start gap-6 group\">\n                        <div class=\"icon-box w-14 h-14 bg-slate-800 rounded-xl flex items-center justify-center border border-slate-700 text-teal-400 transition-all duration-300 shrink-0\">\n                            <i data-lucide=\"wind\" class=\"w-7 h-7\"><\/i>\n                        <\/div>\n                        <div>\n                            <h3 class=\"text-xl font-bold text-white mb-2 group-hover:text-teal-400 transition-colors\">Micro-Ventilation<\/h3>\n                            <p class=\"text-slate-400 leading-relaxed text-sm\">Strategic air-mesh integration allows continuous airflow, reducing moisture buildup and ensuring 24\/7 comfort.<\/p>\n                        <\/div>\n                    <\/div>\n\n                <\/div>\n            <\/div>\n\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Script baraye icon ha -->\n<script>\n    if(typeof lucide !== 'undefined') {\n        lucide.createIcons();\n    }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-457eb93 e-flex e-con-boxed e-con e-parent\" data-id=\"457eb93\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bee784b elementor-widget elementor-widget-html\" data-id=\"bee784b\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    \/* Section Background *\/\n    .macbook-section {\n        background-color: #0f172a;\n        position: relative;\n        overflow: hidden;\n        perspective: 1000px; \/* Zaruri baraye 3D *\/\n        padding-top: 100px;\n        padding-bottom: 100px;\n    }\n\n    \/* Background Image *\/\n    .bg-overlay {\n        position: absolute;\n        inset: 0;\n        background-image: url('https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/IMG_6931-scaled.webp');\n        background-size: cover;\n        background-position: center;\n        opacity: 0.1;\n        mix-blend-mode: overlay;\n    }\n\n    \/* 3D Macbook Container *\/\n    .macbook-container {\n        width: 100%;\n        max-width: 800px;\n        margin: 0 auto;\n        position: relative;\n        transform-style: preserve-3d;\n        z-index: 20;\n    }\n\n    \/* Screen (Lid) *\/\n    .macbook-lid {\n        width: 70%;\n        margin: 0 auto;\n        aspect-ratio: 16\/10;\n        background: #000;\n        border-radius: 20px 20px 0 0;\n        border: 2px solid #2d2d2d;\n        border-bottom: none;\n        position: relative;\n        transform-origin: bottom;\n        transform: rotateX(0deg); \/* Initial State *\/\n        transition: transform 0.1s ease-out; \/* Smooth Scroll *\/\n        box-shadow: 0 0 20px rgba(0,0,0,0.5);\n        transform-style: preserve-3d;\n    }\n\n    \/* Webcam *\/\n    .macbook-lid::after {\n        content: '';\n        position: absolute;\n        top: 10px;\n        left: 50%;\n        transform: translateX(-50%);\n        width: 8px;\n        height: 8px;\n        background: #333;\n        border-radius: 50%;\n        box-shadow: 0 0 2px rgba(255,255,255,0.2);\n        z-index: 30;\n    }\n\n    \/* Screen Content (Inner Display) *\/\n    .macbook-screen {\n        position: absolute;\n        top: 2%;\n        left: 2%;\n        width: 96%;\n        height: 94%;\n        background: #1a1a1a;\n        border-radius: 10px 10px 0 0;\n        overflow: hidden;\n        border: 1px solid #333;\n    }\n\n    \/* Iframe for PDF *\/\n    .pdf-viewer {\n        width: 100%;\n        height: 100%;\n        border: none;\n        background: white; \/* PDF needs light bg *\/\n    }\n\n    \/* Keyboard Base *\/\n    .macbook-base {\n        width: 80%;\n        height: 20px;\n        background: linear-gradient(to bottom, #d1d5db, #9ca3af);\n        margin: 0 auto;\n        border-radius: 0 0 20px 20px;\n        position: relative;\n        transform: translateZ(0px); \/* Base sabet ast *\/\n        box-shadow: 0 20px 50px rgba(0,0,0,0.8);\n    }\n    \n    \/* Trackpad Notch *\/\n    .macbook-base::before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 50%;\n        transform: translateX(-50%);\n        width: 15%;\n        height: 8px;\n        background: #6b7280;\n        border-radius: 0 0 5px 5px;\n    }\n\n    \/* Glossy Reflection on Screen *\/\n    .screen-gloss {\n        position: absolute;\n        inset: 0;\n        background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 40%);\n        pointer-events: none; \/* Allows click through to PDF *\/\n        z-index: 10;\n    }\n\n    \/* CTA Content Below *\/\n    .cta-content {\n        text-align: center;\n        margin-top: -50px; \/* Overlap slightly or adjust *\/\n        position: relative;\n        z-index: 30;\n        padding-top: 100px;\n    }\n<\/style>\n\n<section class=\"macbook-section\" id=\"macbook-trigger\">\n    <div class=\"bg-overlay\"><\/div>\n    <div class=\"absolute inset-0 bg-gradient-to-t from-slate-900 via-transparent to-slate-900 pointer-events-none\"><\/div>\n\n    <div class=\"container mx-auto px-6\">\n        \n        <!-- MACBOOK 3D -->\n        <div class=\"macbook-container\">\n            <!-- Screen (Rotates) -->\n            <div class=\"macbook-lid\" id=\"macbook-lid\">\n                <div class=\"macbook-screen\">\n                    <div class=\"screen-gloss\"><\/div>\n                    \n                    <!-- CATALOG PDF EMBED -->\n                    <iframe \n                        src=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf#toolbar=0&navpanes=0&scrollbar=0&view=FitH\" \n                        class=\"pdf-viewer\"\n                        title=\"Unicare Catalog\">\n                    <\/iframe>\n                    \n                <\/div>\n            <\/div>\n            \n            <!-- Keyboard Base -->\n            <div class=\"macbook-base\"><\/div>\n        <\/div>\n\n        <!-- CTA TEXT & BUTTONS -->\n        <div class=\"cta-content\" id=\"cta-text\">\n            <h2 class=\"text-5xl md:text-8xl font-black text-white mb-8 tracking-tighter drop-shadow-2xl\">\n                READY TO <span class=\"text-teal-500\">PARTNER?<\/span>\n            <\/h2>\n            <p class=\"text-xl text-slate-300 mb-12 max-w-2xl mx-auto font-light\">\n                Join our global distribution network. Browse our full catalog directly above or download it for offline use.\n            <\/p>\n            \n            <div class=\"flex flex-col md:flex-row justify-center gap-6\">\n                <a href=\"https:\/\/unicare.com.tr\/?page_id=4439\" class=\"px-12 py-5 bg-teal-500 text-slate-900 font-black text-lg hover:bg-white transition-all transform hover:scale-105 shadow-[0_0_40px_rgba(20,184,166,0.4)] rounded-sm\">\n                    BECOME A DISTRIBUTOR\n                <\/a>\n                <a href=\"https:\/\/unicare.com.tr\/wp-content\/uploads\/2026\/01\/Unicare-Catalogue-3-1-compressed.pdf\" target=\"_blank\" class=\"px-12 py-5 border border-white text-white font-bold text-lg hover:bg-white hover:text-slate-900 transition-all flex items-center justify-center gap-2 rounded-sm backdrop-blur-sm\">\n                    <i data-lucide=\"download\" class=\"w-6 h-6\"><\/i> OPEN FULL PDF\n                <\/a>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<!-- Scroll Animation Script -->\n<script>\n    if(typeof lucide !== 'undefined') lucide.createIcons();\n\n    \/\/ Logic baraye baz shodan Laptop ba Scroll\n    window.addEventListener('scroll', () => {\n        const section = document.getElementById('macbook-trigger');\n        const lid = document.getElementById('macbook-lid');\n        const ctaText = document.getElementById('cta-text');\n        \n        if (!section || !lid) return;\n\n        const rect = section.getBoundingClientRect();\n        const windowHeight = window.innerHeight;\n        \n        \/\/ Calculate scroll progress (0 to 1)\n        let progress = (windowHeight - rect.top) \/ (windowHeight + rect.height);\n        \n        \/\/ Clamp progress between 0 and 1\n        progress = Math.min(Math.max(progress, 0), 1);\n\n        \/\/ Map progress to Rotation Angle\n        \/\/ Start closed (-90) and open up to 0\n        let angle = -90 + (progress * 160); \n        if (angle > 0) angle = 0; \/\/ Lock at fully open\n        \n        \/\/ Apply Transform\n        lid.style.transform = `rotateX(${angle}deg)`;\n        \n        \/\/ Fade in text as it opens\n        if(angle > -20) {\n            ctaText.style.opacity = '1';\n            ctaText.style.transform = 'translateY(0)';\n        } else {\n            ctaText.style.opacity = '0';\n            ctaText.style.transform = 'translateY(20px)';\n        }\n    });\n    \n    \/\/ Set initial text state for animation\n    const ctaText = document.getElementById('cta-text');\n    if(ctaText) {\n        ctaText.style.transition = 'all 0.8s ease-out';\n        ctaText.style.opacity = '0';\n        ctaText.style.transform = 'translateY(20px)';\n    }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-8f63fb5 e-flex e-con-boxed e-con e-parent\" data-id=\"8f63fb5\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bf39c2d elementor-widget elementor-widget-html\" data-id=\"bf39c2d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    \/* Section Background *\/\n    .anatomy-section {\n        background-color: #020617;\n        position: relative;\n        overflow: hidden;\n    }\n\n    \/* Grid Overlay *\/\n    .anatomy-grid {\n        background-image: linear-gradient(rgba(45, 212, 191, 0.05) 1px, transparent 1px),\n        linear-gradient(90deg, rgba(45, 212, 191, 0.05) 1px, transparent 1px);\n        background-size: 40px 40px;\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n    }\n\n    \/* Body SVG Styles *\/\n    .human-body-svg {\n        height: 600px;\n        width: auto;\n        filter: drop-shadow(0 0 10px rgba(45, 212, 191, 0.3));\n    }\n    \n    .body-part {\n        fill: rgba(30, 41, 59, 0.5); \/* Slate 800 transparent *\/\n        stroke: rgba(45, 212, 191, 0.5); \/* Teal stroke *\/\n        stroke-width: 1.5;\n        transition: all 0.3s ease;\n        cursor: pointer;\n    }\n\n    .body-part:hover, .body-part.active {\n        fill: rgba(45, 212, 191, 0.2);\n        stroke: #2dd4bf;\n        stroke-width: 3;\n        filter: drop-shadow(0 0 15px rgba(45, 212, 191, 0.8));\n    }\n\n    \/* Right Side Panel (Dynamic Card) *\/\n    .info-panel {\n        background: rgba(15, 23, 42, 0.8);\n        border: 1px solid rgba(45, 212, 191, 0.3);\n        backdrop-filter: blur(10px);\n        opacity: 0;\n        transform: translateX(50px);\n        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    .info-panel.visible {\n        opacity: 1;\n        transform: translateX(0);\n    }\n<\/style>\n\n<section class=\"anatomy-section py-32 border-t border-slate-900\" id=\"anatomy-trigger\">\n    <div class=\"anatomy-grid\"><\/div>\n    \n    <div class=\"container mx-auto px-6 relative z-10\">\n        <div class=\"text-center mb-16\">\n            <h2 class=\"text-4xl md:text-6xl font-black text-white mb-4\">TARGETED <span class=\"text-teal-500\">RECOVERY<\/span><\/h2>\n            <p class=\"text-slate-400\">Select an area on the holographic model.<\/p>\n        <\/div>\n\n        <div class=\"grid lg:grid-cols-2 gap-12 items-center\">\n            \n            <!-- LEFT: Interactive SVG Body -->\n            <div class=\"relative flex justify-center\">\n                <!-- Inline SVG for Human Body (Simplified Geometric\/Sci-Fi Style) -->\n                <svg class=\"human-body-svg\" viewBox=\"0 0 300 700\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <!-- Head & Neck -->\n                    <path class=\"body-part\" data-target=\"neck\" d=\"M150 20 C130 20 120 40 120 60 C120 80 130 95 150 95 C170 95 180 80 180 60 C180 40 170 20 150 20 Z M135 95 L135 110 L165 110 L165 95 Z\" \/>\n                    \n                    <!-- Shoulders & Chest -->\n                    <path class=\"body-part\" data-target=\"shoulder\" d=\"M110 110 L190 110 L220 140 L220 180 L80 180 L80 140 Z\" \/>\n                    \n                    <!-- Arms (Left & Right) -->\n                    <path class=\"body-part\" data-target=\"arm\" d=\"M80 140 L50 140 L40 250 L60 250 L75 180 Z M220 140 L250 140 L260 250 L240 250 L225 180 Z\" \/>\n                    \n                    <!-- Spine & Waist -->\n                    <path class=\"body-part\" data-target=\"spine\" d=\"M110 180 L190 180 L180 280 L120 280 Z\" \/>\n                    \n                    <!-- Hips -->\n                    <path class=\"body-part\" data-target=\"spine\" d=\"M110 280 L190 280 L200 340 L100 340 Z\" \/>\n                    \n                    <!-- Thighs & Knees -->\n                    <path class=\"body-part\" data-target=\"knee\" d=\"M100 340 L145 340 L140 500 L110 500 Z M155 340 L200 340 L190 500 L160 500 Z\" \/>\n                    \n                    <!-- Calves & Ankles -->\n                    <path class=\"body-part\" data-target=\"ankle\" d=\"M110 500 L140 500 L135 630 L115 630 Z M160 500 L190 500 L185 630 L165 630 Z\" \/>\n                    \n                    <!-- Feet -->\n                    <path class=\"body-part\" data-target=\"ankle\" d=\"M115 630 L135 630 L145 660 L105 660 Z M165 630 L185 630 L195 660 L155 660 Z\" \/>\n                <\/svg>\n                \n                <!-- Floating Labels (Optional, adds tech feel) -->\n                <div class=\"absolute top-10 left-10 text-[10px] text-teal-500\/50 font-mono rotate-90\">SCANNING...<\/div>\n                <div class=\"absolute bottom-10 right-10 text-[10px] text-teal-500\/50 font-mono\">ID: HUMAN_V2<\/div>\n            <\/div>\n\n            <!-- RIGHT: Dynamic Info Panel -->\n            <div class=\"relative h-[400px] flex items-center\">\n                \n                <!-- Default State -->\n                <div id=\"default-msg\" class=\"absolute inset-0 flex flex-col justify-center items-center text-center p-8 border border-slate-800 rounded-2xl border-dashed\">\n                    <i data-lucide=\"scan-line\" class=\"w-16 h-16 text-slate-600 mb-4 animate-pulse\"><\/i>\n                    <h3 class=\"text-2xl font-bold text-slate-500\">SYSTEM STANDBY<\/h3>\n                    <p class=\"text-slate-600 mt-2\">Hover over body parts to identify solutions.<\/p>\n                <\/div>\n\n                <!-- Active Card -->\n                <div id=\"active-panel\" class=\"info-panel w-full p-8 rounded-3xl hidden\">\n                    <div class=\"flex justify-between items-start mb-6\">\n                        <div>\n                            <span id=\"panel-category\" class=\"text-teal-400 font-bold tracking-widest uppercase text-sm\">CATEGORY<\/span>\n                            <h3 id=\"panel-title\" class=\"text-3xl font-black text-white mt-1\">Product Name<\/h3>\n                        <\/div>\n                        <i data-lucide=\"crosshair\" class=\"w-8 h-8 text-teal-500 animate-spin-slow\"><\/i>\n                    <\/div>\n                    \n                    <p id=\"panel-desc\" class=\"text-slate-300 mb-8 leading-relaxed\">\n                        Description goes here...\n                    <\/p>\n\n                    <div class=\"grid grid-cols-2 gap-4 mb-8\">\n                        <div class=\"bg-slate-900\/50 p-3 rounded-lg border border-slate-700\">\n                            <span class=\"block text-slate-500 text-xs uppercase\">Support Level<\/span>\n                            <span class=\"text-white font-bold\">Maximum<\/span>\n                        <\/div>\n                        <div class=\"bg-slate-900\/50 p-3 rounded-lg border border-slate-700\">\n                            <span class=\"block text-slate-500 text-xs uppercase\">Material<\/span>\n                            <span class=\"text-white font-bold\">Neoprene<\/span>\n                        <\/div>\n                    <\/div>\n\n                    <a id=\"panel-link\" href=\"#\" class=\"inline-flex items-center gap-2 bg-teal-500 hover:bg-white text-slate-900 px-6 py-3 rounded-lg font-bold transition-colors w-full justify-center\">\n                        VIEW PRODUCTS <i data-lucide=\"arrow-right\" class=\"w-4 h-4\"><\/i>\n                    <\/a>\n                <\/div>\n\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<script>\n    \/\/ Data Object for Anatomy\n    const anatomyData = {\n        neck: {\n            title: \"Cervical Collars\",\n            category: \"Neck Support\",\n            desc: \"Advanced foam and rigid support for cervical spine alignment. Ideal for whiplash, muscle strain, and post-operative recovery.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=neckcervical\"\n        },\n        shoulder: {\n            title: \"Shoulder Immobilizers\",\n            category: \"Upper Limb\",\n            desc: \"Stabilizing supports for dislocations, rotator cuff injuries, and fractures. Provides secure immobilization.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=shoulder\"\n        },\n        spine: {\n            title: \"Lumbar Corsets\",\n            category: \"Spine & Waist\",\n            desc: \"Ergonomic corsets designed to relieve lower back pain, correct posture, and provide abdominal support.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=lumbarlower-spine\"\n        },\n        arm: {\n            title: \"Elbow & Arm Support\",\n            category: \"Upper Limb\",\n            desc: \"Epicondylitis bands and arm slings. Targeted compression for tennis elbow and secure arm positioning.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=arm\"\n        },\n        knee: {\n            title: \"Knee Stabilizers\",\n            category: \"Lower Limb\",\n            desc: \"From simple patella straps to hinged ligament braces. Designed for ACL\/MCL support and sports protection.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=knee\"\n        },\n        ankle: {\n            title: \"Ankle Guards\",\n            category: \"Foot & Ankle\",\n            desc: \"Rigid and flexible ankle supports to prevent sprains and aid recovery. Features figure-8 straps.\",\n            link: \"https:\/\/unicare.com.tr\/?product_cat=foot-ankle\"\n        }\n    };\n\n    \/\/ Interaction Logic\n    const parts = document.querySelectorAll('.body-part');\n    const panel = document.getElementById('active-panel');\n    const defaultMsg = document.getElementById('default-msg');\n    \n    \/\/ Elements to update\n    const pTitle = document.getElementById('panel-title');\n    const pCat = document.getElementById('panel-category');\n    const pDesc = document.getElementById('panel-desc');\n    const pLink = document.getElementById('panel-link');\n\n    parts.forEach(part => {\n        part.addEventListener('mouseenter', () => {\n            \/\/ Active State\n            parts.forEach(p => p.classList.remove('active'));\n            part.classList.add('active');\n\n            \/\/ Get Data\n            const target = part.getAttribute('data-target');\n            const data = anatomyData[target];\n\n            if(data) {\n                \/\/ Update Content\n                pTitle.innerText = data.title;\n                pCat.innerText = data.category;\n                pDesc.innerText = data.desc;\n                pLink.href = data.link;\n\n                \/\/ Show Panel\n                defaultMsg.style.opacity = '0';\n                setTimeout(() => defaultMsg.style.display = 'none', 300);\n                \n                panel.classList.remove('hidden');\n                setTimeout(() => {\n                    panel.classList.add('visible');\n                }, 10);\n            }\n        });\n    });\n    \n    if(typeof lucide !== 'undefined') lucide.createIcons();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"wd-negative-gap elementor-element elementor-element-2725b9b e-flex e-con-boxed e-con e-parent\" data-id=\"2725b9b\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5bb64d8 elementor-widget elementor-widget-html\" data-id=\"5bb64d8\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<footer id=\"contact\" class=\"bg-slate-950 pt-24 pb-12 border-t border-slate-900\">\n    <div class=\"container mx-auto px-6\">\n        <div class=\"grid md:grid-cols-4 gap-12 mb-16\">\n            <div class=\"col-span-1 md:col-span-2 space-y-6\">\n                <div class=\"flex items-center gap-2\">\n                    <div class=\"w-8 h-8 bg-teal-500 rounded-lg flex items-center justify-center\">\n                        <i data-lucide=\"activity\" class=\"text-slate-900 w-5 h-5\"><\/i>\n                    <\/div>\n                    <span class=\"text-2xl font-black text-white\">MEDIORA<\/span>\n                <\/div>\n                <p class=\"text-slate-500 max-w-sm leading-relaxed\">\n                    \"Empowering Motion. Inspiring Confidence.\"<br>\n                    We strive to make our products accessible across the globe, empowering our partners through strong distribution networks.\n                <\/p>\n                <div class=\"flex gap-4\">\n                    <a href=\"#\" class=\"w-10 h-10 bg-slate-900 rounded-full flex items-center justify-center text-slate-400 hover:bg-teal-500 hover:text-slate-900 transition-colors border border-slate-800\"><i data-lucide=\"instagram\" class=\"w-5 h-5\"><\/i><\/a>\n                    <a href=\"#\" class=\"w-10 h-10 bg-slate-900 rounded-full flex items-center justify-center text-slate-400 hover:bg-teal-500 hover:text-slate-900 transition-colors border border-slate-800\"><i data-lucide=\"linkedin\" class=\"w-5 h-5\"><\/i><\/a>\n                    <a href=\"#\" class=\"w-10 h-10 bg-slate-900 rounded-full flex items-center justify-center text-slate-400 hover:bg-teal-500 hover:text-slate-900 transition-colors border border-slate-800\"><i data-lucide=\"globe\" class=\"w-5 h-5\"><\/i><\/a>\n                <\/div>\n            <\/div>\n\n            <div>\n                <h4 class=\"text-white font-bold uppercase tracking-widest mb-6\">Collections<\/h4>\n                <ul class=\"space-y-4 text-slate-400 text-sm\">\n                    <li><a href=\"https:\/\/unicare.com.tr\/?product_cat=neckcervical\" class=\"hover:text-teal-400 transition-colors\">Neck & Cervical<\/a><\/li>\n                    <li><a href=\"https:\/\/unicare.com.tr\/?product_cat=arm\" class=\"hover:text-teal-400 transition-colors\">Upper Limb (Arm\/Shoulder)<\/a><\/li>\n                    <li><a href=\"https:\/\/unicare.com.tr\/?product_cat=lumbarlower-spine\" class=\"hover:text-teal-400 transition-colors\">Torso & Spine<\/a><\/li>\n                    <li><a href=\"https:\/\/unicare.com.tr\/?product_cat=knee\" class=\"hover:text-teal-400 transition-colors\">Knee Support<\/a><\/li>\n                    <li><a href=\"https:\/\/unicare.com.tr\/?product_cat=foot-ankle\" class=\"hover:text-teal-400 transition-colors\">Foot & Ankle<\/a><\/li>\n                <\/ul>\n            <\/div>\n\n            <div>\n                <h4 class=\"text-white font-bold uppercase tracking-widest mb-6\">Contact<\/h4>\n                <ul class=\"space-y-4 text-slate-400 text-sm\">\n                    <li class=\"flex items-start gap-3\">\n                        <i data-lucide=\"map-pin\" class=\"text-teal-500 shrink-0 w-5 h-5\"><\/i>\n                        <span>Unicare International<br>Industrial Zone, Turkey<\/span>\n                    <\/li>\n                    <li class=\"flex items-center gap-3\">\n                        <i data-lucide=\"globe\" class=\"text-teal-500 shrink-0 w-5 h-5\"><\/i>\n                        <span>www.unicare.com.tr<\/span>\n                    <\/li>\n                    <li class=\"flex items-center gap-3\">\n                        <i data-lucide=\"mail\" class=\"text-teal-500 shrink-0 w-5 h-5\"><\/i>\n                        <span>info@unicare.com.tr<\/span>\n                    <\/li>\n                <\/ul>\n            <\/div>\n        <\/div>\n\n        <div class=\"border-t border-slate-900 pt-8 flex flex-col md:flex-row justify-between items-center gap-4 text-xs text-slate-600\">\n            <p>&copy; 2026 Unicare International. All rights reserved.<\/p>\n            <div class=\"flex gap-6\">\n                <span class=\"hover:text-slate-400 cursor-pointer\">Privacy Policy<\/span>\n                <span class=\"hover:text-slate-400 cursor-pointer\">Terms of Service<\/span>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/footer>\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>Mission Categories Tech Contact Catalogue HOME Mission Categories Technology Download PDF Mission Products Technology Catalogue HOME PRODUCTS TECHNOLOGY Download PDF<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-29505","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/pages\/29505","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/unicare.com.tr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=29505"}],"version-history":[{"count":39,"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/pages\/29505\/revisions"}],"predecessor-version":[{"id":29552,"href":"https:\/\/unicare.com.tr\/index.php?rest_route=\/wp\/v2\/pages\/29505\/revisions\/29552"}],"wp:attachment":[{"href":"https:\/\/unicare.com.tr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=29505"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}