.elementor-6391 .elementor-element.elementor-element-2bb5f50:not(.elementor-motion-effects-element-type-background), .elementor-6391 .elementor-element.elementor-element-2bb5f50 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#def0f6;}.elementor-6391 .elementor-element.elementor-element-2bb5f50 > .elementor-background-overlay{background-color:transparent;background-image:linear-gradient(180deg, #0A0F1D 0%, #0A0F1D 100%);opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6391 .elementor-element.elementor-element-2bb5f50 > .elementor-container{min-height:512px;}.elementor-6391 .elementor-element.elementor-element-2bb5f50{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0px 0px 80px 0px;padding:80px 15px 80px 15px;}.elementor-6391 .elementor-element.elementor-element-dc62e43 > .elementor-element-populated{margin:100px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-616a4f8 > .elementor-widget-container{margin:0px 0px 10px 0px;}.elementor-6391 .elementor-element.elementor-element-616a4f8{text-align:start;}.elementor-6391 .elementor-element.elementor-element-616a4f8 .elementor-heading-title{color:#F7F7F7;}.elementor-6391 .elementor-element.elementor-element-ccf0026 > .elementor-widget-container{margin:0px 0px 10px 0px;}.elementor-6391 .elementor-element.elementor-element-ccf0026{text-align:start;}.elementor-6391 .elementor-element.elementor-element-ccf0026 .elementor-heading-title{color:#FDFDFD;}.elementor-6391 .elementor-element.elementor-element-58ae3da{text-align:start;color:#F1F5F9;}.elementor-6391 .elementor-element.elementor-element-59c0e8c > .elementor-container{max-width:1598px;}.elementor-6391 .elementor-element.elementor-element-5f40860 .elementor-button{background-color:#00D1663B;fill:#E6E9F3;color:#E6E9F3;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);border-style:solid;border-width:2px 2px 2px 2px;border-color:#00D166;border-radius:10px 10px 10px 10px;}.elementor-6391 .elementor-element.elementor-element-5f40860 .elementor-button:hover, .elementor-6391 .elementor-element.elementor-element-5f40860 .elementor-button:focus{background-color:#00B355;}.elementor-6391 .elementor-element.elementor-element-5f40860{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-6391 .elementor-element.elementor-element-671f84e .elementor-button{background-color:#D9770636;fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:2px 2px 2px 2px;border-color:#D97706;border-radius:10px 10px 10px 10px;}.elementor-6391 .elementor-element.elementor-element-671f84e .elementor-button:hover, .elementor-6391 .elementor-element.elementor-element-671f84e .elementor-button:focus{background-color:#B45309;}.elementor-6391 .elementor-element.elementor-element-372846f{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0px 0px 80px 0px;padding:80px 15px 80px 15px;}.elementor-6391 .elementor-element.elementor-element-372846f > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6391 .elementor-element.elementor-element-2c51af2b > .elementor-element-populated{border-style:solid;border-width:0px 0px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-2c51af2b > .elementor-element-populated, .elementor-6391 .elementor-element.elementor-element-2c51af2b > .elementor-element-populated > .elementor-background-overlay, .elementor-6391 .elementor-element.elementor-element-2c51af2b > .elementor-background-slideshow{border-radius:50px 50px 50px 50px;}.elementor-6391 .elementor-element.elementor-element-2c51af2b:hover > .elementor-element-populated, .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover > .elementor-element-populated > .elementor-background-overlay{border-radius:20px 20px 20px 20px;}.elementor-6391 .elementor-element.elementor-element-ec44a82 .elementor-icon-box-wrapper{text-align:center;gap:15px;}.elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-stacked:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-stacked:has(:focus) .elementor-icon{background-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-framed:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-default:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-framed:has(:focus) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-ec44a82.elementor-view-default:has(:focus) .elementor-icon{fill:#00F078;color:#00F078;border-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-f2e688d .elementor-icon-box-wrapper{gap:15px;}.elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-stacked:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-stacked:has(:focus) .elementor-icon{background-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-framed:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-default:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-framed:has(:focus) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-f2e688d.elementor-view-default:has(:focus) .elementor-icon{fill:#00F078;color:#00F078;border-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-aea69c6 .elementor-icon-box-wrapper{gap:15px;}.elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-stacked:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-stacked:has(:focus) .elementor-icon{background-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-framed:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-default:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-framed:has(:focus) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-aea69c6.elementor-view-default:has(:focus) .elementor-icon{fill:#00F078;color:#00F078;border-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-029864d .elementor-icon-box-wrapper{gap:15px;}.elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-stacked:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-stacked:has(:focus) .elementor-icon{background-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-framed:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-default:has(:hover) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-framed:has(:focus) .elementor-icon, .elementor-6391 .elementor-element.elementor-element-029864d.elementor-view-default:has(:focus) .elementor-icon{fill:#00F078;color:#00F078;border-color:#00F078;}.elementor-6391 .elementor-element.elementor-element-14800a20 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-6391 .elementor-element.elementor-element-14800a20 > .elementor-container{max-width:1313px;}.elementor-6391 .elementor-element.elementor-element-14800a20, .elementor-6391 .elementor-element.elementor-element-14800a20 > .elementor-background-overlay{border-radius:2px 2px 2px 2px;}.elementor-6391 .elementor-element.elementor-element-14800a20{margin:0px 0px 110px 0px;}.elementor-6391 .elementor-element.elementor-element-4633489c > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-40b46e4 img{border-radius:25px 25px 25px 25px;}.elementor-6391 .elementor-element.elementor-element-7b5d63a5 > .elementor-element-populated{padding:0% 15% 0% 15%;}.elementor-6391 .elementor-element.elementor-element-5dc654ee{z-index:1;}.elementor-6391 .elementor-element.elementor-element-5dc654ee .title{font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-a83a737{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-4e6b428a{width:auto;max-width:auto;}.elementor-6391 .elementor-element.elementor-element-4e6b428a > .elementor-widget-container{margin:0px 15px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-107989a2{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0% 0% -4% 0%;padding:0px 0px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-107989a2 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6391 .elementor-element.elementor-element-5844bef > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:8% 15% 10% 15%;}.elementor-6391 .elementor-element.elementor-element-5844bef > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6391 .elementor-element.elementor-element-39a98bfb{z-index:1;}.elementor-6391 .elementor-element.elementor-element-39a98bfb .title{font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-cc0ebd6{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-28e07f3 img{border-radius:35px 35px 35px 35px;}.elementor-6391 .elementor-element.elementor-element-9473931{--spacer-size:112px;}.elementor-6391 .elementor-element.elementor-element-357e263b > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-6391 .elementor-element.elementor-element-357e263b{margin:0px 0px 80px 0px;}.elementor-6391 .elementor-element.elementor-element-6cdab0ed > .elementor-element-populated{padding:0% 15% 0% 15%;}.elementor-6391 .elementor-element.elementor-element-3d89c624{z-index:1;}.elementor-6391 .elementor-element.elementor-element-3d89c624 .title{font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-d1712a6{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-365d4154{width:auto;max-width:auto;}.elementor-6391 .elementor-element.elementor-element-365d4154 > .elementor-widget-container{margin:0px 15px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-f2846ab{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0% 0% -4% 0%;padding:0px 0px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-f2846ab > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6391 .elementor-element.elementor-element-797c41a > .elementor-element-populated{padding:8% 15% 10% 15%;}.elementor-6391 .elementor-element.elementor-element-3f4733e{width:auto;max-width:auto;font-family:"Manrope", Sans-serif;font-size:80px;font-weight:400;line-height:1em;color:rgba(255, 255, 255, 0.2);}.elementor-6391 .elementor-element.elementor-element-3f4733e > .elementor-widget-container{margin:0px 0px -45px -35px;}.elementor-6391 .elementor-element.elementor-element-ef6b4c6{z-index:1;}.elementor-6391 .elementor-element.elementor-element-ef6b4c6 .title{font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-5328959{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-42f2c39 img{border-radius:35px 35px 35px 35px;}.elementor-6391 .elementor-element.elementor-element-af64e2e{--spacer-size:112px;}.elementor-6391 .elementor-element.elementor-element-84c31e8 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-6391 .elementor-element.elementor-element-84c31e8{margin:0px 0px 80px 0px;}.elementor-6391 .elementor-element.elementor-element-d0d66d5 > .elementor-element-populated{padding:0% 15% 0% 15%;}.elementor-6391 .elementor-element.elementor-element-8cf396f{z-index:1;}.elementor-6391 .elementor-element.elementor-element-8cf396f .title{font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-5d68cd0{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-5204805{width:auto;max-width:auto;}.elementor-6391 .elementor-element.elementor-element-5204805 > .elementor-widget-container{margin:0px 15px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-7dd04f49 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-6391 .elementor-element.elementor-element-7dd04f49{margin:0px 0px 80px 0px;padding:90px 15px 90px 15px;}.elementor-6391 .elementor-element.elementor-element-11b0379b{z-index:1;}.elementor-6391 .elementor-element.elementor-element-11b0379b .title{color:#22E58A;font-size:40px;font-weight:100;}.elementor-6391 .elementor-element.elementor-element-11b0379b .title-after_title{color:#33D88B;}.elementor-6391 .elementor-element.elementor-element-80e3980{margin:0px 0px 20px 0px;padding:1px 1px 1px 1px;}.elementor-6391 .elementor-element.elementor-element-44716bc6{margin:0px 0px 80px 0px;}.elementor-6391 .elementor-element.elementor-element-dbd738d{margin:0px 0px 20px 0px;}.elementor-bc-flex-widget .elementor-6391 .elementor-element.elementor-element-693df9df.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-6391 .elementor-element.elementor-element-693df9df.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-6391 .elementor-element.elementor-element-693df9df.elementor-column > .elementor-widget-wrap{justify-content:space-between;}.elementor-6391 .elementor-element.elementor-element-426326fe{width:var( --container-widget-width, 118.375% );max-width:118.375%;--container-widget-width:118.375%;--container-widget-flex-grow:0;z-index:1;}.elementor-6391 .elementor-element.elementor-element-426326fe .title-after_title, .elementor-6391 .elementor-element.elementor-element-426326fe .title-subtitle, .elementor-6391 .elementor-element.elementor-element-426326fe .woodmart-title-container{max-width:100%;}.elementor-6391 .elementor-element.elementor-element-426326fe .title{font-size:40px;font-weight:100;}@media(max-width:1024px){.elementor-6391 .elementor-element.elementor-element-2bb5f50{margin:0px 0px 60px 0px;padding:60px 15px 60px 15px;}.elementor-6391 .elementor-element.elementor-element-372846f{margin:0px 0px 60px 0px;padding:60px 15px 60px 15px;}.elementor-6391 .elementor-element.elementor-element-14800a20{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-7b5d63a5 > .elementor-element-populated{margin:35px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-5dc654ee .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-107989a2{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-5844bef > .elementor-element-populated{padding:6% 15% 6% 15%;}.elementor-6391 .elementor-element.elementor-element-39a98bfb .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-4e015cb4 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-357e263b{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-6cdab0ed > .elementor-element-populated{margin:0px 0px 60px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-3d89c624 .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-f2846ab{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-797c41a > .elementor-element-populated{padding:6% 15% 6% 15%;}.elementor-6391 .elementor-element.elementor-element-ef6b4c6 .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-7d27c20 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-6391 .elementor-element.elementor-element-84c31e8{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-d0d66d5 > .elementor-element-populated{margin:0px 0px 60px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-8cf396f .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-7dd04f49{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-11b0379b .title{font-size:34px;}.elementor-6391 .elementor-element.elementor-element-44716bc6{margin:0px 0px 60px 0px;}.elementor-6391 .elementor-element.elementor-element-426326fe .title{font-size:34px;}}@media(max-width:767px){.elementor-6391 .elementor-element.elementor-element-2bb5f50{margin:0px 0px 40px 0px;padding:40px 15px 40px 15px;}.elementor-6391 .elementor-element.elementor-element-372846f{margin:0px 0px 40px 0px;padding:40px 15px 40px 15px;}.elementor-6391 .elementor-element.elementor-element-14800a20{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-5dc654ee .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-107989a2{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-39a98bfb .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-357e263b{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-6cdab0ed > .elementor-element-populated{margin:0px 0px 40px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-3d89c624 .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-f2846ab{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-3f4733e{font-size:70px;}.elementor-6391 .elementor-element.elementor-element-ef6b4c6 .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-84c31e8{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-d0d66d5 > .elementor-element-populated{margin:0px 0px 40px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-6391 .elementor-element.elementor-element-8cf396f .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-5d68cd0{text-align:justify;}.elementor-6391 .elementor-element.elementor-element-7dd04f49{margin:0px 0px 40px 0px;padding:80px 15px 80px 15px;}.elementor-6391 .elementor-element.elementor-element-11b0379b .title{font-size:28px;}.elementor-6391 .elementor-element.elementor-element-44716bc6{margin:0px 0px 40px 0px;}.elementor-6391 .elementor-element.elementor-element-426326fe .title{font-size:28px;}}@media(min-width:768px){.elementor-6391 .elementor-element.elementor-element-bebe8fc{width:21.896%;}.elementor-6391 .elementor-element.elementor-element-5b9127c{width:78.104%;}.elementor-6391 .elementor-element.elementor-element-3898fd1{width:25.414%;}.elementor-6391 .elementor-element.elementor-element-ea0751b{width:24.565%;}}@media(max-width:1024px) and (min-width:768px){.elementor-6391 .elementor-element.elementor-element-4633489c{width:100%;}.elementor-6391 .elementor-element.elementor-element-7b5d63a5{width:100%;}.elementor-6391 .elementor-element.elementor-element-5844bef{width:100%;}.elementor-6391 .elementor-element.elementor-element-4e015cb4{width:100%;}.elementor-6391 .elementor-element.elementor-element-1e1ca971{width:100%;}.elementor-6391 .elementor-element.elementor-element-6cdab0ed{width:100%;}.elementor-6391 .elementor-element.elementor-element-797c41a{width:100%;}.elementor-6391 .elementor-element.elementor-element-7d27c20{width:100%;}.elementor-6391 .elementor-element.elementor-element-1ab8db1{width:100%;}.elementor-6391 .elementor-element.elementor-element-d0d66d5{width:100%;}}/* Start custom CSS for column, class: .elementor-element-2c51af2b *//* ================================ تنظیمات اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b { --icon-color: #7CFFB2; --title-color: #F8FAFC; --text-color: #CBD5E1; --accent-color: #FFB45C; /* رنگ نور Hover */ --orange-glow: #FF8A3D; position: relative; overflow: hidden; border-radius: 24px; /* حالت عادی */ border: 1px solid rgba(255, 255, 255, 0.06); transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease; } /* ================================ نور مخفی پشت باکس ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b::before { content: ""; position: absolute; width: 180px; height: 180px; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.5); background: radial-gradient( circle, rgba(255, 138, 61, 0.35) 0%, rgba(255, 138, 61, 0.15) 35%, rgba(255, 138, 61, 0) 72% ); filter: blur(25px); opacity: 0; transition: opacity 0.5s ease, transform 0.5s ease; pointer-events: none; z-index: 0; } /* ================================ محتوای داخل باکس بالای نور ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b > * { position: relative; z-index: 2; } /* ================================ آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b .elementor-icon, .elementor-6391 .elementor-element.elementor-element-2c51af2b .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-2c51af2b svg { color: var(--icon-color) !important; fill: currentColor !important; stroke: currentColor !important; transition: color 0.35s ease, fill 0.35s ease, stroke 0.35s ease, filter 0.4s ease, transform 0.4s ease; } /* ================================ تیتر ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b h1, .elementor-6391 .elementor-element.elementor-element-2c51af2b h2, .elementor-6391 .elementor-element.elementor-element-2c51af2b h3, .elementor-6391 .elementor-element.elementor-element-2c51af2b h4, .elementor-6391 .elementor-element.elementor-element-2c51af2b h5, .elementor-6391 .elementor-element.elementor-element-2c51af2b h6, .elementor-6391 .elementor-element.elementor-element-2c51af2b .elementor-heading-title { color: var(--title-color) !important; transition: color 0.35s ease, transform 0.35s ease; } /* ================================ متن ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b p, .elementor-6391 .elementor-element.elementor-element-2c51af2b .elementor-icon-box-description, .elementor-6391 .elementor-element.elementor-element-2c51af2b .elementor-widget-text-editor { color: var(--text-color) !important; transition: color 0.35s ease; } /* ================================ جزئیات نارنجی ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b .accent, .elementor-6391 .elementor-element.elementor-element-2c51af2b .highlight { color: var(--accent-color) !important; transition: color 0.35s ease; } /* ================================ ✨ HOVER اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover { /* رنگ‌ها */ --icon-color: #FF9A4D; --title-color: #FFFFFF; --text-color: #F1F5F9; --accent-color: #FFB45C; /* کمی جدا شدن از صفحه */ transform: translateY(-7px); /* حاشیه نورانی */ border-color: rgba(255, 138, 61, 0.75); /* نور نارنجی چرمی */ box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.18), 0 10px 30px rgba(255, 138, 61, 0.18), 0 20px 55px rgba(255, 110, 40, 0.15), inset 0 0 25px rgba(255, 138, 61, 0.06); /* پس زمینه خیلی ظریف */ background: linear-gradient( 145deg, rgba(255, 138, 61, 0.10), rgba(255, 255, 255, 0.025) ); } /* ================================ فعال شدن نور داخلی ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover::before { opacity: 1; transform: translate(-50%, -50%) scale(1.5); } /* ================================ Glow روی آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover .elementor-icon, .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover svg { color: #FF9A4D !important; fill: currentColor !important; stroke: currentColor !important; filter: drop-shadow(0 0 6px rgba(255, 138, 61, 0.65)) drop-shadow(0 0 16px rgba(255, 100, 40, 0.35)); transform: scale(1.08); } /* ================================ تیتر در Hover ================================ */ .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover .elementor-heading-title { color: #FFFFFF !important; transform: translateY(-2px); } /* ================================ حالت موبایل ================================ */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-2c51af2b { border-radius: 20px; } .elementor-6391 .elementor-element.elementor-element-2c51af2b:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.15), 0 8px 25px rgba(255, 138, 61, 0.16); } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-8918ac4 *//* ================================ تنظیمات اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 { --icon-color: #7CFFB2; --title-color: #F8FAFC; --text-color: #CBD5E1; --accent-color: #FFB45C; /* رنگ نور Hover */ --orange-glow: #FF8A3D; position: relative; overflow: hidden; border-radius: 24px; /* حالت عادی */ border: 1px solid rgba(255, 255, 255, 0.06); transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease; } /* ================================ نور مخفی پشت باکس ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4::before { content: ""; position: absolute; width: 180px; height: 180px; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.5); background: radial-gradient( circle, rgba(255, 138, 61, 0.35) 0%, rgba(255, 138, 61, 0.15) 35%, rgba(255, 138, 61, 0) 72% ); filter: blur(25px); opacity: 0; transition: opacity 0.5s ease, transform 0.5s ease; pointer-events: none; z-index: 0; } /* ================================ محتوای داخل باکس بالای نور ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 > * { position: relative; z-index: 2; } /* ================================ آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 .elementor-icon, .elementor-6391 .elementor-element.elementor-element-8918ac4 .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-8918ac4 svg { color: var(--icon-color) !important; fill: currentColor !important; stroke: currentColor !important; transition: color 0.35s ease, fill 0.35s ease, stroke 0.35s ease, filter 0.4s ease, transform 0.4s ease; } /* ================================ تیتر ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 h1, .elementor-6391 .elementor-element.elementor-element-8918ac4 h2, .elementor-6391 .elementor-element.elementor-element-8918ac4 h3, .elementor-6391 .elementor-element.elementor-element-8918ac4 h4, .elementor-6391 .elementor-element.elementor-element-8918ac4 h5, .elementor-6391 .elementor-element.elementor-element-8918ac4 h6, .elementor-6391 .elementor-element.elementor-element-8918ac4 .elementor-heading-title { color: var(--title-color) !important; transition: color 0.35s ease, transform 0.35s ease; } /* ================================ متن ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 p, .elementor-6391 .elementor-element.elementor-element-8918ac4 .elementor-icon-box-description, .elementor-6391 .elementor-element.elementor-element-8918ac4 .elementor-widget-text-editor { color: var(--text-color) !important; transition: color 0.35s ease; } /* ================================ جزئیات نارنجی ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4 .accent, .elementor-6391 .elementor-element.elementor-element-8918ac4 .highlight { color: var(--accent-color) !important; transition: color 0.35s ease; } /* ================================ ✨ HOVER اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4:hover { /* رنگ‌ها */ --icon-color: #FF9A4D; --title-color: #FFFFFF; --text-color: #F1F5F9; --accent-color: #FFB45C; /* کمی جدا شدن از صفحه */ transform: translateY(-7px); /* حاشیه نورانی */ border-color: rgba(255, 138, 61, 0.75); /* نور نارنجی چرمی */ box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.18), 0 10px 30px rgba(255, 138, 61, 0.18), 0 20px 55px rgba(255, 110, 40, 0.15), inset 0 0 25px rgba(255, 138, 61, 0.06); /* پس زمینه خیلی ظریف */ background: linear-gradient( 145deg, rgba(255, 138, 61, 0.10), rgba(255, 255, 255, 0.025) ); } /* ================================ فعال شدن نور داخلی ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4:hover::before { opacity: 1; transform: translate(-50%, -50%) scale(1.5); } /* ================================ Glow روی آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4:hover .elementor-icon, .elementor-6391 .elementor-element.elementor-element-8918ac4:hover .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-8918ac4:hover svg { color: #FF9A4D !important; fill: currentColor !important; stroke: currentColor !important; filter: drop-shadow(0 0 6px rgba(255, 138, 61, 0.65)) drop-shadow(0 0 16px rgba(255, 100, 40, 0.35)); transform: scale(1.08); } /* ================================ تیتر در Hover ================================ */ .elementor-6391 .elementor-element.elementor-element-8918ac4:hover .elementor-heading-title { color: #FFFFFF !important; transform: translateY(-2px); } /* ================================ حالت موبایل ================================ */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-8918ac4 { border-radius: 20px; } .elementor-6391 .elementor-element.elementor-element-8918ac4:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.15), 0 8px 25px rgba(255, 138, 61, 0.16); } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-43aa5ac *//* ================================ تنظیمات اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac { --icon-color: #7CFFB2; --title-color: #F8FAFC; --text-color: #CBD5E1; --accent-color: #FFB45C; /* رنگ نور Hover */ --orange-glow: #FF8A3D; position: relative; overflow: hidden; border-radius: 24px; /* حالت عادی */ border: 1px solid rgba(255, 255, 255, 0.06); transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease; } /* ================================ نور مخفی پشت باکس ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac::before { content: ""; position: absolute; width: 180px; height: 180px; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.5); background: radial-gradient( circle, rgba(255, 138, 61, 0.35) 0%, rgba(255, 138, 61, 0.15) 35%, rgba(255, 138, 61, 0) 72% ); filter: blur(25px); opacity: 0; transition: opacity 0.5s ease, transform 0.5s ease; pointer-events: none; z-index: 0; } /* ================================ محتوای داخل باکس بالای نور ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac > * { position: relative; z-index: 2; } /* ================================ آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac .elementor-icon, .elementor-6391 .elementor-element.elementor-element-43aa5ac .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-43aa5ac svg { color: var(--icon-color) !important; fill: currentColor !important; stroke: currentColor !important; transition: color 0.35s ease, fill 0.35s ease, stroke 0.35s ease, filter 0.4s ease, transform 0.4s ease; } /* ================================ تیتر ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac h1, .elementor-6391 .elementor-element.elementor-element-43aa5ac h2, .elementor-6391 .elementor-element.elementor-element-43aa5ac h3, .elementor-6391 .elementor-element.elementor-element-43aa5ac h4, .elementor-6391 .elementor-element.elementor-element-43aa5ac h5, .elementor-6391 .elementor-element.elementor-element-43aa5ac h6, .elementor-6391 .elementor-element.elementor-element-43aa5ac .elementor-heading-title { color: var(--title-color) !important; transition: color 0.35s ease, transform 0.35s ease; } /* ================================ متن ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac p, .elementor-6391 .elementor-element.elementor-element-43aa5ac .elementor-icon-box-description, .elementor-6391 .elementor-element.elementor-element-43aa5ac .elementor-widget-text-editor { color: var(--text-color) !important; transition: color 0.35s ease; } /* ================================ جزئیات نارنجی ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac .accent, .elementor-6391 .elementor-element.elementor-element-43aa5ac .highlight { color: var(--accent-color) !important; transition: color 0.35s ease; } /* ================================ ✨ HOVER اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover { /* رنگ‌ها */ --icon-color: #FF9A4D; --title-color: #FFFFFF; --text-color: #F1F5F9; --accent-color: #FFB45C; /* کمی جدا شدن از صفحه */ transform: translateY(-7px); /* حاشیه نورانی */ border-color: rgba(255, 138, 61, 0.75); /* نور نارنجی چرمی */ box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.18), 0 10px 30px rgba(255, 138, 61, 0.18), 0 20px 55px rgba(255, 110, 40, 0.15), inset 0 0 25px rgba(255, 138, 61, 0.06); /* پس زمینه خیلی ظریف */ background: linear-gradient( 145deg, rgba(255, 138, 61, 0.10), rgba(255, 255, 255, 0.025) ); } /* ================================ فعال شدن نور داخلی ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover::before { opacity: 1; transform: translate(-50%, -50%) scale(1.5); } /* ================================ Glow روی آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover .elementor-icon, .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover svg { color: #FF9A4D !important; fill: currentColor !important; stroke: currentColor !important; filter: drop-shadow(0 0 6px rgba(255, 138, 61, 0.65)) drop-shadow(0 0 16px rgba(255, 100, 40, 0.35)); transform: scale(1.08); } /* ================================ تیتر در Hover ================================ */ .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover .elementor-heading-title { color: #FFFFFF !important; transform: translateY(-2px); } /* ================================ حالت موبایل ================================ */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-43aa5ac { border-radius: 20px; } .elementor-6391 .elementor-element.elementor-element-43aa5ac:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.15), 0 8px 25px rgba(255, 138, 61, 0.16); } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-5881976 *//* ================================ تنظیمات اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 { --icon-color: #7CFFB2; --title-color: #F8FAFC; --text-color: #CBD5E1; --accent-color: #FFB45C; /* رنگ نور Hover */ --orange-glow: #FF8A3D; position: relative; overflow: hidden; border-radius: 24px; /* حالت عادی */ border: 1px solid rgba(255, 255, 255, 0.06); transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease; } /* ================================ نور مخفی پشت باکس ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976::before { content: ""; position: absolute; width: 180px; height: 180px; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.5); background: radial-gradient( circle, rgba(255, 138, 61, 0.35) 0%, rgba(255, 138, 61, 0.15) 35%, rgba(255, 138, 61, 0) 72% ); filter: blur(25px); opacity: 0; transition: opacity 0.5s ease, transform 0.5s ease; pointer-events: none; z-index: 0; } /* ================================ محتوای داخل باکس بالای نور ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 > * { position: relative; z-index: 2; } /* ================================ آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 .elementor-icon, .elementor-6391 .elementor-element.elementor-element-5881976 .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-5881976 svg { color: var(--icon-color) !important; fill: currentColor !important; stroke: currentColor !important; transition: color 0.35s ease, fill 0.35s ease, stroke 0.35s ease, filter 0.4s ease, transform 0.4s ease; } /* ================================ تیتر ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 h1, .elementor-6391 .elementor-element.elementor-element-5881976 h2, .elementor-6391 .elementor-element.elementor-element-5881976 h3, .elementor-6391 .elementor-element.elementor-element-5881976 h4, .elementor-6391 .elementor-element.elementor-element-5881976 h5, .elementor-6391 .elementor-element.elementor-element-5881976 h6, .elementor-6391 .elementor-element.elementor-element-5881976 .elementor-heading-title { color: var(--title-color) !important; transition: color 0.35s ease, transform 0.35s ease; } /* ================================ متن ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 p, .elementor-6391 .elementor-element.elementor-element-5881976 .elementor-icon-box-description, .elementor-6391 .elementor-element.elementor-element-5881976 .elementor-widget-text-editor { color: var(--text-color) !important; transition: color 0.35s ease; } /* ================================ جزئیات نارنجی ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976 .accent, .elementor-6391 .elementor-element.elementor-element-5881976 .highlight { color: var(--accent-color) !important; transition: color 0.35s ease; } /* ================================ ✨ HOVER اصلی ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976:hover { /* رنگ‌ها */ --icon-color: #FF9A4D; --title-color: #FFFFFF; --text-color: #F1F5F9; --accent-color: #FFB45C; /* کمی جدا شدن از صفحه */ transform: translateY(-7px); /* حاشیه نورانی */ border-color: rgba(255, 138, 61, 0.75); /* نور نارنجی چرمی */ box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.18), 0 10px 30px rgba(255, 138, 61, 0.18), 0 20px 55px rgba(255, 110, 40, 0.15), inset 0 0 25px rgba(255, 138, 61, 0.06); /* پس زمینه خیلی ظریف */ background: linear-gradient( 145deg, rgba(255, 138, 61, 0.10), rgba(255, 255, 255, 0.025) ); } /* ================================ فعال شدن نور داخلی ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976:hover::before { opacity: 1; transform: translate(-50%, -50%) scale(1.5); } /* ================================ Glow روی آیکون ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976:hover .elementor-icon, .elementor-6391 .elementor-element.elementor-element-5881976:hover .elementor-icon svg, .elementor-6391 .elementor-element.elementor-element-5881976:hover svg { color: #FF9A4D !important; fill: currentColor !important; stroke: currentColor !important; filter: drop-shadow(0 0 6px rgba(255, 138, 61, 0.65)) drop-shadow(0 0 16px rgba(255, 100, 40, 0.35)); transform: scale(1.08); } /* ================================ تیتر در Hover ================================ */ .elementor-6391 .elementor-element.elementor-element-5881976:hover .elementor-heading-title { color: #FFFFFF !important; transform: translateY(-2px); } /* ================================ حالت موبایل ================================ */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-5881976 { border-radius: 20px; } .elementor-6391 .elementor-element.elementor-element-5881976:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.15), 0 8px 25px rgba(255, 138, 61, 0.16); } }/* End custom CSS */ /* Start custom CSS for section, class: .elementor-element-372846f *//* ========================================= GISO / SNAPY - DARK GLASS رنگ ثابت در حالت عادی و Hover ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f { /* پس‌زمینه ثابت */ background: linear-gradient( 135deg, rgba(3, 15, 12, 0.58), rgba(18, 12, 8, 0.58), rgba(8, 14, 22, 0.62) ) !important; /* Glass */ backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px) !important; /* حاشیه */ border: 1px solid rgba(255, 255, 255, 0.14) !important; border-radius: 24px !important; /* سایه عادی */ box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important; position: relative; overflow: hidden; transform: translateY(0); transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.4s ease, box-shadow 0.4s ease !important; } /* ========================================= نور ترکیبی سبز + نارنجی ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f::before { content: ""; position: absolute; width: 280px; height: 280px; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.55); background: radial-gradient( circle at 35% 40%, rgba(0, 209, 102, 0.18) 0%, rgba(0, 209, 102, 0) 45% ), radial-gradient( circle at 65% 60%, rgba(255, 138, 61, 0.22) 0%, rgba(255, 138, 61, 0) 48% ); filter: blur(25px); opacity: 0; pointer-events: none; z-index: 0; transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1); } /* محتوای داخل کارت */ .elementor-6391 .elementor-element.elementor-element-372846f > * { position: relative; z-index: 2; } /* ========================================= HOVER فقط افکت و نور تغییر می‌کند ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f:hover { transform: translateY(-7px) !important; /* همان رنگ پس‌زمینه حالت عادی */ border-color: rgba(255, 138, 61, 0.65) !important; box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.10), 0 12px 30px rgba(0, 0, 0, 0.30), 0 18px 45px rgba(255, 110, 40, 0.14), 0 0 35px rgba(0, 209, 102, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important; } /* ========================================= فعال شدن نور ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f:hover::before { opacity: 1; transform: translate(-50%, -50%) scale(1.4); } /* ========================================= خط نور بالای کارت ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f::after { content: ""; position: absolute; top: 0; left: 12%; right: 12%; height: 1px; background: linear-gradient( 90deg, transparent, rgba(0, 209, 102, 0.45), rgba(255, 138, 61, 0.7), transparent ); opacity: 0.7; transition: opacity 0.4s ease, filter 0.4s ease; } .elementor-6391 .elementor-element.elementor-element-372846f:hover::after { opacity: 1; filter: drop-shadow(0 0 5px rgba(255, 138, 61, 0.5)); } /* ========================================= خوانایی متن ========================================= */ .elementor-6391 .elementor-element.elementor-element-372846f:hover .elementor-heading-title, .elementor-6391 .elementor-element.elementor-element-372846f:hover h1, .elementor-6391 .elementor-element.elementor-element-372846f:hover h2, .elementor-6391 .elementor-element.elementor-element-372846f:hover h3, .elementor-6391 .elementor-element.elementor-element-372846f:hover h4, .elementor-6391 .elementor-element.elementor-element-372846f:hover h5, .elementor-6391 .elementor-element.elementor-element-372846f:hover h6 { color: #FFFFFF !important; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45); } .elementor-6391 .elementor-element.elementor-element-372846f:hover .elementor-icon-box-description, .elementor-6391 .elementor-element.elementor-element-372846f:hover p, .elementor-6391 .elementor-element.elementor-element-372846f:hover .elementor-widget-text-editor { color: #E2E8F0 !important; text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35); } /* ========================================= موبایل ========================================= */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-372846f { border-radius: 20px !important; } .elementor-6391 .elementor-element.elementor-element-372846f:hover { transform: translateY(-4px) !important; box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.10), 0 10px 28px rgba(0, 0, 0, 0.28), 0 0 25px rgba(255, 138, 61, 0.10), 0 0 20px rgba(0, 209, 102, 0.07) !important; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-4633489c *//* ========================================= PRODUCT IMAGE CONTAINER GISO / SNAPY STYLE ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c { position: relative; overflow: hidden; /* اندازه و فرم */ border-radius: 28px; /* Dark Glass */ background: linear-gradient( 145deg, rgba(3, 15, 12, 0.58), rgba(18, 12, 8, 0.58), rgba(8, 14, 22, 0.62) ) !important; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); /* حاشیه */ border: 1px solid rgba(255, 255, 255, 0.12); /* عمق */ box-shadow: 0 10px 35px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.05); transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.4s ease, box-shadow 0.45s ease; } /* ========================================= نور داخلی سبز + نارنجی ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c::before { content: ""; position: absolute; inset: -25%; background: radial-gradient( circle at 25% 30%, rgba(0, 209, 102, 0.16) 0%, rgba(0, 209, 102, 0) 38% ), radial-gradient( circle at 75% 70%, rgba(255, 138, 61, 0.20) 0%, rgba(255, 138, 61, 0) 42% ); filter: blur(30px); opacity: 0.75; pointer-events: none; transition: opacity 0.5s ease, transform 0.6s ease; z-index: 0; } /* ========================================= لایه براق شیشه‌ای ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 42%; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0) ); pointer-events: none; opacity: 0.65; z-index: 1; } /* ========================================= عکس روی تمام افکت‌ها ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c img { position: relative; z-index: 2; width: 100%; transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), filter 0.45s ease; } /* ========================================= HOVER ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c:hover { transform: translateY(-8px); border-color: rgba(255, 138, 61, 0.65); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.08), 0 18px 40px rgba(0, 0, 0, 0.28), 0 20px 55px rgba(255, 110, 40, 0.14), 0 0 35px rgba(0, 209, 102, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.08); } /* ========================================= حرکت خیلی نرم عکس ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c:hover img { transform: scale(1.035); filter: brightness(1.04) saturate(1.05); } /* ========================================= تقویت نور Hover ========================================= */ .elementor-6391 .elementor-element.elementor-element-4633489c:hover::before { opacity: 1; transform: scale(1.08); } /* ========================================= موبایل ========================================= */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-4633489c { border-radius: 22px; } .elementor-6391 .elementor-element.elementor-element-4633489c:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25), 0 0 25px rgba(255, 138, 61, 0.10), 0 0 18px rgba(0, 209, 102, 0.06); } .elementor-6391 .elementor-element.elementor-element-4633489c:hover img { transform: scale(1.02); } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-7b5d63a5 *//* ================================================= LUXURY PRODUCT TEXT CARD GREEN + LEATHER ORANGE ================================================= */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 { position: relative; isolation: isolate; overflow: hidden; padding: 42px 38px; border-radius: 28px; /* Dark luxury glass */ background: linear-gradient( 135deg, rgba(3, 15, 12, 0.82), rgba(18, 12, 8, 0.76), rgba(8, 14, 22, 0.82) ) !important; backdrop-filter: blur(22px) saturate(120%); -webkit-backdrop-filter: blur(22px) saturate(120%); border: 1px solid rgba(255, 255, 255, 0.10); box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 0 rgba(0, 0, 0, 0.20); transform: translateY(0); transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.45s ease, box-shadow 0.55s ease; } /* ================================================ نور محیطی سبز ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5::before { content: ""; position: absolute; width: 260px; height: 260px; top: -90px; right: -70px; border-radius: 50%; background: radial-gradient( circle, rgba(0, 209, 102, 0.20) 0%, rgba(0, 209, 102, 0.07) 32%, rgba(0, 209, 102, 0) 72% ); filter: blur(15px); opacity: 0.65; pointer-events: none; z-index: -2; transition: transform 0.8s ease, opacity 0.5s ease; } /* ================================================ نور محیطی نارنجی ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5::after { content: ""; position: absolute; width: 260px; height: 260px; bottom: -110px; left: -80px; border-radius: 50%; background: radial-gradient( circle, rgba(255, 138, 61, 0.20) 0%, rgba(255, 138, 61, 0.06) 34%, rgba(255, 138, 61, 0) 72% ); filter: blur(18px); opacity: 0.58; pointer-events: none; z-index: -2; transition: transform 0.8s ease, opacity 0.5s ease; } /* ================================================ Shine متحرک ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-widget-container::before { content: ""; position: absolute; top: -120%; left: -40%; width: 35%; height: 260%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.045), transparent ); transform: rotate(18deg) translateX(-180px); opacity: 0; pointer-events: none; z-index: 3; transition: opacity 0.4s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1); } /* ================================================ محتوای داخل ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 > * { position: relative; z-index: 5; } /* ================================================ HOVER CARD ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover { transform: translateY(-10px); border-color: rgba(255, 138, 61, 0.58); box-shadow: 0 0 0 1px rgba(255, 138, 61, 0.08), 0 22px 55px rgba(0, 0, 0, 0.34), 0 18px 55px rgba(255, 110, 40, 0.12), 0 0 42px rgba(0, 209, 102, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.10); } /* ================================================ حرکت نورها ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover::before { transform: translate(-35px, 25px) scale(1.22); opacity: 0.95; } .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover::after { transform: translate(30px, -25px) scale(1.18); opacity: 0.9; } /* ================================================ فعال شدن Shine ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover .elementor-widget-container::before { opacity: 1; transform: rotate(18deg) translateX(680px); } /* ================================================ عنوان محصول ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-heading-title, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h1, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h2, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h3, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h4, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h5, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h6 { position: relative; color: #FFFFFF !important; letter-spacing: -0.3px; transition: transform 0.4s ease, text-shadow 0.4s ease, color 0.4s ease; } /* خط کوچک کنار عنوان */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-heading-title::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h1::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h2::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h3::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h4::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h5::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h6::before { content: ""; display: inline-block; width: 5px; height: 28px; margin-left: 10px; vertical-align: middle; border-radius: 999px; background: linear-gradient( 180deg, #00D166, #FF8A3D ); box-shadow: 0 0 12px rgba(0, 209, 102, 0.35), 0 0 12px rgba(255, 138, 61, 0.25); opacity: 0.95; } /* ================================================ متن توضیحات ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 p, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-text-editor, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-widget-text-editor { color: #CBD5E1 !important; line-height: 2; transition: color 0.4s ease, text-shadow 0.4s ease; } /* ================================================ مشخصات مهم محصول ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 strong, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 b { color: #FFB45C !important; transition: color 0.35s ease, text-shadow 0.35s ease; } /* ================================================ HOVER CONTENT ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover .elementor-heading-title, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h1, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h2, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h3, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h4, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h5, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover h6 { transform: translateX(-4px); text-shadow: 0 0 18px rgba(255, 138, 61, 0.18); } .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover p, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover .elementor-text-editor, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover .elementor-widget-text-editor { color: #E7EDF4 !important; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35); } .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover strong, .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover b { color: #FFC27D !important; text-shadow: 0 0 12px rgba(255, 138, 61, 0.28); } /* ================================================ خط جداکننده لوکس ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .luxury-divider { position: relative; height: 1px; margin: 22px 0; background: linear-gradient( 90deg, rgba(0, 209, 102, 0), rgba(0, 209, 102, 0.45), rgba(255, 138, 61, 0.70), rgba(255, 138, 61, 0) ); opacity: 0.7; } /* ================================================ گوشه‌های نورانی ================================================ */ .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .corner-glow { position: absolute; width: 90px; height: 90px; top: 0; right: 0; border-top-right-radius: 28px; border-top: 1px solid rgba(255, 138, 61, 0.35); border-right: 1px solid rgba(0, 209, 102, 0.30); opacity: 0.45; pointer-events: none; transition: opacity 0.4s ease, width 0.4s ease, height 0.4s ease; } .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover .corner-glow { width: 125px; height: 125px; opacity: 0.9; } /* ================================================ موبایل ================================================ */ @media (max-width: 767px) { .elementor-6391 .elementor-element.elementor-element-7b5d63a5 { padding: 28px 22px; border-radius: 22px; } .elementor-6391 .elementor-element.elementor-element-7b5d63a5:hover { transform: translateY(-5px); } .elementor-6391 .elementor-element.elementor-element-7b5d63a5 .elementor-heading-title::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h1::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h2::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h3::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h4::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h5::before, .elementor-6391 .elementor-element.elementor-element-7b5d63a5 h6::before { height: 22px; width: 4px; margin-left: 8px; } }/* End custom CSS */ /* Start custom CSS for section, class: .elementor-element-107989a2 *//* ================================================= ZARIF SNAP GREEN HOVER PRODUCT CARD ORIGINAL COLORS PRESERVED ================================================= */ .elementor-6391 .elementor-element.elementor-element-107989a2 { position:relative; isolation:isolate; overflow:hidden; padding:45px 42px; border-radius:30px; background: linear-gradient( 135deg, rgba(15,25,22,.95), rgba(25,18,12,.92), rgba(10,18,22,.95) ) !important; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 25px 70px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08); transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease, border-color .4s ease; } /* ===================================== ORIGINAL ORANGE LIGHT KEEP UNCHANGED ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2::before { content:""; position:absolute; width:320px; height:320px; top:-150px; right:-120px; background: radial-gradient( circle, rgba(185,106,61,.30), rgba(185,106,61,0) ); filter:blur(25px); z-index:-1; transition:.7s ease; } .elementor-6391 .elementor-element.elementor-element-107989a2::after { content:""; position:absolute; width:280px; height:280px; bottom:-130px; left:-100px; background: radial-gradient( circle, rgba(255,180,92,.18), rgba(255,180,92,0) ); filter:blur(25px); z-index:-1; transition:.7s ease; } /* ===================================== TOP LINE ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 { border-top: 3px solid transparent; border-image: linear-gradient( 90deg, #B96A3D, #FFB45C ) 1; } /* ===================================== CONTENT ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 > * { position:relative; z-index:2; } /* ===================================== TITLE ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 h1, .elementor-6391 .elementor-element.elementor-element-107989a2 h2, .elementor-6391 .elementor-element.elementor-element-107989a2 h3, .elementor-6391 .elementor-element.elementor-element-107989a2 h4, .elementor-6391 .elementor-element.elementor-element-107989a2 h5, .elementor-6391 .elementor-element.elementor-element-107989a2 h6, .elementor-6391 .elementor-element.elementor-element-107989a2 .elementor-heading-title { color:#FFFFFF !important; font-weight:900; line-height:1.6; position:relative; padding-right:18px; transition:.45s ease; } .elementor-6391 .elementor-element.elementor-element-107989a2 h1::before, .elementor-6391 .elementor-element.elementor-element-107989a2 h2::before, .elementor-6391 .elementor-element.elementor-element-107989a2 h3::before, .elementor-6391 .elementor-element.elementor-element-107989a2 h4::before, .elementor-6391 .elementor-element.elementor-element-107989a2 h5::before, .elementor-6391 .elementor-element.elementor-element-107989a2 h6::before, .elementor-6391 .elementor-element.elementor-element-107989a2 .elementor-heading-title::before { content:""; position:absolute; right:0; top:12%; width:5px; height:75%; border-radius:20px; background: linear-gradient( 180deg, #FFB45C, #B96A3D ); }/* ===================================== TEXT ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 p, .elementor-6391 .elementor-element.elementor-element-107989a2 .elementor-widget-text-editor { color:#D5DAD8 !important; font-size:16px; line-height:2.25; } .elementor-6391 .elementor-element.elementor-element-107989a2 strong, .elementor-6391 .elementor-element.elementor-element-107989a2 b { color:#FFB45C !important; } /* ===================================== BUTTON ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 .elementor-button { background: linear-gradient( 135deg, #B96A3D, #8E4B28 ); color:white; border-radius:50px; padding:14px 35px; font-weight:800; box-shadow: 0 10px 30px rgba(185,106,61,.30); transition:.4s ease; } .elementor-6391 .elementor-element.elementor-element-107989a2 .elementor-button:hover { background: linear-gradient( 135deg, #D58A52, #B96A3D ); transform: translateY(-3px); } /* ===================================== IMAGE BOX ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 .product-image { background:white; border-radius:30px; padding:18px; box-shadow: 0 25px 60px rgba(0,0,0,.18); transition:.5s ease; } /* ===================================== SNAP GREEN HOVER ONLY EXTERNAL EFFECT NO INNER COLOR CHANGE ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2:hover { transform: translateY(-12px); border-color: rgba(0,209,112,.75); box-shadow: 0 35px 90px rgba(0,0,0,.50), 0 0 45px rgba(0,209,112,.35), 0 0 80px rgba(0,209,112,.12); } /* عمداً به before و after دست نزدیم تا رنگ داخل کانتینر ثابت بماند */ .elementor-6391 .elementor-element.elementor-element-107989a2:hover h1, .elementor-6391 .elementor-element.elementor-element-107989a2:hover h2, .elementor-6391 .elementor-element.elementor-element-107989a2:hover h3, .elementor-6391 .elementor-element.elementor-element-107989a2:hover h4, .elementor-6391 .elementor-element.elementor-element-107989a2:hover h5, .elementor-6391 .elementor-element.elementor-element-107989a2:hover h6, .elementor-6391 .elementor-element.elementor-element-107989a2:hover .elementor-heading-title { transform: translateX(-6px); text-shadow: 0 0 18px rgba(0,209,112,.35); } .elementor-6391 .elementor-element.elementor-element-107989a2:hover .product-image { transform: translateY(-8px) scale(1.03); box-shadow: 0 35px 80px rgba(0,0,0,.30); } /* ===================================== MOTION ===================================== */ .elementor-6391 .elementor-element.elementor-element-107989a2 { animation: zarifEnter 1s cubic-bezier(.22,1,.36,1) both; } @keyframes zarifEnter { from { opacity:0; transform: translateY(40px); } to { opacity:1; transform: translateY(0); } } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-107989a2 { padding:28px 22px; border-radius:22px; } .elementor-6391 .elementor-element.elementor-element-107989a2:hover { transform: translateY(-5px); } .elementor-6391 .elementor-element.elementor-element-107989a2 p { font-size:14px; line-height:2; } }/* End custom CSS */ /* Start custom CSS for section, class: .elementor-element-f2846ab *//* ================================================= ZARIF LEATHER ORANGE PRODUCT CARD INDUSTRIAL LUXURY + ORANGE HOVER ================================================= */ .elementor-6391 .elementor-element.elementor-element-f2846ab { position:relative; isolation:isolate; overflow:hidden; padding:45px 42px; border-radius:30px; background: linear-gradient( 135deg, rgba(15,25,22,.95), rgba(25,18,12,.92), rgba(10,18,22,.95) ) !important; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 25px 70px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08); transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease, border-color .4s ease; } /* ===================================== ORANGE LEATHER LIGHT ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab::before { content:""; position:absolute; width:320px; height:320px; top:-150px; right:-120px; background: radial-gradient( circle, rgba(185,106,61,.30), rgba(185,106,61,0) ); filter:blur(25px); z-index:-1; transition:.7s ease; } /* ===================================== WARM GOLD LIGHT ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab::after { content:""; position:absolute; width:280px; height:280px; bottom:-130px; left:-100px; background: radial-gradient( circle, rgba(255,180,92,.18), rgba(255,180,92,0) ); filter:blur(25px); z-index:-1; transition:.7s ease; } /* ===================================== TOP LINE ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab { border-top: 3px solid transparent; border-image: linear-gradient( 90deg, #B96A3D, #FFB45C ) 1; } /* ===================================== CONTENT ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab > * { position:relative; z-index:2; } /* ===================================== TITLE ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab h1, .elementor-6391 .elementor-element.elementor-element-f2846ab h2, .elementor-6391 .elementor-element.elementor-element-f2846ab h3, .elementor-6391 .elementor-element.elementor-element-f2846ab h4, .elementor-6391 .elementor-element.elementor-element-f2846ab h5, .elementor-6391 .elementor-element.elementor-element-f2846ab h6, .elementor-6391 .elementor-element.elementor-element-f2846ab .elementor-heading-title { color:#FFFFFF !important; font-weight:900; line-height:1.6; position:relative; padding-right:18px; transition:.45s ease; } .elementor-6391 .elementor-element.elementor-element-f2846ab h1::before, .elementor-6391 .elementor-element.elementor-element-f2846ab h2::before, .elementor-6391 .elementor-element.elementor-element-f2846ab h3::before, .elementor-6391 .elementor-element.elementor-element-f2846ab h4::before, .elementor-6391 .elementor-element.elementor-element-f2846ab h5::before, .elementor-6391 .elementor-element.elementor-element-f2846ab h6::before, .elementor-6391 .elementor-element.elementor-element-f2846ab .elementor-heading-title::before { content:""; position:absolute; right:0; top:12%; width:5px; height:75%; border-radius:20px; background: linear-gradient( 180deg, #FFB45C, #B96A3D ); } /* ===================================== TEXT ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab p, .elementor-6391 .elementor-element.elementor-element-f2846ab .elementor-widget-text-editor { color:#D5DAD8 !important; font-size:16px; line-height:2.25; } /* ===================================== IMPORTANT WORDS ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab strong, .elementor-6391 .elementor-element.elementor-element-f2846ab b { color:#FFB45C !important; } /* ===================================== BUTTON ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab .elementor-button { background: linear-gradient( 135deg, #B96A3D, #8E4B28 ); color:white; border-radius:50px; padding:14px 35px; font-weight:800; box-shadow: 0 10px 30px rgba(185,106,61,.30); transition:.4s ease; } .elementor-6391 .elementor-element.elementor-element-f2846ab .elementor-button:hover { background: linear-gradient( 135deg, #D58A52, #B96A3D ); transform: translateY(-3px); } /* ===================================== IMAGE BOX ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab .product-image { background:white; border-radius:30px; padding:18px; box-shadow: 0 25px 60px rgba(0,0,0,.18); transition:.5s ease; } /* ===================================== LEATHER ORANGE HOVER ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab:hover { transform: translateY(-12px); border-color: rgba(255,180,92,.75); box-shadow: 0 35px 90px rgba(0,0,0,.50), 0 0 45px rgba(185,106,61,.35), 0 0 80px rgba(255,180,92,.12); } .elementor-6391 .elementor-element.elementor-element-f2846ab:hover::before { transform: translate(-25px,25px) scale(1.18); opacity:.95; } .elementor-6391 .elementor-element.elementor-element-f2846ab:hover::after { transform: translate(25px,-25px) scale(1.15); opacity:.9; } .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h1, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h2, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h3, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h4, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h5, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover h6, .elementor-6391 .elementor-element.elementor-element-f2846ab:hover .elementor-heading-title { transform: translateX(-6px); text-shadow: 0 0 18px rgba(255,180,92,.35); } .elementor-6391 .elementor-element.elementor-element-f2846ab:hover .product-image { transform: translateY(-8px) scale(1.03); box-shadow: 0 35px 80px rgba(0,0,0,.30); } /* ===================================== MOTION ===================================== */ .elementor-6391 .elementor-element.elementor-element-f2846ab { animation: zarifEnter 1s cubic-bezier(.22,1,.36,1) both; } @keyframes zarifEnter { from { opacity:0; transform: translateY(40px); } to { opacity:1; transform: translateY(0); } } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-f2846ab { padding:28px 22px; border-radius:22px; } .elementor-6391 .elementor-element.elementor-element-f2846ab:hover { transform: translateY(-5px); } .elementor-6391 .elementor-element.elementor-element-f2846ab p { font-size:14px; line-height:2; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-3898fd1 *//* ================================================= ZARIF BRAND LOGO CARD SNAP GREEN + LEATHER ORANGE LIGHTER GLASS / SAME HOVER & ANIMATION ================================================= */ .elementor-6391 .elementor-element.elementor-element-3898fd1 { position:relative; display:flex; align-items:center; justify-content:center; height:120px; padding:25px; border-radius:24px; background: linear-gradient( 135deg, rgba(255,255,255,.28), rgba(255,255,255,.14) ) !important; border: 1px solid rgba(255,255,255,.38); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow: 0 15px 40px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.55); transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .45s ease; overflow:hidden; } /* ===================================== نور سبز داخل کارت ===================================== */ .elementor-6391 .elementor-element.elementor-element-3898fd1::before { content:""; position:absolute; width:120px; height:120px; top:-50px; right:-40px; background: radial-gradient( circle, rgba(0,209,112,.25), transparent 70% ); filter:blur(20px); opacity:0; transition:.5s ease; } /* ===================================== نور نارنجی ===================================== */ .elementor-6391 .elementor-element.elementor-element-3898fd1::after { content:""; position:absolute; width:100px; height:100px; bottom:-40px; left:-30px; background: radial-gradient( circle, rgba(185,106,61,.25), transparent 70% ); filter:blur(18px); opacity:0; transition:.5s ease; } /* ===================================== IMAGE LOGO ===================================== */ .elementor-6391 .elementor-element.elementor-element-3898fd1 img { max-width:150px; max-height:55px; object-fit:contain; filter: filter: none; opacity:1; transition: transform .45s ease, filter .45s ease, opacity .45s ease; position:relative; z-index:2; } /* ===================================== HOVER ===================================== */ .elementor-6391 .elementor-element.elementor-element-3898fd1:hover { transform: translateY(-10px) scale(1.04); border-color: rgba(0,209,112,.55); box-shadow: 0 25px 60px rgba(0,0,0,.35), 0 0 35px rgba(0,209,112,.25), 0 0 60px rgba(185,106,61,.15); } .elementor-6391 .elementor-element.elementor-element-3898fd1:hover::before { opacity:1; } .elementor-6391 .elementor-element.elementor-element-3898fd1:hover::after { opacity:1; } .elementor-6391 .elementor-element.elementor-element-3898fd1:hover img { filter: grayscale(0) brightness(1); opacity:1; transform: scale(1.08); } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-3898fd1 { height:95px; padding:18px; border-radius:20px; } .elementor-6391 .elementor-element.elementor-element-3898fd1 img { max-width:120px; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-ea0751b *//* ================================================= ZARIF BRAND LOGO CARD SNAP GREEN + LEATHER ORANGE LIGHTER GLASS / SAME HOVER & ANIMATION ================================================= */ .elementor-6391 .elementor-element.elementor-element-ea0751b { position:relative; display:flex; align-items:center; justify-content:center; height:120px; padding:25px; border-radius:24px; background: linear-gradient( 135deg, rgba(255,255,255,.28), rgba(255,255,255,.14) ) !important; border: 1px solid rgba(255,255,255,.38); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow: 0 15px 40px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.55); transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .45s ease; overflow:hidden; } /* ===================================== نور سبز داخل کارت ===================================== */ .elementor-6391 .elementor-element.elementor-element-ea0751b::before { content:""; position:absolute; width:120px; height:120px; top:-50px; right:-40px; background: radial-gradient( circle, rgba(0,209,112,.25), transparent 70% ); filter:blur(20px); opacity:0; transition:.5s ease; } /* ===================================== نور نارنجی ===================================== */ .elementor-6391 .elementor-element.elementor-element-ea0751b::after { content:""; position:absolute; width:100px; height:100px; bottom:-40px; left:-30px; background: radial-gradient( circle, rgba(185,106,61,.25), transparent 70% ); filter:blur(18px); opacity:0; transition:.5s ease; } /* ===================================== IMAGE LOGO ===================================== */ .elementor-6391 .elementor-element.elementor-element-ea0751b img { max-width:150px; max-height:55px; object-fit:contain; filter: filter: none; opacity:1; transition: transform .45s ease, filter .45s ease, opacity .45s ease; position:relative; z-index:2; } /* ===================================== HOVER ===================================== */ .elementor-6391 .elementor-element.elementor-element-ea0751b:hover { transform: translateY(-10px) scale(1.04); border-color: rgba(0,209,112,.55); box-shadow: 0 25px 60px rgba(0,0,0,.35), 0 0 35px rgba(0,209,112,.25), 0 0 60px rgba(185,106,61,.15); } .elementor-6391 .elementor-element.elementor-element-ea0751b:hover::before { opacity:1; } .elementor-6391 .elementor-element.elementor-element-ea0751b:hover::after { opacity:1; } .elementor-6391 .elementor-element.elementor-element-ea0751b:hover img { filter: grayscale(0) brightness(1); opacity:1; transform: scale(1.08); } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-ea0751b { height:95px; padding:18px; border-radius:20px; } .elementor-6391 .elementor-element.elementor-element-ea0751b img { max-width:120px; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-54f86f0 *//* ================================================= ZARIF BRAND LOGO CARD SNAP GREEN + LEATHER ORANGE LIGHTER GLASS / SAME HOVER & ANIMATION ================================================= */ .elementor-6391 .elementor-element.elementor-element-54f86f0 { position:relative; display:flex; align-items:center; justify-content:center; height:120px; padding:25px; border-radius:24px; background: linear-gradient( 135deg, rgba(255,255,255,.28), rgba(255,255,255,.14) ) !important; border: 1px solid rgba(255,255,255,.38); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow: 0 15px 40px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.55); transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .45s ease; overflow:hidden; } /* ===================================== نور سبز داخل کارت ===================================== */ .elementor-6391 .elementor-element.elementor-element-54f86f0::before { content:""; position:absolute; width:120px; height:120px; top:-50px; right:-40px; background: radial-gradient( circle, rgba(0,209,112,.25), transparent 70% ); filter:blur(20px); opacity:0; transition:.5s ease; } /* ===================================== نور نارنجی ===================================== */ .elementor-6391 .elementor-element.elementor-element-54f86f0::after { content:""; position:absolute; width:100px; height:100px; bottom:-40px; left:-30px; background: radial-gradient( circle, rgba(185,106,61,.25), transparent 70% ); filter:blur(18px); opacity:0; transition:.5s ease; } /* ===================================== IMAGE LOGO ===================================== */ .elementor-6391 .elementor-element.elementor-element-54f86f0 img { max-width:150px; max-height:55px; object-fit:contain; filter: filter: none; opacity:1; transition: transform .45s ease, filter .45s ease, opacity .45s ease; position:relative; z-index:2; } /* ===================================== HOVER ===================================== */ .elementor-6391 .elementor-element.elementor-element-54f86f0:hover { transform: translateY(-10px) scale(1.04); border-color: rgba(0,209,112,.55); box-shadow: 0 25px 60px rgba(0,0,0,.35), 0 0 35px rgba(0,209,112,.25), 0 0 60px rgba(185,106,61,.15); } .elementor-6391 .elementor-element.elementor-element-54f86f0:hover::before { opacity:1; } .elementor-6391 .elementor-element.elementor-element-54f86f0:hover::after { opacity:1; } .elementor-6391 .elementor-element.elementor-element-54f86f0:hover img { filter: grayscale(0) brightness(1); opacity:1; transform: scale(1.08); } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-54f86f0 { height:95px; padding:18px; border-radius:20px; } .elementor-6391 .elementor-element.elementor-element-54f86f0 img { max-width:120px; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-8c71540 *//* ================================================= ZARIF BRAND LOGO CARD SNAP GREEN + LEATHER ORANGE LIGHTER GLASS / SAME HOVER & ANIMATION ================================================= */ .elementor-6391 .elementor-element.elementor-element-8c71540 { position:relative; display:flex; align-items:center; justify-content:center; height:120px; padding:25px; border-radius:24px; background: linear-gradient( 135deg, rgba(255,255,255,.28), rgba(255,255,255,.14) ) !important; border: 1px solid rgba(255,255,255,.38); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow: 0 15px 40px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.55); transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .45s ease; overflow:hidden; } /* ===================================== نور سبز داخل کارت ===================================== */ .elementor-6391 .elementor-element.elementor-element-8c71540::before { content:""; position:absolute; width:120px; height:120px; top:-50px; right:-40px; background: radial-gradient( circle, rgba(0,209,112,.25), transparent 70% ); filter:blur(20px); opacity:0; transition:.5s ease; } /* ===================================== نور نارنجی ===================================== */ .elementor-6391 .elementor-element.elementor-element-8c71540::after { content:""; position:absolute; width:100px; height:100px; bottom:-40px; left:-30px; background: radial-gradient( circle, rgba(185,106,61,.25), transparent 70% ); filter:blur(18px); opacity:0; transition:.5s ease; } /* ===================================== IMAGE LOGO ===================================== */ .elementor-6391 .elementor-element.elementor-element-8c71540 img { max-width:150px; max-height:55px; object-fit:contain; filter: filter: none; opacity:1; transition: transform .45s ease, filter .45s ease, opacity .45s ease; position:relative; z-index:2; } /* ===================================== HOVER ===================================== */ .elementor-6391 .elementor-element.elementor-element-8c71540:hover { transform: translateY(-10px) scale(1.04); border-color: rgba(0,209,112,.55); box-shadow: 0 25px 60px rgba(0,0,0,.35), 0 0 35px rgba(0,209,112,.25), 0 0 60px rgba(185,106,61,.15); } .elementor-6391 .elementor-element.elementor-element-8c71540:hover::before { opacity:1; } .elementor-6391 .elementor-element.elementor-element-8c71540:hover::after { opacity:1; } .elementor-6391 .elementor-element.elementor-element-8c71540:hover img { filter: grayscale(0) brightness(1); opacity:1; transform: scale(1.08); } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-8c71540 { height:95px; padding:18px; border-radius:20px; } .elementor-6391 .elementor-element.elementor-element-8c71540 img { max-width:120px; } }/* End custom CSS */ /* Start custom CSS for section, class: .elementor-element-7dd04f49 *//* ================================================= ZARIF PARTNER BRANDS SECTION INDUSTRIAL DARK GLASS STYLE ================================================= */ .elementor-6391 .elementor-element.elementor-element-7dd04f49 { position:relative; isolation:isolate; overflow:hidden; padding:70px 55px; border-radius:35px; background: linear-gradient( 135deg, #252B29, #303632, #1D2422 ) !important; border: 1px solid rgba(255,255,255,.10); box-shadow: 0 30px 80px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08); transition:.5s ease; } /* ===================================== GREEN SNAP LIGHT ===================================== */ .elementor-6391 .elementor-element.elementor-element-7dd04f49::before { content:""; position:absolute; width:360px; height:360px; top:-170px; right:-120px; background: radial-gradient( circle, rgba(0,209,112,.22), transparent 70% ); filter:blur(35px); z-index:-1; } /* ===================================== LEATHER ORANGE LIGHT ===================================== */ .elementor-6391 .elementor-element.elementor-element-7dd04f49::after { content:""; position:absolute; width:320px; height:320px; bottom:-150px; left:-120px; background: radial-gradient( circle, rgba(185,106,61,.25), transparent 70% ); filter:blur(35px); z-index:-1; } /* ===================================== TITLE ===================================== */ .elementor-6391 .elementor-element.elementor-element-7dd04f49 h1, .elementor-6391 .elementor-element.elementor-element-7dd04f49 h2, .elementor-6391 .elementor-element.elementor-element-7dd04f49 h3 { color:#FFFFFF !important; font-weight:900; } .elementor-6391 .elementor-element.elementor-element-7dd04f49 p { color:#C7D0CC !important; line-height:2; } /* ===================================== TITLE ACCENT ===================================== */ .elementor-6391 .elementor-element.elementor-element-7dd04f49 h1::before, .elementor-6391 .elementor-element.elementor-element-7dd04f49 h2::before, .elementor-6391 .elementor-element.elementor-element-7dd04f49 h3::before { content:""; display:inline-block; width:6px; height:30px; margin-left:12px; border-radius:20px; background: linear-gradient( 180deg, #00D170, #B96A3D ); vertical-align:middle; } /* ===================================== MOBILE ===================================== */ @media(max-width:767px){ .elementor-6391 .elementor-element.elementor-element-7dd04f49 { padding:35px 20px; border-radius:25px; } }/* End custom CSS */