.elementor-301 .elementor-element.elementor-element-f5c5b7d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-001973b{--display:flex;}.elementor-301 .elementor-element.elementor-element-e8891ff{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-301 .elementor-element.elementor-element-764d934{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-301 .elementor-element.elementor-element-8a7d274{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-8176f79{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-301 .elementor-element.elementor-element-989a7d3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-ad322a8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-afc46e3{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-301 .elementor-element.elementor-element-25303bb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-8c26808{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-f3dd509{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-83fa0e3{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-c353414{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-a685cb0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-ff344fc{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-b71eae4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-9d52e77{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-8f70288{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-6392850{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-0e6f13f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-44786ec{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-6a03a29{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-2b91766{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-4f1f995{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-e64223f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-030e717{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-f2255d5{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-a7da6b8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-c5b48b1{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-bb1f9b1{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-eaf4308{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-a8f3d96{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:140px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-301 .elementor-element.elementor-element-674da5e{--display:flex;--margin-top:-70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-301 .elementor-element.elementor-element-879f604{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-301 .elementor-element.elementor-element-0379321{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-301 .elementor-element.elementor-element-602b123{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}body.elementor-page-301:not(.elementor-motion-effects-element-type-background), body.elementor-page-301 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}@media(max-width:767px){.elementor-301 .elementor-element.elementor-element-daf1725{text-align:center;}}@media(min-width:768px){.elementor-301 .elementor-element.elementor-element-764d934{--width:50%;}.elementor-301 .elementor-element.elementor-element-8a7d274{--width:50%;}.elementor-301 .elementor-element.elementor-element-989a7d3{--width:50%;}.elementor-301 .elementor-element.elementor-element-ad322a8{--width:50%;}.elementor-301 .elementor-element.elementor-element-25303bb{--width:50%;}.elementor-301 .elementor-element.elementor-element-8c26808{--width:50%;}.elementor-301 .elementor-element.elementor-element-0379321{--width:50%;}.elementor-301 .elementor-element.elementor-element-602b123{--width:50%;}}/* Start custom CSS for image, class: .elementor-element-80b0933 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-80b0933 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-80b0933::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-80b0933::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-80b0933 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-80b0933:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-80b0933:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-80b0933:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-80b0933 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-80b0933:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-80b0933 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-80b0933 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-80b0933, .elementor-301 .elementor-element.elementor-element-80b0933::before, .elementor-301 .elementor-element.elementor-element-80b0933::after, .elementor-301 .elementor-element.elementor-element-80b0933 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-32abf6d *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-32abf6d { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-32abf6d::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-32abf6d::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-32abf6d img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-32abf6d:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-32abf6d:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-32abf6d:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-32abf6d { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-32abf6d:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-32abf6d { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-32abf6d img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-32abf6d, .elementor-301 .elementor-element.elementor-element-32abf6d::before, .elementor-301 .elementor-element.elementor-element-32abf6d::after, .elementor-301 .elementor-element.elementor-element-32abf6d img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-2482f96 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-2482f96 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-2482f96::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-2482f96::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-2482f96 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-2482f96:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-2482f96:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-2482f96:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-2482f96 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-2482f96:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-2482f96 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-2482f96 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-2482f96, .elementor-301 .elementor-element.elementor-element-2482f96::before, .elementor-301 .elementor-element.elementor-element-2482f96::after, .elementor-301 .elementor-element.elementor-element-2482f96 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-eee5a5d *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-eee5a5d { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-eee5a5d::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-eee5a5d::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-eee5a5d img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-eee5a5d:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-eee5a5d:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-eee5a5d:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-eee5a5d { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-eee5a5d:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-eee5a5d { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-eee5a5d img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-eee5a5d, .elementor-301 .elementor-element.elementor-element-eee5a5d::before, .elementor-301 .elementor-element.elementor-element-eee5a5d::after, .elementor-301 .elementor-element.elementor-element-eee5a5d img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-b19ba29 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-b19ba29 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-b19ba29::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-b19ba29::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-b19ba29 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-b19ba29:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-b19ba29:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-b19ba29:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-b19ba29 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-b19ba29:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-b19ba29 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-b19ba29 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-b19ba29, .elementor-301 .elementor-element.elementor-element-b19ba29::before, .elementor-301 .elementor-element.elementor-element-b19ba29::after, .elementor-301 .elementor-element.elementor-element-b19ba29 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-eeb1099 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-eeb1099 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-eeb1099::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-eeb1099::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-eeb1099 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-eeb1099:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-eeb1099:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-eeb1099:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-eeb1099 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-eeb1099:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-eeb1099 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-eeb1099 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-eeb1099, .elementor-301 .elementor-element.elementor-element-eeb1099::before, .elementor-301 .elementor-element.elementor-element-eeb1099::after, .elementor-301 .elementor-element.elementor-element-eeb1099 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-4f540f7 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-4f540f7 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-4f540f7::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-4f540f7::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-4f540f7 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-4f540f7:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-4f540f7:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-4f540f7:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-4f540f7 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-4f540f7:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-4f540f7 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-4f540f7 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-4f540f7, .elementor-301 .elementor-element.elementor-element-4f540f7::before, .elementor-301 .elementor-element.elementor-element-4f540f7::after, .elementor-301 .elementor-element.elementor-element-4f540f7 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-b951c95 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-b951c95 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-b951c95::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-b951c95::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-b951c95 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-b951c95:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-b951c95:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-b951c95:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-b951c95 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-b951c95:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-b951c95 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-b951c95 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-b951c95, .elementor-301 .elementor-element.elementor-element-b951c95::before, .elementor-301 .elementor-element.elementor-element-b951c95::after, .elementor-301 .elementor-element.elementor-element-b951c95 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-96c9feb *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-96c9feb { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-96c9feb::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-96c9feb::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-96c9feb img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-96c9feb:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-96c9feb:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-96c9feb:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-96c9feb { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-96c9feb:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-96c9feb { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-96c9feb img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-96c9feb, .elementor-301 .elementor-element.elementor-element-96c9feb::before, .elementor-301 .elementor-element.elementor-element-96c9feb::after, .elementor-301 .elementor-element.elementor-element-96c9feb img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-580fa0c *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-580fa0c { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-580fa0c::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-580fa0c::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-580fa0c img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-580fa0c:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-580fa0c:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-580fa0c:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-580fa0c { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-580fa0c:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-580fa0c { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-580fa0c img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-580fa0c, .elementor-301 .elementor-element.elementor-element-580fa0c::before, .elementor-301 .elementor-element.elementor-element-580fa0c::after, .elementor-301 .elementor-element.elementor-element-580fa0c img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-e9aeb88 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-e9aeb88 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-e9aeb88::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-e9aeb88::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-e9aeb88 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-e9aeb88:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-e9aeb88:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-e9aeb88:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-e9aeb88 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-e9aeb88:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-e9aeb88 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-e9aeb88 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-e9aeb88, .elementor-301 .elementor-element.elementor-element-e9aeb88::before, .elementor-301 .elementor-element.elementor-element-e9aeb88::after, .elementor-301 .elementor-element.elementor-element-e9aeb88 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-daf1725 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-daf1725 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-daf1725::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-daf1725::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-daf1725 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-daf1725:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-daf1725:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-daf1725:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-daf1725 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-daf1725:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-daf1725 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-daf1725 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-daf1725, .elementor-301 .elementor-element.elementor-element-daf1725::before, .elementor-301 .elementor-element.elementor-element-daf1725::after, .elementor-301 .elementor-element.elementor-element-daf1725 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-6975169 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-6975169 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-6975169::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-6975169::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-6975169 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-6975169:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-6975169:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-6975169:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-6975169 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-6975169:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-6975169 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-6975169 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-6975169, .elementor-301 .elementor-element.elementor-element-6975169::before, .elementor-301 .elementor-element.elementor-element-6975169::after, .elementor-301 .elementor-element.elementor-element-6975169 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-2e9e1f8 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-2e9e1f8 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-2e9e1f8::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-2e9e1f8::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-2e9e1f8 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-2e9e1f8:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-2e9e1f8:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-2e9e1f8:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-2e9e1f8 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-2e9e1f8:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-2e9e1f8 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-2e9e1f8 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-2e9e1f8, .elementor-301 .elementor-element.elementor-element-2e9e1f8::before, .elementor-301 .elementor-element.elementor-element-2e9e1f8::after, .elementor-301 .elementor-element.elementor-element-2e9e1f8 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-0d81cda *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-0d81cda { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-0d81cda::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-0d81cda::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-0d81cda img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-0d81cda:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-0d81cda:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-0d81cda:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-0d81cda { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-0d81cda:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-0d81cda { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-0d81cda img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-0d81cda, .elementor-301 .elementor-element.elementor-element-0d81cda::before, .elementor-301 .elementor-element.elementor-element-0d81cda::after, .elementor-301 .elementor-element.elementor-element-0d81cda img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-f0127d6 *//* ========================================= PREMIUM CLIENT LOGO — ELEMENTOR ========================================= */ .elementor-301 .elementor-element.elementor-element-f0127d6 { position: relative; display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 22px 30px; border-radius: 24px; background: linear-gradient( 135deg, rgba(255,255,255,0.98) 0%, rgba(250,249,255,0.94) 50%, rgba(245,243,252,0.98) 100% ); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 8px 25px rgba(61,43,119,0.10), inset 0 1px 0 rgba(255,255,255,1); overflow: hidden; transform: translateZ(0); transition: transform 0.5s cubic-bezier(.16,1,.3,1), box-shadow 0.5s ease, border-color 0.5s ease; } /* ========================================= PURPLE / RED AMBIENT GLOW ========================================= */ .elementor-301 .elementor-element.elementor-element-f0127d6::after { content: ""; position: absolute; width: 180%; height: 180%; left: -40%; top: -40%; background: radial-gradient( circle at 25% 35%, rgba(61,43,119,0.20), transparent 30% ), radial-gradient( circle at 75% 70%, rgba(220,25,35,0.14), transparent 28% ); filter: blur(30px); opacity: 0.35; pointer-events: none; transition: opacity 0.5s ease, transform 0.8s ease; } /* ========================================= ANIMATED LIGHT SWEEP ========================================= */ .elementor-301 .elementor-element.elementor-element-f0127d6::before { content: ""; position: absolute; top: -30%; left: -80%; width: 45%; height: 160%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: rotate(18deg); pointer-events: none; z-index: 3; animation: logoLightSweep 5s ease-in-out infinite; } /* ========================================= LOGO IMAGE ========================================= */ .elementor-301 .elementor-element.elementor-element-f0127d6 img { position: relative; z-index: 4; display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 7px 10px rgba(0,0,0,0.08)); transform: translateZ(0); transition: transform 0.55s cubic-bezier(.16,1,.3,1), filter 0.55s ease; } /* ========================================= HOVER EFFECT ========================================= */ .elementor-301 .elementor-element.elementor-element-f0127d6:hover { transform: translateY(-9px) scale(1.025); border-color: rgba(61,43,119,0.22); box-shadow: 0 30px 70px rgba(0,0,0,0.17), 0 12px 35px rgba(61,43,119,0.14), 0 0 45px rgba(61,43,119,0.08), inset 0 1px 0 rgba(255,255,255,1); } .elementor-301 .elementor-element.elementor-element-f0127d6:hover::after { opacity: 0.75; transform: scale(1.12) rotate(8deg); } .elementor-301 .elementor-element.elementor-element-f0127d6:hover img { transform: scale(1.07) translateY(-2px); filter: drop-shadow(0 12px 20px rgba(61,43,119,0.20)); } /* ========================================= MOVING LIGHT ========================================= */ @keyframes logoLightSweep { 0% { left: -90%; opacity: 0; } 12% { opacity: 1; } 32% { left: 150%; opacity: 0; } 100% { left: 150%; opacity: 0; } } /* ========================================= VERY SUBTLE FLOAT ========================================= */ @keyframes logoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .elementor-301 .elementor-element.elementor-element-f0127d6 { animation: logoFloat 5s ease-in-out infinite; } /* Pause floating on hover */ .elementor-301 .elementor-element.elementor-element-f0127d6:hover { animation-play-state: paused; } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .elementor-301 .elementor-element.elementor-element-f0127d6 { padding: 15px 19px; border-radius: 18px; } .elementor-301 .elementor-element.elementor-element-f0127d6 img { width: 145px; } } /* ========================================= REDUCE MOTION ========================================= */ @media (prefers-reduced-motion: reduce) { .elementor-301 .elementor-element.elementor-element-f0127d6, .elementor-301 .elementor-element.elementor-element-f0127d6::before, .elementor-301 .elementor-element.elementor-element-f0127d6::after, .elementor-301 .elementor-element.elementor-element-f0127d6 img { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-5aba2b2 *//* ========================================= SUN VORTEX — CLEAN BLACK HERO ========================================= */ .sv-hero-section { position: relative; width: 100%; min-height: 560px; box-sizing: border-box; padding: 38px 6% 42px; background: #000000 !important; color: #ffffff; overflow: hidden; font-family: Inter, Arial, Helvetica, sans-serif; } /* ========================================= SUBTLE BACKGROUND — STILL BLACK ========================================= */ .sv-bg-glow { position: absolute; pointer-events: none; border-radius: 50%; filter: blur(90px); opacity: .12; } .sv-glow-left { width: 280px; height: 280px; left: -180px; bottom: -150px; background: #ff7200; } .sv-glow-right { width: 300px; height: 300px; right: -180px; top: 100px; background: #ff7200; } /* ========================================= TOP BADGE ========================================= */ .sv-top-badge { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 9px; padding: 8px 15px; border: 1px solid rgba(255,150,30,.7); border-radius: 50px; background: #050505; color: #eeeeee; font-size: 10px; font-weight: 700; letter-spacing: .7px; box-shadow: 0 0 18px rgba(255,106,0,.10); } .sv-bolt { color: #ff9700; font-size: 13px; } .sv-top-badge i { width: 4px; height: 4px; background: #ff9700; border-radius: 50%; box-shadow: 0 0 8px #ff7600; } /* ========================================= MAIN HEADING ========================================= */ .sv-main-heading { position: relative; z-index: 2; max-width: 850px; margin: 20px 0 0; line-height: .98; letter-spacing: -1.8px; font-size: clamp(38px, 5vw, 64px); font-weight: 900; } .sv-main-heading span { display: block; } .sv-white { color: #f5f5f5; } .sv-orange { margin-top: 4px; background: linear-gradient( 90deg, #ff6b00, #ffb52b, #ff7600 ); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: svOrangeFlow 5s linear infinite; } @keyframes svOrangeFlow { to { background-position: 200% center; } } /* ========================================= SECOND HEADING ========================================= */ .sv-sub-heading { position: relative; z-index: 2; margin-top: 17px; display: flex; flex-direction: column; gap: 2px; font-size: clamp(24px, 3vw, 38px); line-height: 1.08; letter-spacing: -.8px; font-weight: 800; color: #f4f4f4; } .sv-sub-heading strong { position: relative; color: #ff9b18; } .sv-sub-heading strong::after { content: ""; position: absolute; left: 7%; right: 0; bottom: -6px; height: 2px; background: linear-gradient( 90deg, transparent, #ff7600, #ffb52b ); transform: rotate(-3deg); box-shadow: 0 0 8px rgba(255,106,0,.45); } /* ========================================= DESCRIPTION ========================================= */ .sv-description { position: relative; z-index: 2; max-width: 650px; margin: 22px 0 0; color: rgba(255,255,255,.68); font-size: 12.5px; line-height: 1.65; } /* ========================================= BUTTONS ========================================= */ .sv-buttons { position: relative; z-index: 2; display: flex; gap: 14px; margin-top: 22px; } .sv-btn { min-width: 195px; height: 46px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 11px; border-radius: 30px; text-decoration: none; font-size: 12px; font-weight: 800; transition: .35s ease; } .sv-btn b { font-size: 18px; font-weight: 500; } /* PRIMARY */ .sv-btn-primary { color: #090909; background: linear-gradient( 135deg, #ffbd35, #ff7600 ); box-shadow: 0 7px 25px rgba(255,106,0,.25); } .sv-btn-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 35px rgba(255,106,0,.38); } /* SECONDARY */ .sv-btn-secondary { color: #fff; background: #030303; border: 1px solid rgba(255,150,30,.7); } .sv-btn-secondary:hover { transform: translateY(-3px); background: #0a0a0a; box-shadow: 0 0 25px rgba(255,106,0,.13); } /* ========================================= STATS ========================================= */ .sv-stats { position: relative; z-index: 2; display: flex; align-items: center; gap: 25px; margin-top: 34px; } .sv-stat { display: flex; align-items: center; gap: 11px; } .sv-stat-icon { width: 43px; height: 43px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid rgba(255,150,30,.45); background: #050505; color: #ffab20; font-size: 20px; box-shadow: 0 0 15px rgba(255,106,0,.08); } .sv-stat strong { display: block; color: #ffab18; font-size: 21px; line-height: 1; font-weight: 900; } .sv-stat small { display: block; margin-top: 4px; color: rgba(255,255,255,.70); font-size: 10px; } .sv-stat-divider { width: 1px; height: 38px; background: linear-gradient( transparent, rgba(255,150,30,.55), transparent ); } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .sv-hero-section { min-height: auto; padding: 28px 20px 35px; background: #000000 !important; } .sv-top-badge { font-size: 8px; padding: 7px 11px; } .sv-main-heading { margin-top: 18px; font-size: clamp(32px, 9.5vw, 48px); letter-spacing: -1.3px; } .sv-sub-heading { margin-top: 15px; font-size: clamp(22px, 6.5vw, 32px); } .sv-description { margin-top: 19px; font-size: 11px; } .sv-buttons { flex-direction: column; gap: 9px; margin-top: 20px; } .sv-btn { width: 100%; min-width: 0; height: 45px; font-size: 11px; } .sv-stats { justify-content: space-between; gap: 8px; margin-top: 28px; } .sv-stat { flex-direction: column; gap: 6px; text-align: center; } .sv-stat-icon { width: 37px; height: 37px; font-size: 17px; } .sv-stat strong { font-size: 17px; } .sv-stat small { font-size: 8px; } .sv-stat-divider { height: 48px; } }/* End custom CSS */