{"id":19433,"date":"2025-04-29T01:26:34","date_gmt":"2025-04-29T01:26:34","guid":{"rendered":"https:\/\/hubsteel.casethemes.net\/?page_id=19433"},"modified":"2026-07-01T12:31:25","modified_gmt":"2026-07-01T07:31:25","slug":"home","status":"publish","type":"page","link":"https:\/\/feznavoi.uz\/ru\/","title":{"rendered":"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"19433\" class=\"elementor elementor-19433\">\n\t\t\t\t<div class=\"elementor-element elementor-element-76e8983 e-con-full e-flex e-con e-parent \" data-id=\"76e8983\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\t\t<div class=\"elementor-element elementor-element-b2b4def elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"b2b4def\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\t:root {\n\t\t--header-height: 158px;\n\t\t--accent: #1db4ce;\n\t\t--ease: cubic-bezier(0.4, 0, 0.2, 1);\n\t}\n\t.mobile-ui {\n\t\tmargin: 0 0 2vw;\n\t\tdisplay: none;\n\t\tflex-shrink: 0;\n\t\tflex-direction: column;\n\t\tbackground: #ffffff;\n\t\tz-index: 5;\n\t\toverflow-y: auto;\n\t\tgap: 2vh;\n\t\tpadding-bottom: env(safe-area-inset-bottom, 0px);\n\t}\n\n\t.hero-content .hero_name {\n\t\tfont-size: clamp(18px, 3.2vh, 26px);\n\t\tfont-weight: 700;\n\t\tmargin: 0;\n\t\tcolor: #0a0a0a;\n\t\ttext-transform: uppercase;\n\t}\n\t.hero-content .hero_desc {\n\t\tfont-size: clamp(13px, 1.6vh, 16px);\n\t\tcolor: #6c757d;\n\t\tmargin-top: 0.4vh;\n\t\tline-height: 1.5;\n\t}\n\n\t.main-marker-list {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 1vh;\n\t}\n\t.mobile-marker-btn {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 1.4vw;\n\t\tbackground: var(--accent);\n\t\tfont-size: clamp(14px, 1.8vh, 17px);\n\t\tfont-weight: 500;\n\t\tcursor: pointer;\n\t\twidth: 100%;\n\t\tborder: none;\n\t\tcolor: #fff;\n\t}\n\t.map {\n\t\tposition: relative;\n\t\twidth: 100vw;\n\t\theight: calc(100vh - var(--header-height));\n\t\theight: calc(100dvh - var(--header-height));\n\t\toverflow: hidden;\n\t\tuser-select: none;\n\t\tflex-shrink: 0;\n\t}\n\n\t.map > img {\n\t\twidth: 150vw;\n\t\tmax-width: 150vw !important;\n\t\theight: auto;\n\t\tposition: absolute;\n\t\ttop: -45vw;\n\t\tleft: -30vw;\n\t\ttransition:\n\t\t\ttop 0.5s ease,\n\t\t\tleft 0.5s ease;\n\t}\n\n\t.overlay {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t}\n\t.marker {\n\t\tposition: absolute;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.2vw;\n\t\tcursor: pointer;\n\t\tanimation: appear 0.3s ease;\n\t}\n\t.marker_data {\n\t\tposition: relative;\n\t\tleft: -1vw;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\t.marker .icon {\n\t\twidth: 2.5vw;\n\t\theight: 2.5vw;\n\t\tmin-width: 2.5vw;\n\t\tline-height: 1;\n\t\ttext-align: center;\n\t\tbackground: var(--accent);\n\t\tcolor: #fff;\n\t\tfont-size: 1.5vw;\n\t\tfont-weight: bold;\n\t\tborder-radius: 10vw;\n\t\ttransition:\n\t\t\tborder-radius 0.2s ease,\n\t\t\tbackground 0.2s ease;\n\t\tz-index: 99;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tanimation: pulse 2.25s infinite cubic-bezier(0.16, 0, 0, 1);\n\t}\n\t.marker .icon span {\n\t\tdisplay: inline-block;\n\t\ttransition: rotate 0.2s ease;\n\t}\n\t.marker .icon.open span {\n\t\trotate: 45deg;\n\t}\n\t.marker.hero_title {\n\t\twidth: 30vw;\n\t\ttop: 17vw;\n\t\tright: 4vw;\n\t\tdisplay: flex;\n\t\tgap: 1vw;\n\t\tflex-direction: column;\n\t\ttext-align: left;\n\t\tcursor: auto !important;\n\t\tcolor: #fff;\n\t\tz-index: 10;\n\t}\n\t.marker.hero_title .hero_name {\n\t\tmargin: 0 0 0.3vw;\n\t\twidth: 100%;\n\t\tfont-size: 5vw;\n\t\ttext-align: left;\n\t\ttext-transform: uppercase;\n\t\tfont-weight: 600;\n\t\tline-height: 1;\n\t}\n\t.marker.hero_title .hero_desc {\n\t\tfont-size: 1vw;\n\t}\n\t.marker .name {\n\t\theight: 2.5vw;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tbackground: #fff;\n\t\tpadding: 0.3vw 1vw;\n\t\tborder-radius: 1vw 0 0 1vw;\n\t\tfont-size: 1.2vw;\n\t\tfont-weight: 500;\n\t\twhite-space: nowrap;\n\t}\n\t.top_side {\n\t\ttop: 10.6vw;\n\t\tleft: 45vw;\n\t}\n\t.left_side {\n\t\ttop: 21.3vw;\n\t\tleft: 30vw;\n\t}\n\t.bottom_side {\n\t\ttop: 32vw;\n\t\tleft: 45vw;\n\t}\n\t.sub_markers {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t}\n\t.sub_marker {\n\t\talign-items: start;\n\t\tanimation: appear 0.3s ease;\n\t}\n\t.map_highlight {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tbackdrop-filter: grayscale(1);\n\t\t-webkit-backdrop-filter: grayscale(1);\n\t\topacity: 0;\n\t\tscale: 1.05;\n\t\tpointer-events: none;\n\t\ttransition: 1.2s;\n\t\tz-index: 3;\n\t}\n\t.map_highlight.active {\n\t\topacity: 1;\n\t\tscale: 1;\n\t}\n\t.map_highlight.top_side {\n\t\tclip-path: polygon(0.1% 100%, -0.05% 50.73%, 31.48% 99.98%, 70.98% 100.13%, 99.33% 50.95%, 99.44% 100.49%);\n\t}\n\t.map_highlight.left_side {\n\t\tclip-path: polygon(75.64% 54.01%, 41.94% -0.51%, 100% 0.17%, 100% 100%, 49.27% 100.49%);\n\t}\n\t.map_highlight.bottom_side {\n\t\tclip-path: polygon(0.04% 84.97%, 0.18% -0.05%, 100% 0, 100% 73%, 53.62% 0, 49.08% 0);\n\t}\n\t.hover_masks {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tz-index: 4;\n\t\tpointer-events: none;\n\t}\n\t.hover_mask {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tbackdrop-filter: grayscale(1);\n\t\t-webkit-backdrop-filter: grayscale(1);\n\t\topacity: 0;\n\t\ttransition: opacity 0.2s var(--ease);\n\t}\n\t.hover_mask.top_side {\n\t\tclip-path: polygon(51.21% 49.4%, 20.43% 0.02%, 81.06% 0.34%);\n\t}\n\t.hover_mask.left_side {\n\t\tclip-path: polygon(0.07% 100.08%, 0.08% 0.09%, 14.65% 0.29%, 48.06% 51.19%, 19.75% 100.13%);\n\t}\n\t.hover_mask.bottom_side {\n\t\tclip-path: polygon(80.78% 100.23%, 23.68% 100.26%, 50.75% 54.5%);\n\t}\n\t.hover_mask.right_side {\n\t\tclip-path: polygon(81.06% 0.34%, 100% 0%, 100% 100%, 80.78% 100.23%, 50.75% 54.5%, 51.21% 49.4%);\n\t}\n\t.map.hover-top_side .hover_mask.left_side,\n\t.map.hover-top_side .hover_mask.bottom_side {\n\t\topacity: 1;\n\t}\n\t.map.hover-left_side .hover_mask.top_side,\n\t.map.hover-left_side .hover_mask.bottom_side {\n\t\topacity: 1;\n\t}\n\t.map.hover-bottom_side .hover_mask.top_side,\n\t.map.hover-bottom_side .hover_mask.left_side {\n\t\topacity: 1;\n\t}\n\t.map.is_zoomed .hover_masks {\n\t\topacity: 0;\n\t\tpointer-events: none;\n\t}\n\t.hover_hitareas {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tz-index: 2;\n\t}\n\t.hover_hit {\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tcursor: pointer;\n\t}\n\t.hover_hit.top_side {\n\t\tclip-path: polygon(51.05% 53.86%, 12.87% 0.14%, 85.73% -0.03%);\n\t}\n\t.hover_hit.left_side {\n\t\tclip-path: polygon(0.07% 100.08%, 0.08% 0.09%, 20.27% 0.04%, 50.85% 53.54%, 26.21% 100.13%);\n\t}\n\t.hover_hit.bottom_side {\n\t\tclip-path: polygon(83.83% 100.35%, 22.05% 100.01%, 50.86% 53.14%);\n\t}\n\t.map.is_zoomed .hover_hitareas {\n\t\tpointer-events: none;\n\t}\n\n\t.desc {\n\t\tmargin-top: 0;\n\t\tpadding: 1vw;\n\t\tfont-size: 1vw;\n\t\tbackground: white;\n\t\tmin-width: 20vw;\n\t\tmax-width: 30vw;\n\t\tline-height: 1.5;\n\t\toverflow: hidden;\n\t\tmax-height: 0;\n\t\topacity: 0;\n\t\ttransition:\n\t\t\tmax-height 0.35s ease,\n\t\t\topacity 0.25s ease,\n\t\t\tmargin-top 0.35s ease,\n\t\t\tpadding 0.35s ease,\n\t\t\ttransform 0.3s ease;\n\t}\n\t.desc.open {\n\t\tmargin-top: 0.5vw;\n\t\tmax-height: 14vw;\n\t\topacity: 1;\n\t\ttransform: translateY(0);\n\t}\n\t@keyframes pulse {\n\t\t0% {\n\t\t\tbox-shadow: 0 0 0 0px var(--accent);\n\t\t}\n\t\t100% {\n\t\t\tbox-shadow: 0 0 0 2vw rgba(29, 180, 206, 0);\n\t\t}\n\t}\n\t@keyframes appear {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: scale(0.8);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: scale(1);\n\t\t}\n\t}\n\t.back_button {\n\t\tposition: fixed;\n\t\ttop: 1vw;\n\t\tleft: 1vw;\n\t\tz-index: 130;\n\t\tdisplay: none;\n\t\talign-items: center;\n\t\tgap: 0.6vw;\n\t\tborder: none;\n\t\tborder-radius: 999px;\n\t\tbackground: #fff;\n\t\tpadding: 0.9vh 1.6vw 0.9vh 1.2vw;\n\t\tfont: inherit;\n\t\tfont-weight: 600;\n\t\tfont-size: 1.3vw;\n\t\tbox-shadow: 0 0.6vh 1.6vh rgba(0, 0, 0, 0.25);\n\t\tcursor: pointer;\n\t}\n\t.back_button.is_visible {\n\t\tdisplay: inline-flex;\n\t}\n\t.back_icon {\n\t\tfont-size: 1.6vw;\n\t\tline-height: 1;\n\t}\n\n\t.is_hidden_marker {\n\t\tdisplay: none !important;\n\t}\n\t@media only screen and (max-width: 768px) {\n\t\t:root {\n\t\t\t--header-height: 0vh;\n\t\t}\n\n\t\tbody {\n\t\t\tflex-direction: column;\n\t\t\theight: 100dvh;\n\t\t}\n\t\t.mobile-ui {\n\t\t\tdisplay: flex;\n\t\t}\n\t\t.map {\n\t\t\theight: 20vh;\n\t\t\tmin-height: 160px;\n\t\t\tflex-shrink: 0;\n\t\t}\n\t\t.marker.hero_title,\n\t\t.marker.top_side,\n\t\t.marker.left_side,\n\t\t.marker.bottom_side {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t.hover_masks {\n\t\t\tdisplay: none;\n\t\t}\n\t\t.sub_marker .icon {\n\t\t\twidth: 2.2vw !important;\n\t\t\theight: 2.2vw !important;\n\t\t\tmin-width: 2.2vw !important;\n\t\t\tfont-size: 1.2vw !important;\n\t\t\tanimation: none !important;\n\t\t}\n\t\t.sub_marker .name {\n\t\t\tfont-size: 0.9vw !important;\n\t\t\tpadding: 0.2vw 0.8vw !important;\n\t\t\theight: auto !important;\n\t\t\tborder-radius: 0.4vw !important;\n\t\t\twhite-space: nowrap;\n\t\t}\n\t\t.sub_marker .desc {\n\t\t\tfont-size: 0.9vw !important;\n\t\t\tmin-width: 10vw !important;\n\t\t\tmax-width: 14vw !important;\n\t\t\tpadding: 0.4vw 0.8vw !important;\n\t\t}\n\t\t.sub_marker .desc.open {\n\t\t\tmax-height: 8vh !important;\n\t\t}\n\t\t.back_button {\n\t\t\tposition: absolute;\n\t\t\ttop: 1.2vh;\n\t\t\tleft: 1.2vw;\n\t\t\tbackground: rgba(0, 0, 0, 0.65);\n\t\t\tcolor: #fff;\n\t\t\tborder: none;\n\t\t\tpadding: 0.6vh 1.4vw;\n\t\t\tborder-radius: 2vh;\n\t\t\tfont-size: 1.3vh;\n\t\t\tbackdrop-filter: blur(0.4vh);\n\t\t\t-webkit-backdrop-filter: blur(0.4vh);\n\t\t\tbox-shadow: none;\n\t\t}\n\t}\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.marker,\n\t\t.marker .icon,\n\t\t.sub_marker {\n\t\t\tanimation: none !important;\n\t\t}\n\t\t.map > img,\n\t\t.desc,\n\t\t.mobile-marker-btn,\n\t\t.hover_mask {\n\t\t\ttransition: none !important;\n\t\t}\n\t}\n<\/style>\n<div class=\"mobile-ui\">\n\t<div class=\"hero-content\">\n\t\t<div class=\"hero_name\">FEZ Navoi<\/div>\n\t\t<div class=\"hero_desc\">\n\t\t\tLorem ipsum dolor sit, amet consectetur adipisicing elit. Rerum, quisquam nesciunt? Ut accusantium voluptate voluptatem mollitia\n\t\t\tdolores nam natus et.\n\t\t<\/div>\n\t<\/div>\n\t<div class=\"main-marker-list\">\n\t\t<button class=\"mobile-marker-btn\" data-zone=\"top_side\">Infrastructure<\/button>\n\t\t<button class=\"mobile-marker-btn\" data-zone=\"left_side\">Build Object<\/button>\n\t\t<button class=\"mobile-marker-btn\" data-zone=\"bottom_side\">Rent Building<\/button>\n\t<\/div>\n<\/div>\n<main class=\"map\">\n\t<img decoding=\"async\" src=\"bg.png\" alt=\"Map\" \/>\n\t<div class=\"map_highlight\"><\/div>\n\t<div class=\"overlay\">\n\t\t<div class=\"hover_masks\">\n\t\t\t<div class=\"hover_mask top_side\"><\/div>\n\t\t\t<div class=\"hover_mask left_side\"><\/div>\n\t\t\t<div class=\"hover_mask bottom_side\"><\/div>\n\t\t\t<div class=\"hover_mask right_side\"><\/div>\n\t\t<\/div>\n\t\t<div class=\"hover_hitareas\">\n\t\t\t<div class=\"hover_hit top_side\" data-zone=\"top_side\"><\/div>\n\t\t\t<div class=\"hover_hit left_side\" data-zone=\"left_side\"><\/div>\n\t\t\t<div class=\"hover_hit bottom_side\" data-zone=\"bottom_side\"><\/div>\n\t\t<\/div>\n\t\t<div class=\"sub_markers\"><\/div>\n\t\t<div class=\"marker top_side\" data-zone=\"top_side\">\n\t\t\t<div class=\"icon\"><span>+<\/span><\/div>\n\t\t\t<div class=\"marker_data\">\n\t\t\t\t<div class=\"name\">Infrastructure<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"marker hero_title\">\n\t\t\t<div class=\"hero_name\">FEZ Navoi<\/div>\n\t\t\t<div class=\"hero_desc\">\n\t\t\t\tLorem ipsum dolor, sit amet consectetur adipisicing elit. Ex est quod magni corporis velit sit suscipit, neque nostrum magnam vitae\n\t\t\t\tmolestiae minima perferendis excepturi, necessitatibus provident eaque amet quasi commodi!\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"marker bottom_side\" data-zone=\"bottom_side\">\n\t\t\t<div class=\"icon\"><span>+<\/span><\/div>\n\t\t\t<div class=\"marker_data\">\n\t\t\t\t<div class=\"name\">Rent Building<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div class=\"marker left_side\" data-zone=\"left_side\">\n\t\t\t<div class=\"icon\"><span>+<\/span><\/div>\n\t\t\t<div class=\"marker_data\">\n\t\t\t\t<div class=\"name\">Build Object<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t<button class=\"back_button\" aria-label=\"Orqaga qaytish\">\n\t\t<span class=\"back_icon\">\u2190<\/span>\n\t\t<span>Back<\/span>\n\t<\/button>\n<\/main>\n<script>\n\t;(function () {\n\t\tconst mapEl = document.querySelector('.map')\n\t\tconst img = document.querySelector('.map > img')\n\t\tconst mainMarkers = document.querySelectorAll('.marker.top_side, .marker.left_side, .marker.bottom_side, .marker.hero_title')\n\t\tconst hoverHitAreas = document.querySelectorAll('.hover_hit[data-zone]')\n\t\tconst subMarkersContainer = document.querySelector('.sub_markers')\n\t\tconst zone = document.querySelector('.map_highlight')\n\t\tconst backButton = document.querySelector('.back_button')\n\t\tconst initialState = {\n\t\t\ttop: '-45vw',\n\t\t\tleft: '-30vw',\n\t\t}\n\t\tconst HOVER_ZONES = ['top_side', 'left_side', 'bottom_side']\n\n\t\tconst zoneConfig = {\n\t\t\ttop_side: {\n\t\t\t\tcategory: 'infrastructure',\n\t\t\t\tdesktop: { top: '-10vw', left: '-30vw' },\n\t\t\t},\n\t\t\tleft_side: {\n\t\t\t\tcategory: 'build',\n\t\t\t\tdesktop: { top: '-45vw', left: '0vw' },\n\t\t\t},\n\t\t\tbottom_side: {\n\t\t\t\tcategory: 'rent',\n\t\t\t\tdesktop: { top: '-70vw', left: '-30vw' },\n\t\t\t},\n\t\t}\n\n\t\tconst markerData = {\n\t\t\tinfrastructure: [\n\t\t\t\t{ text: 'Road Network', info: 'Main transportation infrastructure.', top: '15%', left: '25%' },\n\t\t\t\t{ text: 'Power Station', info: 'Industrial power supply.', top: '25%', left: '55%' },\n\t\t\t\t{ text: 'Water Supply', info: 'Water distribution system.', top: '40%', left: '35%' },\n\t\t\t\t{ text: 'Gas Pipeline', info: 'Natural gas network.', top: '55%', left: '65%' },\n\t\t\t\t{ text: 'Fiber Internet', info: 'High-speed fiber connection.', top: '70%', left: '45%' },\n\t\t\t],\n\t\t\tbuild: [\n\t\t\t\t{ text: 'Warehouse A', info: '5000m\u00b2 warehouse.', top: '15%', left: '15%' },\n\t\t\t\t{ text: 'Warehouse B', info: '3000m\u00b2 warehouse.', top: '35%', left: '35%' },\n\t\t\t\t{ text: 'Factory Block', info: 'Manufacturing facilities.', top: '38%', left: '10%' },\n\t\t\t\t{ text: 'Office Center', info: 'Administrative offices.', top: '55%', left: '5%' },\n\t\t\t\t{ text: 'Logistics Hub', info: 'Distribution center.', top: '70%', left: '15%' },\n\t\t\t],\n\t\t\trent: [\n\t\t\t\t{ text: 'Building 101', info: 'Available for rent.', top: '65%', left: '25%' },\n\t\t\t\t{ text: 'Building 102', info: 'Available for rent.', top: '25%', left: '35%' },\n\t\t\t\t{ text: 'Building 103', info: 'Available for rent.', top: '45%', left: '35%' },\n\t\t\t\t{ text: 'Building 104', info: 'Available for rent.', top: '60%', left: '55%' },\n\t\t\t\t{ text: 'Building 105', info: 'Available for rent.', top: '80%', left: '45%' },\n\t\t\t],\n\t\t}\n\n\t\tfunction hideMainMarkers() {\n\t\t\tmainMarkers.forEach((m) => m.classList.add('is_hidden_marker'))\n\t\t}\n\n\t\tfunction showMainMarkers() {\n\t\t\tmainMarkers.forEach((m) => m.classList.remove('is_hidden_marker'))\n\t\t}\n\n\t\tfunction highlightZone(type) {\n\t\t\tzone.className = `map_highlight active ${type}`\n\t\t}\n\n\t\tfunction clearZone() {\n\t\t\tzone.className = 'map_highlight'\n\t\t}\n\n\t\tfunction closeAllSubDescs() {\n\t\t\tdocument.querySelectorAll('.sub_marker .desc').forEach((d) => d.classList.remove('open'))\n\t\t\tdocument.querySelectorAll('.sub_marker .icon').forEach((i) => i.classList.remove('open'))\n\t\t}\n\t\tfunction clearHoverState() {\n\t\t\tHOVER_ZONES.forEach((z) => mapEl.classList.remove(`hover-${z}`))\n\t\t}\n\n\t\tfunction showSubMarkers(type) {\n\t\t\tsubMarkersContainer.innerHTML = ''\n\t\t\tsubMarkersContainer.style.display = 'block'\n\t\t\tmarkerData[type].forEach((marker) => {\n\t\t\t\tconst el = document.createElement('div')\n\t\t\t\tel.className = 'marker sub_marker'\n\t\t\t\tel.style.top = marker.top\n\t\t\t\tel.style.left = marker.left\n\t\t\t\tel.innerHTML = `\n\t\t\t\t\t\t<div class='icon'><span>+<\/span><\/div>\n\t\t\t\t\t\t<div class=\"marker_data\">\n\t\t\t\t\t\t\t<div class=\"name\">${marker.text}<\/div>\n\t\t\t\t\t\t\t<div class=\"desc\">${marker.info}<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t`\n\t\t\t\tel.addEventListener('click', (e) => {\n\t\t\t\t\te.stopPropagation()\n\t\t\t\t\tconst icon = el.querySelector('.icon')\n\t\t\t\t\tconst desc = el.querySelector('.desc')\n\t\t\t\t\tconst willOpen = !desc.classList.contains('open')\n\t\t\t\t\tdocument.querySelectorAll('.sub_marker').forEach((other) => {\n\t\t\t\t\t\tif (other !== el) {\n\t\t\t\t\t\t\tother.querySelector('.icon').classList.remove('open')\n\t\t\t\t\t\t\tother.querySelector('.desc').classList.remove('open')\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t\ticon.classList.toggle('open', willOpen)\n\t\t\t\t\tdesc.classList.toggle('open', willOpen)\n\t\t\t\t})\n\t\t\t\tsubMarkersContainer.appendChild(el)\n\t\t\t})\n\t\t}\n\n\t\tfunction openZone(zoneKey) {\n\t\t\tconst cfg = zoneConfig[zoneKey]\n\t\t\tif (!cfg) return\n\n\t\t\thideMainMarkers()\n\t\t\tif (cfg.desktop) {\n\t\t\t\tif (cfg.desktop.top !== undefined) img.style.top = cfg.desktop.top\n\t\t\t\tif (cfg.desktop.left !== undefined) img.style.left = cfg.desktop.left\n\t\t\t}\n\n\t\t\thighlightZone(zoneKey)\n\t\t\tshowSubMarkers(cfg.category)\n\t\t\tbackButton.classList.add('is_visible')\n\t\t\tclearHoverState()\n\t\t\tmapEl.classList.add('is_zoomed')\n\t\t}\n\n\t\tfunction resetMap() {\n\t\t\timg.style.top = initialState.top\n\t\t\timg.style.left = initialState.left\n\n\t\t\tshowMainMarkers()\n\t\t\tcloseAllSubDescs()\n\t\t\tsubMarkersContainer.innerHTML = ''\n\t\t\tsubMarkersContainer.style.display = 'none'\n\t\t\tclearZone()\n\t\t\tbackButton.classList.remove('is_visible')\n\n\t\t\tclearHoverState()\n\t\t\tmapEl.classList.remove('is_zoomed')\n\t\t}\n\n\t\tdocument.querySelectorAll('[data-zone]').forEach((el) => {\n\t\t\tel.addEventListener('click', (e) => {\n\t\t\t\te.stopPropagation()\n\t\t\t\topenZone(el.dataset.zone)\n\t\t\t})\n\t\t})\n\t\thoverHitAreas.forEach((hit) => {\n\t\t\thit.addEventListener('mouseenter', () => {\n\t\t\t\tif (mapEl.classList.contains('is_zoomed')) return\n\t\t\t\tmapEl.classList.add(`hover-${hit.dataset.zone}`)\n\t\t\t})\n\t\t\thit.addEventListener('mouseleave', () => {\n\t\t\t\tmapEl.classList.remove(`hover-${hit.dataset.zone}`)\n\t\t\t})\n\t\t})\n\n\t\tbackButton.addEventListener('click', (e) => {\n\t\t\te.stopPropagation()\n\t\t\tresetMap()\n\t\t})\n\t\twindow.addEventListener('wheel', (e) => {\n\t\t\tif (e.deltaY > 0) {\n\t\t\t\tresetMap()\n\t\t\t}\n\t\t})\n\t\tdocument.addEventListener('click', () => {\n\t\t\tcloseAllSubDescs()\n\t\t})\n\t})()\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>FEZ Navoi Lorem ipsum dolor sit, amet consectetur adipisicing elit. Rerum, quisquam nesciunt? Ut accusantium voluptate voluptatem mollitia dolores nam natus et. Infrastructure Build Object Rent Building + Infrastructure FEZ Navoi Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ex est quod magni corporis velit sit suscipit, neque nostrum magnam vitae molestiae minima perferendis excepturi, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-19433","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/pages\/19433","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/comments?post=19433"}],"version-history":[{"count":159,"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/pages\/19433\/revisions"}],"predecessor-version":[{"id":23799,"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/pages\/19433\/revisions\/23799"}],"wp:attachment":[{"href":"https:\/\/feznavoi.uz\/ru\/wp-json\/wp\/v2\/media?parent=19433"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}