{"id":2172,"date":"2026-10-05T14:11:24","date_gmt":"2026-10-05T10:41:24","guid":{"rendered":"https:\/\/matris.ir\/?page_id=2172"},"modified":"2026-10-05T14:54:05","modified_gmt":"2026-10-05T11:24:05","slug":"test","status":"publish","type":"page","link":"https:\/\/matris.ir\/en\/test\/","title":{"rendered":"test"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2172\" class=\"elementor elementor-2172\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0513a25 e-con-full e-flex e-con e-parent\" data-id=\"0513a25\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-da1bca3 elementor-widget elementor-widget-html\" data-id=\"da1bca3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\n     MATRIS HERO \u2014 IMAGE SEQUENCE (\u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0631\u0648\u06cc Canvas)\n     \u0646\u0633\u062e\u0647\u200c\u06cc \u0628\u0647\u06cc\u0646\u0647 \u0628\u0631\u0627\u06cc \u0647\u0645\u0647\u200c\u06cc \u06af\u0648\u0634\u06cc\u200c\u0647\u0627 \u0648 \u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u06a9\u0646\u062f\n     \u0641\u0642\u0637 \u0628\u062e\u0634 CONFIG \u0631\u0627 \u067e\u0631 \u06a9\u0646\u06cc\u062f.\n     (\u0627\u06af\u0631 \u0622\u062f\u0631\u0633 \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0631\u0627 \u0639\u0648\u0636 \u06a9\u0631\u062f\u06cc\u062f\u060c \u062f\u0648 \u062e\u0637 PRELOAD \u067e\u0627\u06cc\u06cc\u0646 \u0631\u0627 \u0647\u0645 \u0639\u0648\u0636 \u06a9\u0646\u06cc\u062f.)\n     ========================================================= -->\n\n<!-- 0) PRELOAD \u2014 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644\u060c \u0642\u0628\u0644 \u0627\u0632 \u0627\u062c\u0631\u0627\u06cc \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u062f\u0627\u0646\u0644\u0648\u062f \u0645\u06cc\u200c\u0634\u0648\u062f \u062a\u0627 \u0635\u0641\u062d\u0647 \u0645\u0634\u06a9\u06cc \u0646\u0645\u0627\u0646\u062f.\n     \u0622\u062f\u0631\u0633\u200c\u0647\u0627 \u0628\u0627\u06cc\u062f \u062f\u0642\u06cc\u0642\u0627\u064b \u0647\u0645\u0627\u0646 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644\u0650 CONFIG \u0628\u0627\u0634\u0646\u062f. -->\n<link rel=\"preload\" as=\"image\" type=\"image\/webp\" fetchpriority=\"high\" media=\"(min-width:768px)\" href=\"https:\/\/matris.ir\/wp-content\/uploads\/hero-frames\/desktop\/frame_001.webp\">\n<link rel=\"preload\" as=\"image\" type=\"image\/webp\" fetchpriority=\"high\" media=\"(max-width:767px)\" href=\"https:\/\/matris.ir\/wp-content\/uploads\/hero-frames\/mobile\/frame_001.webp\">\n\n<!-- 1) HOST -->\n<div id=\"matris-hero-host\" style=\"all:initial!important;display:block!important;width:100%!important;max-width:100%!important;background:#08080b!important;color-scheme:only light!important;forced-color-adjust:none!important;isolation:isolate!important;mix-blend-mode:normal!important;filter:none!important;opacity:1!important;\"><\/div>\n\n\n<!-- 2) TEMPLATE -->\n<template id=\"matris-hero-template\">\n<section id=\"matris-hero-isolated\" dir=\"rtl\">\n<style>\n#matris-hero-isolated,#matris-hero-isolated *,#matris-hero-isolated *::before,#matris-hero-isolated *::after{box-sizing:border-box}\n\n#matris-hero-isolated{--matris-bg:#08080b;--matris-white:#fff;--matris-pink:#eb008b;position:relative;display:block;width:100%;max-width:100%;margin:0;padding:0;background:var(--matris-bg);color:#fff;overflow-x:clip;isolation:isolate;font-family:\"IranYekanX\",sans-serif!important;contain:layout paint style}\n\n#matris-hero-isolated .matris-hero-section{position:relative;width:100%;height:620vh;overflow-anchor:none;margin:0;padding:0;background:#08080b;overflow:clip;isolation:isolate}\n\n#matris-hero-isolated .matris-hero-sticky{position:sticky;top:0;width:100%;height:100vh;min-height:520px;margin:0;padding:0;overflow:hidden;background:#08080b;isolation:isolate}\n\n#matris-hero-isolated .matris-hero-canvas{position:absolute;top:0;left:0;inset:0;display:block;width:100%;height:100%;margin:0;padding:0;background:#08080b;z-index:1;pointer-events:none}\n\n#matris-hero-isolated .matris-hero-vignette{position:absolute;top:0;left:0;inset:0;width:100%;height:100%;margin:0;padding:0;z-index:10;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 35%,rgba(0,0,0,.18) 72%,rgba(0,0,0,.62) 100%),linear-gradient(90deg,rgba(0,0,0,.24),transparent 28%,transparent 72%,rgba(0,0,0,.24))}\n\n\/* SAFE AREA \u2014 \u0645\u062a\u0646\u200c\u0647\u0627 \u0648 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0627\u0633\u06a9\u0631\u0648\u0644 \u062f\u0627\u062e\u0644 \u0627\u06cc\u0646 \u0628\u0627\u06a9\u0633 \u0686\u06cc\u062f\u0647 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f.\n   \u062f\u0631 \u0645\u0648\u0628\u0627\u06cc\u0644 \u0627\u0631\u062a\u0641\u0627\u0639\u0634 \u00ab\u06a9\u0648\u0686\u06a9\u200c\u062a\u0631\u06cc\u0646\u00bb \u0627\u0631\u062a\u0641\u0627\u0639 \u0635\u0641\u062d\u0647 \u0627\u0633\u062a (\u0648\u0642\u062a\u06cc \u0646\u0648\u0627\u0631 \u0622\u062f\u0631\u0633 \u0628\u0627\u0632 \u0627\u0633\u062a)\u060c\n   \u0648\u0644\u06cc \u062e\u0648\u062f\u0650 \u062a\u0635\u0648\u06cc\u0631 \u062a\u0627 \u00ab\u0628\u0632\u0631\u06af\u200c\u062a\u0631\u06cc\u0646\u00bb \u0627\u0631\u062a\u0641\u0627\u0639 \u0645\u06cc\u200c\u0631\u0648\u062f \u062a\u0627 \u0628\u0627 \u062c\u0645\u0639\u200c\u0634\u062f\u0646 \u0646\u0648\u0627\u0631 \u0622\u062f\u0631\u0633\u060c \u067e\u0627\u06cc\u06cc\u0646 \u0635\u0641\u062d\u0647 \u0646\u0648\u0627\u0631 \u0645\u0634\u06a9\u06cc \u0646\u06cc\u0641\u062a\u062f. *\/\n#matris-hero-isolated .matris-hero-safe{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;pointer-events:none}\n\n\/* SCROLL GUIDE *\/\n#matris-hero-isolated .matris-scroll-guide{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:50;display:flex;flex-direction:column;align-items:center;gap:15px;margin:0;padding:0;pointer-events:none;opacity:1;transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}\n#matris-hero-isolated .matris-scroll-guide>span:first-child{color:#eb008b!important;-webkit-text-fill-color:#eb008b!important;font-family:\"IranYekanX\",sans-serif!important;font-size:11px;font-weight:600;line-height:1.4;white-space:nowrap;text-align:center;text-shadow:0 2px 14px rgba(235,0,139,.22)}\n#matris-hero-isolated .matris-scroll-guide-arrow{position:relative;display:block;width:20px;height:35px;border:1px solid rgba(255,255,255,.62);border-radius:999px;animation:matrisScrollGuidePulse 2s ease-in-out infinite;box-shadow:0 0 0 1px rgba(255,255,255,.035),0 5px 20px rgba(0,0,0,.16)}\n#matris-hero-isolated .matris-scroll-guide-arrow::after{content:\"\";position:absolute;left:50%;top:5px;width:4px;height:8px;transform:translateX(-50%);border-radius:999px;background:#eb008b;box-shadow:0 0 12px rgba(235,0,139,.35);animation:matrisScrollDotMove 1.55s cubic-bezier(.45,0,.2,1) infinite}\n#matris-hero-isolated .matris-scroll-guide.is-hidden{opacity:0;transform:translateX(-50%) translateY(14px)}\n@keyframes matrisScrollDotMove{0%,100%{transform:translate(-50%,0);opacity:.72}50%{transform:translate(-50%,15px);opacity:1}}\n@keyframes matrisScrollGuidePulse{0%,100%{opacity:.82}50%{opacity:1}}\n\n@media (max-width:767px){\n  #matris-hero-isolated .matris-scroll-guide{position:absolute!important;left:50%!important;bottom:28px!important;z-index:9999!important;display:flex!important;visibility:visible!important;pointer-events:none!important;gap:13px!important;opacity:1!important;transform:translateX(-50%)!important}\n  #matris-hero-isolated .matris-scroll-guide.is-hidden{opacity:0!important;visibility:hidden!important;transform:translateX(-50%) translateY(14px)!important}\n  #matris-hero-isolated .matris-scroll-guide>span:first-child{display:block!important;visibility:visible!important;color:#eb008b!important;-webkit-text-fill-color:#eb008b!important;font-family:\"IranYekanX\",sans-serif!important;font-size:10px!important;font-weight:600!important;white-space:nowrap!important}\n  #matris-hero-isolated .matris-scroll-guide-arrow{width:19px;height:33px}\n  #matris-hero-isolated .matris-scroll-guide-arrow::after{width:4px;height:8px;top:5px}\n}\n\n\/* INTRO *\/\n#matris-hero-isolated .matris-hero-intro{position:absolute;top:250px;left:0;width:100%;margin:0;padding-left:5%;padding-right:5%;z-index:40;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;will-change:transform,opacity}\n#matris-hero-isolated .matris-hero-intro-heading{position:relative;display:block;margin:0;padding:0;color:transparent;font-family:\"IranYekanX\",sans-serif!important;font-size:clamp(20px,3.4vw,50px);font-weight:900;line-height:1.25;white-space:nowrap;background:linear-gradient(90deg,#ff2ea6 0%,#e84df2 45%,#766dff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;will-change:transform,filter,opacity}\n\n\/* TEXT *\/\n#matris-hero-isolated .matris-hero-text-container{position:absolute;top:0;left:0;inset:0;width:100%;height:100%;margin:0;padding:0;z-index:30;pointer-events:none;overflow:hidden}\n#matris-hero-isolated .matris-hero-text-layer{position:absolute;width:min(32vw,460px);margin:0;padding:0;opacity:0;color:#fff;font-family:\"IranYekanX\",sans-serif!important;text-shadow:0 4px 24px rgba(0,0,0,.45);will-change:transform,opacity;pointer-events:none}\n#matris-hero-isolated .matris-hero-text-layer h2{display:block;margin:0 0 10px 0;padding:0;color:#fff!important;background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:#fff!important;font-family:\"IranYekanX\",sans-serif!important;font-size:clamp(17px,1.8vw,31px);font-weight:700;line-height:1.12;letter-spacing:-0.03em}\n#matris-hero-isolated .matris-hero-text-layer p{display:block;margin:0;padding:0;font-family:\"IranYekanX\",sans-serif!important;font-size:clamp(16px,1.15vw,20px);font-weight:700;line-height:1.65;color:transparent;background:linear-gradient(90deg,#ff009d 0%,#eb008b 35%,#6b35ff 72%,#392dff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none}\n\n\/* TAGLINE \u0627\u0646\u06af\u0644\u06cc\u0633\u06cc: \u0628\u0627\u06a9\u0633 \u0628\u0647 \u0627\u0646\u062f\u0627\u0632\u0647\u200c\u06cc \u062e\u0648\u062f \u0645\u062a\u0646 \u0645\u06cc\u200c\u0634\u0648\u062f \u062a\u0627 \u06af\u0631\u0627\u062f\u06cc\u0627\u0646 \u06a9\u0627\u0645\u0644 \u0631\u0648\u06cc \u0645\u062a\u0646 \u0628\u0646\u0634\u06cc\u0646\u062f\u060c\n   \u0648 \u062c\u0647\u062a \u0686\u067e\u200c\u0628\u0647\u200c\u0631\u0627\u0633\u062a \u062a\u0627 \u0639\u0644\u0627\u0645\u062a \u062a\u0639\u062c\u0628 \u0622\u062e\u0631 \u062c\u0645\u0644\u0647 (\u0633\u0645\u062a \u0631\u0627\u0633\u062a) \u0628\u0645\u0627\u0646\u062f *\/\n#matris-hero-isolated .matris-hero-text-layer p.matris-hero-tagline{display:inline-block;vertical-align:top;width:auto;max-width:100%;direction:ltr;unicode-bidi:isolate;text-align:left;white-space:nowrap}\n\n\/* DESKTOP *\/\n@media (min-width:768px){\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(1){top:16%!important;bottom:auto!important;right:8%;left:auto;text-align:right}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(2){top:21%!important;bottom:auto!important;left:8%;right:auto;text-align:left}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(3){bottom:20%!important;top:auto!important;right:8%;left:auto;text-align:right}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(4){bottom:15%!important;top:auto!important;left:8%;right:auto;text-align:left}\n  #matris-hero-isolated .matris-hero-intro-heading{font-size:clamp(34px,4.5vw,68px)}\n}\n\n\/* MOBILE *\/\n@media (max-width:767px){\n  #matris-hero-isolated .matris-hero-section{height:500svh;min-height:500svh}\n  \/* \u062a\u0635\u0648\u06cc\u0631: \u0628\u0632\u0631\u06af\u200c\u062a\u0631\u06cc\u0646 \u0627\u0631\u062a\u0641\u0627\u0639 \u0635\u0641\u062d\u0647 (lvh) \u2014 \u0645\u062a\u0646\u200c\u0647\u0627: \u06a9\u0648\u0686\u06a9\u200c\u062a\u0631\u06cc\u0646 \u0627\u0631\u062a\u0641\u0627\u0639 (svh) *\/\n  #matris-hero-isolated .matris-hero-sticky{height:100lvh;min-height:100lvh;max-height:100lvh}\n  #matris-hero-isolated .matris-hero-safe{height:100svh}\n  #matris-hero-isolated .matris-hero-intro{top:130px;padding-left:14px;padding-right:14px;width:100%;overflow:hidden}\n  #matris-hero-isolated .matris-hero-intro-heading{width:100%;max-width:100%;padding:0 8px;font-size:clamp(28px,8.8vw,44px);line-height:1.35;white-space:normal;text-align:center}\n  #matris-hero-isolated .matris-hero-text-layer{width:calc(100vw - 20px);max-width:calc(100vw - 20px);overflow:hidden}\n  #matris-hero-isolated .matris-hero-text-layer h2{font-size:clamp(19px,6vw,30px);line-height:1.15;margin-bottom:8px;white-space:normal;overflow-wrap:anywhere;word-break:normal}\n  #matris-hero-isolated .matris-hero-text-layer p{padding-inline:4px;font-size:clamp(13px,3.7vw,17px);line-height:1.45;white-space:normal;overflow-wrap:anywhere;word-break:normal;width:100%;max-width:100%}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(1){top:18%!important;bottom:auto!important;right:14px;left:auto;text-align:right}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(2){top:18%!important;bottom:auto!important;left:14px;right:auto;text-align:left}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(3){bottom:20%!important;top:auto!important;right:14px;left:auto;text-align:right}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(4){bottom:14%!important;top:auto!important;left:14px;right:auto;text-align:left}\n  #matris-hero-isolated .matris-hero-text-layer:nth-child(2) h2,#matris-hero-isolated .matris-hero-text-layer:nth-child(2) p,#matris-hero-isolated .matris-hero-text-layer:nth-child(4) h2,#matris-hero-isolated .matris-hero-text-layer:nth-child(4) p{text-align:left}\n}\n\n@media (max-width:380px){\n  #matris-hero-isolated .matris-hero-intro{top:110px}\n  #matris-hero-isolated .matris-hero-intro-heading{font-size:28px}\n  #matris-hero-isolated .matris-hero-text-layer h2{font-size:19px}\n  #matris-hero-isolated .matris-hero-text-layer p{font-size:13px}\n}\n\n@media (prefers-reduced-motion:reduce){\n  #matris-hero-isolated *,#matris-hero-isolated *::before,#matris-hero-isolated *::after{scroll-behavior:auto!important}\n}\n<\/style>\n\n<div class=\"matris-hero-section\">\n  <div class=\"matris-hero-sticky\">\n\n    <canvas class=\"matris-hero-canvas\" role=\"img\" aria-label=\"MATRIS Group cinematic packaging video\"><\/canvas>\n\n    <div class=\"matris-hero-vignette\"><\/div>\n\n    <div class=\"matris-hero-safe\">\n\n      <div class=\"matris-scroll-guide\" aria-hidden=\"true\">\n        <span>\u0628\u0631\u0627\u06cc \u0645\u0634\u0627\u0647\u062f\u0647 \u0627\u0633\u06a9\u0631\u0648\u0644 \u06a9\u0646\u06cc\u062f<\/span>\n        <span class=\"matris-scroll-guide-arrow\" aria-hidden=\"true\"><\/span>\n      <\/div>\n\n      <div class=\"matris-hero-intro\">\n        <h1 class=\"matris-hero-intro-heading\">\u0686\u0634\u0645\u200c\u0647\u0627 \u0628\u0627\u0632 \u0645\u06cc\u200c\u0645\u0627\u0646\u062f\u060c \u0628\u0647 \u0628\u0633\u062a\u0647 \u0634\u0645\u0627!<\/h1>\n      <\/div>\n\n      <div class=\"matris-hero-text-container\">\n        <div class=\"matris-hero-text-layer\" data-start=\"0.08\" data-hold=\"0.22\" data-end=\"0.36\">\n          <h2>\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u060c \u0627\u0648\u0644\u06cc\u0646 \u0646\u06af\u0627\u0647 \u0627\u0633\u062a!<\/h2>\n          <p>\u0627\u0632 \u06cc\u06a9 \u0628\u0631\u0634 \u0633\u0627\u062f\u0647 \u06a9\u0627\u063a\u0630\u06cc \u062a\u0627 \u06cc\u06a9 \u0627\u06cc\u062f\u0647\u200c\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc.<\/p>\n        <\/div>\n        <div class=\"matris-hero-text-layer\" data-start=\"0.27\" data-hold=\"0.43\" data-end=\"0.57\">\n          <h2>\u0627\u0632 \u0627\u06cc\u062f\u0647 \u062a\u0627 \u0627\u062c\u0631\u0627!<\/h2>\n          <p>\u0637\u0631\u0627\u062d\u06cc \u062f\u0642\u06cc\u0642\u060c \u0645\u062a\u0631\u06cc\u0627\u0644 \u062d\u0631\u0641\u0647\u200c\u0627\u06cc \u0648 \u0627\u062c\u0631\u0627\u06cc \u0628\u0627\u06a9\u06cc\u0641\u06cc\u062a.<\/p>\n        <\/div>\n        <div class=\"matris-hero-text-layer\" data-start=\"0.49\" data-hold=\"0.66\" data-end=\"0.80\">\n          <h2>\u062c\u0632\u0626\u06cc\u0627\u062a\u060c \u062a\u0641\u0627\u0648\u062a \u0631\u0627 \u0645\u06cc\u200c\u0633\u0627\u0632\u062f!<\/h2>\n          <p>\u062a\u062c\u0631\u0628\u0647\u200c\u0627\u06cc \u0644\u0648\u06a9\u0633 \u0628\u0631\u0627\u06cc \u0628\u0631\u0646\u062f\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u062f\u06cc\u062f\u0647 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f.<\/p>\n        <\/div>\n        <div class=\"matris-hero-text-layer\" data-start=\"0.73\" data-hold=\"0.91\" data-end=\"0.995\">\n          <h2>MATRIS GROUP<\/h2>\n          <p class=\"matris-hero-tagline\" dir=\"ltr\" lang=\"en\">The Luxury Packaging!<\/p>\n        <\/div>\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n<\/div>\n<\/section>\n<\/template>\n\n\n<!-- 3) SHADOW DOM + JS\n     \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0631\u0648\u06cc \u062a\u06af script \u0628\u0647 \u0627\u0641\u0632\u0648\u0646\u0647\u200c\u0647\u0627\u06cc \u06a9\u0634\/\u0628\u0647\u06cc\u0646\u0647\u200c\u0633\u0627\u0632\u06cc \u0645\u06cc\u200c\u06af\u0648\u06cc\u0646\u062f \u0627\u06cc\u0646 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0631\u0627\n     \u0628\u0647 \u062a\u0623\u062e\u06cc\u0631 \u0646\u06cc\u0646\u062f\u0627\u0632\u0646\u062f (\u0648\u06af\u0631\u0646\u0647 \u062a\u0627 \u0627\u0648\u0644\u06cc\u0646 \u0644\u0645\u0633 \u06a9\u0627\u0631\u0628\u0631 \u0635\u0641\u062d\u0647 \u0645\u0634\u06a9\u06cc \u0645\u06cc\u200c\u0645\u0627\u0646\u062f). -->\n<script data-no-optimize=\"1\" data-no-defer=\"1\" data-no-minify=\"1\" data-cfasync=\"false\" data-pagespeed-no-defer nowprocket>\n(() => {\n'use strict';\n\nconst host = document.getElementById('matris-hero-host');\nif (!host || host.shadowRoot) return;\n\nconst shadow = host.attachShadow({ mode: 'open' });\nconst hostStyle = document.createElement('style');\nhostStyle.textContent = `\n  :host{all:initial;display:block;width:100%;max-width:100%;background:#08080b;color-scheme:only light;forced-color-adjust:none;isolation:isolate;mix-blend-mode:normal;filter:none;opacity:1;contain:layout paint style}\n  #matris-hero-isolated,#matris-hero-isolated *{color-scheme:only light;forced-color-adjust:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}\n`;\nshadow.appendChild(hostStyle);\n\nconst tpl = document.getElementById('matris-hero-template');\nshadow.appendChild(tpl.content.cloneNode(true));\ntpl.remove();\n\n\n\/* =========================================================\n   CONFIG \u2014 \u0641\u0642\u0637 \u0627\u06cc\u0646 \u0628\u062e\u0634 \u0631\u0627 \u067e\u0631 \u06a9\u0646\u06cc\u062f\n   pattern : \u0622\u062f\u0631\u0633 \u06cc\u06a9\u06cc \u0627\u0632 \u0641\u0631\u06cc\u0645\u200c\u0647\u0627\u060c \u06a9\u0647 \u062c\u0627\u06cc \u0634\u0645\u0627\u0631\u0647\u200c\u0627\u0634 {i} \u06af\u0630\u0627\u0634\u062a\u0647 \u0634\u062f\u0647\n   count   : \u062a\u0639\u062f\u0627\u062f \u0641\u0627\u06cc\u0644\u200c\u0647\u0627\u06cc \u062f\u0627\u062e\u0644 \u067e\u0648\u0634\u0647\n   start   : \u0634\u0645\u0627\u0631\u0647\u200c\u06cc \u0627\u0648\u0644\u06cc\u0646 \u0641\u0627\u06cc\u0644 (\u0645\u0639\u0645\u0648\u0644\u0627\u064b 1)\n   pad     : \u062a\u0639\u062f\u0627\u062f \u0631\u0642\u0645 \u0634\u0645\u0627\u0631\u0647 (001 \u06cc\u0639\u0646\u06cc 3)\n   duration: \u0637\u0648\u0644 \u0648\u06cc\u062f\u06cc\u0648\u06cc \u0627\u0635\u0644\u06cc \u0628\u0647 \u062b\u0627\u0646\u06cc\u0647 (\u0628\u0631\u0627\u06cc \u062a\u0627\u06cc\u0645\u06cc\u0646\u06af \u0627\u06cc\u0646\u062a\u0631\u0648)\n   poster  : (\u0627\u062e\u062a\u06cc\u0627\u0631\u06cc) \u0622\u062f\u0631\u0633 \u06cc\u06a9 \u0646\u0633\u062e\u0647\u200c\u06cc \u062e\u06cc\u0644\u06cc \u06a9\u0645\u200c\u062d\u062c\u0645 \u0627\u0632 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644.\n             \u0627\u06af\u0631 \u067e\u0631 \u0634\u0648\u062f\u060c \u0642\u0628\u0644 \u0627\u0632 \u0647\u0631 \u0686\u06cc\u0632 \u0644\u0648\u062f \u0645\u06cc\u200c\u0634\u0648\u062f \u062a\u0627 \u0635\u0641\u062d\u0647 \u0645\u0634\u06a9\u06cc \u0646\u0645\u0627\u0646\u062f.\n\n   \u0627\u0628\u0639\u0627\u062f \u067e\u06cc\u0634\u0646\u0647\u0627\u062f\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627:  \u0645\u0648\u0628\u0627\u06cc\u0644 720\u00d71280\n   ========================================================= *\/\nconst CONFIG = {\n  desktop: {\n    pattern: 'https:\/\/matris.ir\/wp-content\/uploads\/hero-frames\/desktop\/frame_{i}.webp',\n    count: 149,\n    start: 1,\n    pad: 3,\n    duration: 10,\n    poster: ''\n  },\n  mobile: {\n    pattern: 'https:\/\/matris.ir\/wp-content\/uploads\/hero-frames\/mobile\/frame_{i}.webp',\n    count: 131,\n    start: 1,\n    pad: 3,\n    duration: 8,\n    poster: ''\n  },\n  breakpoint: 767,\n  parallel: 6,        \/\/ \u062a\u0639\u062f\u0627\u062f \u062f\u0627\u0646\u0644\u0648\u062f \u0647\u0645\u0632\u0645\u0627\u0646 (\u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u0645\u0639\u0645\u0648\u0644\u06cc)\n  parallelSlow: 3,    \/\/ \u062a\u0639\u062f\u0627\u062f \u062f\u0627\u0646\u0644\u0648\u062f \u0647\u0645\u0632\u0645\u0627\u0646 \u0648\u0642\u062a\u06cc \u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u06a9\u0646\u062f \u0627\u0633\u062a\n  slowFirstFrameMs: 1500, \/\/ \u0627\u06af\u0631 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644 \u062f\u06cc\u0631\u062a\u0631 \u0627\u0632 \u0627\u06cc\u0646 \u0628\u0631\u0633\u062f = \u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u06a9\u0646\u062f\n  firstFrameWaitMs: 4000, \/\/ \u062d\u062f\u0627\u06a9\u062b\u0631 \u0627\u0646\u062a\u0638\u0627\u0631 \u0628\u0631\u0627\u06cc \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644 \u0642\u0628\u0644 \u0627\u0632 \u0634\u0631\u0648\u0639 \u0628\u0642\u06cc\u0647\n  retries: 2,         \/\/ \u062a\u0644\u0627\u0634 \u062f\u0648\u0628\u0627\u0631\u0647 \u0628\u0631\u0627\u06cc \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u0644\u0648\u062f \u0646\u0634\u062f\n  timeoutMs: 45000,   \/\/ \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u0627\u06cc\u0646\u200c\u0642\u062f\u0631 \u0645\u0639\u0637\u0644 \u0628\u0645\u0627\u0646\u062f \u0631\u0647\u0627 \u0648 \u062f\u0648\u0628\u0627\u0631\u0647 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u06cc\u200c\u0634\u0648\u062f\n  maxDpr: 2,          \/\/ \u0633\u0642\u0641 \u06a9\u06cc\u0641\u06cc\u062a \u06a9\u0627\u0646\u0648\u0627\u0633 \u0631\u0648\u06cc \u0635\u0641\u062d\u0647\u200c\u0647\u0627\u06cc \u0631\u062a\u06cc\u0646\u0627\n  decodeAhead: 3,     \/\/ \u0686\u0646\u062f \u0641\u0631\u06cc\u0645\u0650 \u062c\u0644\u0648\u062a\u0631\u060c \u0642\u0628\u0644 \u0627\u0632 \u0631\u0633\u06cc\u062f\u0646 \u0627\u0633\u06a9\u0631\u0648\u0644 \u062f\u06cc\u06a9\u0648\u062f \u0634\u0648\u062f\n\n  \/* \u0644\u06cc\u0632\u06cc\u200c\u0644\u0648\u062f: \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0641\u0642\u0637 \u0648\u0642\u062a\u06cc \u062f\u0627\u0646\u0644\u0648\u062f \u0645\u06cc\u200c\u0634\u0648\u0646\u062f \u06a9\u0647 \u0647\u06cc\u0631\u0648 \u062d\u062f\u0627\u06a9\u062b\u0631 \u0627\u06cc\u0646\u200c\u0642\u062f\u0631 \u00ab\u0635\u0641\u062d\u0647\u00bb\n     \u0628\u0627 \u062c\u0627\u06cc\u06cc \u06a9\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0647\u0633\u062a \u0641\u0627\u0635\u0644\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f. \u0627\u06af\u0631 \u06a9\u0627\u0631\u0628\u0631 \u0627\u0632 \u0647\u06cc\u0631\u0648 \u0631\u062f \u0634\u0648\u062f\u060c \u062f\u0627\u0646\u0644\u0648\u062f\u0650\n     \u0628\u0642\u06cc\u0647\u200c\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0645\u062a\u0648\u0642\u0641 \u0645\u06cc\u200c\u0634\u0648\u062f \u0648 \u0628\u0627 \u0628\u0631\u06af\u0634\u062a\u0646\u0634 \u0627\u062f\u0627\u0645\u0647 \u067e\u06cc\u062f\u0627 \u0645\u06cc\u200c\u06a9\u0646\u062f. *\/\n  lazyMargin: 1.5,\n\n  \/* \u062d\u0627\u0644\u062a \u0633\u0628\u06a9 \u2014 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0631\u0648\u0634\u0646 \u0645\u06cc\u200c\u0634\u0648\u062f:\n     1) \u0627\u06af\u0631 \u06af\u0648\u0634\u06cc \u0631\u0645 \u06a9\u0645\u06cc \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f \u06cc\u0627 \u00ab\u0635\u0631\u0641\u0647\u200c\u062c\u0648\u06cc\u06cc \u062f\u0627\u062f\u0647\u00bb \u0631\u0648\u0634\u0646 \u0628\u0627\u0634\u062f\n     2) \u0627\u06af\u0631 \u0645\u0648\u0642\u0639 \u0627\u0633\u06a9\u0631\u0648\u0644\u060c \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0648\u0627\u0642\u0639\u0627\u064b \u06a9\u0646\u062f \u0631\u0646\u062f\u0631 \u0634\u0648\u0646\u062f\n     \u0628\u0631\u0627\u06cc \u062a\u0633\u062a \u062f\u0633\u062a\u06cc: \u0622\u062e\u0631 \u0622\u062f\u0631\u0633 \u0635\u0641\u062d\u0647  ?matris-lite=1  \u0628\u06af\u0630\u0627\u0631\u06cc\u062f *\/\n  lite: {\n    maxMemoryGb: 2,   \/\/ \u0631\u0645 \u2264 \u0627\u06cc\u0646 \u0645\u0642\u062f\u0627\u0631 = \u06af\u0648\u0634\u06cc \u0636\u0639\u06cc\u0641\n    frameStep: 2,     \/\/ 2 \u06cc\u0639\u0646\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u06cc\u06a9\u06cc\u200c\u062f\u0631\u0645\u06cc\u0627\u0646 \u0644\u0648\u062f \u0634\u0648\u0646\u062f (\u0646\u0635\u0641 \u062d\u062c\u0645 \u0648 \u0646\u0635\u0641 \u0631\u0645)\n    maxDpr: 1.5       \/\/ \u0633\u0642\u0641 \u06a9\u06cc\u0641\u06cc\u062a \u06a9\u0627\u0646\u0648\u0627\u0633 \u062f\u0631 \u062d\u0627\u0644\u062a \u0633\u0628\u06a9\n  }\n};\n\n\n\/* =========================================================\n   MAIN\n   ========================================================= *\/\n(() => {\n\nconst ROOT = shadow.getElementById('matris-hero-isolated');\nif (!ROOT) return;\n\nconst section      = ROOT.querySelector('.matris-hero-section');\nconst sticky       = ROOT.querySelector('.matris-hero-sticky');\nconst canvas       = ROOT.querySelector('.matris-hero-canvas');\nconst ctx          = canvas.getContext('2d', { alpha: false });\nconst intro        = ROOT.querySelector('.matris-hero-intro');\nconst introHeading = ROOT.querySelector('.matris-hero-intro-heading');\nconst textLayers   = Array.from(ROOT.querySelectorAll('.matris-hero-text-layer'));\nconst scrollGuide  = ROOT.querySelector('.matris-scroll-guide');\n\nconst mq = window.matchMedia(`(max-width:${CONFIG.breakpoint}px)`);\n\nconst FRAME_MS = 1000 \/ 60;\n\n\n\/* ---------- \u062a\u0634\u062e\u06cc\u0635 \u06af\u0648\u0634\u06cc \u0636\u0639\u06cc\u0641 (\u0642\u0628\u0644 \u0627\u0632 \u0634\u0631\u0648\u0639 \u062f\u0627\u0646\u0644\u0648\u062f) ---------- *\/\nfunction detectLowEnd() {\n  try {\n    if (\/[?&]matris-lite=1(&|$)\/.test(location.search)) return true;\n    const nav = navigator;\n    const conn = nav.connection || nav.mozConnection || nav.webkitConnection;\n    if (nav.deviceMemory && nav.deviceMemory <= CONFIG.lite.maxMemoryGb) return true;\n    if (conn && conn.saveData) return true;\n    if (conn && \/(^|-)2g$\/.test(conn.effectiveType || '')) return true;\n  } catch (e) {}\n  return false;\n}\n\nconst startLite = detectLowEnd();\n\nconst state = {\n  mobile: mq.matches,\n  lite: startLite,\n  step: startLite ? Math.max(1, CONFIG.lite.frameStep | 0) : 1,\n  set: null,\n  duration: 10,\n  targetTime: 0,\n  renderedTime: 0,\n  styledTime: -1,\n  frames: [],\n  loaded: null,\n  poster: null,\n  wantedIndex: 0,\n  netSlow: false,\n  gen: 0,\n  drawnIndex: -1,\n  drawnImg: null,\n  drawnSharp: false,\n  warmIndex: -1,\n  needsDraw: true,\n  srcW: 0,            \/\/ \u0627\u0628\u0639\u0627\u062f \u0648\u0627\u0642\u0639\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 (\u0627\u0632 \u0627\u0648\u0644\u06cc\u0646 \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u0628\u0631\u0633\u062f)\n  srcH: 0,\n  near: true,         \/\/ \u0647\u06cc\u0631\u0648 \u0646\u0632\u062f\u06cc\u06a9 \u062f\u06cc\u062f \u06a9\u0627\u0631\u0628\u0631 \u0627\u0633\u062a\u061f (\u0644\u06cc\u0632\u06cc\u200c\u0644\u0648\u062f)\n  pendingStart: null, \/\/ \u0634\u0631\u0648\u0639\u0650 \u062f\u0627\u0646\u0644\u0648\u062f\u060c \u0648\u0642\u062a\u06cc \u0647\u0646\u0648\u0632 \u0628\u0647 \u0647\u06cc\u0631\u0648 \u0646\u0632\u062f\u06cc\u06a9 \u0646\u0634\u062f\u0647\u200c\u0627\u06cc\u0645\n  pump: null\n};\n\nhost.setAttribute('data-matris-mode', state.lite ? 'lite' : 'full');\n\nconst clamp = (v, a, b) => Math.max(a, Math.min(b, v));\nconst easeInOutCubic = v => { v = clamp(v, 0, 1); return v < .5 ? 4*v*v*v : 1 - Math.pow(-2*v + 2, 3) \/ 2; };\n\n\n\/* ---------- TEXT POSITIONS ---------- *\/\nfunction positionTextLayers() {\n  const positions = state.mobile\n    ? [\n        { top:'18%', right:'14px', left:'auto', bottom:'auto', textAlign:'right' },\n        { top:'18%', left:'14px', right:'auto', bottom:'auto', textAlign:'left' },\n        { bottom:'20%', right:'14px', left:'auto', top:'auto', textAlign:'right' },\n        { bottom:'14%', left:'14px', right:'auto', top:'auto', textAlign:'left' }\n      ]\n    : [\n        { top:'16%', right:'8%', left:'auto', bottom:'auto', textAlign:'right' },\n        { top:'21%', left:'8%', right:'auto', bottom:'auto', textAlign:'left' },\n        { bottom:'20%', right:'8%', left:'auto', top:'auto', textAlign:'right' },\n        { bottom:'15%', left:'8%', right:'auto', top:'auto', textAlign:'left' }\n      ];\n  textLayers.forEach((layer, i) => Object.assign(layer.style, positions[i]));\n}\n\n\n\/* ---------- SCROLL ---------- *\/\nfunction scrollProgress() {\n  const rect = section.getBoundingClientRect();\n  const vh = sticky.offsetHeight || window.innerHeight;\n  const scrollable = Math.max(section.offsetHeight - vh, 1);\n  return clamp(-rect.top \/ scrollable, 0, 1);\n}\n\n\/* \u0627\u0646\u062f\u0627\u0632\u0647\u200c\u06af\u06cc\u0631\u06cc \u0641\u0642\u0637 \u06cc\u06a9\u200c\u0628\u0627\u0631 \u062f\u0631 \u0647\u0631 \u0641\u0631\u06cc\u0645 \u0627\u0646\u062c\u0627\u0645 \u0645\u06cc\u200c\u0634\u0648\u062f *\/\nfunction updateFromScroll() {\n  const p = scrollProgress();\n  state.targetTime = p * state.duration;\n  return p;\n}\n\nfunction updateScrollGuide(p) {\n  if (!scrollGuide) return;\n  scrollGuide.classList.toggle('is-hidden', p > 0.008);\n}\n\n\n\/* ---------- INTRO ---------- *\/\nfunction updateIntro(time) {\n  if (!intro || !introHeading) return;\n  const duration = 1;\n  const progress = clamp(time \/ duration, 0, 1);\n\n  if (time >= duration) {\n    intro.style.opacity = '0';\n    intro.style.visibility = 'hidden';   \/\/ \u0648\u0642\u062a\u06cc \u062a\u0645\u0627\u0645 \u0634\u062f\u060c \u062f\u06cc\u06af\u0631 \u0647\u0632\u06cc\u0646\u0647\u200c\u06cc \u0631\u0646\u062f\u0631 \u0646\u062f\u0627\u0631\u062f\n    intro.style.pointerEvents = 'none';\n    return;\n  }\n\n  const scale = 0.72 + progress * 0.52;\n  const disintegrate = clamp((progress - 0.42) \/ 0.58, 0, 1);\n  const eased = easeInOutCubic(disintegrate);\n  const opacity = 1 - Math.pow(disintegrate, 1.6);\n\n  intro.style.visibility = 'visible';\n  intro.style.opacity = opacity.toFixed(4);\n  intro.style.transform = `translate3d(0,${(-eased * 22).toFixed(2)}px,0) scale(${scale.toFixed(4)})`;\n\n  \/* \u062d\u0627\u0644\u062a \u0633\u0628\u06a9: \u0641\u0642\u0637 opacity \u0648 transform (\u0628\u062f\u0648\u0646 blur \/ mask \/ letter-spacing) *\/\n  if (state.lite) return;\n\n  const maskRadius = Math.max(10, 110 - eased * 95);\n  const shadowOpacity = 0.45 * (1 - disintegrate);\n\n  \/* letter-spacing \u0641\u0642\u0637 \u062f\u0631 \u062f\u0633\u06a9\u062a\u0627\u067e: \u062f\u0631 \u0645\u0648\u0628\u0627\u06cc\u0644 \u062a\u06cc\u062a\u0631 \u0686\u0646\u062f\u062e\u0637\u06cc \u0627\u0633\u062a \u0648 \u062a\u063a\u06cc\u06cc\u0631 \u0641\u0627\u0635\u0644\u0647\u200c\u06cc \u062d\u0631\u0648\u0641\n     \u062f\u0631 \u0647\u0631 \u0641\u0631\u06cc\u0645\u060c \u062e\u0637\u200c\u0647\u0627 \u0631\u0627 \u062f\u0648\u0628\u0627\u0631\u0647 \u0645\u06cc\u200c\u0634\u06a9\u0646\u062f (\u067e\u0631\u0634 \u0645\u062a\u0646 + \u0645\u062d\u0627\u0633\u0628\u0647\u200c\u06cc \u062f\u0648\u0628\u0627\u0631\u0647\u200c\u06cc \u0686\u06cc\u062f\u0645\u0627\u0646). *\/\n  if (!state.mobile) introHeading.style.letterSpacing = `${(eased * 0.28).toFixed(3)}em`;\n  introHeading.style.filter = `blur(${(eased * 9.5).toFixed(2)}px) drop-shadow(0 3px 8px rgba(235,0,139,${shadowOpacity.toFixed(2)}))`;\n\n  const mask = `radial-gradient(circle at 50% 50%, rgba(0,0,0,1) 0%, rgba(0,0,0,${(1 - eased * .85).toFixed(2)}) ${maskRadius}%, transparent 100%)`;\n  introHeading.style.webkitMaskImage = mask;\n  introHeading.style.maskImage = mask;\n}\n\nfunction clearHeavyIntroStyles() {\n  if (!introHeading) return;\n  introHeading.style.letterSpacing = 'normal';\n  introHeading.style.filter = 'none';\n  introHeading.style.webkitMaskImage = 'none';\n  introHeading.style.maskImage = 'none';\n}\n\n\n\/* ---------- TEXT LAYERS ---------- *\/\nfunction updateTextLayer(layer, index, progress) {\n  let start = parseFloat(layer.dataset.start);\n  let hold  = parseFloat(layer.dataset.hold);\n  let end   = parseFloat(layer.dataset.end);\n\n  if (state.mobile) {\n    if (index === 0)      { start = 0.15; hold = 0.30; end = 0.44; }\n    else if (index === 1) { start = 0.50; hold = 0.64; end = 0.76; }\n    else if (index === 2) { start = 0.49; hold = 0.66; end = 0.76; }\n  }\n\n  let opacity = 0, y = 0;\n\n  if (state.mobile) {\n    if (progress < start) {\n      opacity = 0;\n    } else if (progress < hold) {\n      opacity = easeInOutCubic((progress - start) \/ (hold - start));\n    } else if (progress < end) {\n      const q = easeInOutCubic((progress - hold) \/ (end - hold));\n      opacity = index === 3 ? 1 : (q < 0.72 ? 1 : 1 - ((q - 0.72) \/ 0.28));\n    } else {\n      opacity = index === 3 ? 1 : 0;\n    }\n  } else {\n    if (progress < start) {\n      opacity = 0; y = 70;\n    } else if (progress < hold) {\n      const q = easeInOutCubic((progress - start) \/ (hold - start));\n      y = 70 - 70 * q; opacity = 1;\n    } else if (progress < end) {\n      const q = easeInOutCubic((progress - hold) \/ (end - hold));\n      y = -70 * q;\n      opacity = q < 0.75 ? 1 : 1 - ((q - 0.75) \/ 0.25);\n    } else {\n      opacity = 0; y = -70;\n    }\n  }\n\n  layer.style.opacity = opacity.toFixed(4);\n  layer.style.transform = `translate3d(0,${y.toFixed(2)}vh,0)`;\n}\n\n\n\/* =========================================================\n   FRAMES\n   ========================================================= *\/\n\nfunction frameUrl(i) {\n  const n = String(i + state.set.start).padStart(state.set.pad, '0');\n  return state.set.pattern.replace('{i}', n);\n}\n\n\/* \u062f\u0631 \u062d\u0627\u0644\u062a \u0633\u0628\u06a9 \u0641\u0642\u0637 \u0641\u0631\u06cc\u0645\u200c\u0647\u0627\u06cc \u0645\u0636\u0631\u0628 step (\u0648 \u0641\u0631\u06cc\u0645 \u0622\u062e\u0631) \u0646\u06af\u0647 \u062f\u0627\u0634\u062a\u0647 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f *\/\nfunction keepFrame(i) {\n  return state.step <= 1 || i % state.step === 0 || i === state.set.count - 1;\n}\n\n\/* \u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u06a9\u0646\u062f\u061f (\u0627\u0639\u0644\u0627\u0645 \u0645\u0631\u0648\u0631\u06af\u0631\u060c \u06cc\u0627 \u062f\u06cc\u0631 \u0631\u0633\u06cc\u062f\u0646 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644) *\/\nfunction slowNetwork() {\n  if (state.netSlow) return true;\n  try {\n    const c = navigator.connection || navigator.mozConnection || navigator.webkitConnection;\n    if (c && (c.saveData || \/2g|3g\/.test(c.effectiveType || '') || (c.downlink > 0 && c.downlink < 1.5))) return true;\n  } catch (e) {}\n  return false;\n}\n\n\/* \u0644\u06cc\u0632\u06cc\u200c\u0644\u0648\u062f: \u0647\u06cc\u0631\u0648 \u062a\u0627 lazyMargin \u0635\u0641\u062d\u0647 \u0628\u0627 \u062f\u06cc\u062f \u06a9\u0627\u0631\u0628\u0631 \u0641\u0627\u0635\u0644\u0647 \u062f\u0627\u0631\u062f\u061f *\/\nfunction heroNear() {\n  const r = section.getBoundingClientRect();\n  const vh = window.innerHeight || document.documentElement.clientHeight || 1;\n  const m = vh * CONFIG.lazyMargin;\n  return r.bottom > -m && r.top < vh + m;\n}\n\nfunction setNear(v) {\n  if (state.near === v) return;\n  state.near = v;\n  if (!v) return;                        \/\/ \u062f\u0648\u0631 \u0634\u062f\u06cc\u0645: pump \u062e\u0648\u062f\u0634 \u062f\u06cc\u06af\u0631 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u062a\u0627\u0632\u0647 \u0646\u0645\u06cc\u200c\u062f\u0647\u062f\n  if (state.pendingStart) {\n    const start = state.pendingStart;\n    state.pendingStart = null;\n    start();\n  } else if (state.pump) {\n    state.pump();\n  }\n}\n\n\/* \u0644\u0648\u062f \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u062a\u0631\u0646\u062a \u06a9\u0646\u062f:\n   1) \u0627\u0648\u0644 \u0641\u0642\u0637 \u0647\u0645\u0627\u0646 \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0627\u0644\u0627\u0646 \u0628\u0627\u06cc\u062f \u0628\u0628\u06cc\u0646\u062f (\u0645\u0639\u0645\u0648\u0644\u0627\u064b \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644)\u060c \u0628\u0627 \u0628\u0627\u0644\u0627\u062a\u0631\u06cc\u0646 \u0627\u0648\u0644\u0648\u06cc\u062a\n   2) \u0628\u0639\u062f \u0628\u0642\u06cc\u0647\u060c \u0627\u0632 \u062f\u0631\u0634\u062a \u0628\u0647 \u0631\u06cc\u0632 (\u0647\u0631 \u06f1\u06f6\u062a\u0627\u060c \u06f8\u062a\u0627\u060c \u06f4\u062a\u0627\u060c ...)\u060c \u0648 \u062f\u0631 \u0647\u0631 \u0645\u0631\u062d\u0644\u0647\n      \u0646\u0632\u062f\u06cc\u06a9\u200c\u062a\u0631\u06cc\u0646 \u0641\u0631\u06cc\u0645 \u0628\u0647 \u062c\u0627\u06cc\u06cc \u06a9\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0627\u0644\u0627\u0646 \u0627\u0633\u06a9\u0631\u0648\u0644 \u06a9\u0631\u062f\u0647\n   3) \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u062e\u0637\u0627 \u0628\u062f\u0647\u062f \u06cc\u0627 \u0645\u0639\u0637\u0644 \u0628\u0645\u0627\u0646\u062f \u062f\u0648\u0628\u0627\u0631\u0647 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u06cc\u200c\u0634\u0648\u062f\n   4) \u0647\u06cc\u0686\u200c\u0686\u06cc\u0632 \u062a\u0627 \u0648\u0642\u062a\u06cc \u0647\u06cc\u0631\u0648 \u0646\u0632\u062f\u06cc\u06a9 \u062f\u06cc\u062f \u06a9\u0627\u0631\u0628\u0631 \u0646\u0628\u0627\u0634\u062f \u062f\u0627\u0646\u0644\u0648\u062f \u0646\u0645\u06cc\u200c\u0634\u0648\u062f (\u0644\u06cc\u0632\u06cc\u200c\u0644\u0648\u062f) *\/\nfunction loadFrames() {\n  const gen = ++state.gen;\n  const set = state.set;\n  const n = set.count;\n\n  state.frames = new Array(n);\n  state.loaded = new Uint8Array(n);\n  state.poster = null;\n  state.drawnIndex = -1;\n  state.drawnImg = null;\n  state.warmIndex = -1;\n  state.pendingStart = null;\n  state.pump = null;\n\n  const LEVELS = [16, 8, 4, 2, 1];\n  const requested = new Uint8Array(n);\n  const tries = new Uint8Array(n);\n  let level = 0;\n  let active = 0;\n  let bulk = false;\n\n  \/* \u0646\u0632\u062f\u06cc\u06a9\u200c\u062a\u0631\u06cc\u0646 \u0641\u0631\u06cc\u0645\u0650 \u062f\u0631\u062e\u0648\u0627\u0633\u062a\u200c\u0646\u0634\u062f\u0647 \u0628\u0647 \u0645\u0648\u0642\u0639\u06cc\u062a \u0641\u0639\u0644\u06cc \u0627\u0633\u06a9\u0631\u0648\u0644\u060c \u062f\u0631 \u0645\u0631\u062d\u0644\u0647\u200c\u06cc \u0641\u0639\u0644\u06cc *\/\n  function pick() {\n    const want = state.wantedIndex;\n    while (level < LEVELS.length) {\n      const step = LEVELS[level];\n      let best = -1, bestDist = Infinity;\n      for (let i = 0; i < n; i += step) {\n        if (requested[i] || !keepFrame(i)) continue;\n        const d = Math.abs(i - want);\n        if (d < bestDist) { bestDist = d; best = i; }\n      }\n      if (best !== -1) return best;\n      level++;\n    }\n    return -1;\n  }\n\n  function pump() {\n    if (gen !== state.gen || !bulk || !state.near) return;\n    const limit = slowNetwork() ? CONFIG.parallelSlow : CONFIG.parallel;\n    while (active < limit) {\n      const i = pick();\n      if (i === -1) break;\n      request(i, 'low');   \/\/ \u0628\u0642\u06cc\u0647\u200c\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u062c\u0644\u0648\u06cc \u0641\u0648\u0646\u062a \u0648 CSS \u0633\u0627\u06cc\u062a \u0631\u0627 \u0646\u06af\u06cc\u0631\u0646\u062f\n    }\n  }\n\n  function request(i, priority, done) {\n    requested[i] = 1;\n    active++;\n    const img = new Image();\n    let settled = false;\n    let timer = 0;\n\n    const finish = ok => {\n      if (settled) return;\n      settled = true;\n      clearTimeout(timer);\n      img.onload = img.onerror = null;\n      active--;\n      if (gen !== state.gen) return;\n\n      if (ok) {\n        if (keepFrame(i)) { state.frames[i] = img; state.loaded[i] = 1; }\n        \/* \u0627\u0648\u0644\u06cc\u0646 \u0641\u0631\u06cc\u0645\u0650 \u0631\u0633\u06cc\u062f\u0647: \u0627\u0628\u0639\u0627\u062f \u0648\u0627\u0642\u0639\u06cc \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0645\u0639\u0644\u0648\u0645 \u0634\u062f\u060c \u06a9\u0627\u0646\u0648\u0627\u0633 \u0631\u0627 \u0628\u0627 \u0622\u0646 \u0647\u0645\u0627\u0647\u0646\u06af \u06a9\u0646 *\/\n        if (!state.srcW && img.naturalWidth) {\n          state.srcW = img.naturalWidth;\n          state.srcH = img.naturalHeight;\n          resizeCanvas();\n        }\n      } else {\n        try { img.src = ''; } catch (e) {}            \/\/ \u062f\u0627\u0646\u0644\u0648\u062f \u0645\u0639\u0637\u0644\u200c\u0645\u0627\u0646\u062f\u0647 \u0631\u0627 \u0642\u0637\u0639 \u06a9\u0646\n        if (tries[i] < CONFIG.retries) {\n          tries[i]++;\n          setTimeout(() => {\n            if (gen !== state.gen) return;\n            requested[i] = 0;\n            level = Math.min(level, LEVELS.length - 1);\n            pump();\n          }, 1200 * tries[i]);\n        }\n      }\n      if (done) done(ok);\n      pump();\n    };\n\n    timer = setTimeout(() => finish(false), CONFIG.timeoutMs);\n    img.decoding = 'async';\n    try { img.fetchPriority = priority; } catch (e) {}\n    img.onload = () => finish(true);\n    img.onerror = () => finish(false);\n    img.src = frameUrl(i);\n  }\n\n  function startBulk() {\n    if (bulk || gen !== state.gen) return;\n    bulk = true;\n    pump();\n  }\n\n  function start() {\n    if (gen !== state.gen) return;\n\n    \/* \u067e\u0648\u0633\u062a\u0631 \u0627\u062e\u062a\u06cc\u0627\u0631\u06cc: \u06cc\u06a9 \u0639\u06a9\u0633 \u062e\u06cc\u0644\u06cc \u06a9\u0645\u200c\u062d\u062c\u0645 \u06a9\u0647 \u0641\u0648\u0631\u0627\u064b \u0645\u06cc\u200c\u0631\u0633\u062f *\/\n    if (set.poster) {\n      const poster = new Image();\n      poster.decoding = 'async';\n      try { poster.fetchPriority = 'high'; } catch (e) {}\n      poster.onload = () => {\n        if (gen !== state.gen) return;\n        state.poster = poster;\n        if (!loopActive) render();\n      };\n      poster.src = set.poster;\n    }\n\n    \/* \u0641\u0631\u06cc\u0645\u06cc \u06a9\u0647 \u06a9\u0627\u0631\u0628\u0631 \u0647\u0645\u06cc\u0646 \u0627\u0644\u0627\u0646 \u0628\u0627\u06cc\u062f \u0628\u0628\u06cc\u0646\u062f: \u062a\u0646\u0647\u0627 \u0648 \u0628\u0627 \u0628\u0627\u0644\u0627\u062a\u0631\u06cc\u0646 \u0627\u0648\u0644\u0648\u06cc\u062a *\/\n    let first = clamp(state.wantedIndex, 0, n - 1);\n    if (!keepFrame(first)) first -= first % state.step;\n    const t0 = performance.now();\n\n    request(first, 'high', ok => {\n      if (ok && performance.now() - t0 > CONFIG.slowFirstFrameMs) state.netSlow = true;\n      if (!loopActive) render();\n      startBulk();\n    });\n\n    \/* \u0627\u06af\u0631 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644 \u062e\u06cc\u0644\u06cc \u0637\u0648\u0644 \u06a9\u0634\u06cc\u062f\u060c \u0628\u0642\u06cc\u0647 \u0628\u06cc\u0634\u062a\u0631 \u0627\u0632 \u0627\u06cc\u0646 \u0645\u0646\u062a\u0638\u0631 \u0646\u0645\u0627\u0646\u0646\u062f *\/\n    setTimeout(startBulk, CONFIG.firstFrameWaitMs);\n  }\n\n  state.pump = pump;\n  if (state.near) start();\n  else state.pendingStart = start;       \/\/ \u0647\u0646\u0648\u0632 \u0628\u0647 \u0647\u06cc\u0631\u0648 \u0646\u0631\u0633\u06cc\u062f\u0647\u200c\u0627\u06cc\u0645: \u0641\u0639\u0644\u0627\u064b \u0647\u06cc\u0686 \u062f\u0627\u0646\u0644\u0648\u062f\u06cc \u0646\u0647\n}\n\n\/* \u0627\u06af\u0631 \u0641\u0631\u06cc\u0645 \u062f\u0642\u06cc\u0642 \u0647\u0646\u0648\u0632 \u0646\u0631\u0633\u06cc\u062f\u0647\u060c \u0646\u0632\u062f\u06cc\u06a9\u200c\u062a\u0631\u06cc\u0646 \u0641\u0631\u06cc\u0645 \u0644\u0648\u062f\u0634\u062f\u0647 \u0631\u0627 \u0646\u0634\u0627\u0646 \u0628\u062f\u0647 *\/\nfunction nearestLoaded(i) {\n  const n = state.set.count;\n  if (!state.loaded) return -1;\n  for (let d = 0; d < n; d++) {\n    if (i - d >= 0 && state.loaded[i - d]) return i - d;\n    if (i + d < n && state.loaded[i + d]) return i + d;\n  }\n  return -1;\n}\n\n\/* \u0686\u0646\u062f \u0641\u0631\u06cc\u0645\u0650 \u0628\u0639\u062f\u06cc (\u062f\u0631 \u062c\u0647\u062a \u0627\u0633\u06a9\u0631\u0648\u0644) \u0631\u0627 \u062e\u0627\u0631\u062c \u0627\u0632 \u062a\u0631\u062f \u0627\u0635\u0644\u06cc \u062f\u06cc\u06a9\u0648\u062f \u0645\u06cc\u200c\u06a9\u0646\u062f\n   \u062a\u0627 \u0648\u0642\u062a\u06cc \u0627\u0633\u06a9\u0631\u0648\u0644 \u0628\u0647 \u0622\u0646\u200c\u0647\u0627 \u0631\u0633\u06cc\u062f\u060c \u06a9\u0634\u06cc\u062f\u0646 \u0631\u0648\u06cc \u06a9\u0627\u0646\u0648\u0627\u0633 \u0645\u06a9\u062b \u0646\u06a9\u0646\u062f. *\/\nfunction warmAhead(idx) {\n  if (idx === state.warmIndex) return;\n  const dir = idx >= state.warmIndex ? 1 : -1;\n  state.warmIndex = idx;\n  const n = state.set.count;\n  for (let k = 1; k <= CONFIG.decodeAhead; k++) {\n    const j = idx + dir * k * state.step;\n    if (j < 0 || j >= n || !state.loaded[j]) continue;\n    const im = state.frames[j];\n    if (im && typeof im.decode === 'function') im.decode().catch(() => {});\n  }\n}\n\n\/* \u0627\u0646\u062f\u0627\u0632\u0647\u200c\u06cc \u06a9\u0627\u0646\u0648\u0627\u0633:\n   - \u062d\u062f\u0627\u06a9\u062b\u0631 \u062a\u0627 \u0633\u0642\u0641 DPR\n   - \u0648 \u0647\u06cc\u0686\u200c\u0648\u0642\u062a \u0628\u0632\u0631\u06af\u200c\u062a\u0631 \u0627\u0632 \u062e\u0648\u062f\u0650 \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 (\u0628\u0632\u0631\u06af\u200c\u062a\u0631 \u0627\u0632 \u0622\u0646 \u06a9\u06cc\u0641\u06cc\u062a\u06cc \u0627\u0636\u0627\u0641\u0647 \u0646\u0645\u06cc\u200c\u06a9\u0646\u062f\u060c\n     \u0641\u0642\u0637 \u062f\u0631 \u0647\u0631 \u0641\u0631\u06cc\u0645 \u067e\u06cc\u06a9\u0633\u0644 \u0628\u06cc\u0634\u062a\u0631\u06cc \u0628\u0627\u06cc\u062f \u06a9\u0634\u06cc\u062f\u0647 \u0634\u0648\u062f) \u2014 \u0648\u0644\u06cc \u06a9\u0645\u062a\u0631 \u0627\u0632 1x \u0647\u0645 \u0646\u0645\u06cc\u200c\u0634\u0648\u062f. *\/\nfunction resizeCanvas() {\n  const cssW = sticky.clientWidth;\n  const cssH = sticky.clientHeight;\n  const cap = state.lite ? CONFIG.lite.maxDpr : CONFIG.maxDpr;\n  let ratio = Math.min(window.devicePixelRatio || 1, cap);\n\n  if (state.srcW && state.srcH && cssW && cssH) {\n    const srcRatio = Math.min(state.srcW \/ cssW, state.srcH \/ cssH);\n    ratio = Math.min(ratio, Math.max(1, srcRatio));\n  }\n\n  const w = Math.max(1, Math.round(cssW * ratio));\n  const h = Math.max(1, Math.round(cssH * ratio));\n  if (canvas.width !== w || canvas.height !== h) {\n    canvas.width = w;\n    canvas.height = h;\n    ctx.fillStyle = '#08080b';           \/\/ \u06a9\u0627\u0646\u0648\u0627\u0633\u0650 \u062a\u0627\u0632\u0647 \u0633\u06cc\u0627\u0647\u0650 \u0645\u0637\u0644\u0642 \u0627\u0633\u062a\u061b \u0647\u0645\u200c\u0631\u0646\u06af \u067e\u0633\u200c\u0632\u0645\u06cc\u0646\u0647 \u0634\u0648\u062f\n    ctx.fillRect(0, 0, w, h);\n    state.needsDraw = true;\n    return true;\n  }\n  return false;\n}\n\n\/* object-fit: cover \u0631\u0648\u06cc \u06a9\u0627\u0646\u0648\u0627\u0633\n   sharp=false \u0645\u0648\u0642\u0639 \u062d\u0631\u06a9\u062a (\u0633\u0631\u06cc\u0639\u200c\u062a\u0631\u06cc\u0646 \u0641\u06cc\u0644\u062a\u0631) \u2014 sharp=true \u0648\u0642\u062a\u06cc \u0627\u0633\u06a9\u0631\u0648\u0644 \u0627\u06cc\u0633\u062a\u0627\u062f\u0647 *\/\nfunction drawFrame(img, sharp) {\n  const cw = canvas.width, ch = canvas.height;\n  const iw = img.naturalWidth, ih = img.naturalHeight;\n  if (!iw || !ih) return false;\n  const scale = Math.max(cw \/ iw, ch \/ ih);\n  const dw = Math.ceil(iw * scale), dh = Math.ceil(ih * scale);\n  try {\n    ctx.imageSmoothingEnabled = true;\n    ctx.imageSmoothingQuality = (sharp && !state.lite) ? 'high' : 'low';\n    \/* \u062a\u0635\u0648\u06cc\u0631 \u0647\u0645\u06cc\u0634\u0647 \u06a9\u0644 \u06a9\u0627\u0646\u0648\u0627\u0633 \u0631\u0627 \u0645\u06cc\u200c\u067e\u0648\u0634\u0627\u0646\u062f\u060c \u067e\u0633 \u067e\u0627\u06a9\u200c\u06a9\u0631\u062f\u0646\u0650 \u0642\u0628\u0644\u0634 \u0644\u0627\u0632\u0645 \u0646\u06cc\u0633\u062a *\/\n    ctx.drawImage(img, Math.floor((cw - dw) \/ 2), Math.floor((ch - dh) \/ 2), dw, dh);\n  } catch (e) {\n    return false;\n  }\n  return true;\n}\n\n\n\/* ---------- \u062d\u0627\u0644\u062a \u0633\u0628\u06a9 (\u062f\u0631 \u062d\u06cc\u0646 \u06a9\u0627\u0631) ---------- *\/\nfunction enableLite() {\n  if (state.lite) return;\n  state.lite = true;\n  state.step = Math.max(1, CONFIG.lite.frameStep | 0);\n  host.setAttribute('data-matris-mode', 'lite');\n\n  \/* \u0641\u0631\u06cc\u0645\u200c\u0647\u0627\u06cc \u0627\u0636\u0627\u0641\u0647 \u0631\u0627 \u0631\u0647\u0627 \u06a9\u0646 \u062a\u0627 \u0631\u0645 \u0622\u0632\u0627\u062f \u0634\u0648\u062f *\/\n  if (state.loaded && state.set) {\n    for (let i = 0; i < state.set.count; i++) {\n      if (!keepFrame(i)) { state.frames[i] = undefined; state.loaded[i] = 0; }\n    }\n  }\n\n  clearHeavyIntroStyles();\n  resizeCanvas();\n  state.warmIndex = -1;\n  state.styledTime = -1;\n  state.needsDraw = true;\n}\n\n\/* \u0627\u06af\u0631 \u0645\u0648\u0642\u0639 \u0627\u0633\u06a9\u0631\u0648\u0644 \u0641\u0631\u06cc\u0645\u200c\u0647\u0627 \u0645\u062f\u0627\u0645 \u062f\u06cc\u0631 \u0628\u0631\u0633\u0646\u062f\u060c \u062e\u0648\u062f\u06a9\u0627\u0631 \u0628\u0647 \u062d\u0627\u0644\u062a \u0633\u0628\u06a9 \u0645\u06cc\u200c\u0631\u0648\u062f *\/\nconst perf = { last: 0, total: 0, slow: 0, strikes: 0 };\n\nfunction watchPerformance(now) {\n  if (state.lite || !now) return;\n  const dt = perf.last ? now - perf.last : 0;\n  perf.last = now;\n  const moving = Math.abs(state.targetTime - state.renderedTime) > 0.01;\n  if (!moving || dt <= 0 || dt > 1000) return;\n\n  perf.total++;\n  if (dt > 40) perf.slow++;\n\n  if (perf.total >= 45) {\n    perf.strikes = perf.slow >= 14 ? perf.strikes + 1 : 0;\n    perf.total = 0;\n    perf.slow = 0;\n    if (perf.strikes >= 2) enableLite();\n  }\n}\n\n\n\/* ---------- RENDER ---------- *\/\n\/* dt = \u0641\u0627\u0635\u0644\u0647\u200c\u06cc \u0627\u06cc\u0646 \u0641\u0631\u06cc\u0645 \u0628\u0627 \u0641\u0631\u06cc\u0645 \u0642\u0628\u0644 (\u0645\u06cc\u0644\u06cc\u200c\u062b\u0627\u0646\u06cc\u0647). \u0646\u0631\u0645\u06cc\u0650 \u062f\u0646\u0628\u0627\u0644\u200c\u06a9\u0631\u062f\u0646\u0650 \u0627\u0633\u06a9\u0631\u0648\u0644 \u0628\u0647 \u0632\u0645\u0627\u0646\n   \u0648\u0627\u0628\u0633\u062a\u0647 \u0627\u0633\u062a \u0646\u0647 \u0628\u0647 \u062a\u0639\u062f\u0627\u062f \u0641\u0631\u06cc\u0645\u060c \u067e\u0633 \u0631\u0648\u06cc \u0635\u0641\u062d\u0647\u200c\u0647\u0627\u06cc 120Hz \u0648 \u06af\u0648\u0634\u06cc\u200c\u0647\u0627\u06cc \u06a9\u0646\u062f \u06cc\u06a9\u200c\u062c\u0648\u0631 \u062d\u0633 \u0645\u06cc\u200c\u0634\u0648\u062f. *\/\nfunction render(dt) {\n  const delta = state.targetTime - state.renderedTime;\n  const distance = Math.abs(delta);\n  const base = distance > 0.8 ? 0.12 : distance > 0.25 ? 0.17 : 0.22;\n  const k = clamp((dt > 0 ? dt : FRAME_MS) \/ FRAME_MS, 0.25, 3);\n  const follow = 1 - Math.pow(1 - base, k);\n\n  state.renderedTime += delta * follow;\n  if (distance < 0.0015) state.renderedTime = state.targetTime;\n\n  const moving = state.renderedTime !== state.targetTime;\n  const progress = state.duration ? clamp(state.renderedTime \/ state.duration, 0, 1) : 0;\n\n  \/* FRAME *\/\n  const wanted = Math.round(progress * (state.set.count - 1));\n  state.wantedIndex = wanted;            \/\/ \u0644\u0648\u062f\u0631 \u0627\u0632 \u0647\u0645\u06cc\u0646\u200c\u062c\u0627 \u0645\u06cc\u200c\u0641\u0647\u0645\u062f \u06a9\u0627\u0631\u0628\u0631 \u06a9\u062c\u0627\u0633\u062a\n  const idx = nearestLoaded(wanted);\n  const img = idx !== -1 ? state.frames[idx] : state.poster;   \/\/ \u0647\u0646\u0648\u0632 \u0641\u0631\u06cc\u0645\u06cc \u0646\u0631\u0633\u06cc\u062f\u0647\u061f \u067e\u0648\u0633\u062a\u0631\n  if (img) {\n    const fresh = state.needsDraw || img !== state.drawnImg;\n    \/* \u0641\u0631\u06cc\u0645 \u062a\u0627\u0632\u0647\u060c \u06cc\u0627 \u0627\u0633\u06a9\u0631\u0648\u0644 \u0627\u06cc\u0633\u062a\u0627\u062f\u0647 \u0648 \u0641\u0631\u06cc\u0645 \u0641\u0639\u0644\u06cc \u0647\u0646\u0648\u0632 \u0628\u0627 \u06a9\u06cc\u0641\u06cc\u062a \u06a9\u0627\u0645\u0644 \u06a9\u0634\u06cc\u062f\u0647 \u0646\u0634\u062f\u0647 *\/\n    if (fresh || (!moving && !state.drawnSharp)) {\n      if (drawFrame(img, !moving)) {\n        state.drawnIndex = idx;\n        state.drawnImg = img;\n        state.drawnSharp = !moving || state.lite;\n        state.needsDraw = false;\n      }\n    }\n  }\n  if (idx !== -1) warmAhead(idx);\n\n  \/* \u0648\u0642\u062a\u06cc \u0627\u0633\u06a9\u0631\u0648\u0644 \u062b\u0627\u0628\u062a \u0627\u0633\u062a\u060c \u0628\u0647 DOM \u062f\u0633\u062a \u0646\u0632\u0646 *\/\n  if (state.renderedTime !== state.styledTime) {\n    state.styledTime = state.renderedTime;\n    updateIntro(state.renderedTime);\n    for (let i = 0; i < textLayers.length; i++) updateTextLayer(textLayers[i], i, progress);\n  }\n}\n\n\n\/* ---------- LOOP ---------- *\/\n\/* \u0647\u0645\u06cc\u0634\u0647 \u0641\u0642\u0637 \u06cc\u06a9 \u062d\u0644\u0642\u0647: rafId \u0646\u06af\u0647 \u062f\u0627\u0634\u062a\u0647 \u0645\u06cc\u200c\u0634\u0648\u062f \u062a\u0627 \u0628\u0627 \u0628\u0631\u06af\u0634\u062a \u0627\u0632 bfcache \/ \u062a\u0628\u060c\n   \u062f\u0648 \u062d\u0644\u0642\u0647 \u0647\u0645\u200c\u0632\u0645\u0627\u0646 \u0631\u0627\u0647 \u0646\u06cc\u0641\u062a\u062f. \u062e\u0637\u0627\u06cc \u06cc\u06a9 \u0641\u0631\u06cc\u0645 \u0647\u0645 \u062d\u0644\u0642\u0647 \u0631\u0627 \u0646\u0645\u06cc\u200c\u06a9\u064f\u0634\u062f. *\/\nlet loopActive = false;\nlet rafId = 0;\nlet lastNow = 0;\n\nfunction driveLoop(now) {\n  if (!loopActive) return;\n  rafId = requestAnimationFrame(driveLoop);\n  const dt = lastNow ? now - lastNow : FRAME_MS;\n  lastNow = now;\n  try {\n    const p = updateFromScroll();\n    updateScrollGuide(p);\n    watchPerformance(now);\n    render(dt);\n  } catch (e) {}\n}\n\nfunction startLoop() {\n  if (loopActive) return;\n  loopActive = true;\n  lastNow = 0;\n  cancelAnimationFrame(rafId);\n  rafId = requestAnimationFrame(driveLoop);\n}\n\nfunction stopLoop() {\n  loopActive = false;\n  cancelAnimationFrame(rafId);\n  rafId = 0;\n}\n\nconst visibilityObserver = new IntersectionObserver(entries => {\n  const entry = entries[entries.length - 1];\n  if (entry.isIntersecting) startLoop();\n  else stopLoop();\n}, { threshold: 0.01 });\n\n\/* \u0644\u06cc\u0632\u06cc\u200c\u0644\u0648\u062f: \u062f\u0648\u0631 \u0648 \u0646\u0632\u062f\u06cc\u06a9\u200c\u0634\u062f\u0646\u0650 \u0647\u06cc\u0631\u0648 \u0628\u0647 \u062f\u06cc\u062f \u06a9\u0627\u0631\u0628\u0631 *\/\nconst nearObserver = new IntersectionObserver(entries => {\n  setNear(entries[entries.length - 1].isIntersecting);\n}, { rootMargin: `${Math.round(CONFIG.lazyMargin * 100)}% 0px`, threshold: 0 });\n\n\n\/* ---------- DEVICE \/ SET ---------- *\/\nfunction applyDevice() {\n  state.mobile = mq.matches;\n  state.set = state.mobile ? CONFIG.mobile : CONFIG.desktop;\n  state.duration = state.set.duration;\n  state.srcW = 0;                        \/\/ \u0627\u0628\u0639\u0627\u062f \u0641\u0631\u06cc\u0645\u200c\u0647\u0627\u06cc \u0627\u06cc\u0646 \u0646\u0633\u062e\u0647 \u0647\u0646\u0648\u0632 \u0645\u0639\u0644\u0648\u0645 \u0646\u06cc\u0633\u062a\n  state.srcH = 0;\n  clearHeavyIntroStyles();\n  positionTextLayers();\n  resizeCanvas();\n  updateFromScroll();\n  state.renderedTime = state.targetTime;\n  state.styledTime = -1;\n  state.wantedIndex = Math.round(clamp(state.renderedTime \/ state.duration, 0, 1) * (state.set.count - 1));\n  loadFrames();\n}\n\n\n\/* ---------- RESIZE ---------- *\/\nlet resizeTimer = null;\nwindow.addEventListener('resize', () => {\n  clearTimeout(resizeTimer);\n  resizeTimer = setTimeout(() => {\n    if (mq.matches !== state.mobile) {\n      applyDevice();           \/\/ \u0639\u0628\u0648\u0631 \u0627\u0632 \u0628\u0631\u06cc\u06a9\u200c\u067e\u0648\u06cc\u0646\u062a: \u0641\u0631\u06cc\u0645\u200c\u0647\u0627\u06cc \u0646\u0633\u062e\u0647\u200c\u06cc \u062f\u06cc\u06af\u0631 \u0644\u0648\u062f \u0634\u0648\u062f\n    } else {\n      positionTextLayers();\n      resizeCanvas();\n    }\n    if (!loopActive) render();\n  }, 100);\n}, { passive: true });\n\n\n\/* ---------- RESUME (\u0628\u0631\u06af\u0634\u062a \u0628\u0647 \u062a\u0628 \/ \u0628\u06a9) ---------- *\/\nfunction redrawNow() {\n  updateFromScroll();\n  state.renderedTime = state.targetTime;\n  state.styledTime = -1;\n  resizeCanvas();\n  state.needsDraw = true;\n  render();\n  const r = section.getBoundingClientRect();\n  if (r.bottom > 0 && r.top < window.innerHeight) startLoop();\n}\n\ndocument.addEventListener('visibilitychange', () => {\n  if (document.visibilityState === 'visible') redrawNow();\n});\n\nwindow.addEventListener('pageshow', e => {\n  if (e.persisted) redrawNow();\n});\n\n\/* \u0627\u06af\u0631 \u0645\u0631\u0648\u0631\u06af\u0631 \u062d\u0627\u0641\u0638\u0647\u200c\u06cc \u06a9\u0627\u0646\u0648\u0627\u0633 \u0631\u0627 \u062f\u0648\u0631 \u0631\u06cc\u062e\u062a \u0648 \u067e\u0633 \u062f\u0627\u062f\u060c \u0647\u0645\u0627\u0646 \u0641\u0631\u06cc\u0645 \u062f\u0648\u0628\u0627\u0631\u0647 \u06a9\u0634\u06cc\u062f\u0647 \u0634\u0648\u062f *\/\ncanvas.addEventListener('contextrestored', () => {\n  state.needsDraw = true;\n  if (!loopActive) render();\n});\n\n\n\/* ---------- INIT ---------- *\/\n\/* \u0628\u062f\u0648\u0646 \u0627\u0646\u062a\u0638\u0627\u0631 \u0628\u0631\u0627\u06cc \u06a9\u0627\u0645\u0644\u200c\u0634\u062f\u0646 \u0635\u0641\u062d\u0647 \u0634\u0631\u0648\u0639 \u0645\u06cc\u200c\u0634\u0648\u062f \u062a\u0627 \u0641\u0631\u06cc\u0645 \u0627\u0648\u0644 \u0632\u0648\u062f\u062a\u0631 \u0628\u0631\u0633\u062f *\/\nfunction init() {\n  if (state.lite) clearHeavyIntroStyles();\n  state.near = heroNear();\n  applyDevice();\n  render();\n  visibilityObserver.observe(section);\n  nearObserver.observe(section);\n\n  \/* \u0627\u06af\u0631 \u0686\u06cc\u062f\u0645\u0627\u0646 \u0635\u0641\u062d\u0647 \u0628\u0639\u062f\u0627\u064b \u0639\u0648\u0636 \u0634\u062f\u060c \u06a9\u0627\u0646\u0648\u0627\u0633 \u0647\u0645\u0627\u0646 \u0644\u062d\u0638\u0647 \u0647\u0645\u200c\u0627\u0646\u062f\u0627\u0632\u0647 \u0648 \u062f\u0648\u0628\u0627\u0631\u0647 \u06a9\u0634\u06cc\u062f\u0647 \u0634\u0648\u062f *\/\n  if ('ResizeObserver' in window) {\n    new ResizeObserver(() => {\n      if (resizeCanvas() && state.drawnImg) {\n        if (drawFrame(state.drawnImg, true)) {\n          state.drawnSharp = true;\n          state.needsDraw = false;\n        }\n      }\n    }).observe(sticky);\n  }\n}\n\ntry { init(); } catch (e) { console.error('[matris-hero]', e); }\n\nwindow.addEventListener('pagehide', stopLoop);\n\n})();\n\n\n\/* =========================================================\n   SCROLL POSITION RESTORE\n   ========================================================= *\/\n(() => {\n  const KEY = 'matris-hero-scroll:' + location.pathname;\n  const MAX_AGE = 30 * 60 * 1000;\n  const heroEl = shadow.getElementById('matris-hero-isolated');\n  let saveTimer = null;\n\n  function save() {\n    try {\n      if (!heroEl) return;\n      const rect = heroEl.getBoundingClientRect();\n      if (rect.top > 0 || rect.bottom < 0) { sessionStorage.removeItem(KEY); return; }\n      sessionStorage.setItem(KEY, JSON.stringify({ y: Math.round(window.scrollY), t: Date.now() }));\n    } catch (e) {}\n  }\n\n  window.addEventListener('scroll', () => {\n    clearTimeout(saveTimer);\n    saveTimer = setTimeout(save, 150);\n  }, { passive: true });\n  window.addEventListener('pagehide', save);\n  document.addEventListener('visibilitychange', () => {\n    if (document.visibilityState === 'hidden') save();\n  });\n\n  function restore() {\n    try {\n      const nav = performance.getEntriesByType('navigation')[0];\n      if (!nav || (nav.type !== 'reload' && nav.type !== 'back_forward')) return;\n      const raw = sessionStorage.getItem(KEY);\n      if (!raw) return;\n      const data = JSON.parse(raw);\n      if (!data || Date.now() - data.t > MAX_AGE || window.scrollY > 5) return;\n      window.scrollTo(0, data.y);\n    } catch (e) {}\n  }\n\n  if (document.readyState === 'complete') setTimeout(restore, 250);\n  else window.addEventListener('load', () => setTimeout(restore, 250), { once: true });\n})();\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-22bda1a e-con-full e-flex e-con e-parent\" data-id=\"22bda1a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f83c579 elementor-widget elementor-widget-html\" data-id=\"f83c579\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\n\/* =========================================================\n   ISOLATION + FONT\n========================================================= *\/\n\n#matris-hero-root,\n#matris-hero-root *,\n#matris-manifesto-root_2,\n#matris-manifesto-root_2 * {\n    box-sizing: border-box;\n    font-family: IranYekanX !important;\n    letter-spacing: 0 !important;\n    font-kerning: normal !important;\n    text-transform: none !important;\n}\n\n\n\/* =========================================================\n   HERO\n========================================================= *\/\n\n#matris-hero-root {\n    margin: 0;\n    padding: 0;\n    background: #00062c;\n    position: relative;\n    overflow: hidden;\n    -webkit-font-smoothing: antialiased;\n    isolation: isolate;\n    width: 100%;\n    max-width: 100%;\n    left: 0;\n    right: 0;\n}\n\n#matris-hero-root .mh-wrap {\n    width: 100%;\n    max-width: 100%;\n    padding: 0 4vw;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: #00062c;\n}\n\n#matris-hero-root .mh-title {\n    font-weight: 900;\n\n    font-size: clamp(36px, 6.5vw, 78px) !important;\n\n    line-height: 1.2;\n    max-width: 100%;\n    overflow-wrap: normal;\n    word-break: keep-all;\n    margin: 0;\n    text-align: center;\n    position: relative;\n    display: inline-block;\n\n    background-image:\n        linear-gradient(\n            115deg,\n            rgba(255,255,255,0) 35%,\n            rgba(255,255,255,0.85) 50%,\n            rgba(255,255,255,0) 65%\n        ),\n        linear-gradient(\n            135deg,\n            rgba(28,42,130,0.85) 0%,\n            rgba(90,40,160,0.80) 40%,\n            rgba(180,40,130,0.85) 100%\n        ),\n        url(\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-2-2026-01_44_18-PM-1.webp\");\n\n    background-size:\n        250% 100%,\n        100% 100%,\n        cover;\n\n    background-position:\n        200% 0,\n        center,\n        center;\n\n    background-repeat: no-repeat;\n\n    -webkit-background-clip: text;\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n    color: transparent;\n\n    animation: mx11-mh-shine 3.2s ease-in-out infinite;\n}\n\n\n\/* =========================================================\n   SHINE ANIMATION\n========================================================= *\/\n\n@keyframes mx11-mh-shine {\n\n    0% {\n        background-position:\n            200% 0,\n            center,\n            center;\n    }\n\n    60%, 100% {\n        background-position:\n            -100% 0,\n            center,\n            center;\n    }\n\n}\n\n\n\/* =========================================================\n   MANIFESTO\n========================================================= *\/\n\n#matris-manifesto-root_2 {\n    margin: 0;\n    padding: 0;\n    background: #00062c;\n    color: #ffffff;\n    overflow: hidden;\n    position: relative;\n    line-height: 1.85;\n    min-height: 0;\n    -webkit-font-smoothing: antialiased;\n    isolation: isolate;\n    width: 100%;\n    max-width: 100%;\n    left: 0;\n    right: 0;\n}\n\n\n\/* Selection *\/\n\n#matris-manifesto-root_2 ::selection {\n    background: #1C2A5E;\n    color: #ffffff;\n}\n\n\n\/* Line *\/\n\n#matris-manifesto-root_2 .mx-line {\n    border-top: 0;\n    background: #00062c;\n    position: relative;\n    overflow: hidden;\n    width: 100%;\n    max-width: 100%;\n}\n\n\n\/* Grain *\/\n\n#matris-manifesto-root_2 .mx-grain {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    z-index: 9998;\n    opacity: 0.035;\n    mix-blend-mode: multiply;\n\n    background-image:\n        url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'\/%3E%3C\/svg%3E\");\n}\n\n\n\/* =========================================================\n   MANIFESTO WRAP\n========================================================= *\/\n\n#matris-manifesto-root_2 .mx-manifesto-wrap {\n\n    padding:\n        clamp(48px, 9vh, 14vh)\n        4vw\n        0;\n\n    width: 100%;\n    max-width: 100%;\n}\n\n\n\/* Inner *\/\n\n#matris-manifesto-root_2 .mx-manifesto-inner {\n    max-width: 940px;\n    margin-left: auto;\n    margin-right: auto;\n    text-align: center;\n}\n\n\n\/* =========================================================\n   LABEL \u2014 \u0628\u0627\u0648\u0631 \u0645\u0627\n========================================================= *\/\n\n#matris-manifesto-root_2 .mx-label {\n\n    font-size:\n        clamp(18px, 1.3vw, 24px) !important;\n\n    color: #ffffff;\n    font-weight: 700;\n    line-height: 1.4;\n\n    margin-bottom:\n        clamp(55px, 5vh, 75px);\n}\n\n\n\/* =========================================================\n   MAIN TEXT \u2014 \u0645\u062a\u0646 \u0628\u0627\u0648\u0631 \u0645\u0627\n========================================================= *\/\n\n#matris-manifesto-root_2 #mx-manifesto_2 {\n\n    font-size:\n        clamp(18px, 1.7vw, 32px) !important;\n\n    line-height: 1.8;\n    font-weight: 700;\n    color: #ffffff;\n\n    width: 100%;\n    margin-left: auto;\n    margin-right: auto;\n}\n\n\n\/* Individual words *\/\n\n#matris-manifesto-root_2 #mx-manifesto_2 .mx-w {\n    opacity: .22;\n    color: #ffffff;\n    transition: opacity .18s linear;\n    display: inline;\n}\n\n\n\/* Footer *\/\n\n#matris-manifesto-root_2 .mx-footer {\n    margin-top:\n        clamp(16px, 3vh, 40px);\n\n    font-size:\n        clamp(9px, 1.2vw, 12.5px);\n\n    color: #ffffff;\n    font-weight: 700;\n}\n\n\n\/* =========================================================\n   MAIN ISOLATION\n========================================================= *\/\n\n#mx11-isolation {\n    width: 100%;\n    max-width: 100%;\n    margin: 0;\n    padding: 0;\n    background: #00062c;\n    overflow-x: hidden;\n}\n\n#mx11-isolation .mx-composition {\n    min-height: 100vh;\n    min-height: 100dvh;\n\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n\n    width: 100%;\n    max-width: 100%;\n\n    margin: 0;\n    padding: 0;\n\n    background: #00062c;\n    overflow-x: hidden;\n}\n\n#mx11-isolation .mx-composition #matris-hero-root,\n#mx11-isolation .mx-composition #matris-manifesto-root_2 {\n    flex: 0 0 auto;\n    width: 100%;\n    max-width: 100%;\n    margin-left: 0;\n    margin-right: 0;\n}\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 767px) {\n\n    #mx11-isolation {\n        width: 100%;\n        max-width: 100%;\n        min-height: 100vh;\n        min-height: 100svh;\n        background: #00062c;\n        overflow-x: hidden;\n    }\n\n\n    #mx11-isolation .mx-composition {\n        width: 100%;\n        max-width: 100%;\n\n        height: 100vh;\n        min-height: 100vh;\n\n        height: 100svh;\n        min-height: 100svh;\n        max-height: 100svh;\n\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n\n        overflow: hidden;\n    }\n\n\n    \/* HERO *\/\n\n    #matris-hero-root {\n        width: 100%;\n        max-width: 100%;\n\n        height: auto;\n        min-height: 0;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n\n    #matris-hero-root .mh-wrap {\n        width: 100%;\n        max-width: 100%;\n\n        padding:\n            clamp(12px, 3vh, 22px)\n            4vw\n            clamp(5px, 1.5vh, 10px);\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        overflow: hidden;\n    }\n\n\n    #matris-hero-root .mh-title {\n\n        width: 100%;\n        max-width: 100%;\n\n        font-size:\n            clamp(28px, 9vw, 46px) !important;\n\n        line-height: 1.12;\n\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: clip;\n    }\n\n\n    \/* MANIFESTO *\/\n\n    #matris-manifesto-root_2 {\n        width: 100%;\n        max-width: 100%;\n\n        margin-top: 0;\n\n        flex: 0 0 auto;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n\n    #matris-manifesto-root_2 .mx-line {\n        width: 100%;\n        max-width: 100%;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        width: 100%;\n        max-width: 100%;\n\n        padding-top:\n            clamp(28px, 7vh, 55px);\n\n        padding-right: 4vw;\n\n        padding-bottom:\n            clamp(10px, 3vh, 28px);\n\n        padding-left: 4vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-inner {\n        width: 100%;\n        max-width: 100%;\n\n        margin-left: auto;\n        margin-right: auto;\n\n        text-align: center;\n    }\n\n\n    \/* \u0628\u0627\u0648\u0631 \u0645\u0627 *\/\n\n    #matris-manifesto-root_2 .mx-label {\n\n        font-size:\n            clamp(13px, 4vw, 18px) !important;\n\n        line-height: 1.4;\n\n        margin-top: 0;\n\n        margin-bottom:\n            clamp(30px, 5vh, 42px);\n    }\n\n\n    \/* \u0645\u062a\u0646 \u0627\u0635\u0644\u06cc *\/\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            clamp(13px, 4vw, 17px) !important;\n\n        line-height:\n            clamp(1.8, 2, 2.15);\n\n        letter-spacing: 0 !important;\n\n        word-spacing: 3px;\n\n        overflow-wrap: normal;\n        word-break: normal;\n    }\n\n\n    #matris-manifesto-root_2 .mx-footer {\n        margin-top:\n            clamp(12px, 2.5vh, 22px);\n\n        font-size:\n            clamp(8px, 2.7vw, 11px);\n\n        line-height: 1.5;\n    }\n\n}\n\n\n\/* =========================================================\n   VERY SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 380px) {\n\n    #mx11-isolation .mx-composition {\n        height: 100vh !important;\n        min-height: 100vh !important;\n\n        height: 100svh !important;\n        min-height: 100svh !important;\n        max-height: 100svh !important;\n    }\n\n\n    #matris-hero-root .mh-wrap {\n        padding:\n            10px\n            4vw\n            5px;\n\n        overflow: hidden;\n    }\n\n\n    #matris-hero-root .mh-title {\n\n        font-size:\n            clamp(25px, 8.5vw, 39px) !important;\n\n        line-height: 1.08;\n\n        max-width: 100%;\n        overflow: hidden;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        padding-top:\n            24px;\n\n        padding-right: 4vw;\n\n        padding-bottom:\n            10px;\n\n        padding-left: 4vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-label {\n\n        font-size:\n            clamp(12px, 3.5vw, 15px) !important;\n\n        margin-bottom: 28px;\n    }\n\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            clamp(11px, 3.6vw, 14px) !important;\n\n        line-height: 1.8;\n\n        word-spacing: 2.5px;\n    }\n\n\n    #matris-manifesto-root_2 .mx-footer {\n        margin-top: 10px;\n\n        font-size:\n            clamp(7px, 2.4vw, 9px);\n    }\n\n}\n\n\n\/* =========================================================\n   SHORT MOBILE\n========================================================= *\/\n\n@media (max-width: 767px) and (max-height: 650px) {\n\n    #matris-hero-root .mh-wrap {\n\n        padding-top: 8px;\n        padding-right: 4vw;\n        padding-bottom: 4px;\n        padding-left: 4vw;\n    }\n\n\n    #matris-hero-root .mh-title {\n\n        font-size:\n            clamp(24px, 8vw, 38px) !important;\n\n        line-height: 1.05;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        padding-top:\n            22px;\n\n        padding-right: 4vw;\n        padding-bottom: 8px;\n        padding-left: 4vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-label {\n\n        margin-bottom:\n            26px;\n    }\n\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            clamp(11px, 3.6vw, 14px) !important;\n\n        line-height: 1.8;\n\n        word-spacing: 2.5px;\n    }\n\n\n    #matris-manifesto-root_2 .mx-footer {\n        margin-top: 8px;\n\n        font-size:\n            clamp(7px, 2.2vw, 9px);\n    }\n\n}\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (min-width: 640px) {\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            18px !important;\n    }\n\n}\n\n\n\/* =========================================================\n   TABLET \/ DESKTOP\n========================================================= *\/\n\n@media (min-width: 768px) {\n\n    #matris-hero-root {\n        height: auto;\n        min-height: 0;\n    }\n\n\n    #matris-hero-root .mh-wrap {\n        padding-left: 4vw;\n        padding-right: 4vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        padding-top:\n            clamp(35px, 5vh, 70px);\n\n        padding-bottom: 24px;\n\n        padding-left: 4vw;\n        padding-right: 4vw;\n    }\n\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            20px !important;\n    }\n\n}\n\n\n\/* =========================================================\n   DESKTOP\n========================================================= *\/\n\n@media (min-width: 1024px) {\n\n    #mx11-isolation {\n        width: 100%;\n        max-width: 100%;\n        min-height: 100vh;\n        background: #00062c;\n    }\n\n\n    #mx11-isolation .mx-composition {\n        width: 100%;\n        max-width: 100%;\n\n        min-height: 100vh;\n        min-height: 100dvh;\n\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n\n        overflow: hidden;\n    }\n\n\n    #matris-hero-root {\n        width: 100%;\n        max-width: 100%;\n\n        height: auto;\n        min-height: 0;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n\n    #matris-hero-root .mh-wrap {\n        width: 100%;\n        max-width: 100%;\n\n        padding-left: 8vw;\n        padding-right: 8vw;\n\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n\n    \/* \u0639\u0646\u0648\u0627\u0646 \u0627\u0635\u0644\u06cc *\/\n\n    #matris-hero-root .mh-title {\n\n        font-size:\n            clamp(48px, 5vw, 90px) !important;\n\n        line-height:\n            clamp(1.08, 1.15, 1.2);\n\n        max-width:\n            min(92vw, 1500px);\n\n        white-space: nowrap;\n    }\n\n\n    #matris-manifesto-root_2 {\n        width: 100%;\n        max-width: 100%;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n\n        flex: 0 0 auto;\n    }\n\n\n    #matris-manifesto-root_2 .mx-line {\n        width: 100%;\n        max-width: 100%;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        width: 100%;\n        max-width: 100%;\n\n        padding-top:\n            clamp(35px, 5vh, 75px);\n\n        padding-right: 8vw;\n\n        padding-bottom:\n            clamp(18px, 2.5vh, 42px);\n\n        padding-left: 8vw;\n\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-inner {\n        width: 100%;\n\n        max-width:\n            clamp(940px, 67vw, 1350px);\n\n        margin-left: auto;\n        margin-right: auto;\n\n        text-align: center;\n    }\n\n\n    \/* \u0639\u0646\u0648\u0627\u0646 \u0628\u0627\u0648\u0631 \u0645\u0627 *\/\n\n    #matris-manifesto-root_2 .mx-label {\n\n        font-size:\n            clamp(18px, 1.1vw, 23px) !important;\n\n        line-height: 1.4;\n\n        margin-bottom:\n            clamp(45px, 5vh, 75px);\n    }\n\n\n    \/* =====================================================\n       \u0645\u062a\u0646 \u0627\u0635\u0644\u06cc \u2014 \u06a9\u0648\u0686\u06a9\u200c\u062a\u0631 \u0634\u062f\u0647\n    ===================================================== *\/\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            22px !important;\n\n        line-height:\n            clamp(1.65, 1.8, 1.95);\n\n        letter-spacing: 0 !important;\n\n        word-spacing:\n            clamp(1px, 0.15vw, 4px);\n\n        width: 100%;\n\n        max-width:\n            clamp(940px, 68vw, 1380px);\n\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n\n    #matris-manifesto-root_2 .mx-footer {\n        margin-top:\n            clamp(18px, 2.4vh, 42px);\n\n        font-size:\n            clamp(10px, 0.7vw, 15px);\n\n        line-height: 1.5;\n    }\n\n}\n\n\n\/* =========================================================\n   LARGE DESKTOP\n========================================================= *\/\n\n@media (min-width: 1440px) {\n\n    #matris-hero-root .mh-wrap {\n        padding-left: 8vw;\n        padding-right: 8vw;\n    }\n\n\n    #matris-hero-root .mh-title {\n\n        font-size:\n            clamp(64px, 4.5vw, 90px) !important;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        width: 100%;\n        max-width: 100%;\n\n        padding-top:\n            clamp(45px, 5vh, 85px);\n\n        padding-right: 8vw;\n\n        padding-bottom:\n            clamp(22px, 3vh, 48px);\n\n        padding-left: 8vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-inner {\n        max-width:\n            min(78vw, 1450px);\n    }\n\n\n    \/* \u0645\u062a\u0646 \u0627\u0635\u0644\u06cc *\/\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            22px !important;\n\n        line-height:\n            clamp(1.65, 1.8, 1.9);\n\n        max-width:\n            min(75vw, 1450px);\n    }\n\n\n    #matris-manifesto-root_2 .mx-label {\n\n        font-size:\n            clamp(18px, 1vw, 23px) !important;\n\n        margin-bottom:\n            clamp(50px, 5vh, 80px);\n    }\n\n\n    #matris-manifesto-root_2 .mx-footer {\n        font-size:\n            clamp(11px, 0.7vw, 15px);\n    }\n\n}\n\n\n\/* =========================================================\n   EXTRA LARGE DESKTOP\n========================================================= *\/\n\n@media (min-width: 1800px) {\n\n    #matris-hero-root .mh-wrap {\n        padding-left: 8vw;\n        padding-right: 8vw;\n    }\n\n\n    #matris-hero-root .mh-title {\n\n        font-size:\n            clamp(74px, 4.2vw, 98px) !important;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-wrap {\n\n        width: 100%;\n        max-width: 100%;\n\n        padding-top:\n            clamp(50px, 6vh, 95px);\n\n        padding-right: 8vw;\n        padding-left: 8vw;\n    }\n\n\n    #matris-manifesto-root_2 .mx-manifesto-inner {\n\n        max-width:\n            min(80vw, 1550px);\n    }\n\n\n    \/* \u0645\u062a\u0646 \u0627\u0635\u0644\u06cc *\/\n\n    #matris-manifesto-root_2 #mx-manifesto_2 {\n\n        font-size:\n            23px !important;\n\n        max-width:\n            min(78vw, 1550px);\n    }\n\n\n    #matris-manifesto-root_2 .mx-label {\n\n        margin-bottom:\n            clamp(55px, 5.5vh, 90px);\n    }\n\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    #matris-hero-root .mh-title {\n        animation: none;\n    }\n\n\n    #matris-manifesto-root_2 #mx-manifesto_2 .mx-w {\n        opacity: 1 !important;\n        color: #ffffff !important;\n        transition: none;\n    }\n\n}\n\n\n\/* =========================================================\n   SCOPED RESET (was global html\/body reset \u2014 now local only)\n========================================================= *\/\n\n#mx11-isolation {\n    margin: 0;\n    padding: 0;\n}\n\n\n#mx11-isolation,\n#mx11-isolation > main,\n#mx11-isolation > main > div {\n\n    max-width: none !important;\n\n    margin-left: 0 !important;\n    margin-right: 0 !important;\n}\n\n<\/style>\n\n\n<div id=\"mx11-isolation\" dir=\"rtl\">\n\n    <main class=\"mx-composition\">\n\n        <!-- =================================================\n             HERO TITLE\n        ================================================== -->\n\n        <div id=\"matris-hero-root\">\n\n            <div class=\"mh-wrap\">\n\n                <h1 class=\"mh-title\">\n                    \u06af\u0640\u0640\u0640\u0640\u0640\u0640\u0631\u0648\u0647 \u0645\u0640\u0640\u0640\u0640\u0640\u0640\u0627\u062a\u0631\u06cc\u0640\u0640\u0640\u0640\u0640\u0640\u0640\u0633\n                <\/h1>\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- =================================================\n             MANIFESTO\n        ================================================== -->\n\n        <div id=\"matris-manifesto-root_2\">\n\n            <div class=\"mx-grain\" aria-hidden=\"true\"><\/div>\n\n            <section class=\"mx-line\">\n\n                <div class=\"mx-manifesto-wrap\">\n\n                    <div class=\"mx-manifesto-inner\">\n\n                        <!-- LABEL -->\n\n                        <div class=\"mx-label\">\n                            \u0628\u0627\u0648\u0631 \u0645\u0627\n                        <\/div>\n\n\n                        <!-- MAIN TEXT -->\n\n                        <div id=\"mx-manifesto_2\">\n\n                            \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u060c \u0627\u0648\u0644\u06cc\u0646 \u062c\u0645\u0644\u0647\u200c\u0627\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0628\u0631\u0646\u062f \u0634\u0645\u0627 \u0628\u0647 \u0645\u0634\u062a\u0631\u06cc \u0645\u06cc\u200c\u06af\u0648\u06cc\u062f.\n                            \u0645\u0627 \u062f\u0631 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0627\u06cc\u0646 \u062c\u0645\u0644\u0647 \u0631\u0627 \u0628\u0627 \u06a9\u0627\u063a\u0630\u060c \u0631\u0646\u06af \u0648 \u0628\u0631\u0634 \u0645\u06cc\u200c\u0646\u0648\u06cc\u0633\u06cc\u0645\u061b\n                            \u0637\u0648\u0631\u06cc \u06a9\u0647 \u062f\u0631 \u0642\u0641\u0633\u0647 \u062f\u06cc\u062f\u0647 \u0634\u0648\u062f\u060c \u062f\u0631 \u062f\u0633\u062a \u062e\u0648\u0628 \u0628\u0646\u0634\u06cc\u0646\u062f \u0648 \u062f\u0631 \u0630\u0647\u0646 \u0628\u0645\u0627\u0646\u062f.\n\n                        <\/div>\n\n\n                    <\/div>\n\n                <\/div>\n\n            <\/section>\n\n        <\/div>\n\n\n    <\/main>\n\n<\/div>\n\n\n<script>\n\n(function () {\n\n    \"use strict\";\n\n\n    var root =\n        document.getElementById(\n            \"matris-manifesto-root_2\"\n        );\n\n\n    if (!root) return;\n\n\n    var man =\n        root.querySelector(\n            \"#mx-manifesto_2\"\n        );\n\n\n    if (!man) return;\n\n\n    var originalText =\n        man.textContent.trim();\n\n\n    var words =\n        originalText.split(\/\\s+\/);\n\n\n    man.innerHTML =\n        words.map(function (w) {\n\n            return '<span class=\"mx-w\">' +\n                w +\n                '<\/span>';\n\n        }).join(\" \");\n\n\n    var ws =\n        Array.prototype.slice.call(\n            man.querySelectorAll(\".mx-w\")\n        );\n\n\n    ws.forEach(function (sp) {\n\n        sp.style.opacity = \".22\";\n        sp.style.color = \"#ffffff\";\n\n    });\n\n\n    function updateReveal() {\n\n        var rect =\n            man.getBoundingClientRect();\n\n\n        var vh =\n            window.innerHeight ||\n            document.documentElement.clientHeight;\n\n\n        var startLine =\n            vh * 0.80;\n\n\n        var endLine =\n            vh * 0.45;\n\n\n        var range =\n            startLine - endLine;\n\n\n        var progress =\n            (startLine - rect.top) \/\n            range;\n\n\n        progress =\n            Math.max(\n                0,\n                Math.min(1, progress)\n            );\n\n\n        var idx =\n            Math.floor(\n                progress * ws.length\n            );\n\n\n        ws.forEach(function (sp, i) {\n\n            sp.style.opacity =\n                i <= idx\n                    ? \"1\"\n                    : \".22\";\n\n        });\n\n    }\n\n\n    if (\n        window.matchMedia &&\n        window.matchMedia(\n            \"(prefers-reduced-motion: reduce)\"\n        ).matches\n    ) {\n\n        ws.forEach(function (sp) {\n\n            sp.style.opacity = \"1\";\n\n        });\n\n        return;\n\n    }\n\n\n    var ticking = false;\n\n\n    function requestUpdate() {\n\n        if (ticking) return;\n\n\n        ticking = true;\n\n\n        window.requestAnimationFrame(function () {\n\n            updateReveal();\n\n            ticking = false;\n\n        });\n\n    }\n\n\n    window.addEventListener(\n        \"scroll\",\n        requestUpdate,\n        {\n            passive: true\n        }\n    );\n\n\n    window.addEventListener(\n        \"resize\",\n        requestUpdate\n    );\n\n\n    window.addEventListener(\n        \"load\",\n        requestUpdate\n    );\n\n\n    updateReveal();\n\n\n})();\n\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dbd2a04 e-con-full e-flex e-con e-parent\" data-id=\"dbd2a04\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-46c2bc9 elementor-widget elementor-widget-html\" data-id=\"46c2bc9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =====================================================\n     MX12 CATEGORIES \u2014 FULLY ISOLATED (Shadow DOM)\n     - CSS \u062f\u0627\u062e\u0644 Shadow DOM \u0627\u0633\u062a: \u0646\u0647 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0633\u0627\u06cc\u062a \u0631\u0648\u06cc \u0622\u0646 \u0627\u062b\u0631 \u0645\u06cc\u200c\u06af\u0630\u0627\u0631\u062f\u060c \u0646\u0647 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0622\u0646 \u0631\u0648\u06cc \u0633\u0627\u06cc\u062a\n     - JS \u062f\u0627\u062e\u0644 IIFE \u0627\u0633\u062a \u0648 \u0647\u06cc\u0686 \u0645\u062a\u063a\u06cc\u0631 \u06af\u0644\u0648\u0628\u0627\u0644\u06cc \u0646\u0645\u06cc\u200c\u0633\u0627\u0632\u062f\n     - \u0627\u0646\u06cc\u0645\u06cc\u0634\u0646\u200c\u0647\u0627 \u0641\u0642\u0637 \u0631\u0648\u06cc \u0627\u0644\u0645\u0646\u062a\u200c\u0647\u0627\u06cc \u062f\u0627\u062e\u0644 \u0647\u0645\u06cc\u0646 \u0648\u06cc\u062c\u062a \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f\n     ===================================================== -->\n\n<div id=\"mx12-host\" style=\"display:block;width:100%;margin:0;padding:0;border:0;\"><\/div>\n\n\n<!-- =====================================================\n     TEMPLATE (\u0645\u062d\u062a\u0648\u0627\u06cc \u0628\u06cc\u200c\u0627\u062b\u0631 \u2014 \u062a\u0627 \u0648\u0642\u062a\u06cc \u0648\u0627\u0631\u062f Shadow DOM \u0646\u0634\u0648\u062f \u0647\u06cc\u0686 \u0627\u0633\u062a\u0627\u06cc\u0644\u06cc \u0631\u0648\u06cc \u0635\u0641\u062d\u0647 \u0627\u0639\u0645\u0627\u0644 \u0646\u0645\u06cc\u200c\u0634\u0648\u062f)\n===================================================== -->\n\n<template id=\"mx12-template\">\n\n<style>\n\n\/* =========================================================\n   HOST RESET\n========================================================= *\/\n\n:host {\n  all: initial;\n  display: block;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  contain: layout style;\n}\n\n\n\/* =========================================================\n   ISOLATED ROOT\n========================================================= *\/\n\n#mx12-categories,\n#mx12-categories * {\n  box-sizing: border-box;\n}\n\n#mx12-categories {\n  --ink: #112990;\n  --muted: #747985;\n  --pink: #ff53cf;\n  --lavender: #ded6ff;\n\n  margin: 0 !important;\n  padding: 0 !important;\n\n  font-family: IranYekanX, Arial, sans-serif;\n\n  background: #ffffff;\n}\n\n\n\/* =========================================================\n   MAIN SECTION\n========================================================= *\/\n\n#mx12-categories .elementor-glass-packaging {\n  width: 100%;\n  height: 100vh;\n  min-height: 100vh;\n\n  overflow: hidden;\n\n  background: #ffffff;\n\n  padding: 32px 4vw;\n\n  display: grid;\n  place-items: center;\n\n  margin: 0 !important;\n}\n\n\n\/* =========================================================\n   INNER\n========================================================= *\/\n\n#mx12-categories .packaging-inner {\n  width: min(1128px, 100%);\n\n  margin: 0 auto !important;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  gap: 28px;\n}\n\n\n\/* =========================================================\n   HEADER\n========================================================= *\/\n\n#mx12-categories .packaging-head {\n  direction: rtl;\n  text-align: center;\n  max-width: 720px;\n  margin: 0 auto;\n}\n\n#mx12-categories .packaging-title {\n  color: var(--ink);\n  font-size: 26px;\n  line-height: 1.35;\n  font-weight: 800;\n  letter-spacing: 0em;\n  margin: 0 0 10px;\n}\n\n#mx12-categories .packaging-subtitle {\n  color: var(--muted);\n  font-size: 15px;\n  line-height: 1.85;\n  font-weight: 500;\n  margin: 0;\n}\n\n\n\/* =========================================================\n   GRID\n========================================================= *\/\n\n#mx12-categories .packaging-grid {\n  width: 100%;\n  margin: 0 auto;\n  direction: ltr;\n}\n\n\n\/* =========================================================\n   CARD\n========================================================= *\/\n\n#mx12-categories .glass-card {\n  position: relative;\n  isolation: isolate;\n  min-height: 392px;\n  border-radius: 32px;\n  overflow: hidden;\n  border: 1px solid rgba(200, 189, 244, 0.82);\n\n  background:\n    radial-gradient(\n      circle at 24% 22%,\n      rgba(255,205,247,.62),\n      transparent 34%\n    ),\n    radial-gradient(\n      circle at 72% 70%,\n      rgba(204,221,255,.56),\n      transparent 42%\n    ),\n    linear-gradient(\n      145deg,\n      rgba(255,255,255,.82),\n      rgba(243,243,255,.66)\n    );\n\n  box-shadow:\n    0 22px 34px rgba(112,82,189,.18),\n    inset 0 1px 0 rgba(255,255,255,.95);\n\n  transform: translateZ(0);\n}\n\n\n\/* =========================================================\n   CARD LIGHT EFFECT\n========================================================= *\/\n\n#mx12-categories .glass-card::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  z-index: -1;\n  opacity: .9;\n\n  background:\n    linear-gradient(\n      116deg,\n      transparent 0 32%,\n      rgba(255,255,255,.55) 40%,\n      transparent 51%\n    ),\n    radial-gradient(\n      circle at 20% 76%,\n      rgba(238,103,215,.20),\n      transparent 24%\n    );\n}\n\n\n\/* =========================================================\n   PRODUCT STAGE\n========================================================= *\/\n\n#mx12-categories .product-stage {\n  position: absolute;\n  inset: 0;\n  display: grid;\n  place-items: center;\n  perspective: 900px;\n  overflow: hidden;\n}\n\n\n\/* =========================================================\n   PRODUCT MEDIA\n========================================================= *\/\n\n#mx12-categories .product-media {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n}\n\n\n\/* =========================================================\n   PRODUCT IMAGE\n========================================================= *\/\n\n#mx12-categories .product-image {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  max-width: none;\n  max-height: none;\n  object-fit: cover;\n  display: block;\n  filter: drop-shadow(0 18px 18px rgba(48,32,126,.18));\n  transform: scale(1.01);\n  z-index: 1;\n}\n\n\n\/* =========================================================\n   PLACEHOLDER\n========================================================= *\/\n\n#mx12-categories .media-placeholder {\n  display: none !important;\n}\n\n\n\/* =========================================================\n   PRODUCT SHADOW\n========================================================= *\/\n\n#mx12-categories .product-shadow {\n  position: absolute;\n  left: 50%;\n  bottom: 15px;\n  width: 74%;\n  height: 23px;\n  border-radius: 999px;\n\n  background:\n    radial-gradient(\n      ellipse,\n      rgba(37,24,120,.23) 0%,\n      rgba(37,24,120,.08) 42%,\n      transparent 72%\n    );\n\n  filter: blur(5px);\n  transform: translateX(-50%);\n  z-index: 2;\n  pointer-events: none;\n}\n\n\n\/* =========================================================\n   GLASS LABEL\n========================================================= *\/\n\n#mx12-categories .label-glass {\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  min-height: 102px;\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  direction: ltr;\n  border-radius: 30px 30px 32px 32px;\n  border: 1px solid rgba(255,255,255,.72);\n  background: rgba(255,255,255,.52);\n\n  box-shadow:\n    inset 0 1px 0 rgba(255,255,255,.86),\n    0 -10px 26px rgba(255,255,255,.32),\n    0 16px 28px rgba(107,78,164,.14);\n\n  backdrop-filter: blur(17px) saturate(148%);\n  -webkit-backdrop-filter: blur(17px) saturate(148%);\n\n  padding: 18px 20px 18px 22px;\n  z-index: 5;\n}\n\n\n\/* =========================================================\n   LABEL TEXT\n========================================================= *\/\n\n#mx12-categories .label-text {\n  flex: 1;\n  min-width: 0;\n  direction: rtl;\n  text-align: right;\n  padding-left: 12px;\n  border-left: 2px solid var(--pink);\n}\n\n#mx12-categories .label-title {\n  color: var(--ink);\n  font-size: 15px;\n  line-height: 1.25;\n  font-weight: 800;\n  letter-spacing: -0.04em;\n  margin: 0 0 6px;\n  white-space: nowrap;\n}\n\n#mx12-categories .label-subtitle {\n  color: var(--muted);\n  font-size: 15px;\n  line-height: 1.2;\n  margin: 0;\n  direction: ltr;\n  text-align: right;\n  white-space: nowrap;\n}\n\n\n\/* =========================================================\n   ICON TILE\n========================================================= *\/\n\n#mx12-categories .icon-tile {\n  width: 60px;\n  height: 60px;\n  flex: 0 0 auto;\n  display: grid;\n  place-items: center;\n  border-radius: 18px;\n  background: rgba(255,255,255,.82);\n\n  box-shadow:\n    0 10px 18px rgba(73,45,159,.17),\n    inset 0 1px 0 rgba(255,255,255,.92);\n}\n\n#mx12-categories .icon-image {\n  width: 33px;\n  height: 33px;\n  object-fit: contain;\n  display: block;\n}\n\n#mx12-categories .icon-fallback {\n  display: none !important;\n}\n\n\n\/* =========================================================\n   GRID HELPERS\n========================================================= *\/\n\n#mx12-categories .grid {\n  display: grid;\n}\n\n#mx12-categories .grid-cols-1 {\n  grid-template-columns: repeat(1, minmax(0,1fr));\n}\n\n#mx12-categories .gap-4 {\n  gap: 1rem;\n}\n\n@media (min-width: 640px) {\n  #mx12-categories .sm\\:grid-cols-2 {\n    grid-template-columns: repeat(2, minmax(0,1fr));\n  }\n}\n\n@media (min-width: 1024px) {\n  #mx12-categories .lg\\:grid-cols-4 {\n    grid-template-columns: repeat(4, minmax(0,1fr));\n  }\n}\n\n\n\/* =========================================================\n   TABLET + MOBILE\n========================================================= *\/\n\n@media (max-width: 1023px) {\n\n  #mx12-categories .elementor-glass-packaging {\n    width: 100%;\n    height: 100svh;\n    min-height: 100svh;\n    overflow: hidden;\n    padding: clamp(10px,2.5vw,22px) 4vw;\n  }\n\n  #mx12-categories .packaging-inner {\n    width: 100%;\n    height: 100%;\n    gap: 28px;\n    justify-content: center;\n  }\n\n  #mx12-categories .packaging-head {\n    width: 100%;\n    flex: 0 0 auto;\n    max-width: 720px;\n  }\n\n  #mx12-categories .packaging-title {\n    font-size: clamp(17px, 5vw, 25px);\n    line-height: 1.3;\n    margin-bottom: clamp(3px, 1vw, 6px);\n  }\n\n  #mx12-categories .packaging-subtitle {\n    font-size: clamp(12px, 3.2vw, 17px);\n    line-height: 1.5;\n  }\n\n  #mx12-categories .packaging-grid {\n    width: min(100%, calc(100svh - 135px), 620px);\n    margin: 0 auto;\n    display: grid !important;\n    grid-template-columns: repeat(2, minmax(0,1fr)) !important;\n    grid-template-rows: repeat(2, minmax(0,1fr)) !important;\n    gap: clamp(6px, 2vw, 14px) !important;\n    row-gap: clamp(20px, 6vw, 36px) !important;\n    flex: 0 1 auto;\n    align-self: center;\n  }\n\n  #mx12-categories .glass-card {\n    width: 100%;\n    height: auto;\n    min-height: 0;\n    aspect-ratio: 1 \/ 1;\n    border-radius: clamp(14px, 4vw, 24px);\n  }\n\n  #mx12-categories .product-image {\n    width: 100%;\n    height: 100%;\n    max-width: none;\n    max-height: none;\n    object-fit: cover;\n  }\n\n  #mx12-categories .product-shadow {\n    bottom: clamp(6px, 2vw, 15px);\n    height: clamp(10px, 3vw, 23px);\n  }\n\n  #mx12-categories .label-glass {\n    min-height: clamp(48px, 14vw, 68px);\n    padding: clamp(6px,2vw,11px) clamp(7px,2.5vw,13px);\n    gap: clamp(4px, 1.8vw, 7px);\n\n    border-radius:\n      clamp(14px,4vw,20px)\n      clamp(14px,4vw,20px)\n      clamp(16px,4.5vw,22px)\n      clamp(16px,4.5vw,22px);\n  }\n\n  #mx12-categories .label-text {\n    padding-left: clamp(4px, 1.8vw, 7px);\n    border-left-width: 1px;\n  }\n\n  #mx12-categories .label-title {\n    font-size: clamp(10px, 3.3vw, 14px);\n    line-height: 1.25;\n    margin-bottom: clamp(2px, .8vw, 3px);\n  }\n\n  #mx12-categories .label-subtitle {\n    font-size: clamp(8.5px, 2.8vw, 12px);\n    line-height: 1.15;\n  }\n\n  #mx12-categories .icon-tile {\n    width: clamp(28px, 10vw, 42px);\n    height: clamp(28px, 10vw, 42px);\n    border-radius: clamp(8px, 2.8vw, 12px);\n  }\n\n  #mx12-categories .icon-image {\n    width: clamp(16px, 5.5vw, 24px);\n    height: clamp(16px, 5.5vw, 24px);\n  }\n\n  #mx12-categories .media-placeholder {\n    display: none !important;\n  }\n\n}\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 380px) {\n\n  #mx12-categories .elementor-glass-packaging {\n    padding: 8px 4vw;\n  }\n\n  #mx12-categories .packaging-inner {\n    gap: 24px;\n  }\n\n  #mx12-categories .packaging-title {\n    font-size: clamp(16px, 5vw, 20px);\n  }\n\n  #mx12-categories .packaging-subtitle {\n    font-size: clamp(8px, 2.6vw, 10px);\n  }\n\n  #mx12-categories .packaging-grid {\n    width: min(100%, calc(100svh - 115px));\n    gap: clamp(5px, 1.8vw, 8px) !important;\n    row-gap: clamp(18px, 5.5vw, 28px) !important;\n  }\n\n  #mx12-categories .glass-card {\n    min-height: 0 !important;\n    border-radius: clamp(12px, 4vw, 18px);\n  }\n\n  #mx12-categories .label-glass {\n    min-height: clamp(46px, 14vw, 56px);\n    padding: 6px 7px;\n    gap: 4px;\n  }\n\n  #mx12-categories .label-title {\n    font-size: clamp(9px, 3.1vw, 12px);\n  }\n\n  #mx12-categories .label-subtitle {\n    font-size: clamp(7.5px, 2.6vw, 10px);\n  }\n\n  #mx12-categories .icon-tile {\n    width: clamp(26px, 9vw, 34px);\n    height: clamp(26px, 9vw, 34px);\n    border-radius: 8px;\n  }\n\n  #mx12-categories .icon-image {\n    width: clamp(14px, 5vw, 20px);\n    height: clamp(14px, 5vw, 20px);\n  }\n\n}\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (min-width: 640px) and (max-width: 1023px) {\n\n  #mx12-categories .elementor-glass-packaging {\n    padding: 22px 4vw;\n  }\n\n  #mx12-categories .packaging-inner {\n    gap: 32px;\n  }\n\n  #mx12-categories .packaging-grid {\n    width: min(100%, calc(100svh - 170px), 620px);\n    gap: 14px !important;\n    row-gap: 34px !important;\n  }\n\n  #mx12-categories .glass-card {\n    border-radius: 24px;\n  }\n\n  #mx12-categories .label-glass {\n    min-height: 68px;\n    padding: 11px 13px;\n  }\n\n  #mx12-categories .label-title {\n    font-size: 14px;\n  }\n\n  #mx12-categories .label-subtitle {\n    font-size: 12px;\n  }\n\n  #mx12-categories .icon-tile {\n    width: 42px;\n    height: 42px;\n  }\n\n}\n\n\n\/* =========================================================\n   DESKTOP\n========================================================= *\/\n\n@media (min-width: 1024px) {\n\n  #mx12-categories .elementor-glass-packaging {\n    width: 100%;\n    height: 100vh;\n    min-height: 100vh;\n    overflow: visible;\n    display: grid;\n    place-items: center;\n    padding: clamp(24px,3vw,52px) 8vw;\n  }\n\n  #mx12-categories .packaging-inner {\n    width: min(calc(100vw - 16vw), 1800px);\n    max-width: 1800px;\n    margin: 0 auto;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    gap: clamp(24px, 2.5vw, 46px);\n  }\n\n  #mx12-categories .packaging-head {\n    width: 100%;\n    max-width: clamp(600px, 48vw, 900px);\n    margin: 0 auto;\n  }\n\n  #mx12-categories .packaging-title {\n    font-size: clamp(20px, 1.45vw, 28px);\n    line-height: 1.35;\n    margin: 0 0 clamp(8px, .7vw, 14px);\n  }\n\n  #mx12-categories .packaging-subtitle {\n    font-size: clamp(14px, 1.05vw, 20px);\n    line-height: 1.8;\n  }\n\n  #mx12-categories .packaging-grid {\n    width: 100%;\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: repeat(4, minmax(0,1fr));\n    gap: clamp(14px, 1.35vw, 28px);\n  }\n\n  #mx12-categories .glass-card {\n    width: 100%;\n    min-height: 0;\n    aspect-ratio: .84 \/ 1;\n    border-radius: clamp(22px, 2vw, 38px);\n  }\n\n  #mx12-categories .product-shadow {\n    bottom: clamp(10px, 1.1vw, 20px);\n    height: clamp(16px, 1.5vw, 28px);\n    filter: blur(clamp(4px, .45vw, 8px));\n  }\n\n  #mx12-categories .label-glass {\n    min-height: clamp(82px, 7vw, 122px);\n    gap: clamp(9px, .9vw, 18px);\n\n    border-radius:\n      clamp(22px,2vw,36px)\n      clamp(22px,2vw,36px)\n      clamp(24px,2.2vw,40px)\n      clamp(24px,2.2vw,40px);\n\n    padding:\n      clamp(12px,1.1vw,22px)\n      clamp(13px,1.2vw,24px)\n      clamp(12px,1.1vw,22px)\n      clamp(15px,1.3vw,26px);\n  }\n\n  #mx12-categories .label-text {\n    padding-left: clamp(7px, .7vw, 14px);\n    border-left: clamp(1px, .12vw, 2px) solid var(--pink);\n  }\n\n  #mx12-categories .label-title {\n    font-size: clamp(13px, 1.05vw, 20px);\n    margin: 0 0 clamp(4px, .45vw, 8px);\n  }\n\n  #mx12-categories .label-subtitle {\n    font-size: clamp(11px, .85vw, 17px);\n  }\n\n  #mx12-categories .icon-tile {\n    width: clamp(48px, 4vw, 76px);\n    height: clamp(48px, 4vw, 76px);\n    flex: 0 0 clamp(48px, 4vw, 76px);\n    border-radius: clamp(14px, 1.25vw, 24px);\n  }\n\n  #mx12-categories .icon-image {\n    width: clamp(26px, 2.2vw, 42px);\n    height: clamp(26px, 2.2vw, 42px);\n  }\n\n  #mx12-categories .media-placeholder {\n    display: none !important;\n  }\n\n}\n\n\n\/* =========================================================\n   REMOVE EXTRA OUTER SPACING\n========================================================= *\/\n\n#mx12-categories,\n#mx12-categories .elementor-glass-packaging,\n#mx12-categories .packaging-inner {\n  margin-top: 0 !important;\n  margin-bottom: 0 !important;\n}\n\n#mx12-categories .elementor-glass-packaging {\n  margin-bottom: 0 !important;\n}\n\n#mx12-categories h1,\n#mx12-categories h2,\n#mx12-categories h3,\n#mx12-categories p {\n  margin-top: 0;\n}\n\n\n\/* =========================================================\n   CARD LINK OVERLAY\n========================================================= *\/\n\n#mx12-categories .card-link {\n  position: absolute;\n  inset: 0;\n  display: block;\n  z-index: 10;\n  border-radius: inherit;\n  background: transparent;\n  text-decoration: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n#mx12-categories a.card-link:not([href]) {\n  pointer-events: none;\n}\n\n<\/style>\n\n\n<div id=\"mx12-categories\" dir=\"rtl\">\n\n<section\n  class=\"elementor-glass-packaging\"\n  aria-label=\"Packaging categories\"\n>\n\n<div class=\"packaging-inner\">\n\n\n<!-- =====================================================\n     HEADER\n===================================================== -->\n\n<header\n  class=\"packaging-head\"\n  data-head\n>\n\n<h2 class=\"packaging-title\">\n  \u0647\u0631 \u0645\u062d\u0635\u0648\u0644\u060c \u06cc\u06a9 \u0631\u0627\u0647\u06a9\u0627\u0631\n<\/h2>\n\n<p class=\"packaging-subtitle\">\n  \u0627\u0632 \u0627\u0646\u062a\u062e\u0627\u0628 \u0633\u0627\u062e\u062a\u0627\u0631 \u062a\u0627 \u062c\u0632\u0626\u06cc\u0627\u062a \u0646\u0647\u0627\u06cc\u06cc\u060c \u0647\u0645\u0647 \u0686\u06cc\u0632 \u0628\u0631\u0627\u06cc \u06cc\u06a9 \u0628\u0633\u062a\u0647 \u0628\u0646\u062f\u06cc \u0645\u062a\u0641\u0627\u0648\u062a\n<\/p>\n\n<\/header>\n\n\n<!-- =====================================================\n     PRODUCTS GRID\n===================================================== -->\n\n<div class=\"packaging-grid grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n\n\n<!-- CARD 1 \u2014 BOX -->\n\n<article\n  class=\"glass-card\"\n  data-card\n>\n\n<a class=\"card-link\" href=\"https:\/\/matris.ir\/cardboard-box\" aria-label=\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\"><\/a>\n\n<div\n  class=\"product-stage\"\n  aria-hidden=\"true\"\n>\n\n<div class=\"product-shadow\"><\/div>\n\n<div\n  class=\"product-media\"\n  data-float\n>\n\n<img decoding=\"async\"\n  class=\"product-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/32757153-DF9F-48B8-8622-6AA4518C2023.webp\"\n  alt=\"Box Packaging\"\n  loading=\"eager\"\n>\n\n<span class=\"media-placeholder\">\n  \u062a\u0635\u0648\u06cc\u0631 \u0645\u062d\u0635\u0648\u0644\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<div class=\"label-glass\">\n\n<div class=\"label-text\">\n\n<h2 class=\"label-title\">\n  \u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\n<\/h2>\n\n<p class=\"label-subtitle\">\n  Cardboard Box\n<\/p>\n\n<\/div>\n\n<div\n  class=\"icon-tile\"\n  aria-hidden=\"true\"\n>\n\n<img decoding=\"async\"\n  class=\"icon-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/Box-Icone2.svg\"\n  alt=\"box-icon\"\n  loading=\"eager\"\n>\n\n<span class=\"icon-fallback\">\n  Icon\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<\/article>\n\n\n<!-- CARD 2 \u2014 LAMINATED -->\n\n<article\n  class=\"glass-card\"\n  data-card\n>\n\n<a class=\"card-link\" href=\"https:\/\/matris.ir\/laminated-carton\" aria-label=\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\"><\/a>\n\n<div\n  class=\"product-stage\"\n  aria-hidden=\"true\"\n>\n\n<div class=\"product-shadow\"><\/div>\n\n<div\n  class=\"product-media\"\n  data-float\n>\n\n<img decoding=\"async\"\n  class=\"product-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/8E55E1DA-995C-4A66-85DC-648D7995E541.webp\"\n  alt=\"Cardboard Packaging\"\n  loading=\"eager\"\n>\n\n<span class=\"media-placeholder\">\n  \u062a\u0635\u0648\u06cc\u0631 \u0645\u062d\u0635\u0648\u0644\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<div class=\"label-glass\">\n\n<div class=\"label-text\">\n\n<h2 class=\"label-title\">\n  \u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\n<\/h2>\n\n<p class=\"label-subtitle\">\n  Laminated Corrugated Box\n<\/p>\n\n<\/div>\n\n<div\n  class=\"icon-tile\"\n  aria-hidden=\"true\"\n>\n\n<img decoding=\"async\"\n  class=\"icon-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/Cartoon-Icon2.svg\"\n  alt=\"cardboard packaging\"\n  loading=\"eager\"\n>\n\n<span class=\"icon-fallback\">\n  Icon\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<\/article>\n\n\n<!-- CARD 3 \u2014 IML -->\n\n<article\n  class=\"glass-card\"\n  data-card\n>\n\n<a class=\"card-link\" href=\"https:\/\/matris.ir\/IML\" aria-label=\"\u0644\u06cc\u0628\u0644 \u062f\u0631\u0648\u0646 \u0642\u0627\u0644\u0628\u06cc\"><\/a>\n\n<div\n  class=\"product-stage\"\n  aria-hidden=\"true\"\n>\n\n<div class=\"product-shadow\"><\/div>\n\n<div\n  class=\"product-media\"\n  data-float\n>\n\n<img decoding=\"async\"\n  class=\"product-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/B292875E-F1AB-4AF0-A23A-01055BD7DFA8.webp\"\n  alt=\"IML Packaging\"\n  loading=\"eager\"\n>\n\n<span class=\"media-placeholder\">\n  \u062a\u0635\u0648\u06cc\u0631 \u0645\u062d\u0635\u0648\u0644\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<div class=\"label-glass\">\n\n<div class=\"label-text\">\n\n<h2 class=\"label-title\">\n  \u0644\u06cc\u0628\u0644 \u062f\u0631\u0648\u0646 \u0642\u0627\u0644\u0628\u06cc\n<\/h2>\n\n<p class=\"label-subtitle\">\n  In-Mold Lables (IML)\n<\/p>\n\n<\/div>\n\n<div\n  class=\"icon-tile\"\n  aria-hidden=\"true\"\n>\n\n<img decoding=\"async\"\n  class=\"icon-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Icon2.svg\"\n  alt=\"IML packaging\"\n  loading=\"eager\"\n>\n\n<span class=\"icon-fallback\">\n  Icon\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<\/article>\n\n\n<!-- CARD 4 \u2014 FLOWER PAPER -->\n\n<article\n  class=\"glass-card\"\n  data-card\n>\n\n<a class=\"card-link\" aria-label=\"\u06a9\u0627\u063a\u0630 \u06af\u0644\"><\/a>\n\n<div\n  class=\"product-stage\"\n  aria-hidden=\"true\"\n>\n\n<div class=\"product-shadow\"><\/div>\n\n<div\n  class=\"product-media\"\n  data-float\n>\n\n<img decoding=\"async\"\n  class=\"product-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/5588DCC9-E1B7-492E-92F2-18CAF52541E1.webp\"\n  alt=\"Flower Paper\"\n  loading=\"eager\"\n>\n\n<span class=\"media-placeholder\">\n  \u062a\u0635\u0648\u06cc\u0631 \u0645\u062d\u0635\u0648\u0644\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<div class=\"label-glass\">\n\n<div class=\"label-text\">\n\n<h2 class=\"label-title\">\n  \u06a9\u0627\u063a\u0630 \u06af\u0644\n<\/h2>\n\n<p class=\"label-subtitle\">\n  Flower Paper\n<\/p>\n\n<\/div>\n\n<div\n  class=\"icon-tile\"\n  aria-hidden=\"true\"\n>\n\n<img decoding=\"async\"\n  class=\"icon-image\"\n  src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/flower-lotus-light2.svg\"\n  alt=\"flower paper\"\n  loading=\"eager\"\n>\n\n<span class=\"icon-fallback\">\n  Icon\n<\/span>\n\n<\/div>\n\n<\/div>\n\n<\/article>\n\n\n<\/div>\n<\/div>\n<\/section>\n<\/div>\n\n<\/template>\n\n\n<!-- =====================================================\n     JAVASCRIPT (IIFE \u2014 \u0628\u062f\u0648\u0646 \u0645\u062a\u063a\u06cc\u0631 \u06af\u0644\u0648\u0628\u0627\u0644)\n===================================================== -->\n\n<script>\n(function () {\n\n  \"use strict\";\n\n  var host = document.getElementById(\"mx12-host\");\n  var tpl  = document.getElementById(\"mx12-template\");\n\n  if (!host || !tpl || !host.attachShadow) return;\n\n  \/* \u062c\u0644\u0648\u06af\u06cc\u0631\u06cc \u0627\u0632 \u0627\u062c\u0631\u0627\u06cc \u062f\u0648\u0628\u0627\u0631\u0647 *\/\n  if (host.shadowRoot) return;\n\n\n  \/* =====================================================\n     SHADOW DOM\n  ===================================================== *\/\n\n  var shadow = host.attachShadow({ mode: \"open\" });\n\n  shadow.appendChild(tpl.content.cloneNode(true));\n\n\n  \/* =====================================================\n     GSAP \u2014 \u0641\u0642\u0637 \u0631\u0648\u06cc \u0627\u0644\u0645\u0646\u062a\u200c\u0647\u0627\u06cc \u062f\u0627\u062e\u0644 Shadow DOM\n  ===================================================== *\/\n\n  var started = false;\n\n  function run() {\n\n    if (started) return;\n\n    if (!window.gsap) return;\n\n    started = true;\n\n    var q = function (sel) {\n      return Array.prototype.slice.call(shadow.querySelectorAll(sel));\n    };\n\n    var headItems = q(\"[data-head] > *\");\n    var cards     = q(\"[data-card]\");\n    var glasses   = q(\".label-glass\");\n\n\n    \/* HEADER *\/\n\n    window.gsap.set(headItems, { autoAlpha: 0, y: 18 });\n\n    window.gsap.to(headItems, {\n      autoAlpha: 1,\n      y: 0,\n      duration: 0.8,\n      ease: \"power3.out\",\n      stagger: 0.12\n    });\n\n\n    \/* CARDS *\/\n\n    window.gsap.set(cards, { autoAlpha: 0, y: 28, scale: 0.98 });\n\n    window.gsap.to(cards, {\n      autoAlpha: 1,\n      y: 0,\n      scale: 1,\n      duration: 0.9,\n      ease: \"power3.out\",\n      delay: 0.15,\n      stagger: 0.12\n    });\n\n\n    \/* GLASS *\/\n\n    window.gsap.to(glasses, {\n      backgroundColor: \"rgba(255,255,255,0.62)\",\n      duration: 2.8,\n      ease: \"sine.inOut\",\n      repeat: -1,\n      yoyo: true,\n      stagger: 0.2\n    });\n\n  }\n\n\n  \/* =====================================================\n     START \u2014 \u0628\u0639\u062f \u0627\u0632 \u0644\u0648\u062f GSAP (\u062a\u0627 \u06f6 \u062b\u0627\u0646\u06cc\u0647 \u0635\u0628\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f)\n  ===================================================== *\/\n\n  function start() {\n\n    var tries = 0;\n\n    (function wait() {\n\n      if (window.gsap) {\n        run();\n        return;\n      }\n\n      if (++tries < 60) {\n        setTimeout(wait, 100);\n      }\n\n    })();\n\n  }\n\n  if (document.readyState === \"complete\") {\n    start();\n  } else {\n    window.addEventListener(\"load\", start, { once: true });\n  }\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-babe0da e-con-full e-flex e-con e-parent\" data-id=\"babe0da\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3bee295 elementor-widget elementor-widget-html\" data-id=\"3bee295\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\/* MATRIS ISOLATION *\/\n#mx13-matris-about,\n#mx13-matris-about *{\n  box-sizing:border-box;\n}\n\n#mx13-matris-about{\n  all:initial;\n  display:block;\n  width:100%;\n  position:relative;\n  isolation:isolate;\n  font-family:\"IranYekanX\",sans-serif;\n  direction:rtl;\n}\n\n#mx13-matris-about *{\n  font-family:inherit;\n}\n\n#mx13-matris-about,\n#mx13-matris-about *,\n#mx13-matris-about *::before,\n#mx13-matris-about *::after{\n  box-sizing:border-box;\n}\n\n#mx13-matris-about{\n  width:100% !important;\n  max-width:none !important;\n  margin:0 !important;\n  padding:0 !important;\n  border:0 !important;\n  display:block !important;\n  overflow:hidden !important;\n  background:#001e87 !important;\n  line-height:0 !important;\n}\n\n#mx13-matris-about #matris-about-section-3{\n  all:initial;\n  display:block;\n  direction:rtl;\n  font-family:\"IranYekanX\",sans-serif;\n  background:#00062c;\n  color:#eceae5;\n  width:100%;\n  min-height:100vh;\n  max-height:100vh;\n  height:100vh;\n  margin:0 !important;\n  padding:0 !important;\n  overflow-x:hidden;\n  isolation:isolate;\n}\n\n#mx13-matris-about #matris-about-section-3 *,\n#mx13-matris-about #matris-about-section-3 *::before,\n#mx13-matris-about #matris-about-section-3 *::after{\n  box-sizing:border-box;\n  margin:0;\n  padding:0;\n  font-family:inherit;\n  color:inherit;\n  line-height:1.2;\n}\n\n\n\/* =========================================================\n   SECTION\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-section{\n  min-height:100vh;\n  max-height:100vh;\n  height:100vh;\n  width:100%;\n  margin:0 !important;\n\n  padding:\n    clamp(28px,6vh,80px)\n    8vw;\n\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  overflow:hidden;\n}\n\n\n\/* =========================================================\n   CONTAINER\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-container{\n  width:100%;\n  max-width:1200px;\n  margin:0 auto;\n  text-align:center;\n  display:flex;\n  flex-direction:column;\n  justify-content:center;\n  align-items:center;\n}\n\n\n\/* =========================================================\n   HEADER\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-head{\n  max-width:1024px;\n  width:100%;\n  margin:0 auto;\n}\n\n#mx13-matris-about #matris-about-section-3 .ma-eyebrow{\n  letter-spacing:0 !important;\n  text-transform:none;\n  font-size:7px;\n  color:#eb008b;\n  white-space:nowrap;\n  word-spacing:normal;\n}\n\n#mx13-matris-about #matris-about-section-3 .ma-heading{\n  font-size:1.15rem;\n  line-height:1.35;\n  font-weight:500;\n  margin-top:16px;\n  letter-spacing:0 !important;\n  word-spacing:normal;\n  font-kerning:normal;\n}\n\n\n\/* =========================================================\n   GRID\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-grid{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:1px;\n  background:rgba(255,255,255,.1);\n  margin-top:clamp(24px,5vh,6vh);\n  text-align:justify;\n  direction:rtl;\n  width:100%;\n  align-items:stretch;\n}\n\n\n\/* =========================================================\n   CARD\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-card{\n  background:#00062c;\n  padding:32px;\n  text-align:justify;\n  min-height:180px;\n}\n\n#mx13-matris-about #matris-about-section-3 .ma-card.ma-highlight{\n  background:#00062c;\n}\n\n\n\/* =========================================================\n   CARD ICON\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-card-icon{\n  font-size:1.5rem;\n  line-height:2rem;\n  color:#ffffff !important;\n}\n\n#mx13-matris-about #matris-about-section-3 .ma-card-icon *{\n  color:#ffffff !important;\n}\n\n\n\/* =========================================================\n   CARD TITLE\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-card-title{\n  font-size:.72rem;\n  line-height:.2;\n  font-weight:500;\n  color:#eb008b;\n  margin-top:16px;\n  text-align:justify;\n  letter-spacing:0 !important;\n  word-spacing:normal;\n  font-kerning:normal;\n}\n\n#mx13-matris-about #matris-about-section-3\n.ma-card.ma-highlight .ma-card-title{\n  margin-top:4px;\n  color:#eb008b;\n}\n\n\n\/* =========================================================\n   CARD TEXT\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3 .ma-card-text{\n  font-size:.55rem;\n  color:rgba(255,255,255,.6);\n  margin-top:12px;\n  line-height:1.025;\n  letter-spacing:0 !important;\n  word-spacing:normal;\n  font-kerning:normal;\n  text-align:justify;\n}\n\n\n\/* =========================================================\n   REVEAL\n   ========================================================= *\/\n\n#mx13-matris-about #matris-about-section-3.ma-js .ma-reveal{\n  opacity:0;\n  transform:translate3d(0,50px,0);\n\n  transition:\n    opacity .8s cubic-bezier(.16,.84,.44,1),\n    transform .8s cubic-bezier(.16,.84,.44,1);\n}\n\n#mx13-matris-about #matris-about-section-3.ma-js\n.ma-reveal.ma-in{\n  opacity:1;\n  transform:translate3d(0,0,0);\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n   ========================================================= *\/\n\n@media (prefers-reduced-motion:reduce){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-reveal{\n\n    transition:none !important;\n    opacity:1 !important;\n    transform:none !important;\n  }\n}\n\n\n\/* =========================================================\n   SMALL TABLET\n   ========================================================= *\/\n\n@media (min-width:640px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n    font-size:1.55rem;\n    line-height:1.2;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n    font-size:.9rem;\n    line-height:1.75rem;\n  }\n}\n\n\n\/* =========================================================\n   TABLET\n   ========================================================= *\/\n\n@media (min-width:768px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    min-height:100vh;\n    max-height:100vh;\n    height:100vh;\n\n    padding:\n      clamp(30px,5vh,70px)\n      8vw;\n\n    display:flex;\n    align-items:center;\n    justify-content:center;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n    font-size:2.4rem;\n    line-height:1;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n    font-size:1rem;\n    line-height:2rem;\n  }\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media (max-width:767px){\n\n  #mx13-matris-about{\n    width:100% !important;\n    max-width:100% !important;\n    margin:0 !important;\n    padding:0 !important;\n    overflow:hidden !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3{\n\n    height:auto !important;\n    min-height:100svh !important;\n    max-height:none !important;\n\n    width:100% !important;\n    margin:0 !important;\n    padding:0 !important;\n    overflow:hidden !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    height:auto !important;\n    min-height:100svh !important;\n    max-height:none !important;\n\n    width:100% !important;\n    margin:0 !important;\n\n    padding:\n      clamp(24px,6vh,55px)\n      4vw;\n\n    display:flex !important;\n    align-items:center !important;\n    justify-content:center !important;\n    overflow:hidden !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-container{\n\n    width:100%;\n    max-width:100%;\n    display:flex;\n    flex-direction:column;\n    justify-content:center;\n    align-items:center;\n    margin:auto;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-head{\n    width:100%;\n    max-width:100%;\n  }\n\n  \/* ===============================\n     EYEBROW \u2014 MOBILE BIGGER\n     =============================== *\/\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-eyebrow{\n\n    font-size:\n      clamp(14px,3.8vw,18px) !important;\n\n    line-height:1.55 !important;\n\n    width:100%;\n    max-width:100%;\n\n    margin-top:20px !important;\n\n    padding-left:4px;\n    padding-right:4px;\n\n    white-space:normal !important;\n    overflow-wrap:break-word;\n    word-break:normal;\n\n    text-align:center;\n\n    box-sizing:border-box;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n\n    font-size:\n      clamp(16px,4.6vw,24px);\n\n    line-height:1.25;\n\n    margin-top:\n      clamp(8px,2.5vh,16px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n\n    width:100%;\n\n    margin-top:\n      clamp(28px,6vh,46px);\n\n    grid-template-columns:\n      1fr;\n\n    gap:1px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card{\n\n    padding:\n      clamp(16px,4vw,22px);\n\n    min-height:\n      clamp(135px,20vh,175px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n\n    font-size:\n      clamp(14px,3.8vw,18px) !important;\n\n    font-weight:700 !important;\n\n    line-height:1.5;\n\n    margin-top:\n      clamp(5px,1.5vh,12px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card.ma-highlight\n  .ma-card-title{\n    margin-top:2px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-text{\n\n    font-size:\n      clamp(11px,3.6vw,14px);\n\n    line-height:1.65;\n\n    margin-top:\n      clamp(7px,1.5vh,12px);\n  }\n}\n\n\n\/* =========================================================\n   VERY SMALL PHONES\n   ========================================================= *\/\n\n@media (max-width:380px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    padding:\n      20px\n      4vw;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n\n    font-size:\n      clamp(14px,4.6vw,18px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n\n    margin-top:\n      clamp(18px,4vh,28px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card{\n\n    padding:\n      clamp(12px,3.5vw,17px);\n\n    min-height:\n      clamp(120px,19vh,145px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n\n    font-size:\n      clamp(13px,3.5vw,16px) !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-text{\n\n    font-size:\n      clamp(10px,3.2vw,12px);\n\n    line-height:1.6;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-eyebrow{\n\n    font-size:\n      clamp(13px,3.8vw,16px) !important;\n\n    line-height:1.5 !important;\n  }\n}\n\n\n\/* =========================================================\n   SHORT MOBILE\n   ========================================================= *\/\n\n@media (max-width:767px)\nand (max-height:650px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    padding:\n      16px\n      4vw;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-eyebrow{\n\n    font-size:\n      clamp(13px,3.6vw,16px) !important;\n\n    line-height:1.5 !important;\n\n    margin-top:10px !important;\n\n    padding:\n      0 6px;\n\n    white-space:normal !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n\n    font-size:\n      clamp(14px,4vw,17px);\n\n    margin-top:6px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n    margin-top:16px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card{\n\n    min-height:110px;\n    padding:12px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n\n    font-size:\n      clamp(12px,3.4vw,14px) !important;\n\n    font-weight:700 !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-text{\n\n    font-size:\n      clamp(10px,3vw,12px);\n\n    line-height:1.5;\n\n    margin-top:6px;\n  }\n}\n\n\n\/* =========================================================\n   DESKTOP\n   ========================================================= *\/\n\n@media (min-width:1024px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    width:100%;\n\n    height:100vh;\n\n    min-height:100vh;\n\n    max-height:100vh;\n\n    margin:0 !important;\n\n    padding:\n      clamp(28px,4vh,60px)\n      8vw;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-container{\n\n    width:\n      min(\n        calc(100vw - 16vw),\n        1800px\n      );\n\n    max-width:1800px;\n\n    margin:0 auto;\n\n    gap:0;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-head{\n\n    width:100%;\n\n    max-width:\n      clamp(850px,62vw,1250px);\n\n    margin:0 auto;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-eyebrow{\n\n    font-size:\n      clamp(18px,1.25vw,24px);\n\n    line-height:1.55;\n\n    margin-top:\n      clamp(16px,1.4vw,24px);\n\n    padding:\n      0 clamp(6px,.5vw,10px);\n\n    white-space:normal;\n\n    max-width:100%;\n\n    box-sizing:border-box;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-heading{\n\n    font-size:\n      clamp(26px,2.4vw,42px);\n\n    line-height:1.15;\n\n    margin-top:\n      clamp(12px,1.2vw,22px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n\n    width:100%;\n\n    margin-top:\n      clamp(26px,3.5vh,46px);\n\n    display:grid;\n\n    grid-template-columns:\n      repeat(3,minmax(0,1fr));\n\n    gap:1px;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card{\n\n    min-height:\n      clamp(150px,10vw,220px);\n\n    padding:\n      clamp(28px,2.5vw,48px);\n\n    text-align:justify;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n\n    font-size:\n      clamp(16px,1.08vw,21px) !important;\n\n    font-weight:700 !important;\n\n    line-height:1.5;\n\n    margin-top:\n      clamp(10px,1vw,18px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card.ma-highlight\n  .ma-card-title{\n\n    margin-top:\n      clamp(3px,.4vw,8px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-text{\n\n    font-size:\n      clamp(13px,.94vw,17px);\n\n    line-height:1.9;\n\n    margin-top:\n      clamp(10px,.9vw,18px);\n  }\n}\n\n\n\/* =========================================================\n   EXTRA LARGE\n   ========================================================= *\/\n\n@media (min-width:1800px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-section{\n\n    padding-left:8vw;\n    padding-right:8vw;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-container{\n\n    width:\n      min(\n        calc(100vw - 16vw),\n        1800px\n      );\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n\n    margin-top:\n      clamp(24px,2.5vh,42px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card{\n\n    min-height:\n      clamp(190px,11vw,230px);\n\n    padding:\n      clamp(34px,2.4vw,50px);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-title{\n\n    font-size:\n      clamp(18px,1vw,23px) !important;\n\n    font-weight:700 !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-card-text{\n\n    font-size:\n      clamp(14px,.85vw,18px);\n\n    line-height:1.9;\n  }\n}\n\n\n\/* =========================================================\n   MOBILE CARD MOTION\n   ========================================================= *\/\n\n@media (max-width:767px){\n\n  #mx13-matris-about\n  #matris-about-section-3\n  .ma-grid{\n\n    grid-template-columns:\n      1fr !important;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card.ma-reveal{\n\n    opacity:0;\n\n    transform:\n      translate3d(0,40px,0);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card.ma-reveal.ma-in{\n\n    opacity:1;\n\n    transform:\n      translate3d(0,0,0);\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(1){\n    transition-delay:.05s;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(2){\n    transition-delay:.12s;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(3){\n    transition-delay:.19s;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(4){\n    transition-delay:.26s;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(5){\n    transition-delay:.33s;\n  }\n\n  #mx13-matris-about\n  #matris-about-section-3.ma-js\n  .ma-card:nth-child(6){\n    transition-delay:.40s;\n  }\n}\n\n\n\/* =========================================================\n   FINAL ISOLATION GUARD\n   ========================================================= *\/\n\n#mx13-matris-about img,\n#mx13-matris-about video{\n  max-width:100%;\n}\n\n#mx13-matris-about button,\n#mx13-matris-about input,\n#mx13-matris-about textarea,\n#mx13-matris-about select{\n  font:inherit;\n}\n\n\n\/* =========================================================\n   FONT\n   ========================================================= *\/\n\n#mx13-matris-about\n#matris-about-section-3,\n#mx13-matris-about\n#matris-about-section-3 *{\n\n  font-family:\n    \"IranYekanX\",\n    sans-serif !important;\n\n  letter-spacing:0 !important;\n\n  word-spacing:normal !important;\n\n  font-kerning:normal !important;\n\n  text-transform:none !important;\n}\n\n#mx13-matris-about\n#matris-about-section-3\n.ma-eyebrow{\n\n  white-space:normal;\n}\n\n#mx13-matris-about\n#matris-about-section-3\n.ma-heading,\n\n#mx13-matris-about\n#matris-about-section-3\n.ma-card-title,\n\n#mx13-matris-about\n#matris-about-section-3\n.ma-card-text{\n\n  font-feature-settings:\n    normal !important;\n\n  font-variant-ligatures:\n    normal !important;\n}\n\n<\/style>\n\n\n<div id=\"mx13-matris-about\">\n\n  <div\n    id=\"matris-about-section-3\"\n    dir=\"rtl\"\n  >\n\n    <section class=\"ma-section\">\n\n      <div class=\"ma-container\">\n\n        <div class=\"ma-head\">\n\n          <h2 class=\"ma-heading ma-reveal\">\n            \u0634\u0627\u062e\u0635\u200c\u0647\u0627\u06cc \u0628\u0631\u062a\u0631\u06cc \u0645\u0627\u062a\u0631\u06cc\u0633\n          <\/h2>\n\n          <p class=\"ma-eyebrow ma-reveal\">\n            \u0632\u06cc\u0631\u0633\u0627\u062e\u062a\u060c \u062a\u062e\u0635\u0635 \u0648 \u062a\u0648\u0627\u0646 \u062a\u0648\u0644\u06cc\u062f\u061b \u062f\u0631 \u0645\u0642\u06cc\u0627\u0633\u06cc \u06a9\u0647 \u062a\u0645\u0627\u06cc\u0632 \u0631\u0627 \u0631\u0642\u0645 \u0645\u06cc\u200c\u0632\u0646\u062f\n          <\/p>\n\n        <\/div>\n\n\n        <div class=\"ma-grid\">\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              01 | \u0633\u0631\u0639\u062a\u06cc \u0641\u0631\u0627\u062a\u0631 \u0627\u0632 \u0627\u0646\u062a\u0638\u0627\u0631\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0645\u0627\u062a\u0631\u06cc\u0633 \u0628\u0627 \u0633\u0631\u0639\u062a\u06cc \u06a9\u0627\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f \u06a9\u0647 \u06a9\u0645\u062a\u0631 \u0645\u062c\u0645\u0648\u0639\u0647\u200c\u0627\u06cc \u062f\u0631 \u0627\u06cc\u0646 \u0635\u0646\u0639\u062a \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u062f \u0628\u0627 \u0622\u0646 \u0647\u0645\u0631\u0627\u0647 \u0634\u0648\u062f. \u0633\u0631\u0639\u062a \u0628\u0627\u0644\u0627\u06cc \u0639\u0645\u0644\u06a9\u0631\u062f \u062f\u0631 \u062a\u0645\u0627\u0645 \u0645\u0631\u0627\u062d\u0644 \u0633\u0641\u0627\u0631\u0634\u060c \u0622\u0645\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0648 \u062a\u0648\u0644\u06cc\u062f\u060c \u0645\u0627\u062a\u0631\u06cc\u0633 \u0631\u0627 \u0628\u0647 \u0627\u0646\u062a\u062e\u0627\u0628 \u0628\u0631\u0646\u062f\u0647\u0627\u06cc\u06cc \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u062f\u0647 \u06a9\u0647 \u0646\u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u0646\u062f \u0632\u0645\u0627\u0646 \u0631\u0627 \u067e\u0627\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0627\u0632 \u062f\u0633\u062a \u0628\u062f\u0647\u0646\u062f.\n            <\/p>\n\n          <\/div>\n\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              02 | \u0648\u0627\u062d\u062f \u062a\u0631\u06a9\u06cc\u0628 \u0631\u0646\u06af\u061b \u06a9\u0646\u062a\u0631\u0644 \u0631\u0646\u06af \u062f\u0631 \u0633\u0637\u062d \u062a\u062e\u0635\u0635\u06cc\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0631\u0646\u06af \u062f\u0631 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0627\u062a\u0641\u0627\u0642\u06cc \u062a\u0648\u0644\u06cc\u062f \u0646\u0645\u06cc\u200c\u0634\u0648\u062f. \u0648\u0627\u062d\u062f \u062a\u062e\u0635\u0635\u06cc \u0622\u0634\u067e\u0632\u062e\u0627\u0646\u0647 \u0631\u0646\u06af\u060c \u0648\u0638\u06cc\u0641\u0647 \u0622\u0645\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0648 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0631\u0646\u06af\u200c\u0647\u0627\u06cc \u0645\u0648\u0631\u062f\u0646\u06cc\u0627\u0632 \u062a\u0648\u0644\u06cc\u062f \u0631\u0627 \u0628\u0631 \u0639\u0647\u062f\u0647 \u062f\u0627\u0631\u062f \u062a\u0627 \u062f\u0642\u062a \u0648 \u062b\u0628\u0627\u062a \u0631\u0646\u06af \u062f\u0631 \u062a\u0645\u0627\u0645 \u062a\u06cc\u0631\u0627\u0698\u0647\u0627 \u062d\u0641\u0638 \u0634\u0648\u062f.\n            <\/p>\n\n          <\/div>\n\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              03 | \u0645\u062f\u06cc\u0631\u06cc\u062a \u062d\u0631\u0641\u0647\u200c\u0627\u06cc \u0631\u0646\u06af\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0645\u0627\u062a\u0631\u06cc\u0633 \u0628\u0627 \u0628\u0647\u0631\u0647\u200c\u06af\u06cc\u0631\u06cc \u0627\u0632 \u0642\u0627\u0628\u0644\u06cc\u062a\u200c\u0647\u0627\u06cc \u0686\u0627\u067e CMYK \u0648 Pantone\u060c \u0627\u0645\u06a9\u0627\u0646 \u0627\u062c\u0631\u0627\u06cc \u0637\u06cc\u0641 \u06af\u0633\u062a\u0631\u062f\u0647\u200c\u0627\u06cc \u0627\u0632 \u0631\u0646\u06af\u200c\u0647\u0627\u06cc \u0641\u0631\u0622\u06cc\u0646\u062f\u06cc \u0648 \u0627\u062e\u062a\u0635\u0627\u0635\u06cc \u0631\u0627 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc\u200c\u0633\u0627\u0632\u062f. \u06a9\u0646\u062a\u0631\u0644 \u062f\u0642\u06cc\u0642 \u0631\u0646\u06af\u060c \u06cc\u06a9\u06cc \u0627\u0632 \u0627\u0631\u06a9\u0627\u0646 \u062d\u0641\u0638 \u0647\u0648\u06cc\u062a \u0628\u0635\u0631\u06cc \u0628\u0631\u0646\u062f \u062f\u0631 \u062a\u06cc\u0631\u0627\u0698\u0647\u0627\u06cc \u0628\u0627\u0644\u0627 \u0627\u0633\u062a.\n            <\/p>\n\n          <\/div>\n\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              04 | \u0632\u0646\u062c\u06cc\u0631\u0647 \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u062a\u0648\u0644\u06cc\u062f\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0627\u0632 \u0637\u0631\u0627\u062d\u06cc \u0648 \u0622\u0645\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u062a\u0627 \u0686\u0627\u067e\u060c \u0644\u0645\u06cc\u0646\u06cc\u0634\u0646\u060c \u062f\u0627\u06cc\u06a9\u0627\u062a\u060c \u0641\u0631\u0645\u200c\u062f\u0647\u06cc \u0648 \u062a\u0648\u0644\u06cc\u062f \u0646\u0647\u0627\u06cc\u06cc\u060c \u0628\u062e\u0634\u200c\u0647\u0627\u06cc \u0627\u0635\u0644\u06cc \u0641\u0631\u0622\u06cc\u0646\u062f \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062f\u0631 \u0645\u062c\u0645\u0648\u0639\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0645\u062a\u0645\u0631\u06a9\u0632 \u0627\u0633\u062a. \u0627\u06cc\u0646 \u06cc\u06a9\u067e\u0627\u0631\u0686\u06af\u06cc\u060c \u06a9\u0646\u062a\u0631\u0644 \u0645\u0633\u062a\u0642\u06cc\u0645 \u0628\u0631 \u06a9\u06cc\u0641\u06cc\u062a\u060c \u0632\u0645\u0627\u0646\u200c\u0628\u0646\u062f\u06cc \u0648 \u062e\u0631\u0648\u062c\u06cc \u0646\u0647\u0627\u06cc\u06cc \u0631\u0627 \u0627\u0645\u06a9\u0627\u0646\u200c\u067e\u0630\u06cc\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f.\n            <\/p>\n\n          <\/div>\n\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              05 | \u0645\u0648\u0642\u0639\u06cc\u062a \u0627\u0633\u062a\u0631\u0627\u062a\u0698\u06cc\u06a9 \u062c\u063a\u0631\u0627\u0641\u06cc\u0627\u06cc\u06cc\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0645\u0627\u062a\u0631\u06cc\u0633 \u062f\u0631 \u0627\u0635\u0641\u0647\u0627\u0646\u060c \u062f\u0631 \u0645\u0648\u0642\u0639\u06cc\u062a\u06cc \u0645\u0631\u06a9\u0632\u06cc \u0646\u0633\u0628\u062a \u0628\u0647 \u062c\u063a\u0631\u0627\u0641\u06cc\u0627\u06cc \u0627\u06cc\u0631\u0627\u0646\u060c \u062f\u0633\u062a\u0631\u0633\u06cc \u0645\u0646\u0627\u0633\u0628 \u0628\u0647 \u0628\u0627\u0632\u0627\u0631\u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u06a9\u0634\u0648\u0631 \u0648 \u0645\u062f\u06cc\u0631\u06cc\u062a \u06a9\u0627\u0631\u0622\u0645\u062f\u062a\u0631 \u0627\u0631\u0633\u0627\u0644 \u0648 \u062a\u0648\u0632\u06cc\u0639 \u0633\u0641\u0627\u0631\u0634\u200c\u0647\u0627 \u0631\u0627 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc\u200c\u06a9\u0646\u062f.\n            <\/p>\n\n          <\/div>\n\n\n          <div class=\"ma-card ma-reveal\">\n\n            <h3 class=\"ma-card-title\">\n              06 | \u0631\u0648\u06cc\u06a9\u0631\u062f \u067e\u0627\u06cc\u062f\u0627\u0631 \u0648 \u062d\u0641\u0627\u0638\u062a \u0627\u0632 \u0645\u062d\u06cc\u0637 \u0632\u06cc\u0633\u062a\n            <\/h3>\n\n            <p class=\"ma-card-text\">\n              \u0645\u0648\u0627\u062f \u0642\u0627\u0628\u0644 \u0628\u0627\u0632\u06cc\u0627\u0641\u062a \u062d\u0627\u0635\u0644 \u0627\u0632 \u0641\u0631\u0622\u06cc\u0646\u062f \u062a\u0648\u0644\u06cc\u062f\u060c \u062a\u0641\u06a9\u06cc\u06a9 \u0634\u062f\u0647 \u0648 \u0628\u0647 \u0686\u0631\u062e\u0647 \u0628\u0627\u0632\u06cc\u0627\u0641\u062a \u0628\u0627\u0632\u0645\u06cc\u200c\u06af\u0631\u062f\u0646\u062f. \u0627\u06cc\u0646 \u0631\u0648\u06cc\u06a9\u0631\u062f \u0628\u0627 \u0647\u062f\u0641 \u06a9\u0627\u0647\u0634 \u062f\u0648\u0631\u0631\u06cc\u0632\u060c \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0628\u0647\u06cc\u0646\u0647 \u0627\u0632 \u0645\u0648\u0627\u062f \u0627\u0648\u0644\u06cc\u0647 \u0648 \u0627\u0631\u062a\u0642\u0627\u06cc \u0628\u0647\u0631\u0647\u200c\u0648\u0631\u06cc \u0645\u0646\u0627\u0628\u0639 \u062f\u0631 \u0641\u0631\u0622\u06cc\u0646\u062f \u062a\u0648\u0644\u06cc\u062f \u062f\u0646\u0628\u0627\u0644 \u0645\u06cc\u200c\u0634\u0648\u062f.\n            <\/p>\n\n          <\/div>\n\n        <\/div>\n\n      <\/div>\n\n    <\/section>\n\n  <\/div>\n\n\n  <script>\n\n  (function(){\n\n    function initMatrisAbout3(){\n\n      try{\n\n        var root =\n          document.querySelector(\n            '#mx13-matris-about #matris-about-section-3'\n          );\n\n        if(!root || root.dataset.maInit) return;\n\n        root.dataset.maInit='true';\n\n        root.classList.add('ma-js');\n\n        var revealEls =\n          root.querySelectorAll(\n            '.ma-reveal'\n          );\n\n\n        function revealAll(){\n\n          revealEls.forEach(\n            function(el){\n\n              el.classList.add(\n                'ma-in'\n              );\n\n            }\n          );\n\n        }\n\n\n        if(\n          !('IntersectionObserver' in window)\n        ){\n\n          revealAll();\n\n          return;\n        }\n\n\n        var io =\n          new IntersectionObserver(\n\n            function(entries){\n\n              entries.forEach(\n                function(entry){\n\n                  if(\n                    entry.isIntersecting\n                  ){\n\n                    entry.target.classList.add(\n                      'ma-in'\n                    );\n\n                    io.unobserve(\n                      entry.target\n                    );\n\n                  }\n\n                }\n              );\n\n            },\n\n            {\n              threshold:0.15,\n\n              rootMargin:\n                '0px 0px -10% 0px'\n            }\n\n          );\n\n\n        revealEls.forEach(\n          function(el){\n\n            io.observe(el);\n\n          }\n        );\n\n\n        setTimeout(\n          function(){\n\n            try{\n              io.disconnect();\n            }catch(e){}\n\n            revealAll();\n\n          },\n          4000\n        );\n\n\n      }catch(err){\n\n        var root =\n          document.querySelector(\n            '#mx13-matris-about #matris-about-section-3'\n          );\n\n        if(root){\n\n          root.classList.remove(\n            'ma-js'\n          );\n\n        }\n\n      }\n\n    }\n\n\n    if(\n      document.readyState ===\n      'loading'\n    ){\n\n      document.addEventListener(\n        'DOMContentLoaded',\n        initMatrisAbout3\n      );\n\n    }else{\n\n      initMatrisAbout3();\n\n    }\n\n  })();\n\n  <\/script>\n\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a2d25b3 e-con-full e-flex e-con e-parent\" data-id=\"a2d25b3\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-95e7821 elementor-widget__width-initial elementor-widget elementor-widget-html\" data-id=\"95e7821\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =====================================================\r\n     MX14 SERVICES \u2014 FULLY ISOLATED (Shadow DOM)\r\n     - CSS \u062f\u0627\u062e\u0644 Shadow DOM \u0627\u0633\u062a: \u0646\u0647 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0633\u0627\u06cc\u062a \u0631\u0648\u06cc \u0622\u0646 \u0627\u062b\u0631 \u0645\u06cc\u200c\u06af\u0630\u0627\u0631\u062f\u060c \u0646\u0647 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0622\u0646 \u0631\u0648\u06cc \u0633\u0627\u06cc\u062a\r\n     - JS \u062f\u0627\u062e\u0644 IIFE \u0627\u0633\u062a \u0648 \u0647\u06cc\u0686 \u0645\u062a\u063a\u06cc\u0631 \u06af\u0644\u0648\u0628\u0627\u0644\u06cc \u0646\u0645\u06cc\u200c\u0633\u0627\u0632\u062f\r\n     - GSAP \u0641\u0642\u0637 \u062f\u0631 \u0635\u0648\u0631\u062a\u06cc \u0644\u0648\u062f \u0645\u06cc\u200c\u0634\u0648\u062f \u06a9\u0647 \u0633\u0627\u06cc\u062a \u0627\u0632 \u0642\u0628\u0644 \u0622\u0646 \u0631\u0627 \u0646\u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f\r\n     ===================================================== -->\r\n\r\n<div id=\"mx14-host\" style=\"display:block;width:100%;margin:0;padding:0;border:0;\"><\/div>\r\n\r\n<!-- =====================================================\r\n     TEMPLATE (\u0628\u06cc\u200c\u0627\u062b\u0631 \u0631\u0648\u06cc \u0635\u0641\u062d\u0647 \u062a\u0627 \u0648\u0642\u062a\u06cc \u0648\u0627\u0631\u062f Shadow DOM \u0634\u0648\u062f)\r\n     ===================================================== -->\r\n\r\n<template id=\"mx14-template\">\r\n\r\n<style>\r\n\r\n\/* =====================================================\r\n   HOST RESET\r\n===================================================== *\/\r\n\r\n:host{\r\n  all:initial;\r\n  display:block;\r\n  width:100%;\r\n  margin:0;\r\n  padding:0;\r\n  contain:layout style;\r\n}\r\n\r\n#mx14-matris-services{\r\n  --pink:#EB008B;\r\n  --blue:#001489;\r\n  --navy:#00062C;\r\n  --text:#101010;\r\n  --muted:#666;\r\n  --line:rgba(0,0,0,.12);\r\n\r\n  width:100%;\r\n  margin:0;\r\n  background:#fff;\r\n  color:var(--text);\r\n  font-family:\"IranYekanX\",\"Vazirmatn\",sans-serif;\r\n  direction:rtl;\r\n  overflow:hidden;\r\n  box-sizing:border-box;\r\n}\r\n\r\n#mx14-matris-services *,\r\n#mx14-matris-services *::before,\r\n#mx14-matris-services *::after{\r\n  box-sizing:border-box;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   SECTION\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-services-section{\r\n  width:100%;\r\n  min-height:100vh;\r\n  display:flex;\r\n  align-items:center;\r\n}\r\n\r\n#mx14-matris-services .mx-services-container{\r\n  width:100%;\r\n  max-width:1600px;\r\n  margin:auto;\r\n  padding:clamp(50px,6vw,100px) 5vw;\r\n}\r\n\r\n#mx14-matris-services .mx-services-layout{\r\n  display:grid;\r\n  grid-template-columns:.88fr 1.42fr;\r\n  gap:clamp(40px,6vw,100px);\r\n  align-items:center;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   LEFT\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-services-copy{\r\n  min-width:0;\r\n}\r\n\r\n#mx14-matris-services .mx-services-eyebrow{\r\n  display:flex;\r\n  align-items:center;\r\n  gap:10px;\r\n  color:var(--pink);\r\n  font-size:13px;\r\n  font-weight:700;\r\n  margin-bottom:14px;\r\n}\r\n\r\n#mx14-matris-services .mx-services-eyebrow::before{\r\n  content:\"\";\r\n  width:20px;\r\n  height:2px;\r\n  background:var(--pink);\r\n  display:block;\r\n}\r\n\r\n#mx14-matris-services .mx-services-heading{\r\n  margin:0 0 22px;\r\n  color:#001489;\r\n  font-size:clamp(28px,1.6vw,48px);\r\n  line-height:1.25;\r\n  font-weight:800;\r\n}\r\n\r\n#mx14-matris-services .mx-services-list{\r\n  width:100%;\r\n  display:flex;\r\n  flex-direction:column;\r\n}\r\n\r\n#mx14-matris-services .mx-service-item{\r\n  position:relative;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:space-between;\r\n  gap:15px;\r\n  padding:17px 0;\r\n  border-bottom:1px solid var(--line);\r\n  cursor:pointer;\r\n  transition:.25s ease;\r\n}\r\n\r\n#mx14-matris-services .mx-service-item:first-child{\r\n  border-top:1px solid var(--line);\r\n}\r\n\r\n#mx14-matris-services .mx-service-main{\r\n  display:flex;\r\n  align-items:center;\r\n  gap:14px;\r\n  min-width:0;\r\n}\r\n\r\n#mx14-matris-services .mx-service-number{\r\n  flex:none;\r\n  color:#EB008B;\r\n  font-size:11px;\r\n  font-weight:500;\r\n  min-width:24px;\r\n}\r\n\r\n#mx14-matris-services .mx-service-title{\r\n  margin:0;\r\n  color:#222;\r\n  font-size:15px;\r\n  font-weight:700;\r\n  line-height:1.5;\r\n  transition:.25s ease;\r\n}\r\n\r\n#mx14-matris-services .mx-service-arrow{\r\n  flex:none;\r\n  color:#777;\r\n  font-size:18px;\r\n  line-height:1;\r\n  transition:\r\n    transform .45s cubic-bezier(.22,.61,.36,1),\r\n    color .25s ease;\r\n}\r\n\r\n\/* \u0641\u0642\u0637 \u062d\u0627\u0644\u062a \u0641\u0639\u0627\u0644\u060c \u0646\u0647 hover *\/\r\n#mx14-matris-services .mx-service-item.is-active .mx-service-title{\r\n  color:var(--pink);\r\n}\r\n\r\n#mx14-matris-services .mx-service-item.is-active .mx-service-arrow{\r\n  color:var(--pink);\r\n  transform:translateX(-4px);\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE PANEL\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-mobile-panel{\r\n  display:none;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   RIGHT VISUAL\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-services-visual-col{\r\n  min-width:0;\r\n}\r\n\r\n#mx14-matris-services .mx-services-visual{\r\n  position:relative;\r\n  width:100%;\r\n  aspect-ratio:16 \/ 9;\r\n  overflow:hidden;\r\n  border-radius:20px;\r\n  background:#eee;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-img{\r\n  position:absolute;\r\n  inset:0;\r\n  width:100%;\r\n  height:100%;\r\n  display:block;\r\n  object-fit:cover;\r\n  transform:scale(1.001);\r\n  will-change:transform;\r\n}\r\n\r\n#mx14-matris-services .mx-services-overlay{\r\n  position:absolute;\r\n  inset:0;\r\n  z-index:1;\r\n  background:linear-gradient(\r\n    to top,\r\n    rgba(0,6,44,.82),\r\n    rgba(0,6,44,.08) 65%,\r\n    rgba(0,6,44,0)\r\n  );\r\n  pointer-events:none;\r\n}\r\n\r\n#mx14-matris-services .mx-services-visual-content{\r\n  position:absolute;\r\n  z-index:2;\r\n  right:32px;\r\n  left:32px;\r\n  bottom:30px;\r\n  color:#fff;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-kicker{\r\n  font-size:11px;\r\n  color:#fff;\r\n  opacity:.8;\r\n  margin-bottom:7px;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-title{\r\n  margin:0 0 7px;\r\n  font-size:24px;\r\n  font-weight:800;\r\n  line-height:1.4;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-desc{\r\n  margin:0;\r\n  max-width:650px;\r\n  color:rgba(255,255,255,.88);\r\n  font-size:12px;\r\n  line-height:2;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   META + BUTTON\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-srv-foot{\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:space-between;\r\n  gap:20px;\r\n  margin-top:16px;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-meta{\r\n  display:flex;\r\n  flex-wrap:wrap;\r\n  gap:7px;\r\n}\r\n\r\n#mx14-matris-services .mx-srv-meta span{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  padding:6px 11px;\r\n  border-radius:30px;\r\n  background:#f5f5f5;\r\n  color:#444;\r\n  font-size:10px;\r\n  line-height:1;\r\n}\r\n\r\n#mx14-matris-services .mx-sample-btn{\r\n  flex:none;\r\n  display:inline-flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  min-height:34px;\r\n  padding:0 17px;\r\n  border:1px solid var(--blue);\r\n  border-radius:20px;\r\n  color:var(--blue);\r\n  background:transparent;\r\n  text-decoration:none;\r\n  font-size:10px;\r\n  font-weight:700;\r\n  transition:.25s ease;\r\n}\r\n\r\n#mx14-matris-services .mx-sample-btn:hover{\r\n  background:linear-gradient(135deg,#001489,#EB008B);\r\n  color:#fff;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   DESCRIPTION\r\n===================================================== *\/\r\n\r\n#mx14-matris-services .mx-services-bottom-desc{\r\n  margin:15px 0 0;\r\n  color:var(--muted);\r\n  font-size:13px;\r\n  line-height:2.1;\r\n  max-width:900px;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   DESKTOP\r\n===================================================== *\/\r\n\r\n@media (min-width:992px){\r\n\r\n  #mx14-matris-services .mx-services-container{\r\n    padding-left:5vw;\r\n    padding-right:5vw;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-layout{\r\n    grid-template-columns:.88fr 1.42fr;\r\n    align-items:start;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-visual{\r\n    aspect-ratio:auto;\r\n    width:100%;\r\n    height:550px;\r\n    min-height:550px;\r\n    max-height:none;\r\n  }\r\n\r\n  #mx14-matris-services .mx-srv-img{\r\n    width:100%;\r\n    height:100%;\r\n    object-fit:cover;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-copy{\r\n    min-height:0;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-visual-col{\r\n    min-height:0;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-bottom-desc{\r\n    margin-top:15px;\r\n  }\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   TABLET \/ MOBILE\r\n===================================================== *\/\r\n\r\n@media (max-width:991px){\r\n\r\n  #mx14-matris-services .mx-services-section{\r\n    min-height:100vh;\r\n    height:auto;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-container{\r\n    padding:55px 24px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-layout{\r\n    grid-template-columns:1fr;\r\n    gap:35px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-heading{\r\n    font-size:26px;\r\n    margin-bottom:25px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-item{\r\n    display:block;\r\n    padding:18px 0 0;\r\n    overflow:hidden;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-item + .mx-service-item{\r\n    margin-top:6px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-main{\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:space-between;\r\n    gap:18px;\r\n    min-height:36px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-title{\r\n    font-size:14px;\r\n    font-weight:650;\r\n    line-height:1.7;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-number{\r\n    color:#EB008B;\r\n    font-size:11px;\r\n    font-weight:800;\r\n    min-width:25px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-arrow{\r\n    display:none;\r\n  }\r\n\r\n\r\n  \/* SMOOTH ACCORDION *\/\r\n\r\n  #mx14-matris-services .mx-mobile-panel{\r\n    display:block;\r\n    height:0;\r\n    opacity:0;\r\n    overflow:hidden;\r\n    padding:0;\r\n    will-change:height,opacity;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-panel-inner{\r\n    padding-top:18px;\r\n    padding-bottom:25px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-image{\r\n    position:relative;\r\n    width:100%;\r\n    aspect-ratio:16 \/ 9;\r\n    overflow:hidden;\r\n    border-radius:13px;\r\n    background:#eee;\r\n    margin-bottom:17px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-image img{\r\n    width:100%;\r\n    height:100%;\r\n    display:block;\r\n    object-fit:cover;\r\n    opacity:0;\r\n    transform:scale(1.025);\r\n    transition:\r\n      opacity .5s cubic-bezier(.22,.61,.36,1),\r\n      transform .7s cubic-bezier(.22,.61,.36,1);\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-panel.is-visible .mx-mobile-image img{\r\n    opacity:1;\r\n    transform:scale(1);\r\n  }\r\n\r\n\r\n  \/* TEXT UNDER IMAGE *\/\r\n\r\n  #mx14-matris-services .mx-mobile-kicker{\r\n    font-size:11px;\r\n    color:#777;\r\n    margin-bottom:7px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-title{\r\n    display:none !important;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-desc{\r\n    margin:0;\r\n    color:#666;\r\n    font-size:13px;\r\n    line-height:2.05;\r\n  }\r\n\r\n\r\n  \/* TAGS HIDDEN *\/\r\n\r\n  #mx14-matris-services .mx-mobile-meta{\r\n    display:none !important;\r\n  }\r\n\r\n\r\n  \/* MOBILE BUTTON *\/\r\n\r\n  #mx14-matris-services .mx-mobile-foot{\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:flex-start;\r\n    width:100%;\r\n    margin-top:18px;\r\n    padding-bottom:0;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-btn{\r\n    flex:none;\r\n    display:inline-flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n\r\n    min-width:112px;\r\n    min-height:34px;\r\n\r\n    padding:0 17px;\r\n\r\n    border:1px solid var(--blue);\r\n    border-radius:20px;\r\n\r\n    color:var(--blue);\r\n    background:transparent;\r\n\r\n    text-decoration:none;\r\n\r\n    font-size:9.5px;\r\n    font-weight:700;\r\n    line-height:1;\r\n\r\n    white-space:nowrap;\r\n\r\n    transition:\r\n      background .25s ease,\r\n      color .25s ease,\r\n      border-color .25s ease;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-btn:hover{\r\n    background:linear-gradient(135deg,#001489,#EB008B);\r\n    color:#fff;\r\n    border-color:#001489;\r\n  }\r\n\r\n\r\n  \/* HIDE DESKTOP *\/\r\n\r\n  #mx14-matris-services .mx-services-visual-col{\r\n    display:none;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-bottom-desc{\r\n    display:none;\r\n  }\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   SMALL MOBILE\r\n===================================================== *\/\r\n\r\n@media (max-width:479px){\r\n\r\n  #mx14-matris-services .mx-services-container{\r\n    padding:42px 15px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-layout{\r\n    gap:27px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-eyebrow{\r\n    font-size:11px;\r\n    margin-bottom:11px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-services-heading{\r\n    font-size:23px;\r\n    margin-bottom:20px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-item{\r\n    padding:14px 0 0;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-item + .mx-service-item{\r\n    margin-top:7px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-main{\r\n    gap:12px;\r\n    min-height:34px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-title{\r\n    font-size:13px;\r\n    font-weight:650;\r\n    line-height:1.75;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-number{\r\n    color:#EB008B;\r\n    font-size:10px;\r\n    font-weight:800;\r\n    min-width:22px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-service-arrow{\r\n    display:none;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-panel-inner{\r\n    padding-top:14px;\r\n    padding-bottom:28px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-image{\r\n    aspect-ratio:16 \/ 9;\r\n    border-radius:11px;\r\n    margin-bottom:14px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-kicker{\r\n    font-size:10px;\r\n    margin-bottom:6px;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-desc{\r\n    font-size:11.5px;\r\n    line-height:2;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-foot{\r\n    margin-top:14px;\r\n    padding-bottom:0;\r\n  }\r\n\r\n  #mx14-matris-services .mx-mobile-btn{\r\n    min-width:108px;\r\n    min-height:33px;\r\n    padding:0 16px;\r\n    font-size:9.2px;\r\n  }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<div id=\"mx14-matris-services\" dir=\"rtl\">\r\n\r\n<section class=\"mx-services-section\">\r\n\r\n<div class=\"mx-services-container\">\r\n\r\n<div class=\"mx-services-layout\">\r\n\r\n\r\n<!-- LEFT -->\r\n\r\n<div class=\"mx-services-copy\">\r\n\r\n<div class=\"mx-services-eyebrow\">\r\n\u0635\u0646\u0627\u06cc\u0639\r\n<\/div>\r\n\r\n<h2 class=\"mx-services-heading\">\r\n\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0631\u0627\u06cc \u0647\u0631 \u0635\u0646\u0639\u062a\r\n<\/h2>\r\n\r\n<div class=\"mx-services-list\"><\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<!-- RIGHT -->\r\n\r\n<div class=\"mx-services-visual-col\">\r\n\r\n<div class=\"mx-services-visual\">\r\n\r\n<img\r\nclass=\"mx-srv-img\"\r\nsrc=\"https:\/\/www.emanspackaging.com\/wp-content\/uploads\/2021\/02\/1-1.jpg\"\r\nalt=\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0627\u062a\u0631\u06cc\u0633\"\r\n>\r\n\r\n<div class=\"mx-services-overlay\"><\/div>\r\n\r\n<div class=\"mx-services-visual-content\">\r\n\r\n<div class=\"mx-srv-kicker\"><\/div>\r\n\r\n<div class=\"mx-srv-title\"><\/div>\r\n\r\n<p class=\"mx-srv-desc\"><\/p>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<div class=\"mx-srv-foot\">\r\n\r\n<div class=\"mx-srv-meta\"><\/div>\r\n\r\n<a\r\nclass=\"mx-sample-btn\"\r\nhref=\"#\"\r\n>\r\n\u0645\u0634\u0627\u0647\u062f\u0647 \u0646\u0645\u0648\u0646\u0647\u200c\u0647\u0627\r\n<\/a>\r\n\r\n<\/div>\r\n\r\n\r\n<p class=\"mx-services-bottom-desc\">\r\n\u0627\u0632 \u0637\u0631\u0627\u062d\u06cc \u0648 \u0646\u0645\u0648\u0646\u0647\u200c\u0633\u0627\u0632\u06cc \u062a\u0627 \u0686\u0627\u067e\u060c \u0631\u0648\u06a9\u0634\u060c \u0628\u0631\u0634 \u0648 \u062a\u0648\u0644\u06cc\u062f \u0646\u0647\u0627\u06cc\u06cc \u0627\u0646\u0648\u0627\u0639 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0642\u0648\u0627\u06cc\u06cc\u060c \u06a9\u0627\u0631\u062a\u0646 \u0633\u0647 \u0648 \u067e\u0646\u062c \u0644\u0627\u06cc\u0647\u060c \u0644\u0645\u06cc\u0646\u062a \u0648 IML \u2014 \u0647\u0645\u0647 \u062f\u0631 \u06cc\u06a9 \u0645\u062c\u0645\u0648\u0639\u0647 \u0648 \u0628\u062f\u0648\u0646 \u0648\u0627\u0633\u0637\u0647.\r\n<\/p>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/section>\r\n\r\n<\/div>\r\n\r\n<\/template>\r\n\r\n\r\n<!-- =====================================================\r\n     JAVASCRIPT (IIFE \u2014 \u0628\u062f\u0648\u0646 \u0645\u062a\u063a\u06cc\u0631 \u06af\u0644\u0648\u0628\u0627\u0644)\r\n===================================================== -->\r\n\r\n<script>\r\n(function(){\r\n\r\n\"use strict\";\r\n\r\nvar host=document.getElementById(\"mx14-host\");\r\nvar tpl=document.getElementById(\"mx14-template\");\r\n\r\nif(!host||!tpl||!host.attachShadow)return;\r\n\r\n\r\n\/* \u062c\u0644\u0648\u06af\u06cc\u0631\u06cc \u0627\u0632 \u0627\u062c\u0631\u0627\u06cc \u062f\u0648\u0628\u0627\u0631\u0647 *\/\r\n\r\nif(host.shadowRoot)return;\r\n\r\n\r\n\/* =====================================================\r\n   FONT \u2014 Vazirmatn \u0628\u0627\u06cc\u062f \u062f\u0631 \u062e\u0648\u062f \u0635\u0641\u062d\u0647 \u0644\u0648\u062f \u0634\u0648\u062f\r\n   (@font-face \u062f\u0627\u062e\u0644 Shadow DOM \u06a9\u0627\u0631 \u0646\u0645\u06cc\u200c\u06a9\u0646\u062f)\r\n===================================================== *\/\r\n\r\nif(!document.querySelector('link[data-mx-vazirmatn]')){\r\n\r\nvar fontLink=document.createElement(\"link\");\r\n\r\nfontLink.rel=\"stylesheet\";\r\nfontLink.href=\"https:\/\/fonts.googleapis.com\/css2?family=Vazirmatn:wght@100..900&display=swap\";\r\nfontLink.setAttribute(\"data-mx-vazirmatn\",\"\");\r\n\r\ndocument.head.appendChild(fontLink);\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   GSAP \u2014 \u0641\u0642\u0637 \u0627\u06af\u0631 \u0633\u0627\u06cc\u062a \u0627\u0632 \u0642\u0628\u0644 \u0646\u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f\r\n===================================================== *\/\r\n\r\nif(!window.gsap&&!document.querySelector('script[data-mx-gsap]')){\r\n\r\nvar gs=document.createElement(\"script\");\r\n\r\ngs.src=\"https:\/\/cdn.jsdelivr.net\/npm\/gsap@3\/dist\/gsap.min.js\";\r\ngs.async=true;\r\ngs.setAttribute(\"data-mx-gsap\",\"\");\r\n\r\ndocument.head.appendChild(gs);\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   SHADOW DOM\r\n===================================================== *\/\r\n\r\nvar shadow=host.attachShadow({mode:\"open\"});\r\n\r\nshadow.appendChild(tpl.content.cloneNode(true));\r\n\r\nconst root=shadow.getElementById(\"mx14-matris-services\");\r\n\r\nif(!root)return;\r\n\r\nconst list=root.querySelector(\".mx-services-list\");\r\n\r\nconst img=root.querySelector(\".mx-srv-img\");\r\nconst kicker=root.querySelector(\".mx-srv-kicker\");\r\nconst title=root.querySelector(\".mx-srv-title\");\r\nconst desc=root.querySelector(\".mx-srv-desc\");\r\nconst meta=root.querySelector(\".mx-srv-meta\");\r\nconst btn=root.querySelector(\".mx-sample-btn\");\r\n\r\n\r\n\/* =====================================================\r\n   SERVICES\r\n===================================================== *\/\r\n\r\nconst services=[\r\n\r\n{\r\nn:\"\u06f0\u06f1\",\r\nt:\"\u0635\u0646\u0627\u06cc\u0639 \u063a\u0630\u0627\u06cc\u06cc\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u063a\u0630\u0627\u06cc\u06cc\",\r\nlink:\"https:\/\/matris.ir\/food-industry\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-11_11_01-AM.webp\",\r\nd:\"\u0637\u0631\u0627\u062d\u06cc \u0648 \u062a\u0648\u0644\u06cc\u062f \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062a\u062e\u0635\u0635\u06cc \u0628\u0631\u0627\u06cc \u0627\u0646\u0648\u0627\u0639 \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u063a\u0630\u0627\u06cc\u06cc \u0628\u0627 \u062a\u0645\u0631\u06a9\u0632 \u0628\u0631 \u062d\u0641\u0638 \u06a9\u06cc\u0641\u06cc\u062a \u0645\u062d\u0635\u0648\u0644\u060c \u062c\u0630\u0627\u0628\u06cc\u062a \u0628\u0635\u0631\u06cc \u0648 \u0647\u0645\u0627\u0647\u0646\u06af\u06cc \u06a9\u0627\u0645\u0644 \u0628\u0627 \u0647\u0648\u06cc\u062a \u0628\u0631\u0646\u062f.\",\r\nm:[\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\",\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc \u0686\u0646\u062f\u0644\u0627\u06cc\u0647\",\"\u0644\u06cc\u0628\u0644 IML\",\"\u0686\u0627\u067e \u0627\u062e\u062a\u0635\u0627\u0635\u06cc\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f2\",\r\nt:\"\u0644\u0628\u0646\u06cc\u0627\u062a \u0648 \u0646\u0648\u0634\u06cc\u062f\u0646\u06cc\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0644\u0628\u0646\u06cc\u0627\u062a \u0648 \u0646\u0648\u0634\u06cc\u062f\u0646\u06cc\",\r\nlink:\"https:\/\/matris.ir\/dairy-beverage\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-12_03_15-PM.webp\",\r\nd:\"\u0631\u0627\u0647\u06a9\u0627\u0631\u0647\u0627\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0631\u0627\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0644\u0628\u0646\u06cc \u0648 \u0646\u0648\u0634\u06cc\u062f\u0646\u06cc \u0628\u0627 \u0633\u0627\u062e\u062a\u0627\u0631 \u0645\u0646\u0627\u0633\u0628\u060c \u0686\u0627\u067e \u0628\u0627\u06a9\u06cc\u0641\u06cc\u062a \u0648 \u0642\u0627\u0628\u0644\u06cc\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0646\u0648\u0627\u0639 \u0644\u06cc\u0628\u0644\u200c\u0647\u0627\u06cc \u062a\u062e\u0635\u0635\u06cc.\",\r\nm:[\"\u0644\u06cc\u0628\u0644 IML\",\"\u0644\u06cc\u0628\u0644 BML\",\"\u0644\u06cc\u0628\u0644 TML\",\"\u0686\u0627\u067e \u0636\u062f\u0622\u0628\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f3\",\r\nt:\"\u0622\u0631\u0627\u06cc\u0634\u06cc \u0648 \u0628\u0647\u062f\u0627\u0634\u062a\u06cc\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0622\u0631\u0627\u06cc\u0634\u06cc \u0648 \u0628\u0647\u062f\u0627\u0634\u062a\u06cc\",\r\nlink:\"https:\/\/matris.ir\/cosmetics\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/2-1.webp\",\r\nd:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062d\u0631\u0641\u0647\u200c\u0627\u06cc \u0628\u0631\u0627\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0622\u0631\u0627\u06cc\u0634\u06cc \u0648 \u0628\u0647\u062f\u0627\u0634\u062a\u06cc \u0628\u0627 \u062a\u0623\u06a9\u06cc\u062f \u0628\u0631 \u06a9\u06cc\u0641\u06cc\u062a \u0686\u0627\u067e\u060c \u062c\u0632\u0626\u06cc\u0627\u062a \u0628\u0635\u0631\u06cc \u0648 \u0627\u06cc\u062c\u0627\u062f \u0638\u0627\u0647\u0631 \u0645\u062a\u0645\u0627\u06cc\u0632 \u062f\u0631 \u0642\u0641\u0633\u0647.\",\r\nm:[\"\u0644\u06cc\u0628\u0644 IML\",\"\u0644\u06cc\u0628\u0644 IMD\",\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\",\"\u0686\u0627\u067e \u0627\u062e\u062a\u0635\u0627\u0635\u06cc\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f4\",\r\nt:\"\u062f\u0627\u0631\u0648\u06cc\u06cc \u0648 \u0645\u06a9\u0645\u0644\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062f\u0627\u0631\u0648 \u0648 \u0645\u06a9\u0645\u0644\",\r\nlink:\"https:\/\/matris.ir\/pharmaceutical\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-11_28_24-AM.webp\",\r\nd:\"\u062a\u0648\u0644\u06cc\u062f \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062f\u0642\u06cc\u0642 \u0648 \u0627\u0633\u062a\u0627\u0646\u062f\u0627\u0631\u062f \u0628\u0631\u0627\u06cc \u062f\u0627\u0631\u0648 \u0648 \u0645\u06a9\u0645\u0644 \u0628\u0627 \u062a\u0645\u0631\u06a9\u0632 \u0628\u0631 \u06a9\u06cc\u0641\u06cc\u062a \u0686\u0627\u067e\u060c \u062e\u0648\u0627\u0646\u0627\u06cc\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0648 \u06a9\u0646\u062a\u0631\u0644 \u06a9\u06cc\u0641\u06cc\u062a \u0633\u0627\u062e\u062a.\",\r\nm:[\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\",\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc \u0686\u0646\u062f\u0644\u0627\u06cc\u0647\",\"\u0686\u0627\u067e \u062f\u0642\u06cc\u0642\",\"\u06a9\u0646\u062a\u0631\u0644 \u06a9\u06cc\u0641\u06cc\u062a\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f5\",\r\nt:\"\u0634\u0648\u06cc\u0646\u062f\u0647 \u0648 \u0628\u0647\u062f\u0627\u0634\u062a \u062e\u0627\u0646\u06af\u06cc\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0634\u0648\u06cc\u0646\u062f\u0647 \u0648 \u062e\u0627\u0646\u06af\u06cc\",\r\nlink:\"https:\/\/matris.ir\/household-cleaning\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-11_39_09-AM.webp\",\r\nd:\"\u0631\u0627\u0647\u06a9\u0627\u0631\u0647\u0627\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0642\u0627\u0648\u0645 \u0628\u0631\u0627\u06cc \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0634\u0648\u06cc\u0646\u062f\u0647 \u0648 \u0628\u0647\u062f\u0627\u0634\u062a \u062e\u0627\u0646\u06af\u06cc \u0628\u0627 \u0642\u0627\u0628\u0644\u06cc\u062a \u0627\u062c\u0631\u0627\u06cc \u0637\u0631\u062d\u200c\u0647\u0627\u06cc \u0645\u062a\u0646\u0648\u0639 \u0648 \u0686\u0627\u067e \u0627\u062e\u062a\u0635\u0627\u0635\u06cc.\",\r\nm:[\"\u0644\u06cc\u0628\u0644 IML\",\"\u0644\u06cc\u0628\u0644 IMD\",\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\",\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0642\u0627\u0648\u0645\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f6\",\r\nt:\"\u0635\u06cc\u0641\u06cc\u200c\u062c\u0627\u062a\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0635\u06cc\u0641\u06cc\u200c\u062c\u0627\u062a \u0648 \u0633\u0628\u0632\u06cc\u062c\u0627\u062a\",\r\nlink:\"https:\/\/matris.ir\/vegetables\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-11_52_38-AM.webp\",\r\nd:\"\u0637\u0631\u0627\u062d\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0631\u0627\u06cc \u0635\u06cc\u0641\u06cc\u200c\u062c\u0627\u062a \u0648 \u0633\u0628\u0632\u06cc\u062c\u0627\u062a \u0628\u0627 \u0633\u0627\u062e\u062a\u0627\u0631 \u0645\u0646\u0627\u0633\u0628 \u0628\u0631\u0627\u06cc \u062d\u0645\u0644\u060c \u0646\u0645\u0627\u06cc\u0634 \u0645\u062d\u0635\u0648\u0644 \u0648 \u062d\u0641\u0638 \u062a\u0627\u0632\u06af\u06cc \u062f\u0631 \u0637\u0648\u0644 \u0632\u0646\u062c\u06cc\u0631\u0647 \u062a\u0648\u0632\u06cc\u0639.\",\r\nm:[\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc \u0686\u0646\u062f\u0644\u0627\u06cc\u0647\",\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc \u0645\u0634\u0628\u06a9\",\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062d\u0627\u0641\u0638 \u062a\u0627\u0632\u06af\u06cc\",\"\u0686\u0627\u067e \u0627\u062e\u062a\u0635\u0627\u0635\u06cc\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f7\",\r\nt:\"\u0635\u0646\u0627\u06cc\u0639 \u0648 \u0642\u0637\u0639\u0627\u062a\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0635\u0646\u0627\u06cc\u0639 \u0648 \u0642\u0637\u0639\u0627\u062a\",\r\nlink:\"https:\/\/matris.ir\/industrial\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-19-2026-10_29_41-AM.webp\",\r\nd:\"\u0637\u0631\u0627\u062d\u06cc \u0648 \u062a\u0648\u0644\u06cc\u062f \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062a\u062e\u0635\u0635\u06cc \u0628\u0631\u0627\u06cc \u0642\u0637\u0639\u0627\u062a \u0635\u0646\u0639\u062a\u06cc\u060c \u062a\u062c\u0647\u06cc\u0632\u0627\u062a \u0648 \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0641\u0646\u06cc\u061b \u0628\u0627 \u062c\u0639\u0628\u0647\u200c\u0647\u0627\u06cc \u0645\u0642\u0648\u0627\u06cc\u06cc \u0645\u0642\u0627\u0648\u0645 \u0648 \u06a9\u0627\u0631\u062a\u0646\u200c\u0647\u0627\u06cc \u0644\u0645\u06cc\u0646\u062a\u06cc \u0645\u062a\u0646\u0627\u0633\u0628 \u0628\u0627 \u0627\u0628\u0639\u0627\u062f\u060c \u0648\u0632\u0646 \u0648 \u0634\u0631\u0627\u06cc\u0637 \u062d\u0645\u0644 \u0645\u062d\u0635\u0648\u0644.\",\r\nm:[\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc \u0645\u0642\u0627\u0648\u0645\",\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\",\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0642\u0637\u0639\u0627\u062a\",\"\u0686\u0627\u067e \u0635\u0646\u0639\u062a\u06cc\"]\r\n},\r\n\r\n{\r\nn:\"\u06f0\u06f8\",\r\nt:\"\u0644\u0648\u0627\u0632\u0645 \u062e\u0627\u0646\u06af\u06cc\",\r\nlt:\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0644\u0648\u0627\u0632\u0645 \u062e\u0627\u0646\u06af\u06cc\",\r\nlink:\"https:\/\/matris.ir\/home-appliances\",\r\nimg:\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-19-2026-10_42_05-AM.webp\",\r\nd:\"\u062a\u0648\u0644\u06cc\u062f \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0631\u0627\u06cc \u0627\u0646\u0648\u0627\u0639 \u0644\u0648\u0627\u0632\u0645 \u0648 \u062a\u062c\u0647\u06cc\u0632\u0627\u062a \u062e\u0627\u0646\u06af\u06cc \u0628\u0627 \u062a\u0645\u0631\u06a9\u0632 \u0628\u0631 \u0627\u0633\u062a\u062d\u06a9\u0627\u0645\u060c \u0645\u062d\u0627\u0641\u0638\u062a \u062f\u0631 \u0632\u0645\u0627\u0646 \u062c\u0627\u0628\u0647\u200c\u062c\u0627\u06cc\u06cc \u0648 \u0646\u0645\u0627\u06cc\u0634 \u0645\u0646\u0627\u0633\u0628 \u0645\u062d\u0635\u0648\u0644\u061b \u0628\u0627 \u0633\u0627\u062e\u062a\u0627\u0631 \u0648 \u0627\u0628\u0639\u0627\u062f \u0645\u062a\u0646\u0627\u0633\u0628 \u0628\u0627 \u0645\u062d\u0635\u0648\u0644 \u0648 \u0647\u0648\u06cc\u062a \u0628\u0635\u0631\u06cc \u0628\u0631\u0646\u062f.\",\r\nm:[\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\",\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\",\"\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0642\u0627\u0648\u0645\",\"\u0686\u0627\u067e \u0627\u062e\u062a\u0635\u0627\u0635\u06cc\"]\r\n}\r\n\r\n];\r\n\r\n\r\nlet current=0;\r\n\r\n\r\n\/* =====================================================\r\n   DESKTOP CHANGE\r\n===================================================== *\/\r\n\r\nfunction changeDesktop(index){\r\n\r\nconst s=services[index];\r\n\r\nimg.src=s.img;\r\n\r\nkicker.textContent=s.n+\" \/ \"+s.t;\r\n\r\ntitle.textContent=s.lt;\r\n\r\ndesc.textContent=s.d;\r\n\r\nmeta.innerHTML=s.m\r\n.map(x=>`<span>${x}<\/span>`)\r\n.join(\"\");\r\n\r\nbtn.href=s.link||\"#\";\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   DESKTOP ACTIVATE\r\n===================================================== *\/\r\n\r\nfunction activateDesktop(index,instant=false){\r\n\r\nif(index===current&&!instant)return;\r\n\r\ncurrent=index;\r\n\r\nconst items=list.querySelectorAll(\".mx-service-item\");\r\n\r\nitems.forEach((el,i)=>{\r\nel.classList.toggle(\"is-active\",i===index);\r\n});\r\n\r\n\r\nconst change=()=>{\r\nchangeDesktop(index);\r\n};\r\n\r\n\r\nif(instant){\r\n\r\nchange();\r\n\r\n}else if(window.gsap){\r\n\r\nwindow.gsap.timeline()\r\n\r\n.to(\r\n[title,desc,meta],\r\n{\r\nopacity:0,\r\ny:8,\r\nduration:.20,\r\nease:\"power2.out\"\r\n}\r\n)\r\n\r\n.to(\r\nimg,\r\n{\r\nopacity:0,\r\nscale:1.02,\r\nduration:.25,\r\nease:\"power2.out\",\r\nonComplete:change\r\n}\r\n)\r\n\r\n.to(\r\nimg,\r\n{\r\nopacity:1,\r\nscale:1,\r\nduration:.5,\r\nease:\"power2.out\"\r\n}\r\n)\r\n\r\n.to(\r\n[title,desc,meta],\r\n{\r\nopacity:1,\r\ny:0,\r\nduration:.4,\r\nstagger:.04,\r\nease:\"power2.out\"\r\n}\r\n);\r\n\r\n}else{\r\n\r\nchange();\r\n\r\n}\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE PANEL\r\n===================================================== *\/\r\n\r\nfunction createMobilePanel(s){\r\n\r\nconst panel=document.createElement(\"div\");\r\n\r\npanel.className=\"mx-mobile-panel\";\r\n\r\npanel.innerHTML=`\r\n\r\n<div class=\"mx-mobile-panel-inner\">\r\n\r\n<div class=\"mx-mobile-image\">\r\n\r\n<img\r\nsrc=\"${s.img}\"\r\nalt=\"${s.lt}\"\r\n>\r\n\r\n<\/div>\r\n\r\n<div class=\"mx-mobile-kicker\">\r\n${s.n} \/ ${s.t}\r\n<\/div>\r\n\r\n<p class=\"mx-mobile-desc\">\r\n${s.d}\r\n<\/p>\r\n\r\n<div class=\"mx-mobile-foot\">\r\n\r\n<div class=\"mx-mobile-meta\">\r\n${s.m.map(x=>`<span>${x}<\/span>`).join(\"\")}\r\n<\/div>\r\n\r\n<a\r\nclass=\"mx-mobile-btn\"\r\nhref=\"${s.link||\"#\"}\"\r\n>\r\n\u0645\u0634\u0627\u0647\u062f\u0647 \u0646\u0645\u0648\u0646\u0647\u200c\u0647\u0627\r\n<\/a>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n`;\r\n\r\nreturn panel;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   SMOOTH OPEN \/ CLOSE\r\n===================================================== *\/\r\n\r\nfunction openPanel(item,panel){\r\n\r\nif(!panel)return;\r\n\r\npanel.classList.add(\"is-visible\");\r\n\r\nconst inner=panel.querySelector(\".mx-mobile-panel-inner\");\r\n\r\nif(!inner)return;\r\n\r\nconst targetHeight=inner.scrollHeight;\r\n\r\npanel.style.height=\"0px\";\r\npanel.style.opacity=\"0\";\r\n\r\nrequestAnimationFrame(()=>{\r\n\r\npanel.style.transition=\r\n\"height .55s cubic-bezier(.22,.61,.36,1), opacity .4s ease\";\r\n\r\npanel.style.height=targetHeight+\"px\";\r\npanel.style.opacity=\"1\";\r\n\r\n});\r\n\r\n}\r\n\r\n\r\nfunction closePanel(item,panel){\r\n\r\nif(!panel)return;\r\n\r\nconst inner=panel.querySelector(\".mx-mobile-panel-inner\");\r\n\r\nif(!inner)return;\r\n\r\nconst currentHeight=inner.getBoundingClientRect().height;\r\n\r\npanel.style.height=currentHeight+\"px\";\r\npanel.style.opacity=\"1\";\r\n\r\nrequestAnimationFrame(()=>{\r\n\r\npanel.style.transition=\r\n\"height .5s cubic-bezier(.22,.61,.36,1), opacity .35s ease\";\r\n\r\npanel.style.height=\"0px\";\r\npanel.style.opacity=\"0\";\r\n\r\npanel.classList.remove(\"is-visible\");\r\n\r\n});\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   RENDER\r\n===================================================== *\/\r\n\r\nfunction render(){\r\n\r\nlist.innerHTML=\"\";\r\n\r\nservices.forEach((s,i)=>{\r\n\r\nconst item=document.createElement(\"div\");\r\n\r\nitem.className=\"mx-service-item\";\r\n\r\nitem.dataset.index=i;\r\n\r\nitem.innerHTML=`\r\n\r\n<div class=\"mx-service-main\">\r\n\r\n<div style=\"display:flex;align-items:center;gap:14px;min-width:0;\">\r\n\r\n<span class=\"mx-service-number\">\r\n${s.n}\r\n<\/span>\r\n\r\n<h3 class=\"mx-service-title\">\r\n${s.t}\r\n<\/h3>\r\n\r\n<\/div>\r\n\r\n<span class=\"mx-service-arrow\">\r\n\u2190\r\n<\/span>\r\n\r\n<\/div>\r\n\r\n`;\r\n\r\nconst mobilePanel=createMobilePanel(s);\r\n\r\nitem.appendChild(mobilePanel);\r\n\r\n\r\n\/* =====================================================\r\n   CLICK ONLY\r\n   - \u0645\u0648\u0628\u0627\u06cc\u0644: Accordion\r\n   - \u062f\u0633\u06a9\u062a\u0627\u067e: \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\r\n   - \u0647\u06cc\u0686 Mouseenter \/ Hover \u0628\u0631\u0627\u06cc \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0648\u062c\u0648\u062f \u0646\u062f\u0627\u0631\u062f\r\n===================================================== *\/\r\n\r\nitem.addEventListener(\"click\",()=>{\r\n\r\nif(window.innerWidth<992){\r\n\r\nconst isOpen=item.classList.contains(\"is-active\");\r\n\r\nconst allItems=list.querySelectorAll(\".mx-service-item\");\r\n\r\nallItems.forEach(el=>{\r\n\r\nif(el!==item){\r\n\r\nconst otherPanel=el.querySelector(\".mx-mobile-panel\");\r\n\r\nel.classList.remove(\"is-active\");\r\n\r\nif(otherPanel){\r\nclosePanel(el,otherPanel);\r\n}\r\n\r\n}\r\n\r\n});\r\n\r\n\r\nif(isOpen){\r\n\r\nitem.classList.remove(\"is-active\");\r\n\r\nclosePanel(item,mobilePanel);\r\n\r\n}else{\r\n\r\nitem.classList.add(\"is-active\");\r\n\r\nopenPanel(item,mobilePanel);\r\n\r\n}\r\n\r\nreturn;\r\n\r\n}\r\n\r\n\r\n\/* \u062f\u0633\u06a9\u062a\u0627\u067e \u0641\u0642\u0637 \u0628\u0627 \u06a9\u0644\u06cc\u06a9 *\/\r\n\r\nactivateDesktop(i);\r\n\r\n});\r\n\r\n\r\nlist.appendChild(item);\r\n\r\n});\r\n\r\n\r\nif(window.innerWidth<992){\r\n\r\nconst first=list.querySelector(\".mx-service-item\");\r\n\r\nif(first){\r\n\r\nconst panel=first.querySelector(\".mx-mobile-panel\");\r\n\r\nfirst.classList.add(\"is-active\");\r\n\r\nrequestAnimationFrame(()=>{\r\n\r\nopenPanel(first,panel);\r\n\r\n});\r\n\r\n}\r\n\r\n}else{\r\n\r\nactivateDesktop(0,true);\r\n\r\n}\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   INITIAL\r\n===================================================== *\/\r\n\r\nrender();\r\n\r\n\r\n\/* =====================================================\r\n   RESIZE\r\n===================================================== *\/\r\n\r\nlet lastMobile=window.innerWidth<992;\r\n\r\nwindow.addEventListener(\"resize\",()=>{\r\n\r\nconst nowMobile=window.innerWidth<992;\r\n\r\nif(nowMobile!==lastMobile){\r\n\r\nlastMobile=nowMobile;\r\n\r\ncurrent=0;\r\n\r\nrender();\r\n\r\n}\r\n\r\n});\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-462e61e e-con-full e-flex e-con e-parent\" data-id=\"462e61e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-02607c3 elementor-widget elementor-widget-html\" data-id=\"02607c3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.mx15-omneraScrollHero6,\n.mx15-omneraScrollHero6 *{\nbox-sizing:border-box;\n}\n\n.mx15-omneraScrollHero6.omn-scroll-scene{\nposition:relative;\nwidth:100%;\nheight:200vh;\nbackground:#1b2226;\ncolor:#001489;\nfont-family:\"IranYekanX\",sans-serif;\ndirection:rtl;\ntext-align:right;\noverflow-x:clip;\n}\n\n.mx15-omneraScrollHero6 .omn-sticky{\nposition:sticky;\ntop:0;\nwidth:100%;\nheight:100vh;\nheight:100dvh;\noverflow:hidden;\nbackground:#303b41;\n}\n\n.mx15-omneraScrollHero6 .omn-media-plane{\nposition:absolute;\ninset:0;\nz-index:0;\noverflow:hidden;\nbackground:#303b41;\n}\n\n.mx15-omneraScrollHero6 .omn-media-plane img{\ndisplay:block;\nwidth:100%;\nheight:100%;\nobject-fit:cover;\nobject-position:50% 50%;\ntransform:none!important;\nwill-change:opacity,filter;\nbackface-visibility:visible;\n-webkit-backface-visibility:visible;\n}\n\n.mx15-omneraScrollHero6 .omn-media-tint{\nposition:absolute;\ninset:0;\nz-index:1;\nbackground:#ffffff;\nopacity:.08;\npointer-events:none;\n}\n\n.mx15-omneraScrollHero6 .omn-media-vignette{\nposition:absolute;\ninset:0;\nz-index:2;\nbackground:\nlinear-gradient(\n180deg,\nrgba(10,14,16,.25),\ntransparent 24%,\ntransparent 70%,\nrgba(10,13,15,.55)\n),\nlinear-gradient(\n90deg,\nrgba(12,16,18,.15),\ntransparent 34%,\ntransparent 75%,\nrgba(12,16,18,.15)\n);\npointer-events:none;\n}\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\nposition:absolute;\nz-index:5;\n\ntop:35svh;\n\nright:8vw;\nleft:8vw;\n\ndisplay:grid;\ngrid-template-columns:minmax(0,1fr) minmax(460px,42vw);\n\ngap:clamp(48px,6vw,110px);\n\nalign-items:start;\n\npointer-events:none;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\nmargin:0 0 6px;\n\nfont-size:clamp(1.1rem,1.5vw,1.35rem);\n\nfont-weight:700;\nline-height:1.4;\n\ncolor:#eb008b;\n\nletter-spacing:0;\ndirection:rtl;\ntext-align:right;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nwidth:min(780px,58vw);\nmargin:0;\n\nfont-size:clamp(2.25rem,2.85vw,3.7rem);\n\nfont-weight:700;\nline-height:1;\n\ncolor:#382d7e;\n\nletter-spacing:0;\ndirection:rtl;\ntext-align:right;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\npadding-top:0;\n\nfont-size:clamp(1.05rem,1.4vw,1.32rem);\n\nfont-weight:400;\nline-height:1.9;\n\nletter-spacing:0;\ndirection:rtl;\ntext-align:justify;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p{\nmargin:0;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p+p{\nmargin-top:24px;\n}\n\n.mx15-omneraScrollHero6 .omn-word{\ndisplay:inline-block;\nwhite-space:nowrap;\ndirection:rtl;\nunicode-bidi:normal;\nwill-change:opacity,transform,filter;\n}\n\n.mx15-omneraScrollHero6 .omn-space{\ndisplay:inline;\nwhite-space:pre;\n}\n\n.mx15-omneraScrollHero6 .omn-reveal-copy{\nopacity:1;\n}\n\n\n\/* =========================================================\n   DESKTOP\n   ========================================================= *\/\n\n@media (min-width:1025px){\n\n.mx15-omneraScrollHero6 .omn-detail{\ntransform:none;\ntext-align:justify;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p:first-child{\nline-height:1.4;\n}\n\n}\n\n\n\/* =========================================================\n   TABLET + MEDIA\n   ========================================================= *\/\n\n@media (max-width:1024px){\n\n.mx15-omneraScrollHero6.omn-scroll-scene{\nheight:300vh;\nheight:300svh;\n}\n\n.mx15-omneraScrollHero6 .omn-sticky{\nheight:100vh!important;\nmin-height:100vh!important;\n\nheight:100svh!important;\nmin-height:100svh!important;\n\nheight:100dvh!important;\nmin-height:100dvh!important;\n\nmax-height:none!important;\n}\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\n\ntop:50%!important;\n\nright:4vw!important;\nleft:4vw!important;\n\nbottom:auto!important;\n\ntransform:translateY(-50%)!important;\n\ndisplay:flex!important;\nflex-direction:column!important;\n\nalign-items:stretch!important;\n\ngap:clamp(24px,6vh,60px)!important;\n\nwidth:auto!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement,\n.mx15-omneraScrollHero6 .omn-detail{\n\nwidth:100%!important;\nmax-width:none!important;\n\ndisplay:block!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\n\nfont-size:\nclamp(\n1.05rem,\n2.8vw,\n1.45rem\n)!important;\n\nmargin-bottom:\nclamp(\n4px,\n0.8vh,\n8px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\n\nwidth:100%!important;\nmax-width:none!important;\n\nfont-size:\nclamp(\n1.7rem,\n5.2vw,\n3.9rem\n)!important;\n\nline-height:\n.92!important;\n\nletter-spacing:0!important;\n\noverflow-wrap:normal;\nword-break:normal;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\n\nfont-size:\nclamp(\n1.05rem,\n3vw,\n1.75rem\n)!important;\n\nline-height:\nclamp(\n1.6,\n1.8,\n2\n)!important;\n\ntext-align:justify!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p{\n\ndisplay:block!important;\n\nwidth:100%!important;\n\nmargin:0!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p+p{\n\nmargin-top:\nclamp(\n12px,\n2.5vh,\n24px\n)!important;\n}\n\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media (max-width:767px){\n\n.mx15-omneraScrollHero6.omn-scroll-scene{\nheight:300vh!important;\n}\n\n.mx15-omneraScrollHero6 .omn-sticky{\n\nheight:100vh!important;\nmin-height:100vh!important;\n\nheight:100svh!important;\nmin-height:100svh!important;\n\nheight:100dvh!important;\nmin-height:100dvh!important;\n}\n\n.mx15-omneraScrollHero6 .omn-media-plane{\n\nheight:100%!important;\nmin-height:100%!important;\n}\n\n.mx15-omneraScrollHero6 .omn-media-plane img{\n\nwidth:100%!important;\nheight:100%!important;\n\nobject-fit:cover!important;\nobject-position:50% 50%!important;\n\ntransform:none!important;\n\nwill-change:filter,opacity;\n}\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\n\ntop:50%!important;\n\nright:4vw!important;\nleft:4vw!important;\n\ntransform:translateY(-50%)!important;\n\ngap:\nclamp(\n20px,\n5vh,\n42px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement{\nwidth:100%;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\n\nfont-size:\nclamp(\n.95rem,\n3.8vw,\n1.25rem\n)!important;\n\nline-height:1.4!important;\n\nmargin-bottom:\nclamp(\n2px,\n0.5vh,\n5px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\n\nwidth:100%!important;\nmax-width:none!important;\n\nfont-size:\nclamp(\n1.4rem,\n7.5vw,\n3.2rem\n)!important;\n\nline-height:\n.85!important;\n\nletter-spacing:0!important;\n\noverflow-wrap:normal!important;\nword-break:normal!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\n\nwidth:100%!important;\n\nfont-size:\nclamp(\n.92rem,\n4.3vw,\n1.4rem\n)!important;\n\nline-height:\nclamp(\n1.85,\n2.05,\n2.2\n)!important;\n\nletter-spacing:0!important;\n\ntext-align:justify!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p{\n\nwidth:100%!important;\nmargin:0!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p+p{\n\nmargin-top:\nclamp(\n10px,\n2.2vh,\n20px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-reveal-copy .omn-word{\n\nopacity:0;\n\ntransform:\ntranslate3d(\n0,\n.7em,\n0\n);\n\nfilter:blur(5px);\n\nwill-change:\nopacity,\ntransform,\nfilter;\n}\n\n.mx15-omneraScrollHero6 .omn-crosshair{\ndisplay:none!important;\n}\n\n.mx15-omneraScrollHero6 .omn-media-vignette{\n\ndisplay:none!important;\nopacity:0!important;\nvisibility:hidden!important;\n}\n\n.mx15-omneraScrollHero6 .omn-scroll-blur{\n\nz-index:3!important;\n\nbackground:transparent!important;\n\n-webkit-backdrop-filter:blur(5px)!important;\nbackdrop-filter:blur(5px)!important;\n\nmix-blend-mode:normal!important;\n\nbox-shadow:none!important;\n}\n\n}\n\n\n\/* =========================================================\n   VERY SMALL MOBILE\n   ========================================================= *\/\n\n@media (max-width:380px){\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\n\nright:4vw!important;\nleft:4vw!important;\n\ngap:\nclamp(\n16px,\n4vh,\n28px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\n\nfont-size:\nclamp(\n.85rem,\n3.4vw,\n1.05rem\n)!important;\n\nmargin-bottom:3px!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\n\nfont-size:\nclamp(\n1.3rem,\n7.5vw,\n2.4rem\n)!important;\n\nline-height:.85!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\n\nfont-size:\nclamp(\n.85rem,\n4.1vw,\n1.15rem\n)!important;\n\nline-height:1.65!important;\n\ntext-align:justify!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p+p{\n\nmargin-top:\nclamp(\n8px,\n1.8vh,\n14px\n)!important;\n}\n\n}\n\n\n\/* =========================================================\n   MOBILE SHORT HEIGHT\n   ========================================================= *\/\n\n@media (max-width:767px) and (max-height:700px){\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\n\ngap:\nclamp(\n12px,\n3vh,\n25px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\n\nfont-size:\nclamp(\n1.35rem,\n7.2vw,\n2.65rem\n)!important;\n\nline-height:.85!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\n\nfont-size:\nclamp(\n.87rem,\n4vw,\n1.2rem\n)!important;\n\nline-height:1.6!important;\n\ntext-align:justify!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail p+p{\n\nmargin-top:\nclamp(\n8px,\n1.8vh,\n14px\n)!important;\n}\n\n}\n\n\n\/* =========================================================\n   MOBILE TALL\n   ========================================================= *\/\n\n@media (max-width:767px) and (min-height:800px){\n\n.mx15-omneraScrollHero6 .omn-copy-plane{\n\ngap:\nclamp(\n24px,\n5vh,\n45px\n)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\n\nfont-size:\nclamp(\n1.5rem,\n8vw,\n3.4rem\n)!important;\n\nline-height:.85!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\n\nfont-size:\nclamp(\n.97rem,\n4.4vw,\n1.45rem\n)!important;\n\ntext-align:justify!important;\n}\n\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n   ========================================================= *\/\n\n@media (prefers-reduced-motion:reduce){\n\n.mx15-omneraScrollHero6 .omn-reveal-copy .omn-word{\n\nopacity:1!important;\ntransform:none!important;\nfilter:none!important;\n}\n\n}\n\n\n\/* =========================================================\n   SHRINK ALL FONTS A BIT\n   ========================================================= *\/\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\nfont-size:clamp(0.95rem,1.3vw,1.15rem);\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.95rem,2.5vw,3.2rem);\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.92rem,1.2vw,1.15rem);\ntext-align:justify;\n}\n\n\n@media (max-width:1024px){\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\nfont-size:clamp(0.92rem,2.4vw,1.25rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.45rem,4.4vw,3.3rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.92rem,2.6vw,1.5rem)!important;\ntext-align:justify!important;\n}\n\n}\n\n\n@media (max-width:767px){\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\nfont-size:clamp(0.82rem,3.2vw,1.08rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.2rem,6.4vw,2.7rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.8rem,3.7vw,1.2rem)!important;\ntext-align:justify!important;\n}\n\n}\n\n\n@media (max-width:380px){\n\n.mx15-omneraScrollHero6 .omn-statement__brand{\nfont-size:clamp(0.75rem,2.9vw,0.9rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.1rem,6.4vw,2.05rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.75rem,3.5vw,1.0rem)!important;\ntext-align:justify!important;\n}\n\n}\n\n\n@media (max-width:767px) and (max-height:700px){\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.15rem,6.2vw,2.25rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.76rem,3.4vw,1.03rem)!important;\ntext-align:justify!important;\n}\n\n}\n\n\n@media (max-width:767px) and (min-height:800px){\n\n.mx15-omneraScrollHero6 .omn-statement__title{\nfont-size:clamp(1.28rem,6.9vw,2.9rem)!important;\n}\n\n.mx15-omneraScrollHero6 .omn-detail{\nfont-size:clamp(0.85rem,3.8vw,1.25rem)!important;\ntext-align:justify!important;\n}\n\n}\n<\/style>\n\n<section\nclass=\"mx15-omneraScrollHero6 omn-scroll-scene\"\nid=\"omneraScrollHero6\"\naria-label=\"\u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633\"\n>\n\n<div class=\"omn-sticky\" id=\"omn-sticky-6\">\n\n<div class=\"omn-media-plane\" aria-hidden=\"true\">\n\n<img\nid=\"omn-hero-image-6\"\nsrc=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-28-2026-01_57_14-PM.webp\"\nsrcset=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-28-2026-01_57_14-PM.webp\"\nsizes=\"100vw\"\nalt=\"\"\n\n\n\n<\/div>\n\n<div\nclass=\"omn-media-tint\"\nid=\"omn-media-tint-6\"\naria-hidden=\"true\">\n<\/div>\n\n<div\nclass=\"omn-media-vignette\"\naria-hidden=\"true\">\n<\/div>\n\n<div class=\"omn-copy-plane\">\n\n<div class=\"omn-statement\">\n\n<p\nclass=\"omn-statement__brand omn-reveal-copy\"\ndata-start=\"0.29\"\ndata-end=\"0.38\">\n\u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633\n<\/p>\n\n<h1\nclass=\"omn-statement__title omn-reveal-copy\"\ndata-start=\"0.34\"\ndata-end=\"0.54\">\n\u0647\u0631 \u0645\u0633\u06cc\u0631\u060c<br>\n\u0628\u062e\u0634\u06cc \u0627\u0632 \u06cc\u06a9 \u062a\u0635\u0648\u06cc\u0631 \u0628\u0632\u0631\u06af\u200c\u062a\u0631\n<\/h1>\n\n<\/div>\n\n<div class=\"omn-detail\">\n\n\n\n<p\nclass=\"omn-reveal-copy\"\ndata-start=\"0.60\"\ndata-end=\"0.83\">\n\u0622\u0646\u0686\u0647 \u0627\u0645\u0631\u0648\u0632 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0631\u0627 \u0634\u06a9\u0644 \u062f\u0627\u062f\u0647\u060c \u062d\u0627\u0635\u0644 \u06a9\u0646\u0627\u0631 \u0647\u0645 \u0642\u0631\u0627\u0631 \u06af\u0631\u0641\u062a\u0646 \u062a\u062c\u0631\u0628\u0647\u200c\u0647\u0627\u060c \u062a\u062e\u0635\u0635\u200c\u0647\u0627 \u0648 \u06a9\u0633\u0628\u200c\u0648\u06a9\u0627\u0631\u0647\u0627\u06cc \u0645\u06a9\u0645\u0644\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0647\u0631\u06a9\u062f\u0627\u0645 \u0628\u062e\u0634\u06cc \u0627\u0632 \u0627\u06cc\u0646 \u0645\u0633\u06cc\u0631 \u0631\u0627 \u0633\u0627\u062e\u062a\u0647\u200c\u0627\u0646\u062f. \u0647\u0631 \u0645\u062c\u0645\u0648\u0639\u0647\u060c \u0647\u0648\u06cc\u062a \u0648 \u062a\u0648\u0627\u0646\u0645\u0646\u062f\u06cc \u0645\u0633\u062a\u0642\u0644 \u062e\u0648\u062f \u0631\u0627 \u062f\u0627\u0631\u062f\u061b \u0627\u0645\u0627 \u062f\u0631 \u06a9\u0646\u0627\u0631 \u06cc\u06a9\u062f\u06cc\u06af\u0631\u060c \u062a\u0635\u0648\u06cc\u0631\u06cc \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u0627\u0632 \u0645\u0633\u06cc\u0631 \u0631\u0634\u062f \u0648 \u062a\u0648\u0633\u0639\u0647 \u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0634\u06a9\u0644 \u0645\u06cc\u200c\u062f\u0647\u0646\u062f.\n<\/p>\n\n<p\nclass=\"omn-reveal-copy\"\ndata-start=\"0.80\"\ndata-end=\"0.95\">\u0627\u06cc\u0646 \u062a\u0635\u0648\u06cc\u0631 \u0647\u0645\u0686\u0646\u0627\u0646 \u062f\u0631 \u062d\u0627\u0644 \u06a9\u0627\u0645\u0644 \u0634\u062f\u0646 \u0627\u0633\u062a\u061b \u0628\u0627 \u062a\u0648\u0633\u0639\u0647 \u06a9\u0633\u0628\u200c\u0648\u06a9\u0627\u0631\u0647\u0627\u06cc \u0645\u06a9\u0645\u0644\u060c \u0634\u06a9\u0644\u200c\u06af\u06cc\u0631\u06cc \u0645\u0633\u06cc\u0631\u0647\u0627\u06cc \u062a\u0627\u0632\u0647 \u0648 \u0645\u062c\u0645\u0648\u0639\u0647\u200c\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u0647\u0631\u06a9\u062f\u0627\u0645 \u0628\u062e\u0634\u06cc \u0627\u0632 \u0622\u06cc\u0646\u062f\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0631\u0627 \u062e\u0648\u0627\u0647\u0646\u062f \u0633\u0627\u062e\u062a.\n<\/p>\n\n<\/div>\n\n<div\nclass=\"omn-crosshair\"\nid=\"omn-crosshair-6\"\naria-hidden=\"true\">\n\n<span class=\"omn-crosshair__horizontal\"><\/span>\n<span class=\"omn-crosshair__vertical\"><\/span>\n<span class=\"omn-crosshair__mark\"><\/span>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/section>\n\n<script>\n\n(function(){\n\nconst scene =\ndocument.getElementById(\n'omneraScrollHero6'\n);\n\nif(!scene)return;\n\n\nconst mobile =\nwindow.matchMedia(\n'(max-width:767px)'\n);\n\nconst reduced =\nwindow.matchMedia(\n'(prefers-reduced-motion:reduce)'\n);\n\n\nfunction prepareText(){\n\nscene\n.querySelectorAll(\n'.omn-reveal-copy'\n)\n.forEach(el=>{\n\nif(el.dataset.prepared === 'true')return;\n\nconst nodes =\nArray.from(el.childNodes);\n\nconst frag =\ndocument.createDocumentFragment();\n\nnodes.forEach(node=>{\n\nif(node.nodeType === 3){\n\nconst text =\nnode.textContent;\n\nconst parts =\ntext.split(\/(\\s+)\/);\n\nparts.forEach(part=>{\n\nif(!part)return;\n\nif(\/^\\s+$\/.test(part)){\n\nconst space =\ndocument.createElement('span');\n\nspace.className='omn-space';\n\nspace.textContent=part;\n\nfrag.appendChild(space);\n\n}else{\n\nconst word =\ndocument.createElement('span');\n\nword.className='omn-word';\n\nword.textContent=part;\n\nfrag.appendChild(word);\n\n}\n\n});\n\n}else if(\nnode.nodeType === 1 &&\nnode.tagName.toLowerCase()==='br'\n){\n\nfrag.appendChild(\ndocument.createElement('br')\n);\n\n}else{\n\nconst text =\nnode.textContent || '';\n\nconst parts =\ntext.split(\/(\\s+)\/);\n\nparts.forEach(part=>{\n\nif(!part)return;\n\nif(\/^\\s+$\/.test(part)){\n\nconst space =\ndocument.createElement('span');\n\nspace.className='omn-space';\n\nspace.textContent=part;\n\nfrag.appendChild(space);\n\n}else{\n\nconst word =\ndocument.createElement('span');\n\nword.className='omn-word';\n\nword.textContent=part;\n\nfrag.appendChild(word);\n\n}\n\n});\n\n}\n\n});\n\nel.textContent='';\n\nel.appendChild(frag);\n\nel.dataset.prepared='true';\n\n});\n\n}\n\n\nprepareText();\n\n\nconst image =\nscene.querySelector(\n'#omn-hero-image-6'\n);\n\nconst tint =\nscene.querySelector(\n'#omn-media-tint-6'\n);\n\n\nconst groups=[];\n\n\nconst clamp =\n(v,min=0,max=1)=>\nMath.min(\nmax,\nMath.max(min,v)\n);\n\n\nconst lerp =\n(a,b,t)=>\na+(b-a)*t;\n\n\nconst ease =\nv=>\nv<.5\n? 4*v*v*v\n: 1-Math.pow(-2*v+2,3)\/2;\n\n\nscene\n.querySelectorAll(\n'.omn-reveal-copy'\n)\n.forEach(el=>{\n\ngroups.push({\n\nel:el,\n\nwords:Array.from(\nel.querySelectorAll(\n'.omn-word'\n)\n),\n\nstart:Number(\nel.dataset.start\n),\n\nend:Number(\nel.dataset.end\n)\n\n});\n\n});\n\n\nif(mobile.matches){\n\nlet mTarget=0,\nmCurrent=0,\nmRaf=0;\n\n\nfunction computeProgress(){\n\nconst rect =\nscene.getBoundingClientRect();\n\nconst sticky =\nscene.querySelector(\n'.omn-sticky'\n);\n\nconst maxScroll =\nMath.max(\nscene.offsetHeight -\n(\nsticky\n? sticky.offsetHeight\n: document.documentElement.clientHeight\n),\n1\n);\n\nreturn Math.max(\n0,\nMath.min(\n1,\n-rect.top\/maxScroll\n)\n);\n\n}\n\n\nfunction applyProgress(progress){\n\nconst tintValue =\nlerp(\n.08,\n.75,\nease(\nclamp(\n(progress-.12)\/.88\n)\n)\n);\n\n\nif(tint){\n\ntint.style.opacity =\ntintValue.toFixed(3);\n\n}\n\n\nif(image){\n\nimage.style.opacity='1';\n\n}\n\n\nconst textProgress =\nMath.max(\n0,\nMath.min(\n1,\n(progress-.115)\/.76\n)\n);\n\n\ngroups.forEach(g=>{\n\nconst local =\nclamp(\n(textProgress-g.start) \/\n(g.end-g.start)\n);\n\nconst count =\nMath.max(\n1,\ng.words.length-1\n);\n\n\ng.words.forEach(\n(word,i)=>{\n\nconst p =\nclamp(\n(\nlocal -\n(i\/count)*.82\n)\/.18\n);\n\n\nconst v =\n1-Math.pow(\n1-p,\n3\n);\n\n\nword.style.opacity =\nv.toFixed(3);\n\n\nword.style.transform =\n'translate3d(0,' +\n(\n(1-v)*.7\n).toFixed(3) +\n'em,0)';\n\n\nword.style.filter =\n'blur(' +\n(\n(1-v)*5\n).toFixed(2) +\n'px)';\n\n});\n\n});\n\n}\n\n\nfunction renderMobile(){\n\nif(reduced.matches){\n\nmCurrent = mTarget;\n\napplyProgress(mCurrent);\n\nmRaf=0;\n\nreturn;\n\n}\n\n\nmCurrent =\nlerp(\nmCurrent,\nmTarget,\n.12\n);\n\n\napplyProgress(mCurrent);\n\n\nif(\nMath.abs(\nmTarget-mCurrent\n)>.0008\n){\n\nmRaf =\nrequestAnimationFrame(\nrenderMobile\n);\n\n}else{\n\nmCurrent=mTarget;\n\napplyProgress(mCurrent);\n\nmRaf=0;\n\n}\n\n}\n\n\nfunction onScrollOrResize(){\n\nmTarget = computeProgress();\n\n\nif(!mRaf){\n\nmRaf =\nrequestAnimationFrame(\nrenderMobile\n);\n\n}\n\n}\n\n\nwindow.addEventListener(\n'scroll',\nonScrollOrResize,\n{passive:true}\n);\n\n\nwindow.addEventListener(\n'resize',\nonScrollOrResize,\n{passive:true}\n);\n\n\nmTarget = computeProgress();\n\nmCurrent = mTarget;\n\napplyProgress(mCurrent);\n\nreturn;\n\n}\n\n\nlet target=0,\ncurrent=0,\nraf=0,\nticking=false;\n\n\nfunction update(){\n\nconst rect =\nscene.getBoundingClientRect();\n\nconst maxScroll =\nMath.max(\nscene.offsetHeight -\nwindow.innerHeight,\n1\n);\n\n\ntarget =\nclamp(\n-rect.top\/maxScroll\n);\n\n\nif(!raf){\n\nraf =\nrequestAnimationFrame(\nrender\n);\n\n}\n\n}\n\n\nfunction render(){\n\nif(reduced.matches){\n\nraf=0;\n\nreturn;\n\n}\n\n\ncurrent =\nlerp(\ncurrent,\ntarget,\n.075\n);\n\n\nconst pan =\nease(\nclamp(\ncurrent\/.29\n)\n);\n\n\nif(image){\n\nimage.style.objectPosition =\n'50% ' +\nlerp(\n0,\n100,\npan\n).toFixed(3) +\n'%';\n\n\nimage.style.transform =\n'translate3d(0,0,0) scale(' +\nlerp(\n1.075,\n1.015,\npan\n).toFixed(4) +\n')';\n\n}\n\n\nif(tint){\n\ntint.style.opacity =\nlerp(\n.08,\n.75,\nease(\nclamp(\n(current-.12)\/.88\n)\n)\n).toFixed(3);\n\n}\n\n\ngroups.forEach(g=>{\n\nconst local =\nclamp(\n(current-g.start) \/\n(g.end-g.start)\n);\n\n\nconst count =\nMath.max(\n1,\ng.words.length-1\n);\n\n\ng.words.forEach(\n(word,i)=>{\n\nconst p =\nclamp(\n(\nlocal -\n(i\/count)*.82\n)\/.18\n);\n\n\nconst v =\n1-Math.pow(\n1-p,\n3\n);\n\n\nword.style.opacity =\nv.toFixed(3);\n\n\nword.style.transform =\n'translate3d(0,' +\n(\n(1-v)*.7\n).toFixed(3) +\n'em,0)';\n\n\nword.style.filter =\n'blur(' +\n(\n(1-v)*5\n).toFixed(2) +\n'px)';\n\n});\n\n});\n\n\nif(\nMath.abs(\ntarget-current\n)>.0005\n){\n\nraf =\nrequestAnimationFrame(\nrender\n);\n\n}else{\n\ncurrent=target;\n\nraf=0;\n\n}\n\n}\n\n\nfunction scrollHandler(){\n\nif(ticking)return;\n\nticking=true;\n\nrequestAnimationFrame(\n()=>{\n\nupdate();\n\nticking=false;\n\n}\n);\n\n}\n\n\nwindow.addEventListener(\n'scroll',\nscrollHandler,\n{passive:true}\n);\n\n\nwindow.addEventListener(\n'resize',\nupdate,\n{passive:true}\n);\n\n\nupdate();\n\n})();\n\n<\/script>\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ca68fca e-con-full e-flex e-con e-child\" data-id=\"ca68fca\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3085b4a elementor-widget elementor-widget-html\" data-id=\"3085b4a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\n\/* =========================================================\n   MATRIS CLIENTS \u2014 FULLY ISOLATED\n========================================================= *\/\n\n#mx16-matris-clients,\n#mx16-matris-clients *,\n#mx16-matris-clients *::before,\n#mx16-matris-clients *::after{\n  box-sizing:border-box;\n}\n\n#mx16-matris-clients{\n  --mx-bg:#00062c;\n  --mx-pink:#eb008b;\n  --mx-white:#ffffff;\n  --mx-muted:rgba(255,255,255,.64);\n\n  position:relative;\n  width:100%;\n  height:100vh;\n  min-height:100vh;\n\n  margin:0;\n  padding:0;\n\n  background:var(--mx-bg);\n  color:var(--mx-white);\n\n  font-family:'IranYekanX',sans-serif;\n\n  direction:rtl;\n  text-align:center;\n\n  isolation:isolate;\n  overflow:hidden;\n\n  display:flex;\n  align-items:center;\n  justify-content:center;\n}\n\n\n\/* =========================================================\n   INNER\n========================================================= *\/\n\n#mx16-matris-clients .mx16-clients-inner{\n  position:relative;\n  width:100%;\n  max-width:none;\n\n  margin:0 auto;\n  padding:0 8vw;\n\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  justify-content:center;\n}\n\n\n\/* =========================================================\n   TITLE\n========================================================= *\/\n\n#mx16-matris-clients .mx16-clients-title{\n  position:relative;\n\n  margin:0 0 clamp(16px,1.5vw,24px);\n  padding:0;\n\n  color:var(--mx-pink);\n\n  font-family:'IranYekanX',sans-serif;\n\n  font-size:clamp(22px,2.35vw,40px);\n  font-weight:500;\n\n  line-height:1.5;\n  letter-spacing:-.035em;\n\n  white-space:normal;\n}\n\n\n\/* =========================================================\n   TITLE LINES\n========================================================= *\/\n\n#mx16-matris-clients .mx16-clients-title::before,\n#mx16-matris-clients .mx16-clients-title::after{\n\n  content:\"\";\n\n  position:absolute;\n\n  top:50%;\n\n  width:clamp(25px,4vw,85px);\n  height:1px;\n\n  background:rgba(235,0,139,.55);\n\n  transform:translateY(-50%);\n}\n\n#mx16-matris-clients .mx16-clients-title::before{\n  right:calc(100% + clamp(12px,1.8vw,30px));\n}\n\n#mx16-matris-clients .mx16-clients-title::after{\n  left:calc(100% + clamp(12px,1.8vw,30px));\n}\n\n\n\/* =========================================================\n   DESCRIPTION\n========================================================= *\/\n\n#mx16-matris-clients .mx16-clients-description{\n\n  width:min(780px,92%);\n\n  margin:0 auto clamp(58px,6vw,92px);\n\n  padding:0;\n\n  color:var(--mx-muted);\n\n  font-family:'IranYekanX',sans-serif;\n\n  font-size:clamp(14px,1.2vw,18px);\n\n  font-weight:400;\n\n  line-height:2.15;\n\n  letter-spacing:-.012em;\n}\n\n\n\/* =========================================================\n   LOGO WINDOW\n========================================================= *\/\n\n#mx16-matris-clients .mx16-logo-window{\n\n  position:relative;\n\n  width:100%;\n\n  overflow:hidden;\n\n  direction:ltr;\n\n  isolation:isolate;\n\n  -webkit-mask-image:linear-gradient(\n    to right,\n    transparent 0%,\n    black 7%,\n    black 93%,\n    transparent 100%\n  );\n\n  mask-image:linear-gradient(\n    to right,\n    transparent 0%,\n    black 7%,\n    black 93%,\n    transparent 100%\n  );\n}\n\n\n\/* =========================================================\n   LOGO TRACK\n   \u0644\u0648\u06af\u0648 \u06f2 \u0628\u0631\u0627\u0628\u0631\n   \u0641\u0627\u0635\u0644\u0647 \u0646\u0635\u0641\n   \u062d\u0631\u06a9\u062a \u0622\u0647\u0633\u062a\u0647\n========================================================= *\/\n\n#mx16-matris-clients .mx16-logo-track{\n\n  display:flex;\n  align-items:center;\n\n  width:max-content;\n\n  gap:0;\n\n  \/* \u0644\u0648\u06af\u0648\u0647\u0627 \u0639\u0645\u062f\u0627\u064b \u0646\u0632\u062f\u06cc\u06a9 \u0648 \u06a9\u0645\u06cc overlap \u0645\u06cc\u200c\u0634\u0648\u0646\u062f *\/\n\n  padding:0 clamp(35px,5vw,90px);\n\n  animation:mx16MatrisLogoScroll 65s linear infinite;\n\n  will-change:transform;\n}\n\n\n\/* =========================================================\n   LOGO ITEM\n========================================================= *\/\n\n#mx16-matris-clients .mx16-logo-item{\n\n  position:relative;\n\n  flex:0 0 auto;\n\n  width:440px;\n  height:144px;\n\n  display:flex;\n\n  align-items:center;\n  justify-content:center;\n\n  overflow:visible;\n\n  margin-right:-120px;\n}\n\n\n\/* =========================================================\n   LOGOS\n========================================================= *\/\n\n#mx16-matris-clients .mx16-client-logo{\n\n  display:block;\n\n  flex:none;\n\n  width:440px;\n  height:144px;\n\n  max-width:440px;\n  max-height:144px;\n\n  object-fit:contain;\n  object-position:center;\n\n  filter:\n    grayscale(100%)\n    brightness(0)\n    invert(1);\n\n  opacity:.55;\n\n  transition:\n    opacity .4s ease,\n    transform .4s ease;\n\n  transform-origin:center;\n}\n\n\n\/* =========================================================\n   HOVER\n========================================================= *\/\n\n#mx16-matris-clients .mx16-logo-item:hover .mx16-client-logo{\n  opacity:1;\n  transform:scale(1.07);\n}\n\n\n\/* =========================================================\n   INFINITE LOOP\n========================================================= *\/\n\n@keyframes mx16MatrisLogoScroll{\n\n  from{\n    transform:translate3d(0,0,0);\n  }\n\n  to{\n    transform:translate3d(-50%,0,0);\n  }\n\n}\n\n\n\/* =========================================================\n   LARGE DESKTOP\n========================================================= *\/\n\n@media (min-width:1440px){\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:8vw;\n    padding-right:8vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n    font-size:40px;\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n    font-size:18px;\n    margin-bottom:90px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n    gap:0;\n    animation-duration:65s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:440px;\n    height:144px;\n    margin-right:-120px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n    width:440px;\n    height:144px;\n    max-width:440px;\n    max-height:144px;\n  }\n\n}\n\n\n\/* =========================================================\n   STANDARD DESKTOP\n========================================================= *\/\n\n@media (min-width:1025px) and (max-width:1439px){\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:8vw;\n    padding-right:8vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n    font-size:clamp(28px,2.5vw,36px);\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n    font-size:16px;\n    margin-bottom:72px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n    gap:0;\n    animation-duration:62s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:400px;\n    height:132px;\n    margin-right:-105px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n    width:400px;\n    height:132px;\n    max-width:400px;\n    max-height:132px;\n  }\n\n}\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (min-width:769px) and (max-width:1024px){\n\n  #mx16-matris-clients{\n    height:100vh;\n    min-height:100vh;\n  }\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:4vw;\n    padding-right:4vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n    font-size:clamp(25px,3.5vw,34px);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before,\n  #mx16-matris-clients .mx16-clients-title::after{\n    display:block;\n    width:42px;\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n    width:78%;\n    font-size:15px;\n    line-height:2.15;\n    margin-bottom:65px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n    gap:0;\n    animation-duration:55s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:320px;\n    height:104px;\n    margin-right:-90px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n    width:320px;\n    height:104px;\n    max-width:320px;\n    max-height:104px;\n  }\n\n}\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (min-width:481px) and (max-width:768px){\n\n  #mx16-matris-clients{\n    height:100vh;\n    min-height:100vh;\n  }\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:4vw;\n    padding-right:4vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n\n    font-size:15px;\n\n    line-height:1.8;\n\n    margin-bottom:16px;\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before,\n  #mx16-matris-clients .mx16-clients-title::after{\n\n    display:block;\n\n    width:28px;\n\n    background:rgba(235,0,139,.6);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before{\n    right:calc(100% + 12px);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::after{\n    left:calc(100% + 12px);\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n\n    width:91%;\n\n    font-size:14px;\n\n    line-height:2.15;\n\n    margin-bottom:54px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n\n    gap:0;\n\n    padding:0 30px;\n\n    animation-duration:48s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:260px;\n    height:86px;\n    margin-right:-75px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n\n    width:260px;\n    height:86px;\n\n    max-width:260px;\n    max-height:86px;\n  }\n\n}\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n\n@media (max-width:480px){\n\n  #mx16-matris-clients{\n    height:100vh;\n    min-height:100vh;\n  }\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:4vw;\n    padding-right:4vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n\n    font-size:18px;\n\n    line-height:1.65;\n\n    margin-bottom:14px;\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before,\n  #mx16-matris-clients .mx16-clients-title::after{\n\n    display:block;\n\n    width:20px;\n\n    background:rgba(235,0,139,.6);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before{\n    right:calc(100% + 9px);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::after{\n    left:calc(100% + 9px);\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n\n    width:94%;\n\n    font-size:13px;\n\n    line-height:2.15;\n\n    margin-bottom:46px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n\n    gap:0;\n\n    padding:0 25px;\n\n    animation-duration:44s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:230px;\n    height:76px;\n    margin-right:-65px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n\n    width:230px;\n    height:76px;\n\n    max-width:230px;\n    max-height:76px;\n  }\n\n}\n\n\n\/* =========================================================\n   VERY SMALL\n========================================================= *\/\n\n@media (max-width:360px){\n\n  #mx16-matris-clients .mx16-clients-inner{\n    padding-left:4vw;\n    padding-right:4vw;\n  }\n\n  #mx16-matris-clients .mx16-clients-title{\n    font-size:15px;\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before,\n  #mx16-matris-clients .mx16-clients-title::after{\n    width:16px;\n  }\n\n  #mx16-matris-clients .mx16-clients-title::before{\n    right:calc(100% + 7px);\n  }\n\n  #mx16-matris-clients .mx16-clients-title::after{\n    left:calc(100% + 7px);\n  }\n\n  #mx16-matris-clients .mx16-clients-description{\n    font-size:12px;\n    margin-bottom:40px;\n  }\n\n  #mx16-matris-clients .mx16-logo-track{\n    gap:0;\n    animation-duration:40s;\n  }\n\n  #mx16-matris-clients .mx16-logo-item{\n    width:200px;\n    height:66px;\n    margin-right:-55px;\n  }\n\n  #mx16-matris-clients .mx16-client-logo{\n    width:200px;\n    height:66px;\n    max-width:200px;\n    max-height:66px;\n  }\n\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion:reduce){\n\n  #mx16-matris-clients .mx16-logo-track{\n    animation:none;\n  }\n\n}\n\n<\/style>\n\n\n<section id=\"mx16-matris-clients\">\n\n  <div class=\"mx16-clients-inner\">\n\n\n    <!-- TITLE -->\n\n    <h2 class=\"mx16-clients-title\">\n      \u06af\u0644\u0686\u06cc\u0646\u06cc \u0627\u0632 \u0628\u0632\u0631\u06af\u200c\u062a\u0631\u06cc\u0646 \u0647\u0645\u0631\u0627\u0647\u0627\u0646 \u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633\n    <\/h2>\n\n\n    <!-- DESCRIPTION -->\n\n    <p class=\"mx16-clients-description\">\n      \u0628\u0631\u0646\u062f\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u062f\u0631 \u0645\u0633\u06cc\u0631 \u062e\u0644\u0642\u060c \u062a\u0648\u0633\u0639\u0647 \u0648 \u0627\u062c\u0631\u0627\u06cc \u0627\u06cc\u062f\u0647\u200c\u0647\u0627\u06cc \u0645\u062a\u0645\u0627\u06cc\u0632\u060c\n      \u0628\u0647 \u062a\u062c\u0631\u0628\u0647\u060c \u062a\u062e\u0635\u0635 \u0648 \u062a\u0648\u0627\u0646\u0627\u06cc\u06cc \u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633 \u0627\u0639\u062a\u0645\u0627\u062f \u06a9\u0631\u062f\u0647\u200c\u0627\u0646\u062f\u061b\n      \u0647\u0645\u0631\u0627\u0647\u0627\u0646\u06cc \u06a9\u0647 \u0647\u0631 \u067e\u0631\u0648\u0698\u0647 \u0628\u0627 \u0622\u0646\u200c\u0647\u0627 \u0641\u0631\u0635\u062a\u06cc \u0628\u0631\u0627\u06cc \u062e\u0644\u0642 \u0627\u0631\u0632\u0634\u060c\n      \u0633\u0627\u062e\u062a \u062a\u062c\u0631\u0628\u0647\u200c\u0627\u06cc \u0645\u062a\u0641\u0627\u0648\u062a \u0648 \u0634\u06a9\u0644\u200c\u062f\u0627\u062f\u0646 \u0628\u0647 \u06cc\u06a9 \u0647\u0648\u06cc\u062a \u0645\u0627\u0646\u062f\u06af\u0627\u0631 \u0628\u0648\u062f\u0647 \u0627\u0633\u062a.\n    <\/p>\n\n\n    <!-- LOGOS -->\n\n    <div class=\"mx16-logo-window\">\n\n      <div class=\"mx16-logo-track\">\n\n\n        <!-- =================================================\n             LOGO SET 1\n        ================================================== -->\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_29_42-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 01\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_27_01-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 02\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_21_12-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 03\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_17_23-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 04\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_53_58-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 05\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_55_35-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 06\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_52_06-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 07\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_57_36-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 08\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_44_39-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 09\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_31_03-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 10\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_46_39-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 11\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_38_02-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 12\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_43_02-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 13\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_07_53-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 14\"\n          >\n        <\/div>\n\n\n        <!-- =================================================\n             LOGO SET 2\n             DUPLICATE FOR INFINITE LOOP\n        ================================================== -->\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_29_42-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 01\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_27_01-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 02\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_21_12-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 03\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_17_23-PM-1.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 04\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_53_58-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 05\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_55_35-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 06\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_52_06-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 07\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_57_36-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 08\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_44_39-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 09\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_31_03-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 10\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_46_39-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 11\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_38_02-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 12\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_43_02-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 13\"\n          >\n        <\/div>\n\n        <div class=\"mx16-logo-item\">\n          <img decoding=\"async\"\n            src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-16-2026-03_07_53-PM.svg\"\n            class=\"mx16-client-logo\"\n            alt=\"Client Logo 14\"\n          >\n        <\/div>\n\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f430ed3 e-con-full e-flex e-con e-parent\" data-id=\"f430ed3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dc62965 elementor-widget elementor-widget-html\" data-id=\"dc62965\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\n\/* =========================================================\n   ABSOLUTE ISOLATION\n========================================================= *\/\n#mx16-matris-selected-works,\n#mx16-matris-selected-works *,\n#mx16-matris-selected-works *::before,\n#mx16-matris-selected-works *::after {\n  box-sizing: border-box;\n}\n\n#mx16-matris-selected-works {\n  position: relative;\n  display: block;\n  width: 100%;\n  max-width: 100%;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  outline: 0;\n\n  font-family: IranYekanX !important;\n\n  isolation: isolate;\n}\n\n\n\/* =========================================================\n   MAIN\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw {\n  position: relative;\n  display: block;\n\n  width: 100%;\n  max-width: 100%;\n\n  min-height: 270vh;\n\n  margin: 0;\n  padding: 0;\n\n  background: #ffffff;\n  color: #30302e;\n\n  isolation: isolate;\n}\n\n\n\/* =========================================================\n   BACKDROP\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__backdrop {\n  position: sticky;\n  top: 0;\n  z-index: 0;\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  width: 100%;\n  height: 100vh;\n  height: 100svh;\n\n  margin: 0;\n  padding: 0;\n\n  overflow: hidden;\n  pointer-events: none;\n}\n\n#mx16-matris-selected-works .revana-sw__title {\n  display: block;\n\n  width: 100%;\n  min-width: 0;\n\n  margin: 0;\n  padding: 0;\n\n  text-align: center;\n  white-space: nowrap;\n\n  color: #d2d2d2 !important;\n\n  font-family: IranYekanX !important;\n  font-size: clamp(5.25rem, 16vw, 19rem);\n  font-weight: 800;\n\n  line-height: .8;\n  letter-spacing: -.095em;\n\n  will-change: transform, opacity;\n}\n\n\n\/* =========================================================\n   CARDS AREA\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__cards {\n  position: relative;\n  z-index: 2;\n\n  width: 100%;\n  max-width: 100%;\n\n  margin-top: -95vh;\n  margin-top: -95svh;\n\n  padding-top: clamp(9rem, 15vh, 12rem);\n  padding-right: 8vw;\n  padding-left: 8vw;\n  padding-bottom: clamp(5rem, 18vh, 12rem);\n}\n\n\n\/* =========================================================\n   CARD SHELL\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__card-shell {\n  position: relative;\n\n  width: min(53vw, 1080px);\n  max-width: 100%;\n\n  margin-top: var(\n    --card-gap,\n    clamp(1.5rem, 5vh, 3.5rem)\n  );\n\n  will-change: transform;\n}\n\n#mx16-matris-selected-works .revana-sw__card-shell:first-child {\n  margin-top: 0;\n}\n\n#mx16-matris-selected-works .revana-sw__card-shell--left {\n  margin-right: auto;\n  margin-left: 0;\n}\n\n#mx16-matris-selected-works .revana-sw__card-shell--right {\n  margin-right: 0;\n  margin-left: auto;\n}\n\n\n\/* =========================================================\n   CARD\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__card {\n  display: block;\n\n  width: 100%;\n  max-width: 100%;\n\n  margin: 0;\n  padding: clamp(.85rem, 1.4vw, 1.5rem);\n\n  background: #ffffff;\n  color: inherit;\n\n  text-decoration: none;\n\n  box-shadow: 0 28px 70px rgba(31, 31, 31, .13);\n\n  transform-origin: center center;\n\n  will-change: transform;\n}\n\n\n\/* =========================================================\n   IMAGE\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__image-clip {\n  position: relative;\n\n  width: 100%;\n  aspect-ratio: 16 \/ 9;\n\n  margin: 0;\n  padding: 0;\n\n  overflow: hidden;\n\n  background: #dedbd3;\n}\n\n#mx16-matris-selected-works .revana-sw__image-zoom,\n#mx16-matris-selected-works .revana-sw__image {\n  width: 100%;\n  height: 100%;\n\n  margin: 0;\n  padding: 0;\n}\n\n#mx16-matris-selected-works .revana-sw__image-zoom {\n  will-change: transform;\n}\n\n#mx16-matris-selected-works .revana-sw__image {\n  display: block;\n\n  object-fit: cover;\n  transform: scale(1.04);\n\n  will-change: transform;\n}\n\n\n\/* =========================================================\n   CARD TEXT\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__meta {\n  width: 100%;\n\n  margin: 0;\n  padding-top: clamp(1rem, 1.65vw, 1.45rem);\n}\n\n#mx16-matris-selected-works .revana-sw__name {\n  margin: 0;\n\n  color: #2c2c2a;\n\n  font-family: IranYekanX !important;\n  font-size: clamp(1rem, 1.1vw, 1.25rem);\n  font-weight: 700;\n\n  line-height: 1.15;\n  letter-spacing: -.035em;\n\n  direction: rtl;\n  text-align: right;\n}\n\n#mx16-matris-selected-works .revana-sw__desc {\n  margin: clamp(.55rem, .9vw, .8rem) 0 0;\n\n  color: rgba(40, 40, 38, .68);\n\n  font-family: IranYekanX !important;\n  font-size: clamp(.75rem, 1vw, 1rem);\n  font-weight: 400;\n\n  line-height: 1.45;\n  letter-spacing: -.025em;\n\n  direction: rtl;\n  text-align: right;\n}\n\n\n\/* =========================================================\n   INTRO\n========================================================= *\/\n#mx16-matris-selected-works .revana-sw__intro {\n  position: absolute;\n\n  top: clamp(1.25rem, 3vw, 2.5rem);\n  right: 8vw;\n  left: 8vw;\n\n  z-index: 4;\n\n  width: auto;\n\n  margin: 0;\n  padding: 0;\n\n  text-align: right;\n  direction: rtl;\n}\n\n#mx16-matris-selected-works .revana-sw__eyebrow {\n  margin: 0 0 .8rem;\n\n  color: #eb008b;\n\n  font-family: IranYekanX !important;\n  font-size: 20px;\n  font-weight: 700;\n\n  line-height: 1.4;\n  letter-spacing: 0;\n\n  direction: rtl;\n  text-align: right;\n}\n\n#mx16-matris-selected-works .revana-sw__heading {\n  margin: 0;\n\n  color: #001489;\n\n  font-family: IranYekanX !important;\n  font-size: 23px;\n  font-weight: 800;\n\n  line-height: 1.35;\n  letter-spacing: -.02em;\n\n  direction: rtl;\n  text-align: right;\n}\n\n#mx16-matris-selected-works .revana-sw__intro-desc {\n  width: 100%;\n  max-width: none;\n\n  margin: .9rem 0 0;\n\n  color: #777777;\n\n  font-family: IranYekanX !important;\n  font-size: 16px;\n  font-weight: 400;\n\n  line-height: 1.9;\n  letter-spacing: 0;\n\n  direction: rtl;\n  text-align: justify;\n}\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n@media (max-width: 767px) {\n\n  #mx16-matris-selected-works {\n    overflow: clip;\n  }\n\n  #mx16-matris-selected-works .revana-sw {\n    min-height: 390vh;\n  }\n\n\n  \/* =======================================================\n     MOBILE BACKDROP\n  ======================================================= *\/\n  #mx16-matris-selected-works .revana-sw__backdrop {\n    align-items: center;\n    justify-content: center;\n\n    height: 100vh;\n    height: 100svh;\n\n    min-height: 100svh;\n  }\n\n  #mx16-matris-selected-works .revana-sw__title {\n    width: 100%;\n    min-width: 0;\n\n    margin: 0;\n    padding: 0 4vw;\n\n    color: #d2d2d2 !important;\n\n    font-family: IranYekanX !important;\n    font-size: clamp(\n      4.8rem,\n      24vw,\n      7.8rem\n    );\n\n    font-weight: 900 !important;\n\n    line-height: .86;\n    letter-spacing: -.085em;\n\n    white-space: normal;\n    transform: none;\n\n    -webkit-text-stroke: .35px #d2d2d2;\n  }\n\n\n  \/* =======================================================\n     CARDS MOBILE\n  ======================================================= *\/\n  #mx16-matris-selected-works .revana-sw__cards {\n    margin-top: -100vh;\n    margin-top: -100svh;\n\n    padding-top: 35vh;\n\n    padding-right: 4vw;\n    padding-left: 4vw;\n    padding-bottom: 10rem;\n  }\n\n\n  \/* =======================================================\n     INTRO MOBILE\n  ======================================================= *\/\n  #mx16-matris-selected-works .revana-sw__intro {\n    top: 80px;\n\n    right: 4vw;\n    left: 4vw;\n\n    width: auto;\n\n    margin: 0;\n    padding: 0;\n\n    z-index: 10;\n  }\n\n  #mx16-matris-selected-works .revana-sw__eyebrow {\n    margin-bottom: 8px;\n\n    font-size: 12px;\n    font-weight: 800;\n\n    line-height: 1.4;\n  }\n\n  #mx16-matris-selected-works .revana-sw__heading {\n    font-size: 21px;\n    font-weight: 800;\n\n    line-height: 1.4;\n  }\n\n  #mx16-matris-selected-works .revana-sw__intro-desc {\n    margin-top: 10px;\n\n    color: #777777;\n\n    font-size: 13px;\n    font-weight: 400;\n\n    line-height: 1.85;\n\n    text-align: justify;\n  }\n\n\n  \/* =======================================================\n     MOBILE CARD SIZE\n  ======================================================= *\/\n  #mx16-matris-selected-works .revana-sw__card-shell {\n    width: min(68vw, 330px);\n\n    margin-top: var(\n      --card-gap-mobile,\n      2.4rem\n    );\n  }\n\n  #mx16-matris-selected-works .revana-sw__card-shell:first-child {\n    margin-top: 0;\n  }\n\n  #mx16-matris-selected-works .revana-sw__card-shell--left {\n    margin-left: 0;\n    margin-right: auto;\n  }\n\n  #mx16-matris-selected-works .revana-sw__card-shell--right {\n    margin-left: auto;\n    margin-right: 0;\n  }\n\n  #mx16-matris-selected-works .revana-sw__card {\n    padding: .7rem;\n  }\n\n  #mx16-matris-selected-works .revana-sw__name {\n    font-size: clamp(\n      .9rem,\n      3.8vw,\n      1.15rem\n    );\n\n    font-weight: 700;\n    line-height: 1.3;\n\n    direction: rtl;\n    text-align: right;\n  }\n\n  #mx16-matris-selected-works .revana-sw__desc {\n    font-size: 15px;\n    line-height: 1.65;\n\n    direction: rtl;\n    text-align: right;\n  }\n}\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n@media (max-width: 380px) {\n\n  #mx16-matris-selected-works .revana-sw__intro {\n    top: 80px;\n    right: 4vw;\n    left: 4vw;\n  }\n\n  #mx16-matris-selected-works .revana-sw__eyebrow {\n    font-size: 15px;\n  }\n\n  #mx16-matris-selected-works .revana-sw__heading {\n    font-size: 17px;\n  }\n\n  #mx16-matris-selected-works .revana-sw__intro-desc {\n    font-size: 13px;\n  }\n\n  #mx16-matris-selected-works .revana-sw__name {\n    font-size: 12px;\n  }\n\n  #mx16-matris-selected-works .revana-sw__desc {\n    font-size: 15px;\n    line-height: 1.65;\n  }\n}\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n@media (prefers-reduced-motion: reduce) {\n\n  #mx16-matris-selected-works .revana-sw *,\n  #mx16-matris-selected-works .revana-sw *::before,\n  #mx16-matris-selected-works .revana-sw *::after {\n\n    transition-duration: .001ms !important;\n    animation-duration: .001ms !important;\n    animation-iteration-count: 1 !important;\n  }\n}\n\n<\/style>\n\n\n<section\n  class=\"revana-sw\"\n  data-revana-selected-works\n  aria-label=\"Selected works\"\n  id=\"mx16-matris-selected-works\"\n>\n\n\n  <!-- BACKDROP -->\n  <div\n    class=\"revana-sw__backdrop\"\n    aria-hidden=\"true\"\n  >\n\n    <h2 class=\"revana-sw__title\">\n      MATRIS ART\n    <\/h2>\n\n  <\/div>\n\n\n  <!-- INTRO -->\n  <div class=\"revana-sw__intro\">\n\n    <p class=\"revana-sw__eyebrow\">\n      \u0628\u0631\u06af\u0632\u06cc\u062f\u0647 \u0647\u0627\u06cc \u06af\u0631\u0648\u0647 \u0645\u0627\u062a\u0631\u06cc\u0633\n    <\/p>\n\n    <h2 class=\"revana-sw__heading\">\n      \u0645\u062c\u0645\u0648\u0639\u0647\u200c\u0627\u06cc \u0627\u0632 \u062a\u062c\u0631\u0628\u0647\u200c\u0647\u0627\u06cc \u0645\u062a\u0645\u0627\u06cc\u0632 \u062f\u0631 \u0637\u0631\u0627\u062d\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\n    <\/h2>\n\n    <p class=\"revana-sw__intro-desc\">\n      \u0645\u062c\u0645\u0648\u0639\u0647\u200c\u0627\u06cc \u0627\u0632 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u200c\u0647\u0627\u06cc \u0645\u062a\u0645\u0627\u06cc\u0632 \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0637\u0631\u0627\u062d\u06cc\u060c \u0645\u062a\u0631\u06cc\u0627\u0644 \u0648 \u0686\u0627\u067e \u062f\u0631 \u06a9\u0646\u0627\u0631 \u0647\u0645\u060c \u062a\u0635\u0648\u06cc\u0631\u06cc \u0645\u062a\u0641\u0627\u0648\u062a \u0627\u0632 \u0628\u0631\u0646\u062f \u0645\u06cc\u200c\u0633\u0627\u0632\u0646\u062f.\n    <\/p>\n\n  <\/div>\n\n\n  <!-- CARDS -->\n  <div class=\"revana-sw__cards\">\n\n\n    <!-- CARD 1 -->\n    <div\n      class=\"revana-sw__card-shell revana-sw__card-shell--left\"\n      data-float=\"185\"\n    >\n\n      <a\n        class=\"revana-sw__card\"\n        href=\"#willow-house\"\n        aria-label=\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\"\n      >\n\n        <div class=\"revana-sw__image-clip\">\n\n          <div class=\"revana-sw__image-zoom\">\n\n            <img\n              class=\"revana-sw__image\"\n              src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/hf_20260923_104033_e3d8a7b1-e2ed-43c7-98a1-92c6960d54e3-scaled-1.webp\"\n              alt=\"\u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\"\n              loading=\"eager\"\n              decoding=\"async\"\n            >\n\n          <\/div>\n\n        <\/div>\n\n        <div class=\"revana-sw__meta\">\n\n          <h3 class=\"revana-sw__name\">\n            \u062c\u0639\u0628\u0647 \u0645\u0642\u0648\u0627\u06cc\u06cc\n          <\/h3>\n\n          <p class=\"revana-sw__desc\">\n            \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u200c\u0627\u06cc \u0645\u062a\u0645\u0627\u06cc\u0632 \u06a9\u0647 \u062a\u0644\u0641\u06cc\u0642\u06cc \u0627\u0632 \u0637\u0631\u0627\u062d\u06cc \u062e\u0644\u0627\u0642\u0627\u0646\u0647\u060c \u06a9\u06cc\u0641\u06cc\u062a \u0633\u0627\u062e\u062a \u0648 \u0647\u0648\u06cc\u062a \u0628\u0635\u0631\u06cc \u0642\u062f\u0631\u062a\u0645\u0646\u062f \u0627\u0633\u062a\u061b \u0645\u062d\u0635\u0648\u0644\u06cc \u06a9\u0647 \u062f\u0631 \u0686\u0646\u062f \u062f\u0648\u0631\u0647\u060c \u0639\u0646\u0648\u0627\u0646 \u0628\u0647\u062a\u0631\u06cc\u0646 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0631\u0627 \u0627\u0632 \u0622\u0646 \u062e\u0648\u062f \u06a9\u0631\u062f\u0647 \u0648 \u0646\u0645\u0648\u0646\u0647\u200c\u0627\u06cc \u0634\u0627\u062e\u0635 \u0627\u0632 \u0646\u0642\u0634 \u0637\u0631\u0627\u062d\u06cc \u0648 \u0686\u0627\u067e \u062f\u0631 \u0627\u0631\u0632\u0634\u200c\u0622\u0641\u0631\u06cc\u0646\u06cc \u0628\u0631\u0627\u06cc \u0645\u062d\u0635\u0648\u0644 \u0627\u0633\u062a.\n          <\/p>\n\n        <\/div>\n\n      <\/a>\n\n    <\/div>\n\n\n    <!-- CARD 2 -->\n    <div\n      class=\"revana-sw__card-shell revana-sw__card-shell--right\"\n      style=\"--card-gap:clamp(1.25rem,3.5vh,2.5rem);\"\n      data-float=\"150\"\n    >\n\n      <a\n        class=\"revana-sw__card\"\n        href=\"#terra-garden\"\n        aria-label=\"IML\"\n      >\n\n        <div class=\"revana-sw__image-clip\">\n\n          <div class=\"revana-sw__image-zoom\">\n\n            <img\n              class=\"revana-sw__image\"\n              src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-12_51_49-PM.webp\"\n              alt=\"IML\"\n              loading=\"lazy\"\n              decoding=\"async\"\n            >\n\n          <\/div>\n\n        <\/div>\n\n        <div class=\"revana-sw__meta\">\n\n          <h3 class=\"revana-sw__name\">\n            IML\n          <\/h3>\n\n          <p class=\"revana-sw__desc\">\n            \u062a\u0631\u06a9\u06cc\u0628 \u0647\u0648\u0634\u0645\u0646\u062f\u0627\u0646\u0647 \u0637\u0631\u0627\u062d\u06cc \u0648 \u0644\u06cc\u0628\u0644\u200c\u06af\u0630\u0627\u0631\u06cc \u062f\u0631\u0648\u0646 \u0642\u0627\u0644\u0628 \u06a9\u0647 \u0628\u0627 \u0627\u06cc\u062c\u0627\u062f \u0633\u0637\u062d\u06cc \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u0648 \u0686\u0634\u0645\u200c\u0646\u0648\u0627\u0632\u060c \u062c\u0644\u0648\u0647 \u0645\u062d\u0635\u0648\u0644 \u0631\u0627 \u062f\u0631 \u0642\u0641\u0633\u0647 \u062a\u0642\u0648\u06cc\u062a \u0645\u06cc\u200c\u06a9\u0646\u062f\u061b \u0686\u0627\u067e \u0628\u0627\u06a9\u06cc\u0641\u06cc\u062a\u060c \u0631\u0646\u06af\u200c\u0647\u0627\u06cc \u0632\u0646\u062f\u0647 \u0648 \u062c\u0632\u0626\u06cc\u0627\u062a \u062f\u0642\u06cc\u0642\u060c \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0631\u0627 \u0628\u0647 \u0639\u0646\u0635\u0631\u06cc \u062c\u0630\u0627\u0628 \u0648 \u0645\u062a\u0645\u0627\u06cc\u0632 \u0628\u0631\u0627\u06cc \u062c\u0644\u0628 \u062a\u0648\u062c\u0647 \u0645\u062e\u0627\u0637\u0628 \u062a\u0628\u062f\u06cc\u0644 \u0645\u06cc\u200c\u06a9\u0646\u062f.\n          <\/p>\n\n        <\/div>\n\n      <\/a>\n\n    <\/div>\n\n\n    <!-- CARD 3 -->\n    <div\n      class=\"revana-sw__card-shell revana-sw__card-shell--left\"\n      data-float=\"170\"\n    >\n\n      <a\n        class=\"revana-sw__card\"\n        href=\"#loft-line\"\n        aria-label=\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\"\n      >\n\n        <div class=\"revana-sw__image-clip\">\n\n          <div class=\"revana-sw__image-zoom\">\n\n            <img\n              class=\"revana-sw__image\"\n              src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-01_13_07-PM.webp\"\n              alt=\"\u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\"\n              loading=\"lazy\"\n              decoding=\"async\"\n            >\n\n          <\/div>\n\n        <\/div>\n\n        <div class=\"revana-sw__meta\">\n\n          <h3 class=\"revana-sw__name\">\n            \u06a9\u0627\u0631\u062a\u0646 \u0644\u0645\u06cc\u0646\u062a\u06cc\n          <\/h3>\n\n          <p class=\"revana-sw__desc\">\n            \u0627\u0633\u062a\u062d\u06a9\u0627\u0645 \u0648 \u0645\u0642\u0627\u0648\u0645\u062a \u0645\u0646\u0627\u0633\u0628 \u0628\u0631\u0627\u06cc \u0645\u062d\u0627\u0641\u0638\u062a \u0628\u0647\u062a\u0631 \u0627\u0632 \u0645\u062d\u0635\u0648\u0644\u060c \u062f\u0631 \u06a9\u0646\u0627\u0631 \u0633\u0637\u062d\u06cc \u0628\u0627\u06a9\u06cc\u0641\u06cc\u062a \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u0631\u0646\u06af\u200c\u0647\u0627\u060c \u062a\u0635\u0627\u0648\u06cc\u0631 \u0648 \u062c\u0632\u0626\u06cc\u0627\u062a \u0637\u0631\u0627\u062d\u06cc\u061b \u0627\u0646\u062a\u062e\u0627\u0628\u06cc \u06a9\u0647 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0631\u0627 \u062f\u0631 \u0642\u0641\u0633\u0647 \u0686\u0634\u0645\u06af\u06cc\u0631\u062a\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f \u0648 \u062d\u0636\u0648\u0631 \u0645\u062d\u0635\u0648\u0644 \u0631\u0627 \u067e\u0631\u0631\u0646\u06af\u200c\u062a\u0631 \u0646\u0634\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u062f.\n          <\/p>\n\n        <\/div>\n\n      <\/a>\n\n    <\/div>\n\n\n    <!-- CARD 4 -->\n    <div\n      class=\"revana-sw__card-shell revana-sw__card-shell--right\"\n      data-float=\"190\"\n    >\n\n      <a\n        class=\"revana-sw__card\"\n        href=\"#stonebay-bath\"\n        aria-label=\"\u06a9\u0627\u063a\u0630 \u06af\u0644 \u0648 \u06a9\u0627\u062f\u0648\"\n      >\n\n        <div class=\"revana-sw__image-clip\">\n\n          <div class=\"revana-sw__image-zoom\">\n\n            <img\n              class=\"revana-sw__image\"\n              src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-02_32_41-PM.webp\"\n              alt=\"\u06a9\u0627\u063a\u0630 \u06af\u0644 \u0648 \u06a9\u0627\u062f\u0648\"\n              loading=\"lazy\"\n              decoding=\"async\"\n            >\n\n          <\/div>\n\n        <\/div>\n\n        <div class=\"revana-sw__meta\">\n\n          <h3 class=\"revana-sw__name\">\n            \u06a9\u0627\u063a\u0630 \u06af\u0644 \u0648 \u06a9\u0627\u062f\u0648\n          <\/h3>\n\n          <p class=\"revana-sw__desc\">\n            \u0627\u0646\u062a\u062e\u0627\u0628\u06cc \u0686\u0634\u0645\u200c\u0646\u0648\u0627\u0632 \u0628\u0631\u0627\u06cc \u0646\u062e\u0633\u062a\u06cc\u0646 \u062c\u0644\u0648\u0647 \u0647\u062f\u06cc\u0647\u061b \u0686\u0627\u067e \u062f\u0642\u06cc\u0642\u060c \u0631\u0646\u06af\u200c\u0647\u0627\u06cc \u0632\u0646\u062f\u0647 \u0648 \u0627\u0645\u06a9\u0627\u0646 \u0627\u062c\u0631\u0627\u06cc \u0637\u0631\u062d\u200c\u0647\u0627\u06cc \u0645\u062a\u0646\u0648\u0639\u060c \u0638\u0627\u0647\u0631 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0631\u0627 \u062c\u0630\u0627\u0628\u200c\u062a\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f \u0648 \u0628\u0647 \u0647\u062f\u06cc\u0647 \u0648 \u062f\u0633\u062a\u0647\u200c\u06af\u0644 \u062c\u0644\u0648\u0647\u200c\u0627\u06cc \u0644\u0648\u06a9\u0633 \u0648 \u0628\u0647\u200c\u06cc\u0627\u062f\u0645\u0627\u0646\u062f\u0646\u06cc \u0645\u06cc\u200c\u0628\u062e\u0634\u062f.\n          <\/p>\n\n        <\/div>\n\n      <\/a>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<script>\n(function () {\n\n  'use strict';\n\n\n  \/*\n   * =========================================================\n   * COMPLETELY ISOLATED INITIALIZATION\n   * =========================================================\n   *\/\n\n  function initSelectedWorks() {\n\n    if (\n      !window.gsap ||\n      !window.ScrollTrigger\n    ) {\n      return;\n    }\n\n\n    var section =\n      document.getElementById(\n        'mx16-matris-selected-works'\n      );\n\n    if (!section) {\n      return;\n    }\n\n\n    \/*\n     * \u062c\u0644\u0648\u06af\u06cc\u0631\u06cc \u0627\u0632 \u0627\u062c\u0631\u0627\u06cc \u062f\u0648\u0628\u0627\u0631\u0647\n     *\/\n    if (\n      section.getAttribute(\n        'data-revana-ready'\n      ) === 'true'\n    ) {\n      return;\n    }\n\n    section.setAttribute(\n      'data-revana-ready',\n      'true'\n    );\n\n\n    var reducedMotion =\n      window.matchMedia(\n        '(prefers-reduced-motion: reduce)'\n      ).matches;\n\n\n    var title =\n      section.querySelector(\n        '.revana-sw__title'\n      );\n\n\n    var shells =\n      Array.prototype.slice.call(\n        section.querySelectorAll(\n          '.revana-sw__card-shell'\n        )\n      );\n\n\n    var cards =\n      Array.prototype.slice.call(\n        section.querySelectorAll(\n          '.revana-sw__card'\n        )\n      );\n\n\n    \/*\n     * =======================================================\n     * REDUCED MOTION\n     * \u0641\u0642\u0637 \u0639\u0646\u0627\u0635\u0631 \u0647\u0645\u06cc\u0646 \u0633\u06a9\u0634\u0646\n     * =======================================================\n     *\/\n    if (reducedMotion) {\n\n      gsap.set(\n        [title].concat(shells, cards),\n        {\n          clearProps: 'all'\n        }\n      );\n\n      return;\n    }\n\n\n    \/*\n     * =======================================================\n     * LOCAL TRIGGERS\n     *\n     * \u062a\u0645\u0627\u0645 Trigger\u0647\u0627\u06cc \u0633\u0627\u062e\u062a\u0647\u200c\u0634\u062f\u0647 \u062a\u0648\u0633\u0637 \u0627\u06cc\u0646 \u0633\u06a9\u0634\u0646\n     * \u062f\u0631 \u0627\u06cc\u0646 \u0622\u0631\u0627\u06cc\u0647 \u0646\u06af\u0647\u062f\u0627\u0631\u06cc \u0645\u06cc\u200c\u0634\u0648\u0646\u062f.\n     * =======================================================\n     *\/\n    var localTriggers = [];\n\n\n    \/*\n     * =======================================================\n     * GSAP CONTEXT\n     * =======================================================\n     *\/\n    gsap.context(function () {\n\n\n      \/*\n       * =====================================================\n       * BACKGROUND TITLE\n       * =====================================================\n       *\/\n      var titleTween =\n        gsap.fromTo(\n          title,\n          {\n            xPercent: 0,\n            opacity: .22\n          },\n          {\n            xPercent: 0,\n            opacity: .32,\n            ease: 'none',\n\n            scrollTrigger: {\n              trigger: section,\n              start: 'top top',\n              end: 'bottom bottom',\n              scrub: true\n            }\n          }\n        );\n\n\n      if (\n        titleTween &&\n        titleTween.scrollTrigger\n      ) {\n\n        localTriggers.push(\n          titleTween.scrollTrigger\n        );\n\n      }\n\n\n      \/*\n       * =====================================================\n       * CARDS\n       * =====================================================\n       *\/\n      shells.forEach(function (shell) {\n\n        var card =\n          shell.querySelector(\n            '.revana-sw__card'\n          );\n\n\n        var image =\n          shell.querySelector(\n            '.revana-sw__image'\n          );\n\n\n        var floatAmount =\n          Number(\n            shell.dataset.float || 160\n          );\n\n\n        var isMobile =\n          window.matchMedia(\n            '(max-width:767px)'\n          ).matches;\n\n\n        var safeFloat =\n          isMobile\n            ? Math.min(\n                34,\n                floatAmount * .22\n              )\n            : Math.min(\n                floatAmount,\n                120\n              );\n\n\n        \/*\n         * ===================================================\n         * CARD FLOAT\n         * ===================================================\n         *\/\n        var floatTween =\n          gsap.fromTo(\n            shell,\n            {\n              y: safeFloat\n            },\n            {\n              y: -safeFloat,\n              ease: 'none',\n\n              scrollTrigger: {\n                trigger: shell,\n                start: 'top bottom',\n                end: 'bottom top',\n                scrub: true,\n                invalidateOnRefresh: true\n              }\n            }\n          );\n\n\n        if (\n          floatTween &&\n          floatTween.scrollTrigger\n        ) {\n\n          localTriggers.push(\n            floatTween.scrollTrigger\n          );\n\n        }\n\n\n        \/*\n         * ===================================================\n         * CARD REVEAL\n         * ===================================================\n         *\/\n        var revealTween =\n          gsap.fromTo(\n            card,\n            {\n              autoAlpha: 0,\n              y: 42\n            },\n            {\n              autoAlpha: 1,\n              y: 0,\n              duration: .9,\n              ease: 'power3.out',\n\n              scrollTrigger: {\n                trigger: shell,\n                start: 'top 86%',\n                toggleActions:\n                  'play none none reverse'\n              }\n            }\n          );\n\n\n        if (\n          revealTween &&\n          revealTween.scrollTrigger\n        ) {\n\n          localTriggers.push(\n            revealTween.scrollTrigger\n          );\n\n        }\n\n\n        \/*\n         * ===================================================\n         * IMAGE PARALLAX\n         * ===================================================\n         *\/\n        var imageTween =\n          gsap.fromTo(\n            image,\n            {\n              yPercent: -5\n            },\n            {\n              yPercent: 5,\n              ease: 'none',\n\n              scrollTrigger: {\n                trigger: shell,\n                start: 'top bottom',\n                end: 'bottom top',\n                scrub: true\n              }\n            }\n          );\n\n\n        if (\n          imageTween &&\n          imageTween.scrollTrigger\n        ) {\n\n          localTriggers.push(\n            imageTween.scrollTrigger\n          );\n\n        }\n\n      });\n\n    }, section);\n\n\n    \/*\n     * =======================================================\n     * LOCAL REFRESH\n     *\n     * \u0645\u0647\u0645:\n     * \u0627\u06cc\u0646\u062c\u0627 \u062f\u06cc\u06af\u0631 ScrollTrigger.refresh() \u0633\u0631\u0627\u0633\u0631\u06cc \u0646\u062f\u0627\u0631\u06cc\u0645.\n     * \u0641\u0642\u0637 Trigger\u0647\u0627\u06cc \u0647\u0645\u06cc\u0646 \u0633\u06a9\u0634\u0646 refresh \u0645\u06cc\u200c\u0634\u0648\u0646\u062f.\n     * =======================================================\n     *\/\n    function refreshLocalTriggers() {\n\n      localTriggers.forEach(\n        function (trigger) {\n\n          if (\n            trigger &&\n            typeof trigger.refresh === 'function'\n          ) {\n\n            trigger.refresh();\n\n          }\n\n        }\n      );\n\n    }\n\n\n    \/*\n     * =======================================================\n     * LOAD\n     * \u0641\u0642\u0637 \u0647\u0645\u06cc\u0646 \u0633\u06a9\u0634\u0646\n     * =======================================================\n     *\/\n    window.addEventListener(\n      'load',\n      refreshLocalTriggers,\n      {\n        once: true,\n        passive: true\n      }\n    );\n\n\n    \/*\n     * =======================================================\n     * RESIZE\n     * \u0641\u0642\u0637 Trigger\u0647\u0627\u06cc \u0647\u0645\u06cc\u0646 \u0633\u06a9\u0634\u0646\n     * =======================================================\n     *\/\n    var refreshTimer;\n\n    var lastRefreshWidth =\n      window.innerWidth;\n\n\n    window.addEventListener(\n      'resize',\n      function () {\n\n        var currentWidth =\n          window.innerWidth;\n\n\n        if (\n          window.matchMedia(\n            '(max-width:767px)'\n          ).matches\n        ) {\n\n          if (\n            Math.abs(\n              currentWidth -\n              lastRefreshWidth\n            ) < 2\n          ) {\n            return;\n          }\n\n        }\n\n\n        clearTimeout(\n          refreshTimer\n        );\n\n\n        refreshTimer =\n          setTimeout(\n            function () {\n\n              lastRefreshWidth =\n                window.innerWidth;\n\n              refreshLocalTriggers();\n\n            },\n            200\n          );\n\n      },\n      {\n        passive: true\n      }\n    );\n\n  }\n\n\n  \/*\n   * =========================================================\n   * INIT\n   * =========================================================\n   *\/\n  if (\n    document.readyState ===\n    'loading'\n  ) {\n\n    document.addEventListener(\n      'DOMContentLoaded',\n      initSelectedWorks,\n      {\n        once: true\n      }\n    );\n\n  } else {\n\n    initSelectedWorks();\n\n  }\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5796178 e-con-full e-flex e-con e-parent\" data-id=\"5796178\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-a34ab2c e-con-full e-flex e-con e-child\" data-id=\"a34ab2c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-09483cd elementor-widget elementor-widget-heading\" data-id=\"09483cd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0633\u0648\u0627\u0644\u0627\u062a \u0645\u062a\u062f\u0627\u0648\u0644<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0817530 elementor-widget elementor-widget-heading\" data-id=\"0817530\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u067e\u0627\u0633\u062e \u0628\u0647 \u067e\u0631\u0633\u0634\u200c\u0647\u0627\u06cc \u0634\u0645\u0627<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a97d182 elementor-widget elementor-widget-n-accordion\" data-id=\"a97d182\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;default_state&quot;:&quot;all_collapsed&quot;,&quot;max_items_expended&quot;:&quot;one&quot;,&quot;n_accordion_animation_duration&quot;:{&quot;unit&quot;:&quot;ms&quot;,&quot;size&quot;:400,&quot;sizes&quot;:[]}}\" data-widget_type=\"nested-accordion.default\">\n\t\t\t\t\t\t\t<div class=\"e-n-accordion\" aria-label=\"Accordion. Open links with Enter or Space, close with Escape, and navigate with Arrow Keys\">\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-1770\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"1\" tabindex=\"0\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-1770\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> \u062d\u062f\u0627\u0642\u0644 \u062a\u06cc\u0631\u0627\u0698 \u0633\u0641\u0627\u0631\u0634 \u0686\u0642\u062f\u0631 \u0627\u0633\u062a\u061f <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><i aria-hidden=\"true\" class=\"icon icon-arrow-square-left\"><\/i><\/span>\n\t\t\t<span class='e-closed'><i aria-hidden=\"true\" class=\"icon icon-arrow-square-down\"><\/i><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-1770\" class=\"elementor-element elementor-element-22c6bff e-con-full e-flex e-con e-child\" data-id=\"22c6bff\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-67d2aa8 elementor-widget elementor-widget-text-editor\" data-id=\"67d2aa8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>\u062d\u062f\u0627\u0642\u0644 \u062a\u06cc\u0631\u0627\u0698 \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0633\u0641\u0627\u0631\u0634\u0627\u062a 5000 \u0639\u062f\u062f \u0645\u06cc\u200c\u0628\u0627\u0634\u062f.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-1771\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"2\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-1771\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> \u0622\u06cc\u0627 \u062e\u062f\u0645\u0627\u062a \u0637\u0631\u0627\u062d\u06cc \u0647\u0645 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc\u200c\u062f\u0647\u06cc\u062f \u06cc\u0627 \u0641\u0642\u0637 \u0686\u0627\u067e\u061f <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><i aria-hidden=\"true\" class=\"icon icon-arrow-square-left\"><\/i><\/span>\n\t\t\t<span class='e-closed'><i aria-hidden=\"true\" class=\"icon icon-arrow-square-down\"><\/i><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-1771\" class=\"elementor-element elementor-element-7e43f01 e-con-full e-flex e-con e-child\" data-id=\"7e43f01\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cc58496 elementor-widget elementor-widget-text-editor\" data-id=\"cc58496\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>\u0628\u0644\u0647\u060c \u062a\u06cc\u0645 \u0637\u0631\u0627\u062d\u06cc \u0645\u0627 \u0627\u0632 \u0645\u0631\u062d\u0644\u0647 \u0627\u06cc\u062f\u0647\u200c\u067e\u0631\u062f\u0627\u0632\u06cc \u062a\u0627 \u062a\u0648\u0644\u06cc\u062f \u0646\u0647\u0627\u06cc\u06cc \u0647\u0645\u0631\u0627\u0647 \u0634\u0645\u0627\u0633\u062a. \u0645\u0627 \u062e\u062f\u0645\u0627\u062a \u0637\u0631\u0627\u062d\u06cc \u0647\u0648\u06cc\u062a \u0628\u0631\u0646\u062f\u060c \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0648 \u0645\u062d\u062a\u0648\u0627\u06cc \u062a\u0628\u0644\u06cc\u063a\u0627\u062a\u06cc \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc\u200c\u062f\u0647\u06cc\u0645.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-1772\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"3\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-1772\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> \u0645\u062f\u062a \u0632\u0645\u0627\u0646 \u062a\u062d\u0648\u06cc\u0644 \u0633\u0641\u0627\u0631\u0634\u0627\u062a \u0686\u0642\u062f\u0631 \u0627\u0633\u062a\u061f <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><i aria-hidden=\"true\" class=\"icon icon-arrow-square-left\"><\/i><\/span>\n\t\t\t<span class='e-closed'><i aria-hidden=\"true\" class=\"icon icon-arrow-square-down\"><\/i><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-1772\" class=\"elementor-element elementor-element-9a23a7d e-con-full e-flex e-con e-child\" data-id=\"9a23a7d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f4ae7f elementor-widget elementor-widget-text-editor\" data-id=\"1f4ae7f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>\u0628\u0633\u062a\u0647 \u0628\u0647 \u062d\u062c\u0645 \u0648 \u067e\u06cc\u0686\u06cc\u062f\u06af\u06cc \u067e\u0631\u0648\u0698\u0647\u060c \u0645\u0639\u0645\u0648\u0644\u0627\u064b \u0628\u06cc\u0646 21 \u062a\u0627 28 \u0631\u0648\u0632 \u06a9\u0627\u0631\u06cc \u0632\u0645\u0627\u0646 \u0646\u06cc\u0627\u0632 \u0627\u0633\u062a. \u0628\u0631\u0627\u06cc \u067e\u0631\u0648\u0698\u0647\u200c\u0647\u0627\u06cc \u0641\u0648\u0631\u06cc \u0627\u0645\u06a9\u0627\u0646 \u062a\u0633\u0631\u06cc\u0639 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-1773\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"4\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-1773\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> \u0627\u0645\u06a9\u0627\u0646 \u062f\u0631\u06cc\u0627\u0641\u062a \u0646\u0645\u0648\u0646\u0647 \u0641\u06cc\u0632\u06cc\u06a9\u06cc \u0642\u0628\u0644 \u0627\u0632 \u062a\u0648\u0644\u06cc\u062f \u0627\u0646\u0628\u0648\u0647 \u0647\u0633\u062a\u061f <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><i aria-hidden=\"true\" class=\"icon icon-arrow-square-left\"><\/i><\/span>\n\t\t\t<span class='e-closed'><i aria-hidden=\"true\" class=\"icon icon-arrow-square-down\"><\/i><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-1773\" class=\"elementor-element elementor-element-da1d8f0 e-flex e-con-boxed e-con e-child\" data-id=\"da1d8f0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f9426e elementor-widget elementor-widget-text-editor\" data-id=\"8f9426e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>\u0628\u0644\u0647\u060c \u0628\u0631\u0627\u06cc \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0627\u0632 \u06a9\u06cc\u0641\u06cc\u062a \u0646\u0647\u0627\u06cc\u06cc\u060c \u0646\u0645\u0648\u0646\u0647 \u0641\u06cc\u0632\u06cc\u06a9\u06cc \u0628\u0627 \u0647\u0645\u0627\u0646 \u0645\u062a\u0631\u06cc\u0627\u0644 \u0648 \u0631\u0648\u0634 \u062a\u0648\u0644\u06cc\u062f \u0628\u0647 \u0634\u0645\u0627 \u0627\u0631\u0633\u0627\u0644 \u0645\u06cc\u200c\u0634\u0648\u062f.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-1774\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"5\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-1774\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> \u0622\u06cc\u0627 \u062f\u0631 \u0633\u0631\u0627\u0633\u0631 \u06a9\u0634\u0648\u0631 \u0627\u0631\u0633\u0627\u0644 \u062f\u0627\u0631\u06cc\u062f\u061f <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><i aria-hidden=\"true\" class=\"icon icon-arrow-square-left\"><\/i><\/span>\n\t\t\t<span class='e-closed'><i aria-hidden=\"true\" class=\"icon icon-arrow-square-down\"><\/i><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-1774\" class=\"elementor-element elementor-element-346afc4 e-flex e-con-boxed e-con e-child\" data-id=\"346afc4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0a71a4b elementor-widget elementor-widget-text-editor\" data-id=\"0a71a4b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>\u0628\u0644\u0647\u060c \u0628\u0627 \u0647\u0645\u06a9\u0627\u0631\u06cc \u0628\u0627 \u0634\u0631\u06a9\u062a\u200c\u0647\u0627\u06cc \u062d\u0645\u0644\u200c\u0648\u0646\u0642\u0644 \u0645\u0639\u062a\u0628\u0631\u060c \u0633\u0641\u0627\u0631\u0634\u0627\u062a \u0634\u0645\u0627 \u0628\u0647 \u062a\u0645\u0627\u0645 \u0646\u0642\u0627\u0637 \u0627\u06cc\u0631\u0627\u0646 \u0627\u0631\u0633\u0627\u0644 \u0645\u06cc\u200c\u0634\u0648\u062f.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ff6c92f e-con-full e-flex e-con e-child\" data-id=\"ff6c92f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9808510 elementor-widget elementor-widget-heading\" data-id=\"9808510\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u0634\u0627\u0648\u0631\u0647<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1a48394 elementor-widget elementor-widget-heading\" data-id=\"1a48394\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f\u060c \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0632\u06cc\u0631 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0645\u0627 \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-014e003 elementor-button-align-stretch elementor-widget elementor-widget-form\" data-id=\"014e003\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;step_next_label&quot;:&quot;\\u0628\\u0639\\u062f&quot;,&quot;step_previous_label&quot;:&quot;\\u0642\\u0628\\u0644\\u06cc&quot;,&quot;button_width&quot;:&quot;100&quot;,&quot;step_type&quot;:&quot;number_text&quot;,&quot;step_icon_shape&quot;:&quot;circle&quot;}\" data-widget_type=\"form.default\">\n\t\t\t\t\t\t\t<form class=\"elementor-form\" method=\"post\" name=\"\u0641\u0631\u0645 \u062c\u062f\u06cc\u062f\" aria-label=\"\u0641\u0631\u0645 \u062c\u062f\u06cc\u062f\">\n\t\t\t<input type=\"hidden\" name=\"post_id\" value=\"2172\"\/>\n\t\t\t<input type=\"hidden\" name=\"form_id\" value=\"014e003\"\/>\n\t\t\t<input type=\"hidden\" name=\"referer_title\" value=\"test - \u06af\u0631\u0648\u0647 \u0686\u0627\u067e \u0648 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0645\u0627\u062a\u0631\u06cc\u0633\" \/>\n\n\t\t\t\t\t\t\t<input type=\"hidden\" name=\"queried_id\" value=\"2172\"\/>\n\t\t\t\n\t\t\t<div class=\"elementor-form-fields-wrapper elementor-labels-above\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-name elementor-col-50 elementor-sm-50 elementor-field-required\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[name]\" id=\"form-field-name\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"\u0646\u0627\u0645 \u0648 \u0646\u0627\u0645 \u062e\u0627\u0646\u0648\u0627\u062f\u06af\u06cc\" required=\"required\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-tel elementor-field-group elementor-column elementor-field-group-email elementor-col-50 elementor-sm-50 elementor-field-required\">\n\t\t\t\t\t\t\t<input size=\"1\" type=\"tel\" name=\"form_fields[email]\" id=\"form-field-email\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"\u0634\u0645\u0627\u0631\u0647 \u062a\u0645\u0627\u0633\" required=\"required\" pattern=\"[0-9()#&amp;+*-=.]+\" title=\"\u0641\u0642\u0637 \u0634\u0645\u0627\u0631\u0647\u200c\u0647\u0627 \u0648 \u06a9\u0627\u0631\u0627\u06a9\u062a\u0631\u0647\u0627\u06cc \u062a\u0644\u0641\u0646 (#, -, *, etc) \u067e\u0630\u06cc\u0631\u0641\u062a\u0647 \u0645\u06cc \u0634\u0648\u0646\u062f.\">\n\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-field_fbab8e7 elementor-col-100\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_fbab8e7]\" id=\"form-field-field_fbab8e7\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"\u0627\u06cc\u0645\u06cc\u0644\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-textarea elementor-field-group elementor-column elementor-field-group-message elementor-col-100\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-message\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\t\u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u067e\u0631\u0648\u0698\u0647\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t<textarea class=\"elementor-field-textual elementor-field  elementor-size-sm\" name=\"form_fields[message]\" id=\"form-field-message\" rows=\"6\" placeholder=\"\u06a9\u0645\u06cc \u062f\u0631\u0628\u0627\u0631\u0647 \u062e\u062f\u0645\u062a \u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632\u060c \u0627\u0646\u062a\u0638\u0627\u0631\u0627\u062a \u0648 \u0632\u0645\u0627\u0646 \u062a\u062d\u0648\u06cc\u0644 \u0645\u062f \u0646\u0638\u0631 \u062e\u0648\u062f \u0628\u0646\u0648\u06cc\u0633\u06cc\u062f...\"><\/textarea>\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text\">\n\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_39fa62e]\" id=\"form-field-field_39fa62e\" class=\"elementor-field elementor-size-sm \" style=\"display:none !important;\">\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-group elementor-column elementor-field-type-submit elementor-col-100 e-form__buttons\">\n\t\t\t\t\t<button class=\"elementor-button elementor-size-sm\" type=\"submit\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-arrow-left\"><\/i>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0627\u0631\u0633\u0627\u0644 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u0634\u0627\u0648\u0631\u0647<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/form>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6a8c8ee e-con-full e-flex e-con e-parent\" data-id=\"6a8c8ee\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-945b362 elementor-widget elementor-widget-heading\" data-id=\"945b362\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0648\u0628\u0644\u0627\u06af \u0645\u0627\u062a\u0631\u06cc\u0633<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-79019bd elementor-pagination-type-bullets elementor-arrows-position-inside elementor-pagination-position-outside elementor-widget elementor-widget-loop-carousel\" data-id=\"79019bd\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;template_id&quot;:&quot;22&quot;,&quot;image_spacing_custom&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:36,&quot;sizes&quot;:[]},&quot;_skin&quot;:&quot;post&quot;,&quot;slides_to_show&quot;:&quot;3&quot;,&quot;slides_to_show_tablet&quot;:&quot;2&quot;,&quot;slides_to_show_mobile&quot;:&quot;1&quot;,&quot;slides_to_scroll&quot;:&quot;1&quot;,&quot;edit_handle_selector&quot;:&quot;.elementor-loop-container&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;autoplay_speed&quot;:5000,&quot;pause_on_hover&quot;:&quot;yes&quot;,&quot;pause_on_interaction&quot;:&quot;yes&quot;,&quot;infinite&quot;:&quot;yes&quot;,&quot;speed&quot;:500,&quot;offset_sides&quot;:&quot;none&quot;,&quot;arrows&quot;:&quot;yes&quot;,&quot;pagination&quot;:&quot;bullets&quot;,&quot;image_spacing_custom_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;image_spacing_custom_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"loop-carousel.post\">\n\t\t\t\t\t\t\t<div class=\"swiper elementor-loop-container elementor-grid\" role=\"list\" dir=\"ltr\">\n\t\t\t\t<div class=\"swiper-wrapper\" aria-live=\"off\">\n\t\t<style id=\"loop-22\">.elementor-22 .elementor-element.elementor-element-314880c5{--display:flex;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:var( --e-global-color-4c32af3 );--border-color:var( --e-global-color-4c32af3 );--border-radius:20px 20px 20px 20px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-widget-theme-post-featured-image .widget-image-caption{color:var( --e-global-color-text );font-weight:var( --e-global-typography-text-font-weight );}.elementor-22 .elementor-element.elementor-element-1648ad47 img{border-radius:20px 20px 20px 20px;}.elementor-widget-theme-post-title .elementor-heading-title{font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-22 .elementor-element.elementor-element-5c8e36a4 .elementor-heading-title{font-family:\"IranYekanX\", Sans-serif;font-size:15px;font-weight:600;line-height:20px;}.elementor-widget-post-info .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-post-info .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-post-info .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-post-info .elementor-icon-list-text, .elementor-widget-post-info .elementor-icon-list-text a{color:var( --e-global-color-secondary );}.elementor-widget-post-info .elementor-icon-list-item{font-weight:var( --e-global-typography-text-font-weight );}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-icon{width:14px;}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-icon i{font-size:14px;}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-item{font-family:\"IranYekanX\", Sans-serif;font-size:11px;font-weight:400;}.elementor-22 .elementor-element.elementor-element-2d747e68{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-22 .elementor-element.elementor-element-2d747e68.elementor-element{--align-self:flex-start;}.elementor-widget-theme-post-excerpt{font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-22 .elementor-element.elementor-element-23ae70a7{font-family:\"IranYekanX\", Sans-serif;font-size:13px;font-weight:400;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-widget-button .elementor-button{font-weight:var( --e-global-typography-accent-font-weight );background-color:var( --e-global-color-accent );}.elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button-content-wrapper{flex-direction:row;}.elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button{font-family:\"IranYekanX\", Sans-serif;font-size:12px;font-weight:500;fill:var( --e-global-color-e1f4314 );color:var( --e-global-color-e1f4314 );border-radius:20px 20px 20px 20px;padding:8px 15px 8px 15px;}.elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button:hover, .elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button:focus{color:var( --e-global-color-e1f4314 );background-color:var( --e-global-color-c0f3e0b );}.elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button:hover svg, .elementor-22 .elementor-element.elementor-element-37da5905 .elementor-button:focus svg{fill:var( --e-global-color-e1f4314 );}.elementor-22 .elementor-element.elementor-element-37da5905{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-22 .elementor-element.elementor-element-37da5905.elementor-element{--align-self:center;--order:99999 \/* order end hack *\/;}@media(max-width:767px){.elementor-22 .elementor-element.elementor-element-314880c5{--width:100%;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-22 .elementor-element.elementor-element-5c8e36a4 .elementor-heading-title{font-size:13px;line-height:1.5em;word-spacing:0em;}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-bottom:calc(4px\/2);}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-top:calc(4px\/2);}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-right:calc(4px\/2);margin-left:calc(4px\/2);}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items.elementor-inline-items{margin-right:calc(-4px\/2);margin-left:calc(-4px\/2);}body.rtl .elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{left:calc(-4px\/2);}body:not(.rtl) .elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{right:calc(-4px\/2);}.elementor-22 .elementor-element.elementor-element-2d747e68 .elementor-icon-list-item{font-size:11px;}.elementor-22 .elementor-element.elementor-element-2d747e68.elementor-element{--align-self:center;}}<\/style>\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"22\" class=\"elementor elementor-22 swiper-slide e-loop-item e-loop-item-140 post-140 post type-post status-publish format-standard has-post-thumbnail hentry category-cardboard-box\" data-elementor-post-type=\"elementor_library\" role=\"group\" aria-roledescription=\"slide\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-314880c5 e-con-full e-flex e-con e-parent\" data-id=\"314880c5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1648ad47 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"1648ad47\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/luxury-packaging\/\">\n\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging-1024x576.webp\" class=\"attachment-large size-large wp-image-141\" alt=\"\" srcset=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging-1024x576.webp 1024w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging-300x169.webp 300w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging-768x432.webp 768w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging-1536x864.webp 1536w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/luxury-packaging.webp 1672w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5c8e36a4 elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading\" data-id=\"5c8e36a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-title.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/matris.ir\/en\/luxury-packaging\/\">\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0644\u0648\u06a9\u0633 \u0686\u06cc\u0633\u062a\u061f \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0637\u0631\u0627\u062d\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0631\u0627\u06cc \u0628\u0631\u0646\u062f\u0647\u0627\u06cc \u0645\u062f\u0631\u0646<\/a><\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d747e68 elementor-align-center elementor-widget elementor-widget-post-info\" data-id=\"2d747e68\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"post-info.default\">\n\t\t\t\t\t\t\t<ul class=\"elementor-inline-items elementor-icon-list-items elementor-post-info\">\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-ed8d4d9 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-user\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom\">\n\t\t\t\t\t\t\t\t\t\t\u0645\u0627\u062a\u0631\u06cc\u0633\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-9eb8af2 elementor-inline-item\" itemprop=\"datePublished\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/2026\/09\/29\/\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-calendar-1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-date\">\n\t\t\t\t\t\t\t\t\t\t<time>September 29, 2026<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2170016 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-clock1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-time\">\n\t\t\t\t\t\t\t\t\t\t<time>15:11<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2ff13f8 elementor-inline-item\" itemprop=\"commentCount\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/luxury-packaging\/#respond\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-message\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-comments\">\n\t\t\t\t\t\t\t\t\t\tNo Comments\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-23ae70a7 elementor-widget elementor-widget-theme-post-excerpt\" data-id=\"23ae70a7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-excerpt.default\">\n\t\t\t\t\t<p>\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062f\u06cc\u06af\u0631 \u0641\u0642\u0637 \u06cc\u06a9 \u067e\u0648\u0634\u0634 \u0628\u0631\u0627\u06cc \u0645\u062d\u0627\u0641\u0638\u062a \u0627\u0632 \u0645\u062d\u0635\u0648\u0644 \u0646\u06cc\u0633\u062a. \u062f\u0631 \u0628\u0627\u0632\u0627\u0631 \u0627\u0645\u0631\u0648\u0632\u060c \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u062e\u0634\u06cc \u0627\u0632 \u0647\u0648\u06cc\u062a \u06cc\u06a9 \u0628\u0631\u0646\u062f \u0627\u0633\u062a\u061b \u0639\u0646\u0635\u0631\u06cc \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u062f \u067e\u06cc\u0634 \u0627\u0632\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37da5905 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"37da5905\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/matris.ir\/en\/luxury-packaging\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-document-text-1\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0628\u06cc\u0634\u062a\u0631 \u0628\u062e\u0648\u0627\u0646\u06cc\u062f<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"22\" class=\"elementor elementor-22 swiper-slide e-loop-item e-loop-item-136 post-136 post type-post status-publish format-standard has-post-thumbnail hentry category-laminated-carton\" data-elementor-post-type=\"elementor_library\" role=\"group\" aria-roledescription=\"slide\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-314880c5 e-con-full e-flex e-con e-parent\" data-id=\"314880c5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1648ad47 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"1648ad47\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/carton-types\/\">\n\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1-1024x576.webp\" class=\"attachment-large size-large wp-image-138\" alt=\"\" srcset=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1-1024x576.webp 1024w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1-300x169.webp 300w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1-768x432.webp 768w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1-1536x864.webp 1536w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/cartoon-types-1.webp 1672w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5c8e36a4 elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading\" data-id=\"5c8e36a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-title.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/matris.ir\/en\/carton-types\/\">\u06a9\u0627\u0631\u062a\u0646 \u0633\u0647\u200c\u0644\u0627\u06cc\u0647 \u0648 \u067e\u0646\u062c\u200c\u0644\u0627\u06cc\u0647 \u0686\u06cc\u0633\u062a\u061f \u062a\u0641\u0627\u0648\u062a\u200c\u0647\u0627\u060c \u06a9\u0627\u0631\u0628\u0631\u062f\u0647\u0627 \u0648 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u0627\u0646\u062a\u062e\u0627\u0628<\/a><\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d747e68 elementor-align-center elementor-widget elementor-widget-post-info\" data-id=\"2d747e68\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"post-info.default\">\n\t\t\t\t\t\t\t<ul class=\"elementor-inline-items elementor-icon-list-items elementor-post-info\">\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-ed8d4d9 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-user\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom\">\n\t\t\t\t\t\t\t\t\t\t\u0645\u0627\u062a\u0631\u06cc\u0633\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-9eb8af2 elementor-inline-item\" itemprop=\"datePublished\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/2026\/09\/29\/\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-calendar-1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-date\">\n\t\t\t\t\t\t\t\t\t\t<time>September 29, 2026<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2170016 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-clock1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-time\">\n\t\t\t\t\t\t\t\t\t\t<time>15:09<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2ff13f8 elementor-inline-item\" itemprop=\"commentCount\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/carton-types\/#respond\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-message\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-comments\">\n\t\t\t\t\t\t\t\t\t\tNo Comments\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-23ae70a7 elementor-widget elementor-widget-theme-post-excerpt\" data-id=\"23ae70a7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-excerpt.default\">\n\t\t\t\t\t<p>\u06a9\u0627\u0631\u062a\u0646 \u06cc\u06a9\u06cc \u0627\u0632 \u067e\u0631\u06a9\u0627\u0631\u0628\u0631\u062f\u062a\u0631\u06cc\u0646 \u0627\u0646\u0648\u0627\u0639 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u062f\u0631 \u0635\u0646\u0627\u06cc\u0639 \u0645\u062e\u062a\u0644\u0641 \u0627\u0633\u062a\u061b \u0627\u0645\u0627 \u0647\u0645\u0647 \u06a9\u0627\u0631\u062a\u0646\u200c\u0647\u0627 \u0633\u0627\u062e\u062a\u0627\u0631 \u06cc\u06a9\u0633\u0627\u0646\u06cc \u0646\u062f\u0627\u0631\u0646\u062f. \u062a\u0639\u062f\u0627\u062f \u0644\u0627\u06cc\u0647\u200c\u0647\u0627\u060c \u0646\u0648\u0639 \u06a9\u0627\u063a\u0630\u060c \u0636\u062e\u0627\u0645\u062a\u060c \u0645\u0642\u0627\u0648\u0645\u062a \u0648 \u062d\u062a\u06cc \u0646\u062d\u0648\u0647\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37da5905 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"37da5905\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/matris.ir\/en\/carton-types\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-document-text-1\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0628\u06cc\u0634\u062a\u0631 \u0628\u062e\u0648\u0627\u0646\u06cc\u062f<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"22\" class=\"elementor elementor-22 swiper-slide e-loop-item e-loop-item-133 post-133 post type-post status-publish format-standard has-post-thumbnail hentry category-in-mold-label\" data-elementor-post-type=\"elementor_library\" role=\"group\" aria-roledescription=\"slide\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-314880c5 e-con-full e-flex e-con e-parent\" data-id=\"314880c5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1648ad47 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"1648ad47\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/about-iml-packaging\/\">\n\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging-1024x576.webp\" class=\"attachment-large size-large wp-image-134\" alt=\"\" srcset=\"https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging-1024x576.webp 1024w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging-300x169.webp 300w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging-768x432.webp 768w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging-1536x864.webp 1536w, https:\/\/matris.ir\/wp-content\/uploads\/2026\/09\/IML-Packaging.webp 1672w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5c8e36a4 elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading\" data-id=\"5c8e36a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-title.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/matris.ir\/en\/about-iml-packaging\/\">\u0686\u0627\u067e IML \u0686\u06cc\u0633\u062a\u061f \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u06a9\u0627\u0645\u0644 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u200c\u0647\u0627\u06cc In-Mold Labeling<\/a><\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d747e68 elementor-align-center elementor-widget elementor-widget-post-info\" data-id=\"2d747e68\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"post-info.default\">\n\t\t\t\t\t\t\t<ul class=\"elementor-inline-items elementor-icon-list-items elementor-post-info\">\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-ed8d4d9 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-user\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom\">\n\t\t\t\t\t\t\t\t\t\t\u0645\u0627\u062a\u0631\u06cc\u0633\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-9eb8af2 elementor-inline-item\" itemprop=\"datePublished\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/2026\/09\/29\/\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-calendar-1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-date\">\n\t\t\t\t\t\t\t\t\t\t<time>September 29, 2026<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2170016 elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-clock1\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-time\">\n\t\t\t\t\t\t\t\t\t\t<time>15:06<\/time>\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t<li class=\"elementor-icon-list-item elementor-repeater-item-2ff13f8 elementor-inline-item\" itemprop=\"commentCount\">\n\t\t\t\t\t\t<a href=\"https:\/\/matris.ir\/en\/about-iml-packaging\/#respond\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-message\"><\/i>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-comments\">\n\t\t\t\t\t\t\t\t\t\tNo Comments\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t<\/li>\n\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-23ae70a7 elementor-widget elementor-widget-theme-post-excerpt\" data-id=\"23ae70a7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-excerpt.default\">\n\t\t\t\t\t<p>\u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0641\u0642\u0637 \u0628\u0647 \u0634\u06a9\u0644 \u062c\u0639\u0628\u0647 \u0648 \u0638\u0627\u0647\u0631 \u0628\u06cc\u0631\u0648\u0646\u06cc \u0622\u0646 \u0645\u062d\u062f\u0648\u062f \u0646\u0645\u06cc\u200c\u0634\u0648\u062f. \u062f\u0631 \u0628\u0633\u06cc\u0627\u0631\u06cc \u0627\u0632 \u0645\u062d\u0635\u0648\u0644\u0627\u062a\u060c \u06a9\u06cc\u0641\u06cc\u062a \u0686\u0627\u067e\u060c \u0645\u0627\u0646\u062f\u06af\u0627\u0631\u06cc \u0637\u0631\u062d \u0648 \u0645\u0642\u0627\u0648\u0645\u062a \u0633\u0637\u062d \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc \u0628\u0647 \u0627\u0646\u062f\u0627\u0632\u0647\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37da5905 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"37da5905\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/matris.ir\/en\/about-iml-packaging\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"icon icon-document-text-1\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0628\u06cc\u0634\u062a\u0631 \u0628\u062e\u0648\u0627\u0646\u06cc\u062f<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-swiper-button elementor-swiper-button-prev\" role=\"button\" tabindex=\"0\" aria-label=\"Previous\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-eicon-chevron-left\" viewBox=\"0 0 1000 1000\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M646 125C629 125 613 133 604 142L308 442C296 454 292 471 292 487 292 504 296 521 308 533L604 854C617 867 629 875 646 875 663 875 679 871 692 858 704 846 713 829 713 812 713 796 708 779 692 767L438 487 692 225C700 217 708 204 708 187 708 171 704 154 692 142 675 129 663 125 646 125Z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t\t<div class=\"elementor-swiper-button elementor-swiper-button-next\" role=\"button\" tabindex=\"0\" aria-label=\"Next\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-eicon-chevron-right\" viewBox=\"0 0 1000 1000\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M696 533C708 521 713 504 713 487 713 471 708 454 696 446L400 146C388 133 375 125 354 125 338 125 325 129 313 142 300 154 292 171 292 187 292 204 296 221 308 233L563 492 304 771C292 783 288 800 288 817 288 833 296 850 308 863 321 871 338 875 354 875 371 875 388 867 400 854L696 533Z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t\t\t\t<div class=\"swiper-pagination\"><\/div>\n\t\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>\u0628\u0631\u0627\u06cc \u0645\u0634\u0627\u0647\u062f\u0647 \u0627\u0633\u06a9\u0631\u0648\u0644 \u06a9\u0646\u06cc\u062f \u0686\u0634\u0645\u200c\u0647\u0627 \u0628\u0627\u0632 \u0645\u06cc\u200c\u0645\u0627\u0646\u062f\u060c \u0628\u0647 \u0628\u0633\u062a\u0647 \u0634\u0645\u0627! \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u060c \u0627\u0648\u0644\u06cc\u0646 \u0646\u06af\u0627\u0647 \u0627\u0633\u062a! \u0627\u0632 \u06cc\u06a9 \u0628\u0631\u0634 \u0633\u0627\u062f\u0647 \u06a9\u0627\u063a\u0630\u06cc \u062a\u0627 \u06cc\u06a9 \u0627\u06cc\u062f\u0647\u200c\u06cc \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc. \u0627\u0632 \u0627\u06cc\u062f\u0647 \u062a\u0627 \u0627\u062c\u0631\u0627! \u0637\u0631\u0627\u062d\u06cc \u062f\u0642\u06cc\u0642\u060c \u0645\u062a\u0631\u06cc\u0627\u0644 \u062d\u0631\u0641\u0647\u200c\u0627\u06cc \u0648 \u0627\u062c\u0631\u0627\u06cc \u0628\u0627\u06a9\u06cc\u0641\u06cc\u062a. \u062c\u0632\u0626\u06cc\u0627\u062a\u060c \u062a\u0641\u0627\u0648\u062a \u0631\u0627 \u0645\u06cc\u200c\u0633\u0627\u0632\u062f! \u062a\u062c\u0631\u0628\u0647\u200c\u0627\u06cc \u0644\u0648\u06a9\u0633 \u0628\u0631\u0627\u06cc \u0628\u0631\u0646\u062f\u0647\u0627\u06cc\u06cc \u06a9\u0647 \u062f\u06cc\u062f\u0647 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f. MATRIS GROUP The Luxury Packaging! \u06af\u0640\u0640\u0640\u0640\u0640\u0640\u0631\u0648\u0647 \u0645\u0640\u0640\u0640\u0640\u0640\u0640\u0627\u062a\u0631\u06cc\u0640\u0640\u0640\u0640\u0640\u0640\u0640\u0633 \u0628\u0627\u0648\u0631 \u0645\u0627 \u0628\u0633\u062a\u0647\u200c\u0628\u0646\u062f\u06cc\u060c [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2172","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/pages\/2172","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/comments?post=2172"}],"version-history":[{"count":13,"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/pages\/2172\/revisions"}],"predecessor-version":[{"id":2187,"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/pages\/2172\/revisions\/2187"}],"wp:attachment":[{"href":"https:\/\/matris.ir\/en\/wp-json\/wp\/v2\/media?parent=2172"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}