1<!DOCTYPE html><!-- This site was created in Webflow. https://webflow.com --><!-- Last Published: Mon Aug 31 2026 14:13:45 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="webflow.elecctro.com" data-wf-page="686acfd9a00ef1a2d16c3607" data-wf-site="68376a06cad09fdde4574f6c" lang="en"><head><meta charset="utf-8"/><link href="https://cdn.prod.website-files.com" rel="preconnect" crossorigin="anonymous"/><title>About us</title><link rel="alternate" hrefLang="x-default" href="https://elecctro.com/about-us"/><link rel="alternate" hrefLang="en" href="https://elecctro.com/about-us"/><link rel="alternate" hrefLang="es-ES" href="https://elecctro.com/es-es/about-us"/><meta content="About us" property="og:title"/><meta content="About us" name="twitter:title"/><meta content="width=device-width, initial-scale=1" name="viewport"/><meta content="Webflow" name="generator"/><link href="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/css/elecctro.webflow.shared.e2774c65d.css" rel="stylesheet" type="text/css" integrity="sha384-4ndMZd17xKlmG0Sg1kIWHcTKROxlZgg8UvGUu+0uYHT3B8mnjyLdsnMZCuSPvJHK" crossorigin="anonymous"/><link href="https://fonts.googleapis.com" rel="preconnect"/><link href="https://fonts.gstatic.com" rel="preconnect" crossorigin="anonymous"/>
1<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js" type="text/javascript"></script>
1<script nonce="aPXsNxecKITnUVboEbCnig==" type="text/javascript">WebFont.load({ google: { families: ["Poppins:300,400,500,600,700"] }});</script>
1<script nonce="aPXsNxecKITnUVboEbCnig==" type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
1<link href="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/68c1802d17d2bfbf79697f02_favicon-32x32.png" rel="shortcut icon" type="image/x-icon"/><link href="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/68c18157a7cd6d98f94cb3c9_ms-icon-310x310.ico" rel="apple-touch-icon"/><link href="https://elecctro.com/about-us" rel="canonical"/> 2<style> 3 [loader] { 4 opacity: 1; 5 } 6 .overlay-wrapper { 7 opacity: 1 !important; 8 } 9</style> 10 11<link rel="preload" href="https://www.gstatic.com/draco/versioned/decoders/1.5.2/draco_decoder.wasm" as="fetch" type="application/octet-stream" crossorigin="anonymous" /> 12 13<link rel="preload" href=âhttps://www.gstatic.com/draco/versioned/decoders/1.5.2/draco_wasm_wrapper.jsâ as="script" crossorigin="anonymous" /><link 14 rel="stylesheet" 15 href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" 16 defer 17/> 18<style> 19@media(max-width: 1024px) { 20 .about__culture__subtitle br { 21 display: none; 22 } 23} 24 25@media screen and (max-width: 1200px) and (min-width: 991px) { 26 .about__team { 27 flex-flow: column-reverse; 28 justify-content: flex-end; 29 padding-bottom: 6.5rem; 30 } 31 32 .about__team__left { 33 background-color: #0000; 34 width: auto; 35 height: 100vw; 36 margin-right: 0; 37 padding: 0; 38 } 39 40 .about__team__images__wrap.swiper-wrapper { 41 overflow: visible; 42 } 43 44 .about__team__img.swiper-slide { 45 width: 85vw; 46 min-width: 85vw; 47 height: auto; 48 position: relative !important; 49 } 50 51 .about__team__img__box { 52 background-color: var(--grey-150); 53 border-radius: 1rem; 54 width: 100%; 55 margin-bottom: .625rem; 56 /*padding: .5rem;*/ 57 overflow: hidden; 58 } 59 60 .about__team__img__img { 61 border-radius: .625rem; 62 max-width: none; 63 height: 120%; 64 } 65 66 .about__team__btn.about__team__name__mobile { 67 border-radius: 1rem; 68 display: flex; 69 } 70 71 .btn-group.explore-careers.bottom-one { 72 display: none; 73 } 74 75 .about__team__right.is-active { 76 width: 100%; 77 margin-bottom: 4rem; 78 margin-left: 0; 79 } 80 81 .about__team__title { 82 font-size: 4rem; 83 } 84 85 .about__team__b { 86 display: none; 87 } 88 89 .btn-icon-content { 90 height: 100%; 91 } 92 93 .about__values__box { 94 flex-flow: column; 95 width: 100%; 96 } 97 98 .about__values__wrap { 99 width: 100%; 100 position: relative; 101 top: 0; 102 } 103 104 .about__values__col { 105 width: 70%; 106 margin-left: auto; 107 } 108 109 .about__values__cards { 110 grid-column-gap: 2rem; 111 grid-row-gap: 2rem; 112 flex-flow: column; 113 grid-template-rows: auto auto; 114 grid-template-columns: 1fr 1fr; 115 grid-auto-columns: 1fr; 116 width: 100%; 117 margin-top: 4rem; 118 padding-right: 0; 119 display: flex; 120 } 121 122 .about__values__card { 123 grid-column-gap: 1rem; 124 grid-row-gap: 1rem; 125 width: 100%; 126 min-width: 50vw; 127 min-height: 27.5rem; 128 padding: 1rem; 129 } 130 131 .about__culture__cards { 132 grid-template-columns: 1fr 1fr; 133 } 134 135 .about__culture__cards { 136 grid-template-columns: 1fr 1fr; 137 } 138} 139</style></head><body data-pin-duration="15000" class="body-4"><div class="code-embed-16 w-embed w-script"><style> 140.overlay__path1, 141.overlay__path2, 142.overlay__path3 { 143 /* Tells the browser these properties will change, 144 so it prepares the compositor layer immediately. */ 145 will-change: d, transform, opacity; 146 147 /* darker magic: sometimes needed to fix Safari flickering */ 148 transform: translateZ(0); 149 backface-visibility: hidden; 150} 151 152*::selection { 153 background: #facc4f; 154 color: black; 155} 156*::-moz-selection { 157 background: #facc4f; 158 color: black; 159} 160*::-webkit-selection { 161 background: #facc4f; 162 color: black; 163} 164 165button, 166.btn-group, 167.service__hero__main, 168.service__tooltip-wrapper, 169img, 170.scroll-down, 171[data-parallax-start], 172.cards__wrapper.desktop, 173.about__team__b, 174.careers__join, 175.header__wrapper, 176.chip, 177.about-text, 178.service__needs__list-item, 179.tooltip, 180[features-cards], 181.services__list__mobile, 182canvas { 183 -webkit-touch-callout: none; /* iOS Safari */ 184 -webkit-user-select: none; /* Safari */ 185 -khtml-user-select: none; /* Konqueror HTML */ 186 -moz-user-select: none; /* Old versions of Firefox */
187 -ms-user-select: none; /* Internet Explorer/Edge */ 188 user-select: none; /* Non-prefixed version, currently 189 supported by Chrome, Edge, Opera and Firefox */ 190} 191 192 /* GSAP optimization for Safari */ 193 /* 1. Swiper Images & Image Reveals (Clip-path optimization) */ 194 195 196/* 2. Text Reveals (SplitText lines) */ 197/* Apply to the inner lines generated by SplitText inside your wrappers */ 198.line-wrap > div { 199 will-change: transform; 200 /* Prevents sub-pixel rendering jitter on text during slow scrolls */ 201 -webkit-font-smoothing: antialiased; 202} 203 204/* 3. Horizontal Scroll Container (Mobile) */ 205[features-cards] { 206 will-change: transform; 207} 208 209/* 4. Service Metrics Cards (Opacity + Y transform) */ 210.services__metrics__grid__item { 211 will-change: transform, opacity; 212} 213 214/* 5. Parallax Elements */ 215[card-parallax] { 216 will-change: transform; 217} 218 219/* 6. Expanding Lines */ 220[animation-line] { 221 will-change: transform; 222} 223 224/* 7. Hero Elements */ 225[data-hero] { 226 will-change: transform, opacity; 227} 228 229/* 8. Pinned Sections (Crucial for smooth pinning in Safari) */ 230#services-hero-wrapper, 231#services-scene-wrapper, 232[cards-wrapper] { 233 will-change: transform; 234} 235 236 * { 237 margin: 0; 238 padding: 0; 239 box-sizing: border-box; 240 } 241 242 body { 243 position: relative; 244 width: 100%; 245 height: 100%; 246 min-height: 100svh; 247 } 248 249 .scroll-down { 250 overflow: hidden; 251 } 252 253 .scroll-down-inner-text { 254 animation: scroll-down 3s infinite backwards; 255 } 256 257 @keyframes scroll-down { 258 0% { 259 transform: translateY(-110%); 260 } 261 262 30%, 70% { 263 transform: translateY(0); 264 } 265 266 100% { 267 transform: translateY(110%); 268 } 269 } 270 271 .pink-gradient { 272 background: 273 radial-gradient( 274 ellipse 1200px 1000px at 50% 127%, 275 rgba(255, 255, 255, 1) 0%, 276 rgba(255, 255, 255, 0) 25% 277 ), 278 radial-gradient( 279 ellipse 1600px 1500px at 50% 125%, 280 #A055FF 0%, 281 rgba(160, 85, 255, 0) 70% 282 ); 283 /*filter: blur(100px)*/ 284 } 285 286 #curtain { 287 position: fixed; 288 top: 0; 289 right: 0; 290 width: 162vw; 291 height: 100%; 292 transform-origin: right; 293 background: #1d1131; 294 z-index: 9999; 295 pointer-events: none; 296 transition: transform 0.8s ease-in-out; 297 display: flex; 298 justify-content: flex-start; 299 } 300 301 .curtain__line { 302 height: 100%; 303 width: 30vw; 304 } 305 .curtain__line--yellow { 306 background-color: #facc4f; 307 } 308 .curtain__line--orange { 309 background-color: #ff5a00; 310 } 311 312 .line-wrap { 313 overflow: hidden; 314 margin-top: -0.15em; 315 margin-bottom: -0.1rem; 316 padding-bottom: 0.1rem; 317 } 318 319 .safari .careers__card__label, 320 .safari .text-18-medium { 321 font-weight: 400; 322 } 323 324 .line-wrap p { 325 margin-bottom: 0; 326 } 327 [link-hover-white], 328 [link-hover-600], 329 [link-hover] { 330 overflow: hidden; 331 } 332 [link-hover-white], 333 [link-hover-600] { 334 position: relative; 335 } 336 [link-hover-white]::after, 337 [link-hover-600]::after, 338 [link-hover]::after { 339 content: ""; 340 position: absolute; 341 left: 0; 342 bottom: 0; 343 background-color: #615e84; 344 height: 1px; 345 width: 100%; 346 transform: scaleX(0); 347 transition: transform 0.3s ease; 348 transform-origin: right; 349 } 350 [link-hover-600]::after { 351 background-color: #1d1131; 352 } 353 354 [link-hover-white]::after { 355 background-color: #fff; 356 } 357 358 [button-full] [button-bg] { 359 transition: width 0.6s ease; 360 } 361 362 [button-full] svg { 363 transition: 0.3s ease 0.2s; 364 } 365 366 [button-text] { 367 will-change: transform; 368 transition: transform 0.5s ease, opacity 0.3s ease; 369 } 370 371 [text-hidden] { 372 transform: translateX(10%); 373 opacity: 0; 374 font-weight: 600; 375 text-align: center; 376 color: #0f081a !important; 377 transition: opacity 0.3s ease, transform 0.5s ease; 378 } 379 380 [button-zoom-and-weight] p { 381 transition: all 0.2s ease; 382 } 383 384 [button-zoom-and-weight] svg, 385 [button-zoom] svg { 386 transition: transform 0.3s ease; 387 } 388 389 [button-svg], .form-button-next { 390 position: relative; 391 } 392 [button-svg] *, .form-button-next * { 393 transition: color 0.2s ease; 394 position: relative; 395 z-index: 2; 396 } 397 398 [button-svg]::after, 399 .form-button-next::after { 400 content: ""; 401 position: absolute; 402 inset: 0.25rem; 403 border-radius: 0.375rem; 404 background-color: #fff; 405 z-index: 0; 406 clip-path: inset(0 100% 0 0); 407 will-change: clip-path; 408 transition: clip-path 0.3s ease; 409 } 410 411 [button-svg].alt-after-bg::after { 412 background-color: var(--purple-600); 413 } 414 415 [button-curtain]::after { 416 content: ""; 417 position: absolute; 418 inset: 0; 419 background-color: #1d1131; 420 transform: scaleY(0); 421 transition: transform 0.4s cubic-bezier(0.625, 0.05, 0, 1); 422 } 423 424 [button-curtain].from-top::after { 425 transform-origin: top; 426 } 427 428 [button-curtain].from-bottom::after { 429 transform-origin: bottom; 430 } 431 432 [button-curtain] * { 433 position: relative; 434 z-index: 2; 435 } 436 437 .rich__desc p:not(:last-of-type) { 438 margin-bottom: 1rem; 439 } 440 441 .overlay-wrapper { 442 pointer-events: none; 443 position: fixed; 444 } 445
446 /* Inputs */ 447 [custom-input="wrapper"] { 448 transition: all 0.3s ease; 449 } 450 451 [custom-input="wrapper"]:focus-within { 452 outline: 1px solid #0f081a; 453 background-color: #f6f6f6; 454 } 455 456 [custom-input="wrapper"] input { 457 transition: all 0.3s ease; 458 border: none !important; 459 color: #1d1131; 460 } 461 462 @media(max-width: 1200px) and (min-width: 768px) { 463 .lottie-animation { 464 width: 150svw; 465 left: -25vw; 466 } 467 } 468 469 @media(max-width: 1024px) { 470 .smooth-scroll-content { 471 overflow-x: hidden; 472 } 473 } 474 475 .form-steps-navigation-button { 476 transition: all 0.3s ease !important; 477 } 478 479 .form-steps-navigation-button .button-text { 480 opacity: 0; 481 } 482 483 .current .button-text { 484 opacity: 1 !important; 485 } 486 487 .form-steps-navigation-button .button-text { 488 transition: opacity 0.3s ease 0.2s; 489 } 490 491 [button-full] [data-animation-type="lottie"] { 492 transition: background-color 0.2s ease-in-out; 493 } 494 495 /* Global attribute to easily control easing and timing of all targetted elements */ 496 [data-button-anim-target]{ 497 transition: transform 0.525s cubic-bezier(0.625, 0.05, 0, 1); 498 } 499 500 .btn-icon-icon__bg { 501 transition: background 0.525s cubic-bezier(0.625, 0.05, 0, 1); 502 } 503 504 /* Fake a duplicate text element using text shadow without blur */ 505 .btn-icon-content__text{ 506 --text-duplicate-distance: 1.5em; 507 text-shadow: 0px var(--text-duplicate-distance) var(--purple-600); 508 } 509 510 .btn-group.white .btn-icon-content__text{ 511 --text-duplicate-distance: 1.5em; 512 text-shadow: 0px var(--text-duplicate-distance) white; 513 } 514 515 /* Keyboard focus styling */ 516 .copy-email-button:focus .copy-email-text__el { 517 transform: translate(0px, -100%); 518 } 519 520 /* 'Copied' state, when a user has clicked the button */ 521 [data-copy-button="copied"] .copy-email-icon__wrap{ background: #0F8E2E !important; } 522 [data-copy-button="copied"] .copy-email-text__el{ transform: translate(0px, -200%) !important; } 523 524 .bottom-shine-gradient { 525 background: 526 radial-gradient( 527 ellipse at 50% 115%, 528 rgba(255, 255, 255, 0.7) 0%, 529 rgba(255, 255, 255, 0) 70% 530 ), 531 radial-gradient( 532 ellipse at 50% 112%, 533 #A055FF 0%, 534 rgba(160, 85, 255, 0.1) 40%, 535 rgba(0, 0, 0, 0) 80% 536 ); 537 background-repeat: no-repeat; 538 background-size: cover; 539 } 540 541 .next-step-btn { 542 height: 100%; 543 width: 50%; 544 background: none; 545 cursor: pointer; 546 } 547 548 .next-step-btn .btn-icon-content { 549 height: 100%; 550 border: 1px solid #BDBDBD; 551 } 552 553 .next-step-btn .btn-icon-icon { 554 color: transparent; 555 } 556 557 .next-step-btn .btn-icon-content__bg { 558 background-color: white; 559 transform: translate(0, 175%) rotate(10deg); 560 } 561 562 .next-step-btn .btn-icon-content__text { 563 font-size: 1.125rem; 564 line-height: 1.2; 565 font-family: "Poppins"; 566 font-weight: 500; 567 } 568 569 .next-step-btn[disabled] { 570 opacity: 0.5; 571 pointer-events: none; 572 } 573 574 /* CTA Styles Base */ 575 [cta-dark] { 576 border: 1px solid #1d113133; 577 overflow: hidden; 578 transition: color 0.525s cubic-bezier(0.625, 0.05, 0, 1); 579 } 580 [cta-dark]::before { 581 content: ""; 582 position: absolute; 583 bottom: 0; 584 left: -10%; 585 background-color: white; 586 width: 120%; 587 height: 100%; 588 transform: translate(0, 175%) rotate(10deg); 589 transition: transform 0.525s cubic-bezier(0.625, 0.05, 0, 1); 590 } 591 592 [cta-white] { 593 overflow: hidden; 594 transition: color 0.525s cubic-bezier(0.625, 0.05, 0, 1); 595 } 596 597 [cta-white]::before { 598 content: ""; 599 position: absolute; 600 bottom: 0; 601 left: -10%; 602 background-color: var(--purple-600); 603 width: 120%; 604 height: 100%; 605 transform: translate(0, 175%) rotate(10deg); 606 transition: transform 0.525s cubic-bezier(0.625, 0.05, 0, 1); 607 } 608 609 @media (min-width: 2235px) { 610 [cta-white]::before { 611 transform: translate(0, 175%) rotate(0deg); 612 } 613 614 [cta-dark]::before { 615 transform: translate(0, 175%) rotate(0deg); 616 } 617 } 618 619 .home__popup__close { 620 transition: background 0.3s ease-in-out; 621 } 622 623 .home__popup__close svg { 624 transition: rotate 0.3s ease-in-out; 625 } 626 627 .home__popup__close svg path { 628 transition: fill 0.3s ease-in-out; 629 } 630 631 /* ----------------------------------------------------------------- */ 632 /* LOGIC TO PREVENT HOVER ON MOBILE DEVICES */ 633 /* All hover effects are wrapped in @media (hover: hover) */ 634 /* ----------------------------------------------------------------- */ 635 636 @media (hover: hover) { 637 .home__popup__close:hover { 638 background: #facc4f; 639 } 640 641 .home__popup__close:hover svg { 642 rotate: 180deg; 643 } 644 645 .home__popup__close:hover svg path { 646 fill: #1d1131; 647 } 648 649 /* Links */ 650 [link-hover-white]:hover::after, 651 [link-hover-600]:hover::after { 652 transform: scaleX(1); 653 transform-origin: left; 654 } 655 656 /* Button Full */ 657 [button-full]:hover svg { 658 opacity: 0; 659 transition: 0.3s ease; 660 } 661 662 [button-full]:hover [button-bg] { 663 width: 100%; 664 } 665 666 [button-full]:hover [button-text] { 667 opacity: 0; 668 transform: translateX(-15%); 669 } 670 671 [button-full]:hover [text-hidden] { 672 transform: translateX(0); 673 opacity: 1; 674 } 675 676 [button-full]:hover [button-text] { 677 color: #0f081a; 678 transform: translateX(calc(50% - 1rem - 50%)); 679 } 680 681 [button-full]:hover [data-animation-type="lottie"] { 682 background: transparent; 683 } 684 685 /* Zoom and Weight */ 686 [button-zoom-and-weight]:hover p { 687 text-shadow: 0 0 0.05rem #fff; 688 } 689 690 [button-zoom-and-weight]:hover svg, 691 [button-zoom]:hover svg { 692 transform: scale(1.5); 693 } 694 695 /* Button SVG */ 696 [button-svg]:hover *, 697 .form-button-next:hover * { 698 color: #1d1131; 699 } 700 701 [button-svg]:hover::after, 702 .form-button-next:hover::after { 703 color: #1d1131; 704 clip-path: inset(0 0% 0 0); 705 } 706 707 /* Curtain Button */ 708 [button-curtain]:hover::after { 709 transform: scaleY(1); 710 } 711 712 [button-curtain]:hover *, 713 [button-svg].alt-after-bg:hover * { 714 color: #fff; 715 } 716 717 /* Social Icons */ 718 .social__item:hover svg path { 719 fill: white; 720 } 721 .social__item-2:hover svg path { 722 fill: white; 723 } 724 725 /* Form Steps */ 726 .form-steps-navigation-button:hover .button-text { 727 opacity: 1; 728 } 729 730 /* Icon Link Buttons */ 731 .btn-icon-link:hover .btn-icon-content__text{ transform: translate(0px, calc(-1 * var(--text-duplicate-distance))); } 732 733 .btn-icon-link:hover .btn-icon-icon__bg{ 734 transform: rotate(90deg); 735 background: var(--purple-600); 736 } 737 738 .btn-icon-link:hover .btn-icon-icon__arrow{ transform: translate(200%, 0px); } 739 740 .btn-icon-link:hover .btn-icon-content__bg{ transform: translate(0px, 0%) rotate(0deg); } 741 742 .btn-icon-link.nav:hover .btn-icon-icon__bg { 743 background: transparent; 744 } 745 746 /* Footer form submit */ 747 .form__submit:hover .btn-icon-content__text{ transform: translate(0px, calc(-1 * var(--text-duplicate-distance))); } 748 .form__submit:hover .btn-icon-icon__bg{ 749 transform: rotate(90deg); 750 background: var(--purple-600); 751 } 752 .form__submit:hover .btn-icon-icon__arrow{ transform: translate(200%, 0px); } 753 .form__submit:hover .btn-icon-content__bg{ transform: translate(0px, 0%) rotate(0deg); } 754 755 /* Copy Email */ 756 .copy-email-button:hover .copy-email-text__el{ 757 transform: translate(0px, -100%); 758 } 759 760 /* Next Step Button */ 761 .next-step-btn:hover .btn-icon-content__text{ transform: translate(0px, calc(-1 * var(--text-duplicate-distance))); } 762 .next-step-btn:hover .btn-icon-icon__bg{ transform: rotate(90deg); } 763 .next-step-btn:hover .btn-icon-icon__arrow{ transform: translate(200%, 0px); } 764 .next-step-btn:hover .btn-icon-content__bg{ transform: translate(0px, 0%) rotate(0deg); } 765 766 /* CTA Animations */ 767 [cta-dark]:hover::before { 768 transform: translate(0px, 0%) rotate(0deg); 769 } 770 771 [cta-dark]:hover { 772 color: var(--purple-600); 773 } 774 775 [cta-white]:hover::before { 776 transform: translate(0px, 0%) rotate(0deg); 777 } 778 779 [cta-white]:hover { 780 color: white; 781 } 782 } 783</style> 784
785<script nonce="aPXsNxecKITnUVboEbCnig=="> 786 //check safari 787 (function detectSafari() { 788 const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); 789 if (isSafari) { 790 document.body.classList.add("safari"); 791 } 792 })(); 793 794 setTimeout(() => { 795 const buttons = document.querySelectorAll("[button-curtain]"); 796 797 buttons.forEach(btn => { 798 let enterFrom = "top"; 799 800 btn.addEventListener("mouseenter", (e) => { 801 // MODIFICATION: Do not run logic if the device does not support hover 802 if (window.matchMedia("(hover: none)").matches) return; 803 804 const rect = btn.getBoundingClientRect(); 805 const y = e.clientY - rect.top; 806 807 const topDist = y; 808 const bottomDist = rect.height - y; 809 810 btn.classList.remove("from-top", "from-bottom"); 811 812 if (topDist < bottomDist) { 813 btn.classList.add("from-top"); 814 enterFrom = "top"; 815 } else { 816 btn.classList.add("from-bottom"); 817 enterFrom = "bottom"; 818 } 819 820 btn.classList.add("hover"); 821 }); 822 823 btn.addEventListener("mouseleave", (e) => { 824 // MODIFICATION: Do not run logic if the device does not support hover 825 if (window.matchMedia("(hover: none)").matches) return; 826 827 btn.classList.remove("hover"); 828 btn.classList.remove("from-top", "from-bottom"); 829 830 // set transform-origin to exit direction 831 btn.classList.add(enterFrom === "top" ? "from-top" : "from-bottom"); 832 }); 833 }); 834 }, 500) 835</script>
835</div><div class="hidden w-embed w-script">
835<script nonce="aPXsNxecKITnUVboEbCnig==" type="module"> 836import * as Application from "https://cdn.jsdelivr.net/npm/@splinetool/[email protected]/+esm"; 837import * as DotLottieWorker from "https://cdn.jsdelivr.net/npm/@lottiefiles/[email protected]/+esm"; 838 839window._custom_vendors__ = { 840 "@lottiefiles/dotlottie-web": DotLottieWorker, 841 "gsap": window.gsap 842}; 843</script>
843</div><div class="overlay-wrapper w-embed w-script"><div class="overlay-wrap"> 844 <svg class="overlay" width="100%" height="100%" viewBox="0 0 100 100" preserveAspectRatio="none"> 845 <path class="overlay__path1" vector-effect="non-scaling-stroke" d="M 0 0 h 0 c 0 50 0 50 0 100 H 0 V 0 Z" fill="#1D1131" style="z-index: 1;" /> 846 <path class="overlay__path2" vector-effect="non-scaling-stroke" d="M 0 0 h 0 c 0 50 0 50 0 100 H 0 V 0 Z" fill="#FF5A00" style="z-index: 2;" /> 847 <path class="overlay__path3" vector-effect="non-scaling-stroke" d="M 0 0 h 0 c 0 50 0 50 0 100 H 0 V 0 Z" fill="#FACC4F" style="z-index: 3;" /> 848 </svg> 849 <div class="overlay-loader"></div> 850 <div class="overlay-between"></div> 851</div> 852 853<style> 854 .overlay-between { 855 background-color: #facc4f; 856 position: absolute; 857 inset: 0; 858 z-index: 99; 859 } 860 861 .overlay-wrap { 862 position: fixed; 863 top: 0; 864 right: 0; 865 width: 100vw; 866 height: 100vh; 867 z-index: 9999; 868 pointer-events: none; /* Allows clicks to pass through when not animating */ 869 } 870 871 /* Loader Styles */ 872 .overlay-loader { 873 position: absolute; 874 top: 50%; 875 left: 50%; 876 transform: translate(-50%, -50%); 877 width: 48px; 878 height: 48px; 879 border: 4px solid #1D1131; /* Loader Color */ 880 border-bottom-color: transparent; 881 border-radius: 50%; 882 display: block; 883 box-sizing: border-box; 884 animation: rotation 1s linear infinite; 885 z-index: 100; /* Above SVG paths */ 886 opacity: 0; 887 visibility: hidden; 888 } 889 890 @keyframes rotation { 891 0% { transform: translate(-50%, -50%) rotate(0deg); } 892 100% { transform: translate(-50%, -50%) rotate(360deg); } 893 } 894</style> 895
896<script nonce="aPXsNxecKITnUVboEbCnig==" 897 test-src="http://localhost:3000/dist/external/elecctro/curtains.js" 898 type="module"> 899(() => { function require(key) { return window._custom_vendors__[key]; }; 900"use strict";(()=>{var o=class{constructor(){this.transitionOverlay=null;this.path1=null;this.path2=null;this.path3=null;this.loader=null;this.isAnimating=!1;this.pageEntryAnimationEnded=null;this.initPageTransition(),this.bindNavigationEvents(),window.location.pathname!=="/"&&this.performPageEntryAnimation(),this.pageEntryAnimationEnded=new Event("pageEntryAnimationEnded")}initPageTransition(){this.transitionOverlay=document.querySelector(".overlay"),!this.transitionOverlay||!this.transitionOverlay.parentElement||(this.transitionOverlay=this.transitionOverlay.parentElement),this.path1=document.querySelector(".overlay__path1"),this.path2=document.querySelector(".overlay__path2"),this.path3=document.querySelector(".overlay__path3"),this.loader=document.querySelector(".overlay-loader")}bindNavigationEvents(){document.addEventListener("click",t=>{let e=t.target?.closest("a[href]");if(e&&!e.hasAttribute("data-no-transition")&&!this.isAnimating){let i=e.getAttribute("href");i&&!i.startsWith("#")&&!i.startsWith("mailto:")&&!i.startsWith("tel:")&&!i.startsWith("http")&&(t.preventDefault(),this.performPageExitAnimation(i))}}),window.addEventListener("popstate",t=>{this.isAnimating||this.performPageExitAnimation(window.location.href,!1)})}performPageEntryAnimation(){if(this.isAnimating||!this.transitionOverlay||!this.path1||!this.path2||!this.path3)return;this.isAnimating=!0,this.transitionOverlay.style.pointerEvents="all";let t={filled:"M 0 0 H 100 c 0 50 0 50 0 100 H 0 V 0 Z",inBetween:"M 0 0 H 50 c -28 43 -4 81 0 100 H 0 V 0 Z",unfilled:"M 0 0 H 0 c 0 50 0 50 0 100 H 0 V 0 Z"};this.loader&&window.gsap.set(this.loader,{autoAlpha:1});let n=window.gsap.timeline({onComplete:()=>{this.isAnimating=!1,this.transitionOverlay&&(this.transitionOverlay.style.pointerEvents="none"),window.gsap.fromTo("[mobile-scene]",{scale:0},{scale:1,duration:1,ease:"power2.inOut"})}});n.set([this.path1,this.path2,this.path3],{attr:{d:t.filled}}),this.loader&&n.to(this.loader,{duration:.3,autoAlpha:0,ease:"power2.out"}),n.addLabel("Entry"),n.to(this.path3,{duration:.2,ease:"power3.in",attr:{d:t.inBetween}},"Entry").to(this.path3,{duration:.8,ease:"power1",attr:{d:t.unfilled}},"Entry+=0.2"),n.to(this.path2,{duration:.2,ease:"power3.in",attr:{d:t.inBetween}},"Entry+=0.2").to(this.path2,{duration:.8,ease:"power1",attr:{d:t.unfilled}},"Entry+=0.4"),n.to(this.path1,{duration:.2,ease:"power3.in",attr:{d:t.inBetween}},"Entry+=0.4").to(this.path1,{duration:.8,ease:"power1",attr:{d:t.unfilled}},"Entry+=0.6"),n.call(()=>{this.pageEntryAnimationEnded&&document.dispatchEvent(this.pageEntryAnimationEnded)},null,"-=0.4")}performPageExitAnimation(t,n=!0){if(this.isAnimating||!this.transitionOverlay||!this.path1||!this.path2||!this.path3)return;this.isAnimating=!0,this.transitionOverlay.style.pointerEvents="all";let e={unfilled:"M 100 0 h 0 c 0 50 0 50 0 100 H 100 V 0 Z",inBetween:"M 100 0 h -33 c 30 54 -113 65 0 100 H 100 V 0 Z",filled:"M 100 0 h -100 c 0 50 0 50 0 100 H 100 V 0 Z"};this.loader&&window.gsap.set(this.loader,{autoAlpha:0});let i=window.gsap.timeline({onComplete:()=>{n&&window.history.pushState({},"",t),window.location.href=t}});i.addLabel("Exit"),i.set(this.path1,{attr:{d:e.unfilled}},"Exit").to(this.path1,{duration:.5,ease:"power3.in",attr:{d:e.inBetween}},"Exit").to(this.path1,{duration:.2,ease:"power1.out",attr:{d:e.filled}},"Exit+=0.5"),i.set(this.path2,{attr:{d:e.unfilled}},"Exit").to(this.path2,{duration:.5,ease:"power3.in",attr:{d:e.inBetween}},"Exit+=0.2").to(this.path2,{duration:.2,ease:"power1.out",attr:{d:e.filled}},"Exit+=0.7"),i.set(this.path3,{attr:{d:e.unfilled}},"Exit").to(this.path3,{duration:.5,ease:"power3.in",attr:{d:e.inBetween}},"Exit+=0.4").to(this.path3,{duration:.2,ease:"power1.out",attr:{d:e.filled}},"Exit+=0.9"),this.loader&&i.to(this.loader,{duration:.3,autoAlpha:1},">-0.2")}isCurrentlyAnimating(){return this.isAnimating}destroy(){this.isAnimating=!1}},a=null;document.addEventListener("DOMContentLoaded",()=>{let r=document.querySelector(".overlay-between");a=new o,setTimeout(()=>{r&&(r.style.opacity="0")},100)});window.pageTransition={exit:(r,t)=>{a&&a.performPageExitAnimation(r,t)},entry:()=>{a&&a.performPageEntryAnimation()}
900,isAnimating:()=>a?a.isCurrentlyAnimating():!1};window.addEventListener("beforeunload",()=>{a&&a.destroy()});})(); 901})(); 902 903 904</script>
904</div><div class="header__wrapper div-block-2"><div curtain="" class="mobile__menu__curtain"></div><div header="" class="header"><a href="/" class="w-inline-block"><div class="header__logo w-embed"><svg viewBox="0 0 652 130" fill="none" xmlns="http://www.w3.org/2000/svg"> 905<path d="M47.1 36.1C33.4 36.1 22.2 40.6 13.4 49.5C4.70005 58.4 0.300049 69.5 0.300049 82.7C0.300049 96.2 4.70004 107.3 13.6 116.1C22.5 124.9 34.1 129.3 48.5 129.3C65.6 129.3 78.6001 122.9 87.3 110L71.5 100.8C66.4 108.1 58.8 111.8 48.6 111.8C41.3 111.8 35.1 110 30 106.4C24.9 102.8 21.7 97.6 20.3 90.9H90.8C91.3 87.6 91.5 84.9 91.5 82.9C91.5 69.9 87.3 58.9 79 49.8C70.7 40.7 60.1 36.1 47.1 36.1ZM20.1 75.3C21.4 68.6 24.4 63.3 29.1 59.4C33.8 55.5 39.7001 53.6 46.8 53.6C53.1 53.6 58.5 55.4 63.2 59.1C67.9 62.8 70.8 68.2 72.1001 75.4H20.1V75.3ZM102.9 0H122V129.4H102.9V0ZM181.2 36.1C167.5 36.1 156.3 40.6 147.5 49.5C138.8 58.4 134.4 69.5 134.4 82.7C134.4 96.2 138.8 107.3 147.7 116.1C156.6 124.9 168.2 129.3 182.6 129.3C199.7 129.3 212.7 122.9 221.4 110L205.6 100.8C200.5 108.1 192.9 111.8 182.7 111.8C175.4 111.8 169.2 110 164.1 106.4C159 102.8 155.8 97.6 154.4 90.9H225C225.5 87.6 225.7 84.9 225.7 82.9C225.7 69.9 221.5 58.9 213.2 49.8C204.8 40.7 194.2 36.1 181.2 36.1ZM154.3 75.3C155.6 68.6 158.6 63.3 163.3 59.4C168 55.5 173.9 53.6 181 53.6C187.3 53.6 192.7 55.4 197.4 59.1C202.1 62.8 205 68.2 206.3 75.4H154.3V75.3ZM304.7 96.9L321.2 106.3C317.4 113.4 312 119 304.9 123.1C297.8 127.2 290 129.3 281.3 129.3C267.9 129.3 256.8 124.8 247.9 115.8C239 106.8 234.5 95.8 234.5 82.7C234.5 69.5 239 58.4 247.9 49.5C256.8 40.6 268 36.1 281.3 36.1C289.9 36.1 297.8 38.2 304.9 42.3C312 46.4 317.3 52 320.8 59L304.3 68.6C302.3 64.3 299.2 61 295.2 58.6C291.1 56.2 286.4 55 281.1 55C273.3 55 266.8 57.7 261.5 63C256.2 68.3 253.6 74.9 253.6 82.8C253.6 90.7 256.2 97.3 261.5 102.6C266.8 107.9 273.3 110.6 281.1 110.6C286.3 110.6 291 109.4 295.2 106.9C299.4 104.4 302.6 101.1 304.7 96.9ZM350.2 73.5H330.4C332 64.3 336.2 56.3 343 49.5C351.9 40.6 363.1 36.1 376.4 36.1C385 36.1 392.9 38.2 400 42.3C407.1 46.4 412.4 52 415.9 59L399.4 68.6C397.4 64.3 394.3 61 390.3 58.6C386.2 56.2 381.5 55 376.2 55C368.4 55 361.9 57.7 356.6 63C353.7 66 351.5 69.5 350.2 73.5ZM330.5 92H350.2C351.5 96 353.6 99.5 356.7 102.6C362 107.9 368.5 110.
9056 376.3 110.6C381.5 110.6 386.2 109.4 390.4 106.9C394.6 104.4 397.8 101.1 399.9 97L416.4 106.4C412.6 113.5 407.2 119.1 400.1 123.2C393 127.3 385.2 129.4 376.5 129.4C363.1 129.4 352 124.9 343.1 115.9C336.3 109.1 332.1 101.2 330.5 92ZM441.3 92H460.4V100.9C460.4 104.6 461.2 107.2 462.9 108.8C464.6 110.4 467 111.3 470.3 111.5C473.5 111.7 477.6 111.7 482.4 111.4V128.6C467.7 130.4 457.2 129.1 450.9 124.8C444.5 120.5 441.3 112.5 441.3 101V92ZM460.5 73.5H441.4V58.4H425V40H441.3V20.8L460.4 15.1V40H482.4V58.4H460.4V73.5H460.5ZM501.7 92H520.8V129.3H501.7V92ZM522.7 73.5H501.7V40.8H520.8V55.7C525.6 44.7 534.7 39.2 548.1 39.2V59.9C540.8 59.4 534.4 61.2 529 65.1C526.2 67.2 524.1 70 522.7 73.5ZM651.5 82.8C651.5 95.9 647 107 637.9 115.9C628.9 124.9 617.8 129.4 604.7 129.4C591.7 129.4 580.7 124.9 571.6 115.9C564.7 109.1 560.5 101.2 558.8 92H578.5C579.8 96 582 99.6 585.1 102.8C590.4 108.1 597 110.8 604.8 110.8C612.6 110.8 619.2 108.1 624.5 102.8C629.8 97.5 632.5 90.8 632.5 82.8C632.5 74.8 629.8 68.1 624.5 62.8C619.2 57.5 612.6 54.8 604.8 54.8C597 54.8 590.4 57.5 585.1 62.8C582 65.9 579.8 69.5 578.5 73.6H558.8C560.5 64.5 564.8 56.5 571.6 49.7C580.7 40.7 591.7 36.2 604.7 36.2C617.8 36.2 628.9 40.7 637.9 49.7C647 58.6 651.5 69.6 651.5 82.8Z" fill="#4D4C4D"/> 906<path d="M624.5 78.6C623.3 72.6 619.4 67.6 614.2 64.7C613 64.1 611.8 63.5 610.5 63.1C608.6 62.5 606.5 62.2 604.4 62.2C594.3 62.2 585.9 69.5 584.2 79.2H577.2H558H521.2H501.7H460.4H441.3H349.3H349H329.8H329.5H314.3H292.5H291.5C291.1 78.2 290.6 77.3 290 76.5C289.1 75.3 287.9 74.3 286.5 73.6C285.1 72.9 283.6 72.5 281.9 72.5C280.5 72.5 279.2 72.8 277.9 73.3C277.3 73.6 276.7 73.9 276.2 74.2C275.7 74.6 275.2 75 274.7 75.4C274.2 75.9 273.8 76.4 273.5 76.9C272.8 78 272.2 79.2 272 80.5C271.9 81.2 271.8 81.8 271.8 82.5C271.8 84.3 272.2 85.9 273 87.3C273.5 88.2 274.1 89 274.7 89.6C274.9 89.8 275.2 90 275.4 90.3C275.7 90.6 276.1 90.8 276.5 91.1C278.1 92.1 279.9 92.6 281.9 92.6C283.5 92.6 285.1 92.2 286.5 91.5C287.4 91 288.2 90.4 289 89.7C290.1 88.6 290.9 87.3 291.5 85.9H314.4H329.4H329.7H349H349.3H441.3H460.4H501.7H520.8H558H577.2H584.2C584.4 87.1 584.7 88.3 585.1 89.4C585.5 90.5 586 91.6 586.6 92.6C587.8 94.6 589.3 96.5 591.1 98C592 98.8 592.9 99.4 594 100C595 100.6 596.1 101.1 597.2 101.5C599.4 102.3 601.9 102.8 604.4 102.8C606.5 102.8 608.6 102.5 610.5 101.9C611.8 101.5 613 101 614.2 100.3C615.4 99.7 616.5 98.9 617.5 98.1C619 96.8 620.4 95.4 621.5 93.7C623.7 90.4 625 86.5 625 82.2C624.9 81.3 624.8 80 624.5 78.6ZM614.6 82.8C614.6 83.9 614.4 84.9 614.1 85.8C614 86.1 613.9 86.4 613.8 86.7C612.3 90.3 608.6 92.9 604.4 92.9C600.2 92.9 596.6 90.3 595 86.7C594.9 86.4 594.8 86.1 594.7 85.8C594.4 84.8 594.2 83.8 594.2 82.8C594.2 79.3 596 76.2 598.7 74.4C600.3 73.3 602.3 72.7 604.4 72.7C606.5 72.7 608.5 73.3 610.1 74.4C612.8 76.2 614.6 79.3 614.6 82.8Z" fill="url(#paint0_linear_11_13039)"/> 907<defs> 908<linearGradient id="paint0_linear_11_13039" x1="254.053" y1="88.8339" x2="647.73" y2="82.0087" gradientUnits="userSpaceOnUse"> 909<stop stop-color="#ECDE59"/> 910<stop offset="0.2957" stop-color="#EDD14D"/> 911<stop offset="0.8436" stop-color="#EFAE2F"/> 912<stop offset="1" stop-color="#F0A325"/> 913</linearGradient> 914</defs> 915</svg></div></a><div class="header__links"><div class="header__dropdown"><button data-tab="" class="header__link header__link__tab"><div class="header__link_wrapper"><a data-curtain="" href="/services" class="header__link">Services</a><a data-curtain="" href="/services" class="header__link under">Services</a></div><div class="header__link__arrow w-embed"><svg viewBox="0 0 13 7" fill="none" xmlns="http://www.w3.org/2000/svg"> 916<path d="M12.0326 1.53025L7.03255 6.53025C6.96287 6.60017 6.88008 6.65564 6.78892 6.6935C6.69775 6.73135 6.60001 6.75084 6.5013 6.75084C6.40259 6.75084 6.30485 6.73135 6.21369 6.6935C6.12252 6.65564 6.03973 6.60017 5.97005 6.53025L0.970051 1.53025C0.829155 1.38935 0.75 1.19825 0.75 0.998996C0.75 0.799739 0.829155 0.608643 0.970051 0.467746C1.11095 0.32685 1.30204 0.247695 1.5013 0.247695C1.70056 0.247695 1.89165 0.32685 2.03255 0.467746L6.50193 4.93712L10.9713 0.467122C11.1122 0.326225 11.3033 0.24707 11.5026 0.24707C11.7018 0.24707 11.8929 0.326225 12.0338 0.467122C12.1747 0.608018 12.2539 0.799114 12.2539 0.998372C12.2539 1.19763 12.1747 1.38873 12.0338 1.52962L12.0326 1.53025Z" fill="#1D1131"/> 917</svg></div></button><div class="header__dropdown__list w-dyn-list"><div dropdown-list="" role="list" class="header__dropdown__wrap header__dropdown__wrap--dark w-dyn-items"><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/snacks" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbbb1c0c2137c33640cc_68874a719a2a4264a5268d42_-Snacks_Ortho-v5%203%20(1).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Snacks</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/smart-fridge" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cb6a82f242928345a53c_68874a20ab953a0606a95184_-Smart_Fridge_Ortho-v5.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Smart Fridge</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/photobooth" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cc009d05068eecdf2c60_68874b4c18915b7de2367d10_-Photobooth_Ortho-v5.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Photobooth</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/ocs" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931caa15d617d30c104ba77_6889be0952f7c584bc257a8b_Icon%20(3).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">OCS</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/laundromat" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cab634a3cc477e131a96_6889beac4478496d863d5126_Icon%20(8).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Laundromat</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/kiosk" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931ca7e015f4cfb2d689da5_6889be7aec83cb44355e5d30_Icon%20(7).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Kiosk</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/kiddie-ride" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cb548d208ceb9897bbd7_68874a9ca9fdc5d09424f126_-Kiddie_Ride_Ortho-v5%204.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Kiddie Ride</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/ev-charger" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cae8a4a620b6c091b452_68874a09c4c52c3d73937f7a_-EV_Charger_Ortho-v5%20(1).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">EV Charger</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/coffee" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cc113988faaff8cc33af_68874b23f0dff715f664f595_-Coffee_Ortho-v5.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Coffee</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/cigarettes" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbe4130caca2e7ef8cc3_68874ae80780654883726b50_-Cigarettess_Ortho-v5.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Cigarettes</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/car-wash" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cab16f1c62389ef3
9170236_6889bee8c7fee99fc038fe5e_Icon%20(9).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Car Wash</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/candy" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931bbd48f130f313fca2286_6889be4bff8308a29e316d33_Icon%20(6).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Candy</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/parkomat" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931bbc19c6e9b9289768bec_6889be2b1e5151158507015c_Icon%20(5).png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Parkomat</p></div></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/water" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbd499c8428cd16fd8da_68874ad2c6ec1a66e9debdf2_-Water_Ortho-v5.png" loading="lazy" alt="" class="image-7"/><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">Water</p></div></a></div></div></div></div><div class="header__link_wrapper"><a data-curtain="" href="/projects" class="header__link">Projects</a><a data-curtain="" href="/projects" class="header__link under">Projects</a></div><div class="header__link_wrapper"><a data-curtain="" href="/about-us" aria-current="page" class="header__link w--current">About us</a><a data-curtain="" href="/about-us" aria-current="page" class="header__link under w--current">About us</a></div><div class="header__link_wrapper"><a data-curtain="" href="/careers" class="header__link">Careers</a><a data-curtain="" href="/careers" class="header__link under">Careers</a></div><div class="header__link_wrapper"><a data-curtain="" href="/contact" class="header__link">Contacts</a><a data-curtain="" href="/contact" class="header__link under">Contacts</a></div></div><div class="header__actions"><div menu-btn="" class="menu__btn"><div class="menu__btn__icon"><span class="menu__btn__icon__line"></span><span class="menu__btn__icon__line"></span><span class="menu__btn__icon__line"></span></div></div><div class="lang-switcher land-switcher__desktop lang-main"><div class="locales-wrapper-2 w-locales-list"><div role="list" class="lang-switcher__wrap w-locales-items"><div role="listitem" class="locale w-locales-item"><a hreflang="en" href="/about-us" aria-current="page" class="lang-item w-inline-block w--current"><div class="lang-glob w-embed"><style> 918 919 .lang-item:hover .lang-switcher__text { 920 color: #1D1131; 921 } 922 923 .glob { 924 display: none; 925 color: #1d1131; 926 width: 1.5rem; 927 height: 1.5rem; 928 margin-right: 0.75rem; 929 } 930 931 .lang-item.w--current .lang-switcher__text { 932 color: #1D1131; 933 } 934 935 /*.body-3 .lang-item.w--current .lang-switcher__text { 936 color: white !important; 937 }*/ 938 939 .lang-item.w--current .glob { 940 display: block; 941 } 942 943 944 945 @media(max-width: 1400px) { 946 .glob { 947 display: none; 948 color: #1d1131; 949 width: 1.25rem; 950 height: 1.25rem; 951 margin-right: 0.75rem; 952 } 953 954 /*.lang-open .lang-glob { 955 opacity: 1; 956 }*/ 957 } 958 959</style> 960 961<svg class="glob" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 24" fill="none"> 962 <path d="M12.5 2.25C10.5716 2.25 8.68657 2.82183 7.08319 3.89317C5.47982 4.96451 4.23013 6.48726 3.49218 8.26884C2.75422 10.0504 2.56114 12.0108 2.93735 13.9021C3.31355 15.7934 4.24215 17.5307 5.60571 18.8943C6.96928 20.2579 8.70656 21.1865 10.5979 21.5627C12.4892 21.9389 14.4496 21.7458 16.2312 21.0078C18.0127 20.2699 19.5355 19.0202 20.6068 17.4168C21.6782 15.8134 22.25 13.9284 22.25 12C22.247 9.41505 21.2188 6.93683 19.391 5.109C17.5632 3.28116 15.085 2.25298 12.5 2.25ZM19.8463 8.25H16.5041C16.0832 6.70585 15.3738 5.25532 14.4134 3.975C15.5738 4.25375 16.6602 4.7801 17.598 5.51799C18.5359 6.25588 19.3032 7.18784 19.8472 8.25H19.8463ZM20.75 12C20.7507 12.7608 20.6456 13.5181 20.4378 14.25H16.8275C17.0575 12.7588 17.0575 11.2412 16.8275 9.75H20.4378C20.6456 10.4819 20.7507 11.2392 20.75 12ZM12.5 4.03125C13.6231 5.23361 14.4567 6.67653 14.9375 8.25H10.0625C10.5428 6.67632 11.3765 5.2333 12.5 4.03125ZM10.0625 15.75H14.9375C14.4572 17.3237 13.6235 18.7667 12.5 19.9688C11.377 18.7664 10.5433 17.3235 10.0625 15.75ZM9.69688 14.25C9.43939 12.7611 9.43939 11.2389 9.69688 9.75H15.3106C15.5681 11.2389 15.5681 12.7611 15.3106 14.25H9.69688ZM14.4172 20.025C15.3776 18.7447 16.0869 17.2941 16.5078 15.75H19.8509C19.3065 16.8126 18.5387 17.7448 17.6001 18.4827C16.6616 19.2206 15.5745 19.7467 14.4134 20.025H14.4172Z" fill="currentColor"/> 963</svg></div><div class="lang-switcher__text">EN</div></a></div><div role="listitem" class="locale w-locales-item"><a hreflang="es-ES" href="/es-es/about-us" class="lang-item w-inline-block"><div class="lang-glob w-embed"><style> 964 965 .lang-item:hover .lang-switcher__text { 966 color: #1D1131; 967 } 968 969 .glob { 970 display: none; 971 color: #1d1131; 972 width: 1.5rem; 973 height: 1.5rem; 974 margin-right: 0.75rem; 975 } 976 977 .lang-item.w--current .lang-switcher__text { 978 color: #1D1131; 979 } 980 981 /*.body-3 .lang-item.w--current .lang-switcher__text { 982 color: white !important; 983 }*/ 984 985 .lang-item.w--current .glob { 986 display: block; 987 } 988 989
990 991 @media(max-width: 1400px) { 992 .glob { 993 display: none; 994 color: #1d1131; 995 width: 1.25rem; 996 height: 1.25rem; 997 margin-right: 0.75rem; 998 } 999 1000 /*.lang-open .lang-glob { 1001 opacity: 1; 1002 }*/ 1003 } 1004 1005</style> 1006 1007<svg class="glob" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 24" fill="none"> 1008 <path d="M12.5 2.25C10.5716 2.25 8.68657 2.82183 7.08319 3.89317C5.47982 4.96451 4.23013 6.48726 3.49218 8.26884C2.75422 10.0504 2.56114 12.0108 2.93735 13.9021C3.31355 15.7934 4.24215 17.5307 5.60571 18.8943C6.96928 20.2579 8.70656 21.1865 10.5979 21.5627C12.4892 21.9389 14.4496 21.7458 16.2312 21.0078C18.0127 20.2699 19.5355 19.0202 20.6068 17.4168C21.6782 15.8134 22.25 13.9284 22.25 12C22.247 9.41505 21.2188 6.93683 19.391 5.109C17.5632 3.28116 15.085 2.25298 12.5 2.25ZM19.8463 8.25H16.5041C16.0832 6.70585 15.3738 5.25532 14.4134 3.975C15.5738 4.25375 16.6602 4.7801 17.598 5.51799C18.5359 6.25588 19.3032 7.18784 19.8472 8.25H19.8463ZM20.75 12C20.7507 12.7608 20.6456 13.5181 20.4378 14.25H16.8275C17.0575 12.7588 17.0575 11.2412 16.8275 9.75H20.4378C20.6456 10.4819 20.7507 11.2392 20.75 12ZM12.5 4.03125C13.6231 5.23361 14.4567 6.67653 14.9375 8.25H10.0625C10.5428 6.67632 11.3765 5.2333 12.5 4.03125ZM10.0625 15.75H14.9375C14.4572 17.3237 13.6235 18.7667 12.5 19.9688C11.377 18.7664 10.5433 17.3235 10.0625 15.75ZM9.69688 14.25C9.43939 12.7611 9.43939 11.2389 9.69688 9.75H15.3106C15.5681 11.2389 15.5681 12.7611 15.3106 14.25H9.69688ZM14.4172 20.025C15.3776 18.7447 16.0869 17.2941 16.5078 15.75H19.8509C19.3065 16.8126 18.5387 17.7448 17.6001 18.4827C16.6616 19.2206 15.5745 19.7467 14.4134 20.025H14.4172Z" fill="currentColor"/> 1009</svg></div><div class="lang-switcher__text">ES</div></a></div></div></div></div><div class="btn-group header-main"><a href="/contact" class="btn-icon-link w-inline-block"><div class="btn-icon-content"><div data-icon-size="normal" class="btn-icon-icon"><div data-button-anim-target="" class="btn-icon-icon__bg"></div><div class="btn-icon-icon__wrap"><div class="btn-icon-icon__list"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow main"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg></div></div></div><div class="btn-icon-content__mask"><span data-button-anim-target="" class="btn-icon-content__text">Get in Touch</span></div><div data-button-anim-target="" class="btn-icon-content__bg"></div></div></a></div></div></div><div menu-mobile="" class="menu__mobile"><div menu-wrap="" class="mobile__menu__wrapper"><div menu-item="" class="menu__mobile__dropdown"><a href="/services" class="menu__mobile__link mobile__menu__dropdown__link w-inline-block"><div class="menu__mobile__link__icon"><div class="menu__mobile__link__icon__svg w-embed"><svg style="width: 24px; height: 24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1010<path d="M20.25 6H16.5C16.5 4.80653 16.0259 3.66193 15.182 2.81802C14.3381 1.97411 13.1935 1.5 12 1.5C10.8065 1.5 9.66193 1.97411 8.81802 2.81802C7.97411 3.66193 7.5 4.80653 7.5 6H3.75C3.35218 6 2.97064 6.15804 2.68934 6.43934C2.40804 6.72064 2.25 7.10218 2.25 7.5V18.75C2.25 19.1478 2.40804 19.5294 2.68934 19.8107C2.97064 20.092 3.35218 20.25 3.75 20.25H20.25C20.6478 20.25 21.0294 20.092 21.3107 19.8107C21.592 19.5294 21.75 19.1478 21.75 18.75V7.5C21.75 7.10218 21.592 6.72064 21.3107 6.43934C21.0294 6.15804 20.6478 6 20.25 6ZM12 3C12.7956 3 13.5587 3.31607 14.1213 3.87868C14.6839 4.44129 15 5.20435 15 6H9C9 5.20435 9.31607 4.44129 9.87868 3.87868C10.4413 3.31607 11.2044 3 12 3Z" fill="#615E84"/> 1011</svg></div></div><div class="menu__mobile__link__text">Products & services</div></a><button data-mobile-tab="" class="menu__mobile__more"><div class="arrow-svg w-embed"><svg 1012 xmlns="http://www.w3.org/2000/svg" 1013 width="16" 1014 height="16" 1015 viewBox="0 0 16 16" 1016 fill="none" 1017> 1018 <path 1019 d="M3 6L8 11L13 6" 1020 stroke="currentColor" 1021 stroke-width="1.5" 1022 stroke-linecap="round" 1023 stroke-linejoin="round" 1024 /> 1025</svg></div></button><div class="divider header-divider"></div><div mobile-dropdown-list="" class="header__dropdown__list menu__dropdown__list w-dyn-list"><div role="list" class="header__dropdown__wrap header__dropdown__wrap--dark menu__dropdown__wrap w-dyn-items"><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/snacks" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbbb1c0c2137c33640cc_68874a719a2a4264a5268d42_-Snacks_Ortho-v5%203%20(1).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Snacks</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/smart-fridge" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cb6a82f242928345a53c_68874a20ab953a0606a95184_-Smart_Fridge_Ortho-v5.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Smart Fridge</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/photobooth" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cc009d05068eecdf2c60_68874b4c18915b7de2367d10_-Photobooth_Ortho-v5.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Photobooth</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/ocs" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931caa15d617d30c104ba77_6889be0952f7c584bc257a8b_Icon%20(3).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">OCS</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/laundromat" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cab634a3cc477e131a96_6889beac4478496d863d5126_Icon%20(8).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Laundromat</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/kiosk" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931ca7e015f4cfb2d689da5_6889be7aec83cb44355e5d30_Icon%20(7).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Kiosk</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/kiddie-ride" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cb548d208ceb9897bbd7_68874a9ca9fdc5d09424f126_-Kiddie_Ride_Ortho-v5%204.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Kiddie Ride</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/ev-charger" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cae8a4a620b6c091b452_68874a09c4c52c3d73937f7a_-EV_Charger_Ortho-v5%20(1).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">EV Charger</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/coffee" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cc113988faaff8cc33af_68874b23f0dff715f664f595_-Coffee_Ortho-v5.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Coffee</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/cigarettes" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbe4130caca2e7ef8cc3_68874ae80780654883726b50_-Cigarettess_Ortho-v5.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Cigarettes</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/car-wash" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cab16f1c62389ef3
10250236_6889bee8c7fee99fc038fe5e_Icon%20(9).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Car Wash</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/candy" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931bbd48f130f313fca2286_6889be4bff8308a29e316d33_Icon%20(6).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Candy</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/parkomat" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931bbc19c6e9b9289768bec_6889be2b1e5151158507015c_Icon%20(5).png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Parkomat</p></a></div><div role="listitem" class="header__dropdown__item w-dyn-item"><a data-curtain="" href="/services/water" class="link-block-3 w-inline-block"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931cbd499c8428cd16fd8da_68874ad2c6ec1a66e9debdf2_-Water_Ortho-v5.png" loading="lazy" alt="" class="image-4"/><p class="paragraph-2 text-mobile-regular">Water</p></a></div></div></div></div><div class="menu__mobile__wrap"><a menu-item="" href="/projects" class="menu__mobile__link w-inline-block"><div class="menu__mobile__link__icon"><div class="menu__mobile__link__icon__svg w-embed"><svg style="width: 20px; height: 20px" style="" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1026<path d="M10.9091 2.18182V8.72727C10.9091 9.30593 10.6792 9.86088 10.2701 10.2701C9.86088 10.6792 9.30593 10.9091 8.72727 10.9091H2.18182C1.60316 10.9091 1.04821 10.6792 0.63904 10.2701C0.229869 9.86088 0 9.30593 0 8.72727V2.18182C0 1.60316 0.229869 1.04821 0.63904 0.63904C1.04821 0.229869 1.60316 0 2.18182 0H8.72727C9.30593 0 9.86088 0.229869 10.2701 0.63904C10.6792 1.04821 10.9091 1.60316 10.9091 2.18182ZM21.8182 0H15.2727C14.6941 0 14.1391 0.229869 13.7299 0.63904C13.3208 1.04821 13.0909 1.60316 13.0909 2.18182V8.72727C13.0909 9.30593 13.3208 9.86088 13.7299 10.2701C14.1391 10.6792 14.6941 10.9091 15.2727 10.9091H21.8182C22.3968 10.9091 22.9518 10.6792 23.361 10.2701C23.7701 9.86088 24 9.30593 24 8.72727V2.18182C24 1.60316 23.7701 1.04821 23.361 0.63904C22.9518 0.229869 22.3968 0 21.8182 0ZM8.72727 13.0909H2.18182C1.60316 13.0909 1.04821 13.3208 0.63904 13.7299C0.229869 14.1391 0 14.6941 0 15.2727V21.8182C0 22.3968 0.229869 22.9518 0.63904 23.361C1.04821 23.7701 1.60316 24 2.18182 24H8.72727C9.30593 24 9.86088 23.7701 10.2701 23.361C10.6792 22.9518 10.9091 22.3968 10.9091 21.8182V15.2727C10.9091 14.6941 10.6792 14.1391 10.2701 13.7299C9.86088 13.3208 9.30593 13.0909 8.72727 13.0909ZM21.8182 13.0909H15.2727C14.6941 13.0909 14.1391 13.3208 13.7299 13.7299C13.3208 14.1391 13.0909 14.6941 13.0909 15.2727V21.8182C13.0909 22.3968 13.3208 22.9518 13.7299 23.361C14.1391 23.7701 14.6941 24 15.2727 24H21.8182C22.3968 24 22.9518 23.7701 23.361 23.361C23.7701 22.9518 24 22.3968 24 21.8182V15.2727C24 14.6941 23.7701 14.1391 23.361 13.7299C22.9518 13.3208 22.3968 13.0909 21.8182 13.0909Z" fill="#615E84"/> 1027</svg></div></div><div class="menu__mobile__link__text">Projects</div></a><a menu-item="" href="/about-us" aria-current="page" class="menu__mobile__link w-inline-block w--current"><div class="menu__mobile__link__icon"><div class="menu__mobile__link__icon__svg w-embed"><svg style="width: 24px; height: 24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1028<path d="M6.01175 13.8564C6.01429 13.9072 6.00647 13.958 5.98877 14.0057C5.97107 14.0533 5.94385 14.0969 5.90877 14.1338C5.87369 14.1706 5.83149 14.1999 5.78472 14.2199C5.73796 14.2399 5.68761 14.2502 5.63675 14.2501H1.5005C1.33122 14.2504 1.16683 14.1934 1.03407 14.0884C0.901303 13.9833 0.807971 13.8365 0.769249 13.6717C0.745137 13.5589 0.746249 13.4422 0.772504 13.3299C0.798759 13.2176 0.849509 13.1124 0.921124 13.022C1.58282 12.1445 2.46077 11.4536 3.46925 11.0167C3.02649 10.613 2.68691 10.1091 2.47894 9.54721C2.27098 8.9853 2.20068 8.38173 2.27395 7.78707C2.34721 7.1924 2.5619 6.62395 2.90003 6.12931C3.23817 5.63468 3.6899 5.22827 4.2174 4.94413C4.7449 4.65998 5.33281 4.50636 5.93188 4.49615C6.53096 4.48594 7.12376 4.61942 7.66063 4.88542C8.19751 5.15142 8.66284 5.54219 9.01764 6.02501C9.37244 6.50783 9.60638 7.06863 9.69987 7.66046C9.71195 7.74004 9.69769 7.82139 9.65927 7.89213C9.62086 7.96287 9.56039 8.01912 9.48706 8.05233C8.4468 8.53325 7.56581 9.30168 6.94803 10.267C6.33026 11.2322 6.00148 12.3541 6.0005 13.5001C6.0005 13.6201 6.0005 13.7383 6.01175 13.8564ZM23.0742 13.0211C22.4141 12.1446 21.5381 11.454 20.5317 11.0167C20.9745 10.613 21.3141 10.1091 21.5221 9.54721C21.73 8.9853 21.8003 8.38173 21.727 7.78707C21.6538 7.1924 21.4391 6.62395 21.101 6.12931C20.7628 5.63468 20.3111 5.22827 19.7836 4.94413C19.2561 4.65998 18.6682 4.50636 18.0691 4.49615C17.47 4.48594
102816.8772 4.61942 16.3404 4.88542C15.8035 5.15142 15.3382 5.54219 14.9834 6.02501C14.6286 6.50783 14.3946 7.06863 14.3011 7.66046C14.289 7.74004 14.3033 7.82139 14.3417 7.89213C14.3801 7.96287 14.4406 8.01912 14.5139 8.05233C15.5542 8.53325 16.4352 9.30168 17.053 10.267C17.6707 11.2322 17.9995 12.3541 18.0005 13.5001C18.0005 13.6201 18.0005 13.7383 17.9892 13.8564C17.9867 13.9072 17.9945 13.958 18.0122 14.0057C18.0299 14.0533 18.0571 14.0969 18.0922 14.1338C18.1273 14.1706 18.1695 14.1999 18.2163 14.2199C18.263 14.2399 18.3134 14.2502 18.3642 14.2501H22.5005C22.6698 14.2504 22.8342 14.1934 22.9669 14.0884C23.0997 13.9833 23.193 13.8365 23.2317 13.6717C23.256 13.5587 23.2549 13.4417 23.2285 13.3292C23.202 13.2167 23.151 13.1115 23.0789 13.0211H23.0742ZM14.7305 17.0692C15.4773 16.4973 16.026 15.7058 16.2997 14.8059C16.5734 13.9059 16.5582 12.9429 16.2563 12.0521C15.9543 11.1612 15.3808 10.3874 14.6164 9.83936C13.852 9.2913 12.935 8.99656 11.9944 8.99656C11.0538 8.99656 10.1368 9.2913 9.3724 9.83936C8.60796 10.3874 8.03448 11.1612 7.73254 12.0521C7.43061 12.9429 7.41542 13.9059 7.68909 14.8059C7.96276 15.7058 8.51155 16.4973 9.25831 17.0692C7.93319 17.6434 6.82668 18.6267 6.10081 19.8751C6.03498 19.9892 6.00032 20.1185 6.00033 20.2502C6.00034 20.3819 6.03501 20.5112 6.10085 20.6252C6.1667 20.7392 6.2614 20.8339 6.37544 20.8997C6.48948 20.9655 6.61883 21.0002 6.7505 21.0001H17.2505C17.3822 21.0002 17.5115 20.9655 17.6256 20.8997C17.7396 20.8339 17.8343 20.7392 17.9001 20.6252C17.966 20.5112 18.0007 20.3819 18.0007 20.2502C18.0007 20.1185 17.966 19.9892 17.9002 19.8751C17.1728 18.6258 16.0642 17.6425 14.7371 17.0692H14.7305Z" fill="#615E84"/> 1029</svg></div></div><div class="menu__mobile__link__text">About us</div></a><a menu-item="" href="/careers" class="menu__mobile__link w-inline-block"><div class="menu__mobile__link__icon"><div class="menu__mobile__link__icon__svg w-embed"><svg style="width: 24px; height: 24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1030<path d="M19.5 3H17.25V2.25C17.25 2.05109 17.171 1.86032 17.0303 1.71967C16.8897 1.57902 16.6989 1.5 16.5 1.5C16.3011 1.5 16.1103 1.57902 15.9697 1.71967C15.829 1.86032 15.75 2.05109 15.75 2.25V3H8.25V2.25C8.25 2.05109 8.17098 1.86032 8.03033 1.71967C7.88968 1.57902 7.69891 1.5 7.5 1.5C7.30109 1.5 7.11032 1.57902 6.96967 1.71967C6.82902 1.86032 6.75 2.05109 6.75 2.25V3H4.5C4.10218 3 3.72064 3.15804 3.43934 3.43934C3.15804 3.72064 3 4.10218 3 4.5V19.5C3 19.8978 3.15804 20.2794 3.43934 20.5607C3.72064 20.842 4.10218 21 4.5 21H19.5C19.8978 21 20.2794 20.842 20.5607 20.5607C20.842 20.2794 21 19.8978 21 19.5V4.5C21 4.10218 20.842 3.72064 20.5607 3.43934C20.2794 3.15804 19.8978 3 19.5 3ZM6.75 6V5.25C6.75 5.05109 6.82902 4.86032 6.96967 4.71967C7.11032 4.57902 7.30109 4.5 7.5 4.5C7.69891 4.5 7.88968 4.57902 8.03033 4.71967C8.17098 4.86032 8.25 5.05109 8.25 5.25V6C8.25 6.19891 8.17098 6.38968 8.03033 6.53033C7.88968 6.67098 7.69891 6.75 7.5 6.75C7.30109 6.75 7.11032 6.67098 6.96967 6.53033C6.82902 6.38968 6.75 6.19891 6.75 6ZM14.49 15.6628C13.7717 16.2578 12.9934 16.7766 12.1678 17.2106C12.1157 17.2367 12.0583 17.2503 12 17.2503C11.9417 17.2503 11.8843 17.2367 11.8322 17.2106C11.0066 16.7766 10.2283 16.2578 9.51 15.6628C7.9275 14.3438 7.125 12.9853 7.125 11.625C7.12525 11.0512 7.31352 10.4932 7.66099 10.0366C8.00847 9.57993 8.49601 9.24972 9.04899 9.09648C9.60197 8.94324 10.1899 8.97542 10.7229 9.18809C11.2558 9.40076 11.7044 9.78221 12 10.2741C12.2956 9.78221 12.7442 9.40076 13.2771 9.18809C13.8101 8.97542 14.398 8.94324 14.951 9.09648C15.504 9.24972 15.9915 9.57993 16.339 10.0366C16.6865 10.4932 16.8748 11.0512 16.875 11.625C16.875 12.9853 16.0725 14.3438 14.49 15.6628ZM17.25 6C17.25 6.19891 17.171 6.38968 17.0303 6.53033C16.8897 6.67098 16.6989 6.75 16.5 6.75C16.3011 6.75 16.1103 6.67098 15.9697 6.53033C15.829 6.38968 15.75 6.19891 15.75 6V5.25C15.75 5.05109 15.829 4.86032 15.9697 4.71967C16.1103 4.57902 16.3011 4.5 16.5 4.5C16.6989 4.5 16.8897 4.57902 17.0303 4.71967C17.171 4.86032 17.25 5.05109 17.25 5.25V6Z" fill="#615E84"/> 1031</svg></div></div><div class="menu__mobile__link__text">Careers</div></a><a menu-item="" href="/contact" class="menu__mobile__link w-inline-block"><div class="menu__mobile__link__icon"><div class="menu__mobile__link__icon__svg w-embed"><svg style="width: 24px; height: 24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1032<path d="M21.75 9C21.75 8.60218 21.592 8.22064 21.3107 7.93934C21.0294 7.65804 20.6478 7.5 20.25 7.5H17.25V4.5C17.25 4.10218 17.092 3.72064 16.8107 3.43934C16.5294 3.15804 16.1478 3 15.75 3H3.7
10325C3.35218 3 2.97064 3.15804 2.68934 3.43934C2.40804 3.72064 2.25 4.10218 2.25 4.5V16.5C2.25044 16.6411 2.29068 16.7792 2.36608 16.8985C2.44149 17.0177 2.54901 17.1133 2.67629 17.1742C2.80358 17.2351 2.94546 17.2589 3.08564 17.2428C3.22581 17.2266 3.3586 17.1713 3.46875 17.0831L6.75 14.4375V17.25C6.75 17.6478 6.90804 18.0294 7.18934 18.3107C7.47064 18.592 7.85218 18.75 8.25 18.75H17.0241L20.5312 21.5831C20.664 21.6905 20.8293 21.7493 21 21.75C21.1989 21.75 21.3897 21.671 21.5303 21.5303C21.671 21.3897 21.75 21.1989 21.75 21V9ZM17.7609 17.4169C17.6282 17.3095 17.4629 17.2507 17.2922 17.25H8.25V14.25H15.75C16.1478 14.25 16.5294 14.092 16.8107 13.8107C17.092 13.5294 17.25 13.1478 17.25 12.75V9H20.25V19.4297L17.7609 17.4169Z" fill="#615E84"/> 1033</svg></div></div><div class="menu__mobile__link__text">Contacts</div></a></div><div class="menu__mobile__bottom"><div class="lang-switcher lang-switcher__mobile"><div class="code-embed w-embed"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 24" fill="none"> 1034 <path d="M12.5 2.25C10.5716 2.25 8.68657 2.82183 7.08319 3.89317C5.47982 4.96451 4.23013 6.48726 3.49218 8.26884C2.75422 10.0504 2.56114 12.0108 2.93735 13.9021C3.31355 15.7934 4.24215 17.5307 5.60571 18.8943C6.96928 20.2579 8.70656 21.1865 10.5979 21.5627C12.4892 21.9389 14.4496 21.7458 16.2312 21.0078C18.0127 20.2699 19.5355 19.0202 20.6068 17.4168C21.6782 15.8134 22.25 13.9284 22.25 12C22.247 9.41505 21.2188 6.93683 19.391 5.109C17.5632 3.28116 15.085 2.25298 12.5 2.25ZM19.8463 8.25H16.5041C16.0832 6.70585 15.3738 5.25532 14.4134 3.975C15.5738 4.25375 16.6602 4.7801 17.598 5.51799C18.5359 6.25588 19.3032 7.18784 19.8472 8.25H19.8463ZM20.75 12C20.7507 12.7608 20.6456 13.5181 20.4378 14.25H16.8275C17.0575 12.7588 17.0575 11.2412 16.8275 9.75H20.4378C20.6456 10.4819 20.7507 11.2392 20.75 12ZM12.5 4.03125C13.6231 5.23361 14.4567 6.67653 14.9375 8.25H10.0625C10.5428 6.67632 11.3765 5.2333 12.5 4.03125ZM10.0625 15.75H14.9375C14.4572 17.3237 13.6235 18.7667 12.5 19.9688C11.377 18.7664 10.5433 17.3235 10.0625 15.75ZM9.69688 14.25C9.43939 12.7611 9.43939 11.2389 9.69688 9.75H15.3106C15.5681 11.2389 15.5681 12.7611 15.3106 14.25H9.69688ZM14.4172 20.025C15.3776 18.7447 16.0869 17.2941 16.5078 15.75H19.8509C19.3065 16.8126 18.5387 17.7448 17.6001 18.4827C16.6616 19.2206 15.5745 19.7467 14.4134 20.025H14.4172Z" fill="currentColor"/> 1035</svg></div><div class="w-locales-list"><div role="list" class="w-locales-items"><div role="listitem" class="w-locales-item"><a hreflang="en" href="/about-us" aria-current="page" class="lang-switcher__text w--current">EN</a></div><div role="listitem" class="w-locales-item"><a hreflang="es-ES" href="/es-es/about-us" class="lang-switcher__text">ES</a></div></div></div></div><div class="btn-group header-main inner"><a href="/contact" class="btn-icon-link inner w-inline-block"><div class="btn-icon-content"><div data-icon-size="normal" class="btn-icon-icon"><div data-button-anim-target="" class="btn-icon-icon__bg"></div><div class="btn-icon-icon__wrap"><div class="btn-icon-icon__list"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow main"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg></div></div></div><div class="btn-icon-content__mask"><span data-button-anim-target="" class="btn-icon-content__text">Get in Touch</span></div><div data-button-anim-target="" class="btn-icon-content__bg inner"></div></div></a></div></div></div></div><div class="code-embed-17 w-embed w-script"><style> 1036 .header { 1037 transition: all 1s cubic-bezier(0.625, 0.05, 0, 1) 1038 } 1039 1040 .header::before { 1041 content: ''; 1042 background: rgba(240, 239, 255, 0.5); 1043 backdrop-filter: blur(10px); 1044 position: absolute; 1045 top: 0; 1046 left: 0; 1047 width: 100%; 1048 height: 100%; 1049 z-index: -1; 1050 border-radius: .625rem; 1051 } 1052 .lang-item.w--current { 1053 pointer-events: none 1054 } 1055 1056 .header__wrapper .header__link { 1057 transition: transform 0.525s cubic-bezier(0.625, 0.05, 0, 1); 1058 } 1059 1060 /* MODIFICATION: Hover animation restricted to non-touch devices */ 1061 @media (hover: hover) { 1062 .header__wrapper button.header__link:hover .header__link, 1063 .header__wrapper .header__link_wrapper:hover .header__link{ 1064 transform: translateY(-100%) 1065 } 1066 } 1067 1068 .lang-item::last-of-type {
1069 border-right: none; 1070 } 1071 1072 .menu__btn__icon span:nth-child(1) { 1073 top: 0; 1074 } 1075 .menu__btn__icon span:nth-child(2) { 1076 top: 50%; 1077 transform: translateY(-50%); 1078 } 1079 .menu__btn__icon span:nth-child(3) { 1080 bottom: 0; 1081 } 1082 1083 @media (max-width: 991px) { 1084 .menu__mobile__link.w--current { 1085 padding: 0.375rem 1rem 0.375rem 0.375rem; 1086 } 1087 } 1088 1089 .menu__btn__icon span { 1090 display: block; 1091 height: 2px; 1092 width: 100%; 1093 background: #000; 1094 position: absolute; 1095 left: 0; 1096 transition: all 0.3s ease; 1097 border-radius: 2px; 1098 } 1099 .is-open .menu__btn__icon { 1100 width: 0.9375rem; 1101 height: 0.9375rem; 1102 margin-left: -1.5px; 1103 } 1104 .is-open .menu__btn__icon span:nth-child(1) { 1105 width: 128%; 1106 top: 50%; 1107 transform: rotate(45deg); 1108 } 1109 1110 .is-open .menu__btn__icon span:nth-child(2) { 1111 opacity: 0; 1112 } 1113 1114 .is-open .menu__btn__icon span:nth-child(3) { 1115 width: 128%; 1116 bottom: auto; 1117 top: 50%; 1118 transform: rotate(-45deg); 1119 } 1120 .is-open .menu__btn__text__wrap { 1121 display: block; 1122 } 1123 .dropdown-open .menu__mobile__more__text { 1124 transform: translateY(-101%); 1125 } 1126 1127 .menu__mobile__more { 1128 transition: 0.4s cubic-bezier(0.625, 0.05, 0, 1); 1129 } 1130 .dropdown-open .menu__mobile__more { 1131 rotate: 180deg; 1132 } 1133 .mobile__menu__curtain { 1134 opacity: 0; 1135 transition: 0.4s cubic-bezier(0.625, 0.05, 0, 1) 0.4s; 1136 } 1137 .is-open .mobile__menu__curtain { 1138 opacity: 1; 1139 transition: 0.4s cubic-bezier(0.625, 0.05, 0, 1); 1140 } 1141 .header__wrapper { 1142 scrollbar-width: none; 1143 -ms-overflow-style: none; 1144 } 1145 1146 .header__wrapper::-webkit-scrollbar {
1147 display: none; 1148 } 1149 .header__dropdown__item { 1150 position: relative; 1151 overflow: hidden; 1152 } 1153 1154 .header__dropdown__item > a { 1155 position: relative; 1156 z-index: 2; 1157 } 1158 .header__dropdown__item::after { 1159 content: ""; 1160 position: absolute; 1161 inset: 0; 1162 transform-origin: top; 1163 background-color: #0f081a; 1164 transform: scaleY(0); 1165 transition: transform 0.2s ease-in-out; 1166 } 1167 @media (min-width: 1276px) { 1168 .header__dropdown__item.fill-from-top::after { 1169 transform-origin: top; 1170 transform: scaleY(1); 1171 } 1172 1173 .header__dropdown__item.fill-from-bottom::after { 1174 transform-origin: bottom; 1175 transform: scaleY(1); 1176 } 1177 1178 .header__dropdown__item.empty-to-top::after { 1179 transform-origin: top; 1180 transform: scaleY(0); 1181 } 1182 1183 .header__dropdown__item.empty-to-bottom::after { 1184 transform-origin: bottom; 1185 transform: scaleY(0); 1186 } 1187 } 1188 1189 /* MODIFICATION: Hover color change restricted to non-touch devices */ 1190 @media (hover: hover) { 1191 .header__dropdown__item:hover .header__dropdown__item__text { 1192 color: #fff; 1193 } 1194 } 1195 1196 .dropdown-item__image { 1197 background: #e1deff; 1198 color: #615e84; 1199 border-radius: 0.375rem; 1200 width: 3.25rem; 1201 height: 3.25rem; 1202 display: flex; 1203 align-items: center; 1204 justify-content: center; 1205 } 1206 1207 .dropdown-item__image svg { 1208 width: 1.5rem; 1209 height: 1.5rem; 1210 } 1211 1212 @media (min-width: 1280px) { 1213 .menu__mobile { 1214 display: none; 1215 } 1216 } 1217 1218 @media (max-width: 1280px) and (min-width: 479px) { 1219 .menu__mobile__wrap { 1220 grid-column-gap: 0.625rem; 1221 grid-row-gap: 0.625rem; 1222 grid-template-rows: auto auto; 1223 grid-template-columns: 1fr 1fr; 1224 grid-auto-columns: 1fr; 1225 width: 100%; 1226 display: grid; 1227 transform: scale(1); 1228 } 1229 1230 .menu__mobile__bottom { 1231 grid-column-gap: 0.625rem; 1232 grid-row-gap: 0.625rem; 1233 display: flex; 1234 } 1235 1236 .header { 1237 padding-top: 4px; 1238 padding-bottom: 4px; 1239 padding-right: 4px; 1240 border-radius: 0.625rem; 1241 flex-wrap: wrap; 1242 } 1243 } 1244 1245 .lang-item:last-of-type { 1246 border: none; 1247 } 1248 1249 @media (min-width: 1024px) and (max-width: 1280px) { 1250 .header__link { 1251 font-size: 16px; 1252 } 1253 1254 .header__links { 1255 gap: 1.5rem; 1256 } 1257 } 1258 1259 .header__dropdown__wrap.header__dropdown__wrap--dark { 1260 width: 50.7rem; 1261 } 1262 1263 @media (min-width: 991px) and (max-width: 1280px) { 1264 .menu__btn__text__wrap { 1265 text-align: right; 1266 width: 3.5rem; 1267 height: 21px; 1268 line-height: 21px; 1269 position: relative; 1270 top: 0; 1271 overflow: hidden; 1272 } 1273 1274 .menu__mobile__more__wrap { 1275 height: 20px; 1276 } 1277 1278 .menu__mobile { 1279 opacity: 0; 1280 pointer-events: auto; 1281 background-color: #fff; 1282 height: 0; 1283 padding-left: 1rem; 1284 padding-right: 1rem; 1285 position: relative; 1286 } 1287 1288 .lang-switcher__mobile { 1289 display: none; 1290 } 1291 1292 .button-full { 1293 width: 100%; 1294 } 1295 1296 .header__actions { 1297 grid-column-gap: 0.375rem; 1298 grid-row-gap: 0.375rem; 1299 display: flex; 1300 } 1301 1302 .menu__mobile { 1303 pointer-events: auto; 1304 } 1305 1306 .menu__mobile__wrap { 1307 display: flex; 1308 flex-direction: column; 1309 } 1310 1311 .menu__mobile__bottom { 1312 margin-top: auto; 1313 } 1314 1315 .menu__btn__icon { 1316 position: absolute; 1317 left: 0.875rem; 1318 } 1319 1320 .menu__btn { 1321 position: relative; 1322 } 1323 } 1324 1325 @media (max-width: 1275px) { 1326 .header__wrapper .menu__mobile__bottom .btn-icon-content, { 1327 height: 100%; 1328 padding: 10px; 1329 } 1330 1331 .menu__mobile__bottom .btn-group.header-main.inner { 1332 width: 100%; 1333 height: 56px; 1334 } 1335 1336 .menu__mobile__bottom .btn-icon-link.inner, .about-us__content__wrapper { 1337 width: 100%; 1338 } 1339 1340 .menu__mobile__bottom .btn-icon-content__bg.inner { 1341 transform: translate(0, 185%) rotate(5deg); 1342 } 1343 1344 .menu__mobile__bottom .btn-icon-icon { 1345 scale: 1.5; 1346 margin-left: 7px; 1347 } 1348 1349 .header__wrapper.is-open .header::before { 1350 border-radius: 0; 1351 } 1352 1353 .header .btn-group.header-main { 1354 display: none; 1355 } 1356 1357 .header__actions { 1358 flex-direction: row-reverse; 1359 } 1360 1361 .mobile__menu__wrapper { 1362 background-color: #f0efff80; 1363 border-bottom-right-radius: 0.75rem; 1364 border-bottom-left-radius: 0.75rem; 1365 padding: 1rem 0.25rem 0.25rem; 1366 } 1367 1368 .dropdown-open .menu__dropdown__wrap { 1369 opacity: 1; 1370 } 1371 .dropdown-open a[data-curtain], 1372 .dropdown-open .header__dropdown__wrap { 1373 pointer-events: all !important; 1374 } 1375 1376 .lang-switcher__wrap { 1377 width: fit-content; 1378 height: 2.625rem; 1379 } 1380 1381 .lang-glob { 1382 opacity: 0; 1383 pointer-events: none; 1384 position: absolute; 1385 left: 0.4rem; 1386 } 1387 1388 .lang-switcher.land-switcher__desktop.lang-main { 1389 width: 2.75rem; 1390 background-color: #0000; 1391 border: 1px solid #ced1d8; 1392 display: block; 1393 } 1394 1395 .lang-item { 1396 width: 2.75rem; 1397 min-width: unset; 1398 } 1399 1400 .header__logo { 1401 width: 98px; 1402 } 1403 1404 .button__desktop { 1405 display: none; 1406 } 1407 1408 .header__links { 1409 display: none; 1410 } 1411 1412 .menu__mobile { 1413 grid-column-gap: 0.625rem; 1414 grid-row-gap: 0.625rem; 1415 flex-flow: wrap; 1416 grid-template-rows: auto auto; 1417 grid-template-columns: 1fr 1fr; 1418 grid-auto-columns: 1fr; 1419 width: 100%; 1420 height: 0; 1421 padding-top: 0; 1422 display: flex; 1423 overflow: hidden; 1424 } 1425 1426 .menu__btn { 1427 grid-column-gap: 0.8125rem; 1428 grid-row-gap: 0.8125rem; 1429 background-color: #fff; 1430 border-radius: 0.5rem; 1431 justify-content: center; 1432 align-items: center; 1433 width: 2.75rem; 1434 height: 2.75rem; 1435 padding-left: 0.75rem; 1436 padding-right: 0.75rem; 1437 display: flex; 1438 } 1439 1440 .menu__btn__text__wrap { 1441 height: 21px; 1442 line-height: 21px; 1443 overflow: hidden; 1444 } 1445 1446 .menu__btn__icon { 1447 grid-column-gap: 3px; 1448 grid-row-gap: 3px; 1449 flex-flow: column; 1450 width: 0.8125rem; 1451 min-width: 0.8125rem; 1452 height: 0.625rem; 1453 display: flex; 1454 position: absolute; 1455 } 1456 1457 .menu__mobile__dropdown { 1458 grid-column-gap: 0rem; 1459 grid-row-gap: 0rem; 1460 border-radius: var(--corner-radius-6); 1461 background-color: #fff; 1462 flex-flow: wrap; 1463 align-items: center; 1464 width: 100%; 1465 padding: 0.375rem 1rem 0.375rem 0.375rem; 1466 display: flex; 1467 } 1468 1469 .menu__mobile__link { 1470 grid-column-gap: 0.75rem; 1471 grid-row-gap: 0.75rem; 1472 border-radius: var(--corner-radius-6); 1473 background-color: #fff; 1474 justify-content: flex-start; 1475 align-items: center; 1476 width: 100%; 1477 padding: 0.375rem 1rem 0.375rem 0.375rem; 1478 text-decoration: none; 1479 display: flex; 1480 } 1481 1482 .mobile__menu__wrapper { 1483 grid-column-gap: 0.625rem; 1484 grid-row-gap: 0.625rem; 1485 flex-flow: column; 1486 width: 100%; 1487 padding-top: 0.875rem; 1488 display: flex; 1489 } 1490 1491 @media (max-width: 1024px) { 1492 .header__wrapper.is-open .header { 1493 border-bottom-left-radius: 1rem; 1494 border-bottom-right-radius: 1rem; 1495 } 1496 } 1497 1498 .menu__mobile__more { 1499 color: var(--purple-700); 1500 background-color: #0000; 1501 margin-left: auto; 1502 font-family: Poppins, sans-serif; 1503 font-weight: 400; 1504 overflow: hidden; 1505 } 1506 1507 .header__dropdown__list.menu__dropdown__list { 1508 opacity: 1; 1509 width: 100%; 1510 pointer-events: auto; 1511 margin-left: 3.75rem; 1512 display: block; 1513 position: relative; 1514 top: 0; 1515 left: 0; 1516 right: 0; 1517 overflow: hidden; 1518 } 1519 1520 .header__dropdown__wrap.header__dropdown__wrap--dark { 1521 border-top-style: solid; 1522 border-top-width: 1px;
1523 border-top-color: var(--divider); 1524 border-right-style: none; 1525 border-right-width: 1px; 1526 border-right-color: var(--divider); 1527 border-bottom-style: none; 1528 border-bottom-width: 1px; 1529 border-bottom-color: var(--divider); 1530 border-left-style: none; 1531 border-left-width: 1px; 1532 border-left-color: var(--divider); 1533 border-radius: 0; 1534 flex-flow: column; 1535 width: 100%; 1536 padding-left: 0; 1537 background: transparent !important; 1538 } 1539 1540 .mobile__menu__curtain { 1541 background: #fff; 1542 } 1543 1544 .link-block-3 { 1545 height: 32px; 1546 font-size: 0.875rem; 1547 line-height: 120%; 1548 } 1549 1550 .image-4 { 1551 display: none; 1552 } 1553 1554 .paragraph-2 { 1555 font-size: 0.875rem; 1556 } 1557 1558 .header__wrapper.is-open:not(dropdown-open) { 1559 overflow: hidden; 1560 } 1561 1562 .header__wrapper.is-open .header { 1563 border-bottom-left-radius: 0; 1564 border-bottom-right-radius: 0; 1565 } 1566 1567 /* MODIFICATION: Hover background restricted to non-touch devices */ 1568 @media (max-width: 1024px) and (hover: hover) { 1569 .menu__mobile__link:not(.mobile__menu__dropdown__link):hover { 1570 background-color: #1d1131; 1571 color: #fff; 1572 } 1573 } 1574 } 1575 @media (max-width: 1024px) { 1576 .mobile__menu__dropdown__link { 1577 margin-left: 0 !important; 1578 width: 80% !important; 1579 padding: 0 !important; 1580 } 1581 1582 .lang-open .lang-item.w--current { 1583 border-right: 1px solid var(--purple-200); 1584 } 1585 } 1586 .header__wrapper.dropdown-open { 1587 overflow-y: scroll !important; 1588 } 1589 1590 @media (max-width: 1200px) and (min-width: 768px) { 1591 .mobile__menu__dropdown__link { 1592 width: 50%; 1593 padding: 0; 1594 } 1595 } 1596 1597 @media (max-width: 991px) { 1598 .mobile__menu__dropdown__link { 1599 padding-left: 0.75rem; 1600 } 1601 } 1602</style> 1603
1604<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/CustomEase.min.js"></script>
vendor: 1 bytes, line 1604
1604
1605<script nonce="aPXsNxecKITnUVboEbCnig==" test-src="http://localhost:3000/dist/external/elecctro/header.js"> 1606(() => { function require(key) { return window._custom_vendors__[key]; }; 1607"use strict";(()=>{document.addEventListener("DOMContentLoaded",()=>{gsap.registerPlugin(CustomEase),CustomEase.create("heroEase","0.625, 0.05, 0, 1");let i=document.querySelector(".lang-switcher"),h=document.querySelectorAll(".lang-item"),S=h[0]?.clientWidth||0,s=document.querySelector(".btn-group.header-main"),x=s?.clientWidth||0,v=!1;function O(){let t=document.querySelector(".lang-item.w--current");if(!t)return;let e=t.closest(".w-locales-item");if(!e)return;let o=e.parentElement;if(!o)return;let n=o.querySelector(".w-locales-item:first-child");n&&e!==n&&o.insertBefore(e,n)}function P(){let t=document.querySelector(".w-locales-item:first-child .lang-item");if(!t||t.tagName!=="A")return;let e=t,o=e.getAttribute("href"),n=e.getAttribute("hreflang"),r=e.className,l=e.getAttribute("style"),c=e.innerHTML,a=document.createElement("div");a.className=r,l&&a.setAttribute("style",l),a.innerHTML=c,o&&a.setAttribute("data-href",o),n&&a.setAttribute("data-hreflang",n),a.setAttribute("data-original-tag","a"),e.parentNode?.replaceChild(a,e)}function N(){let t=document.querySelector(".w-locales-item:first-child .lang-item");if(!t||t.tagName!=="DIV")return;let e=t,o=e.className,n=e.getAttribute("style"),r=e.innerHTML,l=document.createElement("a");l.className=o,n&&l.setAttribute("style",n),l.innerHTML=r;let c=e.getAttribute("data-href"),a=e.getAttribute("data-hreflang");c&&(l.setAttribute("href",c),e.removeAttribute("data-href")),a&&(l.setAttribute("hreflang",a),e.removeAttribute("data-hreflang")),e.removeAttribute("data-original-tag"),e.parentNode?.replaceChild(l,e)}O();function B(){i&&(N(),i.addEventListener("mouseenter",q),i.addEventListener("mouseleave",C))}function I(){i&&(i.removeEventListener("mouseenter",q),i.removeEventListener("mouseleave",C),E())}function q(){!i||!s||(gsap.to(i,{width:S*h.length,duration:.6}),h.forEach(t=>{gsap.to(t,{borderColor:"#c9c5f2",duration:.5,ease:"power2.inOut"})}),gsap.to(s,{width:s.clientHeight,duration:.6}),gsap.to(".btn-group.header-main .btn-icon-content__mask",{opacity:0,pointerEvents:"none",duration:.2}))}function C(){!i||!s||(gsap.to(i,{width:S,duration:.6}),gsap.to(s,{width:x,duration:.6}),gsap.to(".btn-group.header-main .btn-icon-content__mask",{opacity:1,duration:.2,delay:.15,clearProps:"all"}),h.forEach(t=>{gsap.to(t,{borderColor:"transparent",duration:.5,ease:"power2.inOut"})}))}function R(){i&&(P(),i.addEventListener("click",W))}function F(){i&&(i.removeEventListener("click",W),E(),v=!1)}function W(){let e=document.querySelector(".lang-switcher__wrap")?.clientWidth||0,o=s?.clientWidth||0;v?(i?.classList.remove("lang-open"),gsap.to(s,{width:o,duration:.6}),gsap.to(i,{width:"2.75rem",duration:.6}),gsap.timeline().to(".menu__btn__text__wrap",{opacity:1,pointerEvents:"all",duration:.2},"-=0.3"),gsap.to(".lang-item-active .lang-switcher__text",{x:0,duration:.2})):(i?.classList.add("lang-open"),gsap.to(i,{width:e,duration:.6}),gsap.to(s,{width:s?.clientHeight||0,duration:.6}),gsap.timeline().to(".menu__btn__text__wrap",{opacity:0,pointerEvents:"none",duration:.2}),gsap.to(".lang-item-active .lang-switcher__text",{x:"0.8rem",duration:.2})),v=!v}function E(){!i||!s||(gsap.set(i,{clearProps:"all"}),gsap.set(s,{clearProps:"all"}),gsap.set(".menu__btn",{clearProps:"all"}),gsap.set(".menu__btn__text__wrap",{clearProps:"all"}),gsap.set(".btn-group.header-main .btn-icon-content__mask",{clearProps:"all"}),gsap.set(".lang-item-active .lang-switcher__text",{clearProps:"all"}),i.classList.remove("lang-open"))}let _=null;function A(){let t=document.documentElement.clientWidth;t>1275&&_!=="desktop"?(F(),B(),_="desktop"):t<=1275&&_!=="mobile"&&(I(),R(),_="mobile")}A(),window.addEventListener("resize",A);let k=document.querySelector(".header__dropdown__wrap"),L=document.createElement("div");L.classList.add("header__dropdown__item"),L.innerHTML='<a data-curtain="" href="/services" class="link-block-3 w-inline-block"><span class="image-7 dropdown-item__image"><svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.25 6H16.5C16.5 4.80653 16.0259 3.66193 15.182 2.81802C14.3381 1.97411 13.1935 1.5 12 1.5C10.8065 1.5 9.66193 1.97411 8.81802 2.81802C7.97411 3.66193 7.5 4.80653 7.5 6H3.75C3.35218 6 2.97064 6.15804 2.68934 6.43934C2.40804 6.72064 2.25 7.10218 2.25 7.5V18.75C2.25 19.1478 2.40804 19.5294 2.68934 19.8107C2.97064 20.092 3.35218 20.25 3.75 20.25H20.25C20.6478 20.25 21.0294 20.092 21.3107 19.8107C21.592 19.5294 21.75 19.1478 21.75 18.75V7.5C21.75 7.10218 21.592 6.72064 21.3107 6.43934C21.0294 6.15804 20.6478 6 20.25 6ZM12 3C12.7956 3 13.5587 3.31607 14.1213 3.87868C14.6839 4.44129 15 5.20435 15 6H9C9 5.20435 9.31607 4.44129 9.87868 3.87868C10.4413 3.31607 11.2044 3 12 3Z" fill="#615E84"/></svg></span><div class="text-wrap"><p class="paragraph-2 header__dropdown__item__text">All Services</p></div></a>',setTimeout(()=>{k&&k.appendChild(L)},500),setTimeout(()=>{document.querySelectorAll(".header__dropdown__item").forEach(t=>{let e=t;e.addEventListener("mouseenter",o=>{let n=e.getBoundingClientRect();o.clientY-n.top<n.height/2?(e.classList.add("fill-from-top"),e.classList.remove("fill-from-bottom","empty-to-top","empty-to-bottom")):(e.classList.add("fill-from-bottom"),e.classList.remove("fill-from-top","empty-to-top","empty-to-bottom"))}),e.addEventListener("mouseleave",o=>{let n=e.getBoundingClientRect();o.clientY-n.top<n.height/2?(e.classList.add("empty-to-top"),e.classList.remove("fill-from-top","fill-from-bottom","empty-to-bottom")):(e.classList.add("empty-to-bottom"),e.classList.remove("fill-from-top","fill-from-bottom","empty-to-top"))})})},600);let b=document.querySelector(".header__dropdown__wrap"),V=(document.querySelector(".header__links")?.clientWidth||0)/2;if(document.documentElement.clientWidth>1200&&b){let t=b.getBoundingClientRect(),e=document.documentElement.clientWidth-t.left;b.style.width=`calc(50vw + ${V}px)`}let G,p=!1,f=document.querySelector(".header__wrapper");if(document.documentElement.clientWidth>1275){let t=document.querySelector("[data-tab]"),e=document.querySelector("[dropdown-list]"),o,n=null,r=!1;if(!t||!e)console.warn("Tab or dropdown element not found");else{let l=()=>{if(clearTimeout(o),e.style.pointerEvents="all",gsap.set(".header__dropdown__item a",{pointerEvents:"all"}),gsap.set(e,{opacity:1}),!n){let y=function(m,u=0){m.forEach((w,$)=>{let D=u+$*.03;w.img&&n.fromTo(w.img,{opacity:0,y:15},{opacity:1,y:0,duration:.25,ease:"power2.out"},D),w.text&&n.fromTo(w.text,{opacity:0,y:10},{opacity:1,y:0,duration:.25,ease:"power2.out"},D+.1)})};var K=y;n=gsap.timeline({paused:!0}),n.fromTo(e,{opacity:0,clipPath:"inset(100% 0% 0% 0%)"},{opacity:1,clipPath:"inset(0% 0% 0% 0%)",duration:.5,ease:"heroEase"});let H=Array.from(document.querySelectorAll(".header__dropdown__item")).map(m=>({img:m.querySelector(".image-7"),text:m.querySelector(".text-wrap")})),Y=H.filter((m,u)=>u%3===0),Z=H.filter((m,u)=>u%3===1),z=H.filter((m,u)=>u%3===2);y(Y.reverse(),0),y(Z.reverse(),.2),y(z.reverse(),.4)}n.play()},c=()=>{clearTimeout(o),n&&n.reverse(),e.style.pointerEvents="none",gsap.set(".header__dropdown__item a",{pointerEvents:"none"})},a=()=>{r||(r=!0,o=setTimeout(()=>{c(),r=!1},250))};t.addEventListener("mouseenter",l),e.addEventListener("mouseenter",()=>{clearTimeout(o),r=!1}),e?.addEventListener("mouseleave",a),t?.addEventListener("mouseleave",a),window.addEventListener("scroll-direction",c)}}else{let t=document.querySelector("[data-mobile-tab]"),e=document.querySelector("[mobile-dropdown-list]"),n=document.querySelector(".menu__dropdown__wrap")?.clientHeight||0;e?(gsap.set(e,{height:0}),gsap.set("[mobile-dropdown-list] .header__dropdown__item",{opacity:0}
1607)):console.warn("Dropdown element not found"),t?.addEventListener("click",()=>{if(!e)return;let r=document.querySelector(".header-divider");p?(f?.classList.remove("dropdown-open"),gsap.to(e,{height:0,duration:.4}),gsap.set(r,{width:"calc(0% - 5rem)"}),gsap.to("[mobile-dropdown-list] .header__dropdown__item",{opacity:0,duration:.1,ease:"power2.out"})):(f?.classList.add("dropdown-open"),gsap.to(e,{height:n,duration:.4}),gsap.set(r,{width:"calc(100% - 5rem)"}),gsap.fromTo("[mobile-dropdown-list] .header__dropdown__item",{opacity:0},{opacity:1,duration:.3,ease:"power2.out"})),p=!p})}let T=document.querySelector("[menu-btn]"),d=document.querySelector("[menu-mobile]"),M=document.querySelector("[menu-wrap]")?.clientHeight||0;document.documentElement.clientWidth<1200&&(M="calc(100svh - 5rem)");let g=!1;if(T?.addEventListener("click",()=>{let t=document.querySelector(".header-divider"),e=document.querySelector(".menu__mobile"),o=document.querySelector(".header__wrapper");g?(f?.classList.remove("is-open"),gsap.timeline().to("[menu-item]",{opacity:0,duration:.2,ease:"power2.inOut"}).fromTo(d,{opacity:1},{opacity:0,duration:.4}),gsap.to("[mobile-dropdown-list]",{height:0,duration:.4}),gsap.set(t,{width:"calc(0% - 5rem)"}),p=!1,document.documentElement.style.overflow="",document.body.style.overflow="",e&&(e.style.pointerEvents="none"),o&&(o.style.pointerEvents="none"),document.documentElement.clientWidth<1200&&(gsap.to(i,{opacity:1,duration:.3}),gsap.to(T,{width:"2.75rem",duration:.3}))):(f?.classList.add("is-open"),gsap.timeline().to(d,{opacity:1,duration:.4,onComplete:()=>{d&&(gsap.set(d,{height:"fit-content"}),document.documentElement.clientWidth<1200&&gsap.set(d,{minHeight:M}))}}).fromTo("[menu-item]",{opacity:0},{opacity:1,stagger:.1,ease:"power2.inOut"},"-=0.3"),document.documentElement.style.overflow="hidden",document.body.style.overflow="hidden",e&&(e.style.pointerEvents="auto"),o&&(o.style.pointerEvents="auto"),document.documentElement.clientWidth<=1275&&(E(),gsap.to(i,{opacity:0,duration:.3}))),g=!g}),document.documentElement.clientWidth<1200){let t=document.querySelectorAll(".menu__mobile a"),e=document.querySelector(".header-divider");t.forEach(o=>{o.addEventListener("click",()=>{let n=document.querySelector(".menu__mobile"),r=document.querySelector(".header__wrapper");d&&gsap.set(d,{minHeight:"auto"}),f?.classList.remove("is-open"),gsap.timeline().to("[menu-item]",{opacity:0,duration:.2,ease:"power2.inOut"}).fromTo(d,{height:M},{height:0,duration:.4}),gsap.to("[mobile-dropdown-list]",{height:0,duration:.4}),gsap.set(e,{width:"calc(0% - 5rem)"}),p=!1,n&&(n.style.pointerEvents="none"),r&&(r.style.pointerEvents="none"),gsap.to(i,{opacity:1,duration:.3}),gsap.to(T,{width:"2.75rem",duration:.3}),g=!g})})}});})(); 1608})(); 1609 1610 1611 // Trigger lottie animation inside get in touch button from time to time 1612 document.addEventListener("DOMContentLoaded", () => { 1613 setTimeout(() => { 1614 const buttonLottie = document.querySelector( 1615 "[button-bg] [data-animation-type='lottie']" 1616 ); 1617 1618 if (buttonLottie && window.Webflow) { 1619 const lottieModule = window.Webflow.require("lottie").lottie; 1620 const animations = lottieModule.getRegisteredAnimations(); 1621 1622 const matchingAnim = animations.find( 1623 (anim) => anim.wrapper === buttonLottie 1624 ); 1625 1626 if (matchingAnim) { 1627 const playAnimation = () => { 1628 console.log("[Lottie] Triggering button-bg animation"); 1629 matchingAnim.goToAndPlay(0); 1630 }; 1631 1632 // First trigger after 5 seconds 1633 playAnimation(); 1634 1635 // Then repeat every 20 seconds 1636 setInterval(playAnimation, 20000); 1637 } else { 1638 console.warn("[Lottie] Animation not found for button-bg element"); 1639 } 1640 } else { 1641 console.warn("[Lottie] Webflow Lottie module not available or element missing"); 1642 } 1643 }, 5000); 1644 }); 1645</script>
1645</div></div><div id="smooth-wrapper" class="smooth-scroll-wrapper"><div class="smooth-scroll-script w-embed w-script">
1645<script nonce="aPXsNxecKITnUVboEbCnig=="> 1646document.addEventListener("DOMContentLoaded", () => { 1647 gsap.registerPlugin(ScrollTrigger, ScrollSmoother); 1648 1649 if(document.documentElement.clientWidth > 1200) { 1650 ScrollSmoother.create({ 1651 smooth: 1.5, 1652 effects: true, 1653 smoothTouch: false, 1654 }); 1655 } 1656}); 1657</script>
1657</div><div id="smooth-content" class="smooth-scroll-content"><section class="about__hero"><div class="about__hero__wrap"><div class="socials socials__about"><a href="#" target="_blank" class="social__item-2 hidden w-inline-block"><div class="code-embed-44 w-embed"><svg viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg"> 1658<path d="M17.7146 1.75C17.0729 2.05625 16.3813 2.2575 15.6646 2.35375C16.3979 1.89 16.9646 1.155 17.2313 0.27125C16.5396 0.70875 15.7729 1.015 14.9646 1.19C14.3062 0.4375 13.3813 0 12.3313 0C10.3729 0 8.77292 1.68 8.77292 3.75375C8.77292 4.05125 8.80625 4.34 8.86458 4.61125C5.89792 4.45375 3.25625 2.9575 1.49792 0.69125C1.18958 1.2425 1.01458 1.89 1.01458 2.5725C1.01458 3.87625 1.63958 5.03125 2.60625 5.6875C2.01458 5.6875 1.46458 5.5125 0.98125 5.25V5.27625C0.98125 7.09625 2.21458 8.61875 3.84792 8.96C3.32362 9.11132 2.77295 9.13229 2.23958 9.02125C2.46592 9.76717 2.9092 10.4199 3.5071 10.8876C4.105 11.3553 4.82746 11.6145 5.57292 11.6288C4.30931 12.6792 2.74292 13.247 1.13125 13.2387C0.847917 13.2387 0.564583 13.2212 0.28125 13.1862C1.86458 14.2537 3.74792 14.875 5.76458 14.875C12.3313 14.875 15.9396 9.1525 15.9396 4.19125C15.9396 4.025 15.9396 3.8675 15.9312 3.70125C16.6313 3.17625 17.2312 2.51125 17.7146 1.75Z" fill="#2C1D44"/> 1659</svg></div></a><a href="#" target="_blank" class="social__item-2 hidden w-inline-block"><div class="social__item__icon__facebook w-embed"><svg viewBox="0 0 11 20" fill="none" xmlns="http://www.w3.org/2000/svg"> 1660<path d="M6.83854 11.4368H9.13021L10.0469 7.60352H6.83854V5.68685C6.83854 4.69977 6.83854 3.77018 8.67188 3.77018H10.0469V0.550182C9.74804 0.508974 8.61963 0.416016 7.42796 0.416016C4.93921 0.416016 3.17188 2.00397 3.17188 4.92018V7.60352H0.421875V11.4368H3.17188V19.5827H6.83854V11.4368Z" fill="#2C1D44"/> 1661</svg></div></a><a href="https://linkedin.com/company/elecctro" target="_blank" class="social__item-2 w-inline-block"><div class="social__item__icon__linkedin w-embed"><svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 1662<path fill-rule="evenodd" clip-rule="evenodd" d="M8.50938 4.796V6.493C8.86476 5.95168 9.3546 5.5119 9.93095 5.21671C10.5073 4.92152 11.1504 4.78103 11.7974 4.809C15.2524 4.809 15.9994 6.969 15.9994 9.779V15.5H12.7994V10.428C12.7994 9.218 12.5554 7.662 10.6714 7.662C8.84438 7.662 8.53238 8.979 8.53238 10.338V15.5H5.34238V4.796H8.50938ZM3.19938 2.106C3.19899 2.423 3.10502 2.73284 2.92926 2.99665C2.7535 3.26047 2.50377 3.46653 2.21138 3.589C1.91911 3.71048 1.5973 3.74226 1.28692 3.68029C0.976529 3.61832 0.691597 3.4654 0.468382 3.241C0.244748 3.01646 0.0924967 2.73081 0.0307744 2.41997C-0.030948 2.10913 0.000614703 1.78698 0.121493 1.49403C0.242371 1.20108 0.447167 0.950407 0.710129 0.773539C0.973091 0.596671 1.28248 0.501502 1.59938 0.5C1.81 0.499999 2.01855 0.541582 2.21306 0.622364C2.40758 0.703147 2.58423 0.821539 2.73288 0.970748C2.88153 1.11996 2.99926 1.29705 3.07932 1.49186C3.15937 1.68668 3.20017 1.89538 3.19938 2.106Z" fill="#2C1D44"/> 1663<path d="M3.2 4.80859H0V15.4996H3.2V4.80859Z" fill="#2C1D44"/> 1664</svg></div></a></div><div class="about__hero__column"><div data-delay="0.6" data-hero="fadeUp" class="chip-2 chip__top chip__hero__mobile"><div class="text-14-medium chip__text">About us</div><div class="code-embed-43 w-embed"><svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 1665<path d="M13.5 2.5H2.5C2.23478 2.5 1.98043 2.60536 1.79289 2.79289C1.60536 2.98043 1.5 3.23478 1.5 3.5V12.5C1.5 12.7652 1.60536 13.0196 1.79289 13.2071C1.98043 13.3946 2.23478 13.5 2.5 13.5H6.5C6.60495 13.5 6.70723 13.467 6.79237 13.4056C6.87751 13.3443 6.94119 13.2577 6.97437 13.1581L7.90125 10.3781L10.1875 9.46437C10.2503 9.43901 10.3073 9.40125 10.3552 9.35336C10.4031 9.30547 10.4409 9.24842 10.4663 9.18563L11.38 6.90125L14.16 5.97437C14.2592 5.94087 14.3454 5.87705 14.4064 5.79194C14.4674 5.70683 14.5001 5.60472 14.5 5.5V3.5C14.5 3.23478 14.3946 2.98043 14.2071 2.79289C14.0196 2.60536 13.7652 2.5 13.5 2.5ZM7.3125 9.53563C7.245 9.56261 7.1842 9.60399 7.13433 9.65689C7.08446 9.70978 7.04672 9.77291 7.02375 9.84188L6.13938 12.5H2.5V10.0431L5.39625 7.14625C5.44269 7.09976 5.49783 7.06288 5.55853 7.03772C5.61923 7.01256 5.68429 6.99961 5.75 6.99961C5.81571 6.99961 5.88077 7.01256 5.94147 7.03772C6.00217 7.06288 6.05731 7.09976 6.10375 7.14625L8.15625 9.19875L7.3125 9.53563ZM14.5 7.60813V12.5C14.5 12.7652 14.3946 13.0196 14.2071 13.2071C14.0196 13.3946 13.7652 13.5 13.5 13.5H8.60812C8.52889 13.5 8.4508 13.4812 8.38027 13.4451C8.30974 13.409 8.2488 13.3566 8.20247 13.2924C8.15615 13.2281 8.12576 13.1537 8.11381 13.0754C8.10186 12.9971 8.10869 12.917 8.13375 12.8419L8.63 11.3544C8.65291 11.2855 8.69055 11.2224 8.7403 11.1695C8.79006 11.1166 8.85074 11.0752 8.91813 11.0481L11.1538 10.1538L12.0481 7.91813C12.0752 7.85074 12.1166 7.79006 12.1695 7.7403C12.2224 7.69055 12.2855 7.65291 12.3544 7.63L13.8419 7.13375C13.917 7.10869 13.9971 7.10186 14.0754 7.11381C14.1537 7.12576 14.2281 7.15615 14.2924 7.20247C14.3566 7.2488 14.409 7.30974 14.4451 7.38027C14.4812 7.4508 14.5 7.52889 14.5 7.60813Z" fill="currentColor"/> 1666</svg></div></div><h1 data-hero="title" class="heading-9">About<br/>Elecctro</h1><div class="about__hero__bottom-2"><p data-hero="text" class="text-subheading-2 about__hero__subheading mobile__subtitle">Powering the future of unattended services through smart, connected IoT solutions</p><div data-line="" class="animation-line animation-line--top animation-line--wide"></div></div><div class="about__hero__sup-2">[ Since 2014 ]</div></div></div><div class="w-layout-blockcontainer container-4 w-container"><div class="inner-dark"></div><div data-w-id="044ce23e-3a2f-9916-21c2-db2e7f8c0f09" class="chip chip__top chip__dark hero"><div class="text-14-medium chip__text chip__text__white">Mission<br/></div><div data-w-id="044ce23e-3a2f-9916-21c2-db2e7f8c0f0c" data-is-ix2-target="1" class="lottie-animation-13" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6939873b837edbe03b3dba84_system-solid-95-star-hover-pinch%20(2).json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0.8666666666666667" data-loading="eager"></div></div><div data-w-id="dc4e79e0-db7b-2b14-7792-744f873cb438" class="chip chip__top chip__dark hero"><div class="text-14-medium chip__text chip__text__white">Values</div><div data-w-id="dc4e79e0-db7b-2b14-7792-744f873cb43c" data-is-ix2-target="1" class="lottie-animation-13" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6939873b837edbe03b3dba84_system-solid-95-star-hover-pinch%20(2).json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0.8666666666666667" data-loading="eager"></div></div><div class="line"></div><h1 class="about-text">Modernising unattended services through smart, connected solutions</h1><h1 class="about-text second">Technology with simplicity, humanity and purpose at its core</h1><div class="code-embed-38 w-embed w-script"><style> 1667 .container-4 .line-wrap { 1668 overflow: hidden; 1669 display: block; 1670 } 1671 1672 .container-4 .chip { 1673 visibility: hidden; 1674 opacity: 0; 1675 } 1676 1677 .about__card-3.desktop { 1678 filter: none; 1679 min-width: auto; 1680 position: static; 1681 transform: none; 1682 flex-shrink: 0; /* Prevents cards from squishing */ 1683 } 1684 1685 .cards__wrapper.desktop { 1686 display: flex; 1687 grid-column-gap: 120px; /* or just gap: 120px; */ 1688 gap: 120px; 1689 width: max-content; /* Critical: Wrapper grows to fit all cards */ 1690 min-width: auto; 1691 min-height: auto; 1692 1693 position: absolute; 1694 /* CRITICAL FIXES BELOW */ 1695 left: 0; /* MUST be 0, not auto */ 1696 top: auto; /* Respect your bottom positioning */ 1697 bottom: 10%; 1698 transform: none; /* Ensure no CSS transforms interfere */ 1699 will-change: transform; 1700 } 1701 1702 @media screen and (max-width: 1325px) { 1703 .about-text { 1704 font-size: 4rem; 1705 } 1706 1707 .about__card-3.desktop { 1708 width: 18rem; 1709 height: 385px; 1710 overflow: hidden; 1711 } 1712 1713 .about__card__info { 1714 padding-left: 1rem; 1715 } 1716 1717 .about__card__img { 1718 height: 11.75rem; 1719 margin-top: 1rem; 1720 } 1721 1722 .image-16 { 1723 width: 100%; 1724 } 1725 } 1726 1727 @media screen and (max-width: 1500px) { 1728 .about-text{ 1729 width: 80%; 1730 font-size: 4rem; 1731 } 1732 .about-text.second { 1733 width: 80%; 1734 /*width: 60%;*/ 1735 } 1736 1737 .about__card-3.desktop { 1738 width: 21rem; 1739 height: 410px; 1740 } 1741 1742 .about__card__info { 1743 padding-left: 0; 1744 } 1745 1746 .about__card__title { 1747 font-size: 1.25rem; 1748 } 1749 1750 .about__card__img { 1751 background-color: #0000; 1752 border-radius: 0; 1753 width: 100%; 1754 height: 17rem; 1755 margin-top: 0 1756 } 1757 1758 .image-16 { 1759 height: 100%; 1760 width: 100%; 1761 } 1762 } 1763 1764 @media screen and (max-width: 1100px) { 1765 .about-text { 1766 width: auto; 1767 font-size: 3.5rem; 1768 } 1769 1770 .about-text.second { 1771 width: auto; 1772 } 1773 } 1774 1775 @media screen and (max-width: 767px) { 1776 .about__card__img { 1777 height: 100%; 1778 margin-top: 0; 1779 } 1780 } 1781 1782 @media screen and (max-width: 750px) { 1783 .about-text { 1784 font-size: 2.7rem; 1785 } 1786 } 1787 1788 @media screen and (max-width: 700px) { 1789 .about-text { 1790 font-size: 2rem; 1791 } 1792 } 1793 1794 @media screen and (max-width: 479px) { 1795 .about__card-3.desktop { 1796 height: 20rem; 1797 } 1798 } 1799</style> 1800
1801<script nonce="aPXsNxecKITnUVboEbCnig=="> 1802document.addEventListener("DOMContentLoaded", () => { 1803 gsap.registerPlugin(ScrollTrigger, SplitText); 1804 const ease = "expoScale(0.5,7,none)"; 1805 const easeMirrored = "sine.in"; 1806 const easeAlt = "power2.inOut"; 1807 1808 1809 let mm = gsap.matchMedia(); 1810 mm.add({ 1811 isDesktop: "(min-width: 769px)", 1812 isTablet: "(max-width: 768px)" 1813 }, (context) => { 1814 let { isDesktop, isTablet } = context.conditions; 1815 1816 // --- SELECTION --- 1817 const texts = gsap.utils.toArray(".about-text"); 1818 const chips = gsap.utils.toArray(".container-4 .chip"); 1819 const innerDark = document.querySelector(".inner-dark"); 1820 const cardContainer = document.querySelector(".cards__wrapper"); 1821 const cards = gsap.utils.toArray(".about__card-3"); 1822 1823 // --- SETUP PHASE --- 1824 1825 // 1. Setup Texts 1826 texts.forEach(text => { 1827 const split = new SplitText(text, { type: "lines" }); 1828 split.lines.forEach(line => { 1829 const wrapper = document.createElement("div"); 1830 wrapper.classList.add("line-wrap"); 1831 line.parentNode.insertBefore(wrapper, line); 1832 wrapper.appendChild(line); 1833 }); 1834 gsap.set(split.lines, { y: "100%", }); 1835 text.splitLines = split.lines; 1836 }); 1837 1838 // 2. Setup Chips (Enforce hidden state immediately) 1839 gsap.set(chips, { autoAlpha: 0, y: 10 }); 1840 1841 // 3. Setup Cards 1842 gsap.set(cards, { transformOrigin: "bottom center" }); 1843 1844 // 4. Setup Wrapper (Start hidden) 1845 gsap.set(cardContainer, { autoAlpha: 0, x: -cardContainer.scrollWidth }); 1846 1847 1848 // --- MASTER TIMELINE --- 1849 const totalWidth = cardContainer.scrollWidth; 1850 // The more cards you have, the longer the scroll area becomes 1851 //const scrollEnd = `+=${totalWidth + window.innerWidth}`; 1852 const scrollEnd = isDesktop ? `+=${totalWidth + window.innerWidth}` : "+=5500"; 1853 const moveDuration = isDesktop ? 5 : 10; 1854 1855 const tl = gsap.timeline({ 1856 scrollTrigger: { 1857 trigger: ".container-4", 1858 start: "top top", 1859 end: scrollEnd, 1860 pin: true, 1861 scrub: 1, 1862 anticipatePin: 1 1863 } 1864 }); 1865 1866 // =================================== 1867 // PART 1: TEXT REVEALS 1868 // =================================== 1869 texts.forEach((text, i) => { 1870 const chip = chips[i]; 1871 const isLast = i === texts.length - 1; 1872 1873 // Reveal Text 1874 tl.to(text.splitLines, { 1875 y: "0%", stagger: 0.15, duration: 1, ease 1876 }); 1877 1878 // Reveal Overlay (First item only) 1879 if (i === 0) tl.to(innerDark, { opacity: 1, duration: 0.8, ease }, "<"); 1880 1881 // Reveal Chip 1882 if (chip) tl.to(chip, { autoAlpha: 1, y: 0, duration: 1, ease }, "<"); 1883 1884 // HIDE LOGIC (Only if NOT the last item) 1885 if (!isLast) { 1886 tl.to(text.splitLines, { 1887 y: "-100%", stagger: 0, duration: 0.5, ease: easeMirrored 1888 }, "+=0.5"); 1889 1890 if (chip) tl.to(chip, { autoAlpha: 0, y: -10, duration: 0.5, ease: easeMirrored }, "<"); 1891 } 1892 }); 1893 1894 1895 // =================================== 1896 // PART 2: CARD SCROLL 1897 // =================================== 1898 1899 // Turn on visibility for the wrapper now that we are ready to scroll 1900 tl.set(cardContainer, { autoAlpha: 1 }); 1901 1902 // Animate Cards (Left to Right) 1903 tl.fromTo(cardContainer, 1904 { x: -totalWidth }, 1905 { 1906 x: window.innerWidth, 1907 duration: moveDuration, 1908 ease: "none", 1909 immediateRender: false, 1910 1911 onUpdate: function() { 1912 const screenCenter = window.innerWidth / 2; 1913 1914 cards.forEach((card) => { 1915 const cardRect = card.getBoundingClientRect(); 1916 const cardCenterX = cardRect.left + cardRect.width / 2; 1917 const distanceFromCenter = cardCenterX - screenCenter; 1918 1919 const normalizedDistance = Math.max( 1920 -1, 1921 Math.min(1, distanceFromCenter / (screenCenter * 2)) 1922 ); 1923 1924 const rotation = normalizedDistance * 40; 1925 const offsetY = -Math.abs(rotation) * -9; 1926 1927 gsap.set(card, { 1928 rotation: rotation, 1929 y: offsetY 1930 }); 1931 }); 1932 } 1933 }, "+=0.2" 1934 ); 1935 }) 1936}); 1937</script>
1937</div><div class="cards__wrapper desktop"><div class="about__card-3 desktop"><div class="about__card__wrapper"><div class="about__card__info"><div class="about__card__title">Simple solutions, real impact</div><p class="about__card__desc-2">We create intuitive tools that cut through complexity, focusing only on what adds measurable value.</p></div><div class="about__card__img"><img width="Auto" loading="lazy" alt="" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6931dd777534cff6eff849c2_68bad2c416f5e295faf8e46c_Rectangle%20240648495.png" class="image-16"/></div></div></div><div class="about__card-3 desktop"><div class="about__card__wrapper"><div class="about__card__info"><div class="about__card__title">Practical intelligence</div><p class="about__card__desc-2">We connect the physical and digital with clarity, using data wisely to make grounded, effective decisions.</p></div><div class="about__card__img"><img width="Auto" loading="lazy" alt="" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6931dd77a134bf12cdaf86e1_68bad2d8279ca395e651e77e_Rectangle%20240648495%20(4).png" class="image-16"/></div></div></div><div class="about__card-3 desktop"><div class="about__card__wrapper"><div class="about__card__info"><div class="about__card__title">Humanity at the centre</div><p class="about__card__desc-2">We prioritise transparency, well-being and a safe culture where people thrive and excellence follows.</p></div><div class="about__card__img"><img width="Auto" loading="lazy" alt="" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6931dd7745dcda90713a89e9_68bad2eab81028c91813436d_Rectangle%20240648495%20(3).png" class="image-16"/></div></div></div><div class="about__card-3 desktop"><div class="about__card__wrapper"><div class="about__card__info"><div class="about__card__title">Meaningful innovation</div><p class="about__card__desc-2">Purpose-driven technology designed to solve real problems and make everyday life simpler, always with the user in mind.</p></div><div class="about__card__img"><img width="Auto" loading="lazy" alt="" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6931dd77857efa29c461932f_68bad300ad39bf3cc75ac440_Rectangle%20240648495%20(2).png" class="image-16"/></div></div></div><div class="about__card-3 desktop"><div class="about__card__wrapper"><div class="about__card__info"><div class="about__card__title">Authentic closeness</div><p class="about__card__desc-2">We listen, engage and build trust-based relationships, treating every client and partner as a valued collaborator.</p></div><div class="about__card__img"><img width="Auto" loading="lazy" alt="" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6931dd77b388a30897548f9d_68bad316e62edb2a852400b8_Rectangle%20240648495%20(1).png" class="image-16"/></div></div></div></div><div class="w-embed"><video 1938 class="image-20" 1939 autoplay 1940 muted 1941 loop 1942 playsinline 1943 preload="auto" 1944 aria-hidden="true" 1945 data-parallax 1946> 1947 <source src="https://elephant002.b-cdn.net/About%20Us%20Avi%20(4).mp4" type="video/mp4" /> 1948</video></div></div></section><section class="about__team"><div class="about__team__left"><div class="about__team__left__wrap swiper w-dyn-list"><div role="list" class="about__team__images__wrap swiper-wrapper w-dyn-items"><div team-img="4" role="listitem" class="about__team__img swiper-slide w-dyn-item"><div class="about__team__img__box"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202d62191990679dcee4a_jorge-vil.jpeg" loading="lazy" data-parallax="0" data-start="10" alt="" sizes="100vw" srcset="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202d62191990679dcee4a_jorge-vil-p-500.jpeg 500w, https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202d62191990679dcee4a_jorge-vil.jpeg 653w" class="about__team__img__img"/></div><div class="about__team__btn about__team__name__mobile"><div class="about__team__btn__text">Jorge Vila</div><div class="about__team__btn__position">CTO Software</div></div></div><div team-img="3" role="listitem" class="about__team__img swiper-slide w-dyn-item"><div class="about__team__img__box"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202cc4902a34b3468ed69_ricardo-correi.jpeg" loading="lazy" data-parallax="0" data-start="10" alt="" sizes="100vw" srcset="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202cc4902a34b3468ed69_ricardo-correi-p-500.jpeg 500w, https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202cc4902a34b3468ed69_ricardo-correi.jpeg 653w" class="about__team__img__img"/></div><div class="about__team__btn about__team__name__mobile"><div class="about__team__btn__text">Ricardo Correia</div><div class="about__team__btn__position">CTO Hardware</div></div></div>
1948<div team-img="2" role="listitem" class="about__team__img swiper-slide w-dyn-item"><div class="about__team__img__box"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202b9774545cb914b67e0_ricardo-jacint.jpeg" loading="lazy" data-parallax="0" data-start="10" alt="" sizes="100vw" srcset="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202b9774545cb914b67e0_ricardo-jacint-p-500.jpeg 500w, https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/68b202b9774545cb914b67e0_ricardo-jacint.jpeg 653w" class="about__team__img__img"/></div><div class="about__team__btn about__team__name__mobile"><div class="about__team__btn__text">Ricardo Jacinto</div><div class="about__team__btn__position">CFO</div></div></div><div team-img="1" role="listitem" class="about__team__img swiper-slide w-dyn-item"><div class="about__team__img__box"><img src="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931de1103590c61ec499aea_diogo-simoe.jpeg" loading="lazy" data-parallax="0" data-start="10" alt="" sizes="100vw" srcset="https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931de1103590c61ec499aea_diogo-simoe-p-500.jpeg 500w, https://cdn.prod.website-files.com/684c135909b65bbb5f9ddc4a/6931de1103590c61ec499aea_diogo-simoe.jpeg 653w" class="about__team__img__img"/></div><div class="about__team__btn about__team__name__mobile"><div class="about__team__btn__text">Diogo Simões</div><div class="about__team__btn__position">CEO</div></div></div></div></div><div class="btn-group explore-careers bottom-one"><a href="/careers" class="btn-icon-link explore-careers w-inline-block"><div class="btn-icon-content"><div data-icon-size="normal" class="btn-icon-icon"><div data-button-anim-target="" class="btn-icon-icon__bg"></div><div class="btn-icon-icon__wrap"><div class="btn-icon-icon__list"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow main"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg></div></div></div><div class="btn-icon-content__mask"><span data-button-anim-target="" class="btn-icon-content__text">Explore careers</span></div><div data-button-anim-target="" class="btn-icon-content__bg explore-careers"></div></div></a></div></div><div class="about__team__right is-active"><div data-text="slow" class="about__team__title">Our <br/>managing team</div><div class="btn-group explore-careers top-one"><a href="/careers" class="btn-icon-link explore-careers w-inline-block"><div class="btn-icon-content"><div data-icon-size="normal" class="btn-icon-icon"><div data-button-anim-target="" class="btn-icon-icon__bg"></div><div class="btn-icon-icon__wrap"><div class="btn-icon-icon__list"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg>
1948<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow main"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg></div></div></div><div class="btn-icon-content__mask"><span data-button-anim-target="" class="btn-icon-content__text">Explore careers</span></div><div data-button-anim-target="" class="btn-icon-content__bg explore-careers"></div></div></a></div><div data-hero="fadeUp" class="about__team__sup"><div class="about__team__scope">[</div><div class="about__team__sup__text">4</div><div class="about__team__scope">]</div></div><div class="about__team__b w-dyn-list"><div role="list" class="about__team__list w-dyn-items"><div data-btn="4" role="listitem" class="about__team__btn w-dyn-item"><div class="about__team__btn__text">Jorge Vila</div><div class="about__team__btn__position">CTO Software</div></div><div data-btn="3" role="listitem" class="about__team__btn w-dyn-item"><div class="about__team__btn__text">Ricardo Correia</div><div class="about__team__btn__position">CTO Hardware</div></div><div data-btn="2" role="listitem" class="about__team__btn w-dyn-item"><div class="about__team__btn__text">Ricardo Jacinto</div><div class="about__team__btn__position">CFO</div></div><div data-btn="1" role="listitem" class="about__team__btn w-dyn-item"><div class="about__team__btn__text">Diogo Simões</div><div class="about__team__btn__position">CEO</div></div></div></div></div><div class="code-embed-20 w-embed w-script"><style> 1949 @media (max-width: 1200px) { 1950 .about__team__img { 1951 clip-path: none !important; 1952 } 1953 } 1954 .about__team__btn { 1955 background: #f6f6f6 !important; 1956 position: relative; 1957 overflow: hidden; 1958 } 1959 1960 .swiper { 1961 overflow: visible; 1962 } 1963 1964 .about__team__btn::after { 1965 content: ""; 1966 background: #1d1131; 1967 position: absolute; 1968 inset: 0; 1969 transform: scaleY(0); 1970 transform-origin: top; 1971 transition: transform 0.4s ease; 1972 } 1973 1974 .about__team__btn.is-active::after { 1975 transform-origin: bottom; 1976 transform: scaleY(1); 1977 } 1978 1979 @media (min-width: 1024px) { 1980 [team-img] { 1981 transition-property: all; 1982 transition-duration: .5s !important; 1983 transition-timing-function: ease-out !important; 1984 } 1985 1986 [team-img].is-active { 1987 transition-property: all; 1988 transition-duration: .5s !important; 1989 transition-timing-function: ease-in !important; 1990 } 1991 1992 .about__team__btn.fill-from-top::after { 1993 transform-origin: top; 1994 transform: scaleY(1); 1995 } 1996 1997 .about__team__btn.fill-from-bottom::after { 1998 transform-origin: bottom; 1999 transform: scaleY(1); 2000 } 2001 2002 .about__team__btn.empty-to-top::after { 2003 transform-origin: top; 2004 transform: scaleY(0); 2005 } 2006 2007 .about__team__btn.empty-to-bottom::after { 2008 transform-origin: bottom; 2009 transform: scaleY(0); 2010 } 2011 } 2012 2013 .about__values__text p:last-of-type { 2014 margin-bottom: 0; 2015 } 2016</style> 2017
2018<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
vendor: 1 bytes, line 2018
2018
2019<script nonce="aPXsNxecKITnUVboEbCnig=="> 2020 setTimeout(() => { 2021 // mobile slider 2022 if (document.documentElement.clientWidth < 1200) { 2023 const wrapper = document.querySelector(".swiper .swiper-wrapper"); 2024 const slides = Array.from(wrapper.children); 2025 2026 // ÑевеÑÑиÑÑем поÑÑдок 2027 slides.reverse().forEach(slide => wrapper.appendChild(slide)); 2028 setTimeout(() => { 2029 const swiper = new Swiper(".swiper", { 2030 slidesPerView: "auto", 2031 spaceBetween: 10, 2032 grabCursor: true, 2033 breakpoints: { 2034 1200: { 2035 slidesPerView: "auto", 2036 }, 2037 0: { 2038 slidesPerView: 1.1, 2039 centeredSlides: false, 2040 slidesOffsetAfter: 20, 2041 }, 2042 }, 2043 }); 2044 }, 500) 2045 } else { 2046 const btns = document.querySelectorAll(".about__team__btn"); 2047const imgs = document.querySelectorAll("[team-img]"); 2048 2049// СÑаÑÑовое ÑоÑÑоÑние 2050document.querySelector('[team-img="1"]').classList.add("is-active"); 2051document.querySelector('[data-btn="1"]').classList.add("is-active"); 2052 2053btns.forEach((el, index) => { 2054 el.addEventListener("mouseenter", (e) => { 2055 btns.forEach((btn) => btn.classList.remove("is-active")); 2056 imgs.forEach((img, i) => { 2057 //img.classList.remove("is-active") 2058 const id = +el.dataset.btn; 2059 const imgId = +img.getAttribute("team-img"); 2060 console.log(id, imgId, img) 2061 if (id <= imgId) { 2062 img.classList.add('is-active'); 2063 } else { 2064 img.classList.remove('is-active'); 2065 } 2066 }); 2067 2068 el.classList.add("is-active"); 2069 //const id = el.dataset.btn; 2070 //const activeImg = document.querySelector(`[team-img='${id}']`); 2071 //activeImg.classList.add("is-active"); 2072 2073 // ÐапÑавление Ð²Ñ Ð¾Ð´Ð° 2074 const rect = el.getBoundingClientRect(); 2075 const offset = e.clientY - rect.top; 2076 const fromTop = offset < rect.height / 2; 2077 2078 if (fromTop) { 2079 el.classList.add("fill-from-top"); 2080 el.classList.remove( 2081 "fill-from-bottom", 2082 "empty-to-top", 2083 "empty-to-bottom" 2084 ); 2085 } else { 2086 el.classList.add("fill-from-bottom"); 2087 el.classList.remove( 2088 "fill-from-top", 2089 "empty-to-top", 2090 "empty-to-bottom" 2091 ); 2092 } 2093 }); 2094 2095 el.addEventListener("mouseleave", (e) => { 2096 const rect = el.getBoundingClientRect(); 2097 const offset = e.clientY - rect.top; 2098 const toTop = offset < rect.height / 2; 2099 2100 // Ñнимаем акÑивнÑй клаÑÑ Ñ ÐºÐ°ÑÑинки, ÑвÑзанной Ñ ÑÑой кнопкой 2101 const id = el.dataset.btn; 2102 2103 2104 if (toTop) { 2105 el.classList.add("empty-to-top"); 2106 el.classList.remove( 2107 "fill-from-top", 2108 "fill-from-bottom", 2109 "empty-to-bottom" 2110 ); 2111 } else { 2112 el.classList.add("empty-to-bottom"); 2113 el.classList.remove( 2114 "fill-from-top", 2115 "fill-from-bottom", 2116 "empty-to-top" 2117 ); 2118 } 2119 2120 // ÑбиÑаем is-active Ñ ÐºÐ½Ð¾Ð¿ÐºÐ¸ Ñоже 2121 el.classList.remove("is-active"); 2122 }); 2123}); 2124 2125 } 2126 }, 500); 2127</script>
2127</div></section><section class="about__culture"><div class="about__culture__top"><div data-delay="0.6" data-hero="fadeUp" data-w-id="b55e63c4-f5a1-b7d7-8ef6-74ad54041be5" class="chip chip__top chip__dark chip__culture"><div class="text-14-medium chip__text chip__text__white">Culture</div><div data-w-id="3d0e3987-180f-6d4e-087a-d7cd36fbec9d" data-is-ix2-target="1" class="lottie-animation-13" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6939873b837edbe03b3dba84_system-solid-95-star-hover-pinch%20(2).json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0.8666666666666667" data-loading="eager"></div></div><div class="about__culture__head"><h1 data-text="slow" class="about__culture__title">Ourâ¨<br/>Culture</h1><div class="about__culture__desc"><p data-text="" class="text-18-regular about__culture__text">At Elecctro, we foster trust, innovation and purpose, building a workplace where growth, recognition and high-performance teamwork thrive.</p></div></div></div><div class="about__culture__bottom"><div class="about__culture__bottom__head"><div data-delay="0.6" data-hero="fadeUp" data-w-id="fb842a37-7251-65f2-5cae-85621c8b0e43" class="chip chip__top chip__culture"><div class="text-14-medium chip__text">Benefits</div><div data-w-id="796ffda2-d528-de56-0300-8cf52df634be" data-is-ix2-target="1" class="lottie-animation-11" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6908f5d65d7320198e2c16a8_system-solid-48-favorite-heart-hover-pinch.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="services__metrics__ttitle__wrap wrapper-left-offset"><h1 data-text="slow" class="text-h3-purple about__culture__subtitle">Designed for Impact, Built for Scale</h1><div animation-line="" class="animation-line animation-line--bottom animation-line-divider"></div></div></div><div class="about__culture__cards"><div data-w-id="db827b92-2bd1-b97f-0852-4820e767e2d9" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="d78b205b-0848-5ecf-c7d9-22261363cc7c" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/691884e2efdae6dd7471195b_system-solid-8-account-hover-pinch.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">People first, <br/>always</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2128<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2129<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2130<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2131</svg></div><p class="about__culture__card__text">Our commitment to people is foundational. We do more than hire talent, we nurture and support it to grow and succeed.</p></div><div data-w-id="7d6b2b11-835f-b280-a572-9d07319b0d83" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="2c6799c3-b0e5-9a76-2720-c9c3fa7890a8" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/691878c244bb884aa7302fa6_system-solid-121-bulb-hover-bulb.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">Innovation with <br/>a human touch</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2132<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2133<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2134<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2135</svg></div><p class="about__culture__card__text">Every team member is encouraged to share ideas, think creatively and help shape solutions that truly make a difference.</p></div><div data-w-id="11ef3e66-a2f7-0ddf-7fcc-b39fe1b5777a" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="712a3302-f46c-a486-92b5-6ea99a6284bd" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/690defa
21357db4d2edb572ced5a_check.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">Driven by purpose and achievement</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2136<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2137<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2138<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2139</svg></div><p class="about__culture__card__text">We focus on clear goals, trust our teams to deliver and celebrate every milestone that moves us forward.</p></div><div data-w-id="1fc6cfc7-1b58-0540-e981-d332476844b0" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="12908539-8b9a-c3c3-5637-dc45df93f119" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/69187a3486f793accde1ed60_system-solid-92-visability-hover-pinch.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0.5" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">Recognition <br/>that matters</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2140<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2141<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2142<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2143</svg></div><p class="about__culture__card__text">We value effort and integrity, recognising contributions both big and small that drive our shared success.</p></div><div data-w-id="5e009c6e-0645-e39a-b10c-ab87bd4dc1ea" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="5a4aee9a-520f-6300-8019-be084fa0e772" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/69187a5d912be2f2702e2429_system-solid-95-star-hover-pinch.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0.8666666666666667" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">Freedom with <br/>responsibility</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2144<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2145<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2146<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2147</svg></div><p class="about__culture__card__text">We trust people to manage their work with autonomy while delivering meaningful results for the business.</p></div><div data-w-id="03d6c11f-a34e-10b0-f90d-35ff4e88dd92" class="about__culture__card"><div class="about__culture__card__icon services__metrics__item__icon"><div data-w-id="9e2c94f1-a532-3a6f-8185-4c4050fea43b" data-is-ix2-target="1" class="lottie-animation-15" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/690df0ab0039a6266d78d09b_like.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="0" data-loading="eager"></div><div class="text-14-medium icon-text">What Drives Us</div></div><h4 class="about__culture__card__title">One team, <br/>
2147real people</h4><div class="services__metrics__item__line w-embed"><svg viewBox="0 0 360 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2148<circle cx="3.5" cy="7" r="3.5" fill="#0D0716" fill-opacity="0.1"/> 2149<line x1="7" y1="6.5" x2="346" y2="6.49997" stroke="#0D0716" stroke-opacity="0.1"/> 2150<path d="M360 7C360 10.866 356.866 14 353 14C349.134 14 346 10.866 346 7C346 3.13401 349.134 0 353 0C356.866 0 360 3.13401 360 7ZM348.897 7C348.897 9.26594 350.734 11.1028 353 11.1028C355.266 11.1028 357.103 9.26594 357.103 7C357.103 4.73406 355.266 2.89715 353 2.89715C350.734 2.89715 348.897 4.73406 348.897 7Z" fill="#0D0716" fill-opacity="0.1"/> 2151</svg></div><p class="about__culture__card__text">We work with authenticity, transparency and trust, supporting each other and achieving more together.</p></div></div></div></section><section class="about__values"><div class="about__values__box"><div data-top="64" data-sticky="" class="about__values__wrap"><div data-delay="0.6" data-hero="fadeUp" data-w-id="196d79ea-8373-4eb2-3f02-0b5379956aaa" class="chip chip__top chip__values"><div class="text-14-medium chip__text">Partnerships</div><div data-w-id="41e3462a-f7f3-ed37-0211-53db9213225c" data-is-ix2-target="1" class="lottie-animation-12" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6908f5d689e79530e6510cda_system-solid-28-info-hover-info.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="about__values__col"><div sticky-wrap="" class="about__values__col__wrap"><div class="about__values__col__subtitle">A foundation for success</div><div class="about__values__heading"><div data-text="slow" class="about__values__title">Strong partnerships that drive<br/></div><div data-text="slow" class="about__values__title about__values__title--grey">global growth</div></div><div class="about__values__text rich__desc w-richtext"><p data-text="" class="paragraph-8">Our collaborations with leading organisations strengthen our technology, expand our reach and ensure compliance, helping us deliver trusted, future-ready solutions worldwide.</p></div></div></div></div><div values-cards="" class="about__values__cards"><div data-parallax-scrub="1" data-parallax-direction="horizontal" data-parallax-start="100" data-parallax-end="0" data-parallax-scroll-end="bottom bottom" data-w-id="c6bd11e7-19a6-9d50-9641-61fff9812f07" class="about__values__card"><div data-w-id="3e373cbe-f2cf-a473-92ee-948508d52d50" class="about__values__card__icon"><div data-is-ix2-target="1" class="lottie-animation-16" data-w-id="9eacea85-a591-d3e3-78a0-cc0800285646" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/69187fae86ffb65a850e9540_system-solid-38-credit-card-hover-card.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="about__values__card__info"><h4 class="text-48-medium about__values__card__title">Getnet EV Payments Partnership</h4><p class="about__values__card__text">A collaboration with Getnet to deliver secure, subscription-free card payments for EV charging, compliant with EU AFIR standards and adopted by major operators.</p><div class="about__values__card__categories"><div class="about__values__card__tag">Partnership</div></div></div></div><div data-parallax-scrub="1" data-parallax-direction="horizontal" data-parallax-start="100" data-parallax-end="0" data-parallax-scroll-end="bottom bottom" data-w-id="e7a93546-159f-36c1-dbeb-e2aec88eb63f" class="about__values__card"><div data-w-id="e7a93546-159f-36c1-dbeb-e2aec88eb640" class="about__values__card__icon"><div data-is-ix2-target="1" class="lottie-animation-16" data-w-id="97d0a504-acca-8f1e-f0fb-e1ee3a6e7dd8" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/691884674c666b012701659b_system-solid-14-article-hover-article.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="about__values__card__info"><h4 class="text-48-medium about__values__card__title">EVA EPS Certification</h4><p class="about__values__card__text">Certification from the European Vending & Coffee Service Association for two Elecctro payment terminals, ensuring full MDB 4.3 compliance and seamless integration in vending machines.</p><div class="about__values__card__categories"><div class="about__values__card__tag">Certification</div></div></div></div><div data-parallax-scrub="1" data-parallax-direction="horizontal" data-parallax-start="100" data-parallax-end="0" data-parallax-scroll-end="bottom bottom" data-w-id="c847f06a-cd64-1d90-30b1-8f0524811c82" class="about__values__card"><div data-w-id="c847f06a-cd64-1d90-30b1-8f0524811c83" class="about__values__card__icon"><div data-is-ix2-target="1" class="lottie-animation-16" data-w-id="50c7cef8-b25a-43db-99e3-fcd9444516b5" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/6918851a328e4a23182c5e93_system-solid-96-groups-hover-groups.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="about__values__card__info"><h4 class="text-48-medium about__values__card__title">EVA Full <br/>Member</h4><p class="about__values__card__text">Membership in the European Vending & Coffee Service Association, granting access to industry insights, networks and standards that drive innovation and market growth.</p><div class="about__values__card__categories"><div class="about__values__card__tag">Association</div></div></div></div><div data-parallax-scrub="1" data-parallax-direction="horizontal" data-parallax-start="100" data-parallax-end="0" data-parallax-scroll-end="bottom bottom" data-w-id="bd217cfe-bb33-a9bf-75dc-8dbb30c2d151" class="about__values__card"><div data-w-id="bd217cfe-bb33-a9bf-75dc-8dbb30c2d152" class="about__values__card__icon"><div data-is-ix2-target="1" class="lottie-animation-16" data-w-id="98b471c7-51d0-94a6-2f3d-c93a3d9c702e" data-animation-type="lottie" data-src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/691885447ff56c68911f8ea0_system-solid-187-contacts-hover-contacts.json" data-loop="0" data-direction="1" data-autoplay="0" data-renderer="svg" data-default-duration="0" data-duration="1" data-loading="eager"></div></div><div class="about__values__card__info"><h4 class="text-48-medium about__values__card__title">
2151ANEDA <br/>Member</h4><p class="about__values__card__text">Membership in Spainâs national vending and unattended retail association, enhancing our visibility and influence in the Spanish market through active industry engagement.</p><div class="about__values__card__categories"><div class="about__values__card__tag">Association</div></div></div></div><div class="w-embed w-script">
2151<script nonce="aPXsNxecKITnUVboEbCnig=="> 2152function initGlobalParallax() { 2153 const mm = gsap.matchMedia(); 2154 2155 mm.add( 2156 { 2157 isMobile: "(max-width:479px)", 2158 isMobileLandscape: "(max-width:767px)", 2159 isTablet: "(max-width:991px)", 2160 isDesktop: "(min-width:992px)" 2161 }, 2162 (context) => { 2163 const { isDesktop, isMobile, isMobileLandscape, isTablet } = context.conditions; 2164 const isDisabled = (el) => { 2165 const disable = el.getAttribute("data-parallax-disable"); 2166 if ( 2167 (disable === "mobile" && isMobile) || 2168 (disable === "mobileLandscape" && isMobileLandscape) || 2169 (disable === "tablet" && isTablet) 2170 ) return true 2171 } 2172 2173 const triggerParallaxFor = (elements) => { 2174 const ctx = gsap.context(() => { 2175 elements.forEach((trigger, index) => { 2176 if (isDisabled(trigger)) return; 2177 2178 const target = trigger.querySelector('[data-parallax="target"]') || trigger; 2179 const direction = trigger.getAttribute("data-parallax-direction") || "vertical"; 2180 const prop = direction === "horizontal" ? "xPercent" : "yPercent"; 2181 2182 const scrubAttr = trigger.getAttribute("data-parallax-scrub"); 2183 //const scrubModifier = trigger.getAttribute("parallax-scrub-modify") ? (index + 1) / 2 : 1 2184 const scrub = scrubAttr ? parseFloat(scrubAttr) : true; 2185 2186 // Note: index now refers to the element's position within its specific class group 2187 const startAttr = trigger.getAttribute("data-parallax-start"); 2188 const startModifier = trigger.getAttribute("parallax-start-modify") ? index * 10 : 1 2189 const startVal = startAttr !== null ? parseFloat(startAttr) + startModifier : 20; 2190 2191 const endAttr = trigger.getAttribute("data-parallax-end"); 2192 const endVal = endAttr !== null ? parseFloat(endAttr) : -20; 2193 2194 const scrollStartRaw = trigger.getAttribute("data-parallax-scroll-start") || "top bottom"; 2195 const scrollStart = `clamp(${scrollStartRaw})`; 2196 2197 const scrollEndRaw = trigger.getAttribute("data-parallax-scroll-end") || "bottom top"; 2198 const scrollEnd = `clamp(${scrollEndRaw})`; 2199 2200 gsap.fromTo( 2201 target, 2202 { [prop]: startVal }, 2203 { 2204 [prop]: endVal, 2205 ease: "none", 2206 immediateRender: true, 2207 scrollTrigger: { 2208 trigger, 2209 start: scrollStart, 2210 end: scrollEnd, 2211 scrub, 2212 }, 2213 } 2214 ); 2215 }); 2216 }); 2217 } 2218 2219 // 1. Select all cards 2220 const servicesFeatures = Array.from(document.querySelectorAll('.about__values__card')); 2221 2222 // Helper to wrap lines (same as your example) 2223 const wrapLines = (lines) => { 2224 lines.forEach((line) => { 2225 if (!line || !line.parentNode) return; 2226 const wrapper = document.createElement("div"); 2227 wrapper.classList.add("line-wrap"); 2228 line.parentNode.insertBefore(wrapper, line); 2229 wrapper.appendChild(line); 2230 }); 2231 }; 2232 2233 // 2. Iterate through each card 2234 servicesFeatures.forEach((card) => { 2235 const icon = card.querySelector('.about__values__card__icon'); 2236 const title = card.querySelector('.about__values__card__title'); 2237 const sub = card.querySelector('.about__values__card__text'); 2238 const category = card.querySelector('.service__features__card__category'); 2239 2240 const titleSplit = new SplitText(title, { types: 'lines' }); 2241 wrapLines(titleSplit.lines); 2242 const subSplit = new SplitText(sub, { types: 'lines' }); 2243 wrapLines(subSplit.lines); 2244 2245 // 3. Create the Timeline with Scrub enabled 2246 const tl = gsap.timeline({ 2247 scrollTrigger: { 2248 trigger: card,
2249 // Animation starts when top of card hits 90% of viewport (enters bottom) 2250 start: "top 90%", 2251 // Animation completes when top of card hits 40% of viewport (near center) 2252 end: "bottom 75%", 2253 // Links animation progress to scrollbar with 1s smoothing 2254 scrub: 1, 2255 // markers: true // Uncomment to debug start/end points 2256 } 2257 }); 2258 2259 // 4. Build the animation sequence 2260 // Note: With scrub, 'duration' works as a ratio of the scroll distance, not time. 2261 if (icon) { 2262 tl.from(icon, { 2263 yPercent: 100, 2264 opacity: 0, 2265 duration: 1, 2266 ease: "power2.out", 2267 }); 2268 } 2269 2270 tl.from(titleSplit.lines, { 2271 yPercent: 100, 2272 opacity: 0, 2273 duration: 1, 2274 stagger: 0.2, 2275 ease: "power2.out", 2276 }, '<0.3'); 2277 2278 tl.from(subSplit.lines, { 2279 yPercent: 100, 2280 duration: 1, 2281 stagger: 0.2, // Staggering elements while scrubbing creates a "wave" effect 2282 ease: "power2.out", 2283 }, '<0.3'); 2284 2285 tl.from(category, { 2286 opacity: 0, 2287 yPercent: 100, 2288 duration: 1, 2289 ease: "linear", 2290 }); 2291 }); 2292 2293 // Keep this! This adds the separate parallax movement to the card container itself 2294 triggerParallaxFor(servicesFeatures); 2295 }) 2296} 2297 2298// Initialize Global Parallax Setup 2299document.addEventListener("DOMContentLoaded", () => { 2300 initGlobalParallax() 2301}) 2302</script>
2302</div></div></div></section><div class="w-embed w-script">
2302<script nonce="aPXsNxecKITnUVboEbCnig==" type="importmap"> 2303 { 2304 "imports": { 2305 "three": "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js", 2306 "three/addons/": "https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/" 2307 } 2308 } 2309</script>
2309 2310 2311<style> 2312#service-display { 2313 position: fixed; 2314 top: 0; 2315 left: 0; 2316 z-index: 1; 2317 width: 100vw; 2318 height: 100vh; 2319 width: 100svw; 2320 height: 100svh; 2321 -webkit-tap-highlight-color: transparent; 2322 outline: none; 2323 user-select: none; 2324 touch-action: none; 2325} 2326 2327@media (pointer: coarse) { 2328 #service-display { 2329 pointer-events: none; 2330 } 2331} 2332</style> 2333 2334<canvas id="service-display"></canvas> 2335
2336<script nonce="aPXsNxecKITnUVboEbCnig==" type="module"> 2337import * as THREE from 'three'; 2338import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; 2339import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js'; 2340import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js'; 2341import { MathUtils } from 'three'; 2342 2343const myCanvas = document.querySelector('#service-display'); 2344const scene = new THREE.Scene(); 2345const clock = new THREE.Clock(); 2346 2347// --- Mouse Interaction State --- 2348const mouse = new THREE.Vector2(); 2349const targetMousePos = new THREE.Vector2(); 2350const POSITION_INTENSITY = 8; 2351const raycaster = new THREE.Raycaster(); 2352let isHovering = false; 2353let isPressed = false; 2354let clickScaleEffect = 1.0; 2355const SCALE_ON_CLICK = 0.9; 2356 2357const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); 2358camera.position.set(0, 85, 200); 2359 2360const renderer = new THREE.WebGLRenderer({ 2361 canvas: myCanvas, 2362 alpha: true, 2363 antialias: true 2364}); 2365renderer.setSize(window.innerWidth, window.innerHeight); 2366renderer.setAnimationLoop(animate); 2367 2368// --- Model Loading --- 2369const dracoLoader = new DRACOLoader(); 2370dracoLoader.setDecoderPath('https://www.gstatic.com/draco/versioned/decoders/1.5.6/'); 2371const ktx2Loader = new KTX2Loader(); 2372ktx2Loader.setTranscoderPath('https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/libs/basis/'); 2373ktx2Loader.detectSupport(renderer); 2374 2375const loader = new GLTFLoader(); 2376loader.setDRACOLoader(dracoLoader); 2377loader.setKTX2Loader(ktx2Loader); 2378 2379const ambientLight = new THREE.AmbientLight(0xffffff, 1.8); 2380const dirLight = new THREE.DirectionalLight(0xffffff, 1); 2381dirLight.position.set(5, 5, 5); 2382scene.add(ambientLight, dirLight); 2383 2384let model; 2385const modelUrl = 'https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/696ea83431be7c8522e8671e_VM_Snacks_NEW_V002_compressed.glb.txt'; 2386let targetScale = new THREE.Vector3(1, 1, 1); 2387 2388const reScaleModel = () => { 2389 let scaleValue = 1; 2390 if (window.innerWidth <= 991) scaleValue = 0.75; 2391 else if (window.innerWidth <= 479) scaleValue = 0.7; 2392 targetScale.setScalar(scaleValue); 2393 if (model) model.scale.setScalar(scaleValue); 2394}; 2395 2396loader.load(modelUrl, (gltf) => { 2397 model = gltf.scene; 2398 2399 // Create Interaction Hitbox 2400 const box = new THREE.Box3().setFromObject(model); 2401 const size = new THREE.Vector3(); 2402 box.getSize(size); 2403 const center = new THREE.Vector3(); 2404 box.getCenter(center); 2405 const hitboxGeo = new THREE.BoxGeometry(size.x, size.y, size.z); 2406 const hitboxMat = new THREE.MeshBasicMaterial({ visible: false }); 2407 const hitbox = new THREE.Mesh(hitboxGeo, hitboxMat); 2408 hitbox.position.copy(center).sub(model.position); 2409 hitbox.name = "interaction_hitbox"; 2410 model.add(hitbox); 2411 2412 reScaleModel(); 2413 model.rotation.y = Math.PI / 2; 2414 scene.add(model); 2415}, undefined, (error) => console.error(error)); 2416 2417// --- Input Handling --- 2418const onPointerDown = (event) => { 2419 const x = event.clientX || (event.touches && event.touches[0].clientX); 2420 const y = event.clientY || (event.touches && event.touches[0].clientY); 2421 const coords = new THREE.Vector2((x / window.innerWidth) * 2 - 1, -(y / window.innerHeight) * 2 + 1); 2422 2423 if (model) { 2424 const hitbox = model.getObjectByName("interaction_hitbox"); 2425 if (hitbox) { 2426 raycaster.setFromCamera(coords, camera); 2427 const intersects = raycaster.intersectObject(hitbox); 2428 if (intersects.length > 0) { 2429 isPressed = true; 2430 // Interaction trigger (without particles) 2431 } 2432 } 2433 } 2434}; 2435 2436window.addEventListener('mousedown', onPointerDown); 2437window.addEventListener('touchstart', onPointerDown, { passive: true }); 2438window.addEventListener('mouseup', () => isPressed = false); 2439window.addEventListener('touchend', () => isPressed = false); 2440 2441window.addEventListener('mousemove', (event) => { 2442 mouse.x = (event.clientX / window.innerWidth) * 2 - 1; 2443 mouse.y = -(event.clientY / window.innerHeight) * 2 + 1; 2444 2445 if (model) { 2446 const hitbox = model.getObjectByName("interaction_hitbox"); 2447 if (hitbox) { 2448 raycaster.setFromCamera(mouse, camera); 2449 const intersects = raycaster.intersectObject(hitbox); 2450 if (intersects.length > 0) { 2451 if (!isHovering) { isHovering = true; } 2452 } else { 2453 if (isHovering) { isHovering = false; } 2454 } 2455 } 2456 } 2457}); 2458 2459// --- Animation Loop --- 2460let scrollY = 0; 2461window.addEventListener('scroll', () => scrollY = window.scrollY); 2462const sectionBottom = document.querySelector('.section__bottom'); 2463const smoothContent = document.querySelector("#smooth-content"); 2464const heroWrapper = smoothContent?.querySelector('#services-hero-wrapper'); 2465 2466let phase3State = 'idle', phase3Timer = 0, phase3StartRotation = 0, phase3ResetTarget = 0; 2467const ROTATION_DURATION = 3.5, PAUSE_DURATION = 2.0; 2468 2469function easeInOutCubic(x) { return x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2; } 2470 2471const moveModel = (delta, allowRotationY = true, enableTilt = true) => { 2472 if ('ontouchstart' in window || navigator.maxTouchPoints > 0) return; 2473 if (!model) return; 2474 if (allowRotationY) model.rotation.y = MathUtils.lerp(model.rotation.y, targetMousePos.x * 0.4, 4 * delta); 2475 if (enableTilt) { 2476 model.rotation.z = MathUtils.lerp(model.rotation.z, -targetMousePos.x * 0.1, 6 * delta); 2477 model.rotation.x = MathUtils.lerp(model.rotation.x, -targetMousePos.y * 0.1, 6 * delta); 2478 } else { 2479 model.rotation.z = MathUtils.lerp(model.rotation.z, 0, 6 * delta); 2480 model.rotation.x = MathUtils.lerp(model.rotation.x, 0, 6 * delta); 2481 } 2482}; 2483 2484function animate() { 2485 const delta = Math.min(clock.getDelta(), 0.1); 2486 2487 if (model) { 2488 // Click Scale Effect 2489 clickScaleEffect = MathUtils.lerp(clickScaleEffect, isPressed ? SCALE_ON_CLICK : 1.0, 10 * delta); 2490 model.scale.set(targetScale.x * clickScaleEffect, targetScale.y * clickScaleEffect, targetScale.z * clickScaleEffect); 2491 2492 targetMousePos.lerp(mouse, 2 * delta); 2493 const targetMouseY = -targetMousePos.y * POSITION_INTENSITY; 2494 model.position.y = MathUtils.lerp(model.position.y, targetMouseY, 2 * delta); 2495 2496 let isPhase3 = false;
2497 if (sectionBottom) isPhase3 = sectionBottom.getBoundingClientRect().top < window.innerHeight; 2498 2499 if (isPhase3) { 2500 moveModel(delta, false, true); 2501 if (phase3State === 'idle') { phase3State = 'resetting'; phase3ResetTarget = Math.round(model.rotation.y / (Math.PI*2)) * (Math.PI*2); } 2502 if (phase3State === 'resetting') { 2503 model.rotation.y = MathUtils.lerp(model.rotation.y, phase3ResetTarget, 5 * delta); 2504 if (Math.abs(model.rotation.y - phase3ResetTarget) < 0.01) { model.rotation.y = phase3ResetTarget; phase3State = 'rotating'; phase3Timer = 0; phase3StartRotation = phase3ResetTarget; } 2505 } else if (phase3State === 'rotating') { 2506 phase3Timer += delta; 2507 const progress = Math.min(phase3Timer / ROTATION_DURATION, 1); 2508 model.rotation.y = phase3StartRotation + (easeInOutCubic(progress) * Math.PI * 2); 2509 if (progress >= 1) { phase3State = 'paused'; phase3Timer = 0; phase3StartRotation = model.rotation.y; } 2510 } else if (phase3State === 'paused') { 2511 phase3Timer += delta; 2512 if (phase3Timer >= PAUSE_DURATION) { phase3State = 'rotating'; phase3Timer = 0; } 2513 } 2514 if (smoothContent) { 2515 const matrix = new DOMMatrix(window.getComputedStyle(smoothContent).transform); 2516 myCanvas.style.transform = `translateY(${matrix.m42 * -1}px)`; 2517 } 2518 } else { 2519 phase3State = 'idle'; 2520 myCanvas.style.transform = `translateY(0px)`; 2521 let shouldUpdateScroll = scrollY > 0; 2522 if (heroWrapper) { 2523 const rect = heroWrapper.getBoundingClientRect(); 2524 if (rect.bottom < 0 || rect.top > window.innerHeight) shouldUpdateScroll = false; 2525 } 2526 moveModel(delta, scrollY <= 5, !shouldUpdateScroll); 2527 if (shouldUpdateScroll) model.rotation.y = MathUtils.lerp(model.rotation.y, scrollY * 0.002, 5 * delta); 2528 } 2529 } 2530 renderer.render(scene, camera); 2531} 2532 2533window.addEventListener('resize', () => { 2534 camera.aspect = window.innerWidth / window.innerHeight; 2535 camera.updateProjectionMatrix(); 2536 renderer.setSize(window.innerWidth, window.innerHeight); 2537 reScaleModel(); 2538}); 2539</script>
2539</div><section class="section__bottom"><footer class="footer"><div class="footer__col__left"><div class="footer__heading"><h3 class="heading-3-medium">Have questions? </h3><h1 class="heading-3-medium heading__grey">Letâs connect</h1></div><a href="mailto:[email protected]?subject=comercial%40elecctro.com" class="link footer__email">[email protected]</a><div class="socials"><a href="#" target="_blank" class="social__item hidden w-inline-block"><div class="code-embed-8 w-embed"><svg viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg"> 2540<path d="M17.7146 1.75C17.0729 2.05625 16.3813 2.2575 15.6646 2.35375C16.3979 1.89 16.9646 1.155 17.2313 0.27125C16.5396 0.70875 15.7729 1.015 14.9646 1.19C14.3062 0.4375 13.3813 0 12.3313 0C10.3729 0 8.77292 1.68 8.77292 3.75375C8.77292 4.05125 8.80625 4.34 8.86458 4.61125C5.89792 4.45375 3.25625 2.9575 1.49792 0.69125C1.18958 1.2425 1.01458 1.89 1.01458 2.5725C1.01458 3.87625 1.63958 5.03125 2.60625 5.6875C2.01458 5.6875 1.46458 5.5125 0.98125 5.25V5.27625C0.98125 7.09625 2.21458 8.61875 3.84792 8.96C3.32362 9.11132 2.77295 9.13229 2.23958 9.02125C2.46592 9.76717 2.9092 10.4199 3.5071 10.8876C4.105 11.3553 4.82746 11.6145 5.57292 11.6288C4.30931 12.6792 2.74292 13.247 1.13125 13.2387C0.847917 13.2387 0.564583 13.2212 0.28125 13.1862C1.86458 14.2537 3.74792 14.875 5.76458 14.875C12.3313 14.875 15.9396 9.1525 15.9396 4.19125C15.9396 4.025 15.9396 3.8675 15.9312 3.70125C16.6313 3.17625 17.2312 2.51125 17.7146 1.75Z" fill="#2C1D44"/> 2541</svg></div></a><a href="#" target="_blank" class="social__item hidden w-inline-block"><div class="social__item__icon__facebook w-embed"><svg viewBox="0 0 11 20" fill="none" xmlns="http://www.w3.org/2000/svg"> 2542<path d="M6.83854 11.4368H9.13021L10.0469 7.60352H6.83854V5.68685C6.83854 4.69977 6.83854 3.77018 8.67188 3.77018H10.0469V0.550182C9.74804 0.508974 8.61963 0.416016 7.42796 0.416016C4.93921 0.416016 3.17188 2.00397 3.17188 4.92018V7.60352H0.421875V11.4368H3.17188V19.5827H6.83854V11.4368Z" fill="#2C1D44"/> 2543</svg></div></a><a href="https://linkedin.com/company/elecctro" target="_blank" class="social__item w-inline-block"><div class="social__item__icon__linkedin w-embed"><svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 2544<path fill-rule="evenodd" clip-rule="evenodd" d="M8.50938 4.796V6.493C8.86476 5.95168 9.3546 5.5119 9.93095 5.21671C10.5073 4.92152 11.1504 4.78103 11.7974 4.809C15.2524 4.809 15.9994 6.969 15.9994 9.779V15.5H12.7994V10.428C12.7994 9.218 12.5554 7.662 10.6714 7.662C8.84438 7.662 8.53238 8.979 8.53238 10.338V15.5H5.34238V4.796H8.50938ZM3.19938 2.106C3.19899 2.423 3.10502 2.73284 2.92926 2.99665C2.7535 3.26047 2.50377 3.46653 2.21138 3.589C1.91911 3.71048 1.5973 3.74226 1.28692 3.68029C0.976529 3.61832 0.691597 3.4654 0.468382 3.241C0.244748 3.01646 0.0924967 2.73081 0.0307744 2.41997C-0.030948 2.10913 0.000614703 1.78698 0.121493 1.49403C0.242371 1.20108 0.447167 0.950407 0.710129 0.773539C0.973091 0.596671 1.28248 0.501502 1.59938 0.5C1.81 0.499999 2.01855 0.541582 2.21306 0.622364C2.40758 0.703147 2.58423 0.821539 2.73288 0.970748C2.88153 1.11996 2.99926 1.29705 3.07932 1.49186C3.15937 1.68668 3.20017 1.89538 3.19938 2.106Z" fill="#2C1D44"/> 2545<path d="M3.2 4.80859H0V15.4996H3.2V4.80859Z" fill="#2C1D44"/> 2546</svg></div></a></div></div><div class="footer__col__right"><div class="w-form"><form id="wf-form-Get-in-Touch" name="wf-form-Get-in-Touch" data-name="Get in Touch" method="get" class="form" data-wf-page-id="686acfd9a00ef1a2d16c3607" data-wf-element-id="4422e323-1815-816b-7903-e1ee6d04c992"><div class="form__row"><div class="form__item footer-ver"><label for="name" class="text-14-medium form__item__text">Name</label><input class="placeholder w-input" maxlength="256" name="name" data-name="Name" placeholder="Full name" type="text" id="name"/><div class="empty-input-error">Email required</div></div><div class="form__item footer-ver"><label for="Company" class="text-14-medium form__item__text">Company</label><input class="placeholder w-input" maxlength="256" name="Company" data-name="Company" placeholder="Organization name" type="text" id="Company" required=""/><div class="empty-input-error">This field is required</div></div></div><div class="form__row"><div class="form__item footer-ver"><label for="Phone" class="text-14-medium form__item__text">Phone</label><input class="placeholder w-input" maxlength="256" name="Phone" data-name="Phone" placeholder="+1 (555) 000-0000" type="tel" id="Phone" required=""/><div class="empty-input-error">Phone required</div></div><div class="form__item footer-ver"><label for="Email" class="text-14-medium form__item__text">Email</label><input class="placeholder w-input" maxlength="256" name="Email" data-name="Email" placeholder="[email protected]" type="email" id="Email" required=""/><div class="empty-input-error">Email required</div></div></div><button class="form__submit button--middle"><div class="btn-group long-ver pointer-events-none"><a href="#" class="btn-icon-link footer-ver w-inline-block"><div class="btn-icon-content"><div data-icon-size="normal" class="btn-icon-icon"><div data-button-anim-target="" class="btn-icon-icon__bg"></div><div class="btn-icon-icon__wrap"><div class="btn-icon-icon__list">
2546<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow header-ver"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 10 8" fill="none" data-button-anim-target="" class="btn-icon-icon__arrow main"><path d="M4.45231 0.385986H6.02531L9.30131 3.99999L6.02531 7.61399H4.45231L7.40331 4.58499H0.695312V3.42799H7.41631L4.45231 0.385986Z" fill="currentColor"></path></svg></div></div></div><div class="btn-icon-content__mask"><span data-button-anim-target="" class="btn-icon-content__text">Get in Touch</span></div><div data-button-anim-target="" class="btn-icon-content__bg header-ver"></div></div></a></div></button></form><div class="form-final w-form-done"><div class="form-msg-wrap"><div class="form-title">Form submitted successfully.</div><div class="form-msg-icon w-embed"><svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"> 2547<path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM21.7075 13.7075L14.7075 20.7075C14.6146 20.8005 14.5043 20.8742 14.3829 20.9246C14.2615 20.9749 14.1314 21.0008 14 21.0008C13.8686 21.0008 13.7385 20.9749 13.6171 20.9246C13.4957 20.8742 13.3854 20.8005 13.2925 20.7075L10.2925 17.7075C10.1049 17.5199 9.99945 17.2654 9.99945 17C9.99945 16.7346 10.1049 16.4801 10.2925 16.2925C10.4801 16.1049 10.7346 15.9994 11 15.9994C11.2654 15.9994 11.5199 16.1049 11.7075 16.2925L14 18.5863L20.2925 12.2925C20.3854 12.1996 20.4957 12.1259 20.6171 12.0756C20.7385 12.0253 20.8686 11.9994 21 11.9994C21.1314 11.9994 21.2615 12.0253 21.3829 12.0756C21.5043 12.1259 21.6146 12.1996 21.7075 12.2925C21.8004 12.3854 21.8741 12.4957 21.9244 12.6171C21.9747 12.7385 22.0006 12.8686 22.0006 13C22.0006 13.1314 21.9747 13.2615 21.9244 13.3829C21.8741 13.5043 21.8004 13.6146 21.7075 13.7075Z" fill="#1D1131"/> 2548</svg></div></div></div><div class="form-error w-form-fail"><div class="form-msg-wrap"><div class="form-msg-icon w-embed"><svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"> 2549<path d="M29.6013 23.5113L18.6701 4.52758C18.3969 4.06249 18.007 3.67686 17.5388 3.40891C17.0707 3.14096 16.5407 3 16.0013 3C15.462 3 14.9319 3.14096 14.4638 3.40891C13.9957 3.67686 13.6058 4.06249 13.3326 4.52758L2.40134 23.5113C2.13851 23.9612 2 24.4728 2 24.9938C2 25.5148 2.13851 26.0265 2.40134 26.4763C2.671 26.9442 3.0603 27.332 3.52929 27.5997C3.99828 27.8675 4.53007 28.0057 5.07009 28.0001H26.9326C27.4722 28.0052 28.0035 27.8669 28.472 27.5991C28.9405 27.3314 29.3294 26.9439 29.5988 26.4763C29.8621 26.0267 30.001 25.5152 30.0014 24.9942C30.0019 24.4732 29.8638 23.9614 29.6013 23.5113ZM15.0013 13.0001C15.0013 12.7349 15.1067 12.4805 15.2942 12.293C15.4818 12.1054 15.7361 12.0001 16.0013 12.0001C16.2666 12.0001 16.5209 12.1054 16.7084 12.293C16.896 12.4805 17.0013 12.7349 17.0013 13.0001V18.0001C17.0013 18.2653 16.896 18.5197 16.7084 18.7072C16.5209 18.8947 16.2666 19.0001 16.0013 19.0001C15.7361 19.0001 15.4818 18.8947 15.2942 18.7072C15.1067 18.5197 15.0013 18.2653 15.0013 18.0001V13.0001ZM16.0013 24.0001C15.7047 24.0001 15.4147 23.9121 15.168 23.7473C14.9213 23.5825 14.7291 23.3482 14.6155 23.0741C14.502 22.8 14.4723 22.4984 14.5302 22.2074C14.588 21.9165 14.7309 21.6492 14.9407 21.4394C15.1505 21.2296 15.4177 21.0868 15.7087 21.0289C15.9997 20.971 16.3013 21.0007 16.5754 21.1143C16.8495 21.2278 17.0837 21.4201 17.2485 21.6667C17.4134 21.9134 17.5013 22.2034 17.5013 22.5001C17.5013 22.8979 17.3433 23.2794 17.062 23.5607C16.7807 23.842 16.3992 24.0001 16.0013 24.0001Z" fill="#FF4E3E"/> 2550</svg></div><div class="form-title">Oops! Something went wrong.</div><a button-full="" href="#" class="form__submit button--middle button--restart w-inline-block"><div button-bg="" class="button__icon-wrapper"><div class="code-embed-2 w-embed"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"> 2551 <path d="M19.5 3H4.5C4.10218 3 3.72064 3.15804 3.43934 3.43934C3.15804 3.72064 3 4.10218 3 4.5V19.5C3 19.8978 3.15804 20.2794 3.43934 20.5607C3.72064 20.842 4.10218 21 4.5 21H19.5C19.8978 21 20.2794 20.842 20.5607 20.5607C20.842 20.2794 21 19.8978 21 19.5V4.5C21 4.10218 20.842 3.72064 20.5607 3.43934C20.2794 3.15804 19.8978 3 19.5 3ZM16.2806 12.5306L13.2806 15.5306C13.1399 15.6714 12.949 15.7504 12.75 15.7504C12.551 15.7504 12.3601 15.6714 12.2194 15.5306C12.0786 15.3899 11.9996 15.199 11.9996 15C11.9996 14.801 12.0786 14.6101 12.2194 14.4694L13.9397 12.75H8.25C8.05109 12.75 7.86032 12.671 7.71967 12.5303C7.57902 12.3897 7.5 12.1989 7.5 12C7.5 11.8011 7.57902 11.6103 7.71967 11.4697C7.86032 11.329 8.05109 11.25 8.25 11.25H13.9397L12.2194 9.53063C12.0786 9.38989 11.9996 9.19902 11.9996 9C11.9996 8.80098 12.0786 8.61011 12.2194 8.46937C12.3601 8.32864 12.551 8.24958 12.75 8.24958C12.949 8.24958 13.1399 8.32864 13.2806 8.46937L16.2806 11.4694C16.3504 11.539 16.4057 11.6217 16.4434 11.7128C16.4812 11.8038 16.5006 11.9014 16.5006 12C16.5006 12.0986 16.4812 12.1962 16.4434 12.2872C16.4057 12.3783 16.3504 12.461 16.2806 12.5306Z" fill="currentColor"/> 2552</svg></div></div><div button-text="" class="text-18-medium form__submit__text button__text footer__btn__text">Try again</div><div text-hidden="" class="text-18-medium form__submit__text button__text footer__btn__text button--hide">Try again</div></a></div></div></div></div><div class="socials socials__mobile"><a href="#" target="_blank" class="social__item hidden w-inline-block"><div class="code-embed-8 w-embed"><svg viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg"> 2553<path d="M17.7146 1.75C17.0729 2.05625 16.3813 2.2575 15.6646 2.35375C16.3979 1.89 16.9646 1.155 17.2313 0.27125C16.5396 0.70875 15.7729 1.015 14.9646 1.19C14.3062 0.4375 13.3813 0 12.3313 0C10.3729 0 8.77292 1.68 8.77292 3.75375C8.77292 4.05125 8.80625 4.34 8.86458 4.61125C5.89792 4.45375 3.25625 2.9575 1.49792 0.69125C1.18958 1.2425 1.01458 1.89 1.01458 2.5725C1.01458 3.87625 1.63958 5.03125 2.60625 5.6875C2.01458 5.6875 1.46458 5.5125 0.98125 5.25V5.27625C0.98125 7.09625 2.21458 8.61875 3.84792 8.96C3.32362 9.11132 2.77295 9.13229 2.23958 9.02125C2.46592 9.76717 2.9092 10.4199 3.5071 10.8876C4.105 11.3553 4.82746 11.6145 5.57292 11.6288C4.30931 12.6792 2.74292 13.247 1.13125 13.2387C0.847917 13.2387 0.564583 13.2212 0.28125 13.1862C1.86458 14.2537 3.74792 14.875 5.76458 14.875C12.3313 14.875 15.9396 9.1525 15.9396 4.19125C15.9396 4.025 15.9396 3.8675 15.9312 3.70125C16.6313 3.17625 17.2312 2.51125 17.7146 1.75Z" fill="#2C1D44"/> 2554</svg></div></a><a href="#" target="_blank" class="social__item hidden w-inline-block"><div class="social__item__icon__facebook w-embed"><svg viewBox="0 0 11 20" fill="none" xmlns="http://www.w3.org/2000/svg"> 2555<path d="M6.83854 11.4368H9.13021L10.0469 7.60352H6.83854V5.68685C6.83854 4.69977 6.83854 3.77018 8.67188 3.77018H10.0469V0.550182C9.74804 0.508974 8.61963 0.416016 7.42796 0.416016C4.93921 0.416016 3.17188 2.00397 3.17188 4.92018V7.60352H0.421875V11.4368H3.17188V19.5827H6.83854V11.4368Z" fill="#2C1D44"/> 2556</svg></div></a><a href="https://pt.linkedin.com/company/elecctro" target="_blank" class="social__item w-inline-block"><div class="social__item__icon__linkedin w-embed"><svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 2557<path fill-rule="evenodd" clip-rule="evenodd" d="M8.50938 4.796V6.493C8.86476 5.95168 9.3546 5.5119 9.93095 5.21671C10.5073 4.92152 11.1504 4.78103 11.7974 4.809C15.2524 4.809 15.9994 6.969 15.9994 9.779V15.5H12.7994V10.428C12.7994 9.218 12.5554 7.662 10.6714 7.662C8.84438 7.662 8.53238 8.979 8.53238 10.338V15.5
2557H5.34238V4.796H8.50938ZM3.19938 2.106C3.19899 2.423 3.10502 2.73284 2.92926 2.99665C2.7535 3.26047 2.50377 3.46653 2.21138 3.589C1.91911 3.71048 1.5973 3.74226 1.28692 3.68029C0.976529 3.61832 0.691597 3.4654 0.468382 3.241C0.244748 3.01646 0.0924967 2.73081 0.0307744 2.41997C-0.030948 2.10913 0.000614703 1.78698 0.121493 1.49403C0.242371 1.20108 0.447167 0.950407 0.710129 0.773539C0.973091 0.596671 1.28248 0.501502 1.59938 0.5C1.81 0.499999 2.01855 0.541582 2.21306 0.622364C2.40758 0.703147 2.58423 0.821539 2.73288 0.970748C2.88153 1.11996 2.99926 1.29705 3.07932 1.49186C3.15937 1.68668 3.20017 1.89538 3.19938 2.106Z" fill="#2C1D44"/> 2558<path d="M3.2 4.80859H0V15.4996H3.2V4.80859Z" fill="#2C1D44"/> 2559</svg></div></a></div><div class="footer__copyright full"><p class="text-18-regular text-purple-300 footer__copyright__first">© 2025.  Elecctro Solutions, Lda</p><a href="https://www.lynksen.com/" target="_blank" class="link-purple link__with__logo w-inline-block"><div class="text-block text-18-regular link__text">Made by</div><div class="link_with_logo__icon__wrap"><div class="code-embed-24 w-embed"><svg xmlns="http://www.w3.org/2000/svg" width="98" height="23" viewBox="0 0 98 23" fill="none"> 2560 <path d="M20.5898 0.0146484C20.7001 0.0421349 20.7991 0.106427 20.8682 0.196289L21.0986 0.496094L21.1045 0.503906L21.1084 0.511719L21.4316 1.13867L21.4336 1.14258L21.4355 1.14746L21.5449 1.41699C21.618 1.59803 21.6687 1.78742 21.6963 1.98047C21.7324 2.2339 21.7283 2.49206 21.6836 2.74414L21.5225 3.65137C21.4954 3.9012 21.4468 4.14709 21.3965 4.38867C21.3456 4.63266 21.2931 4.87154 21.2539 5.1123C21.2371 5.21538 21.2241 5.31955 21.2158 5.42383C21.1866 5.79344 21.2116 6.16573 21.29 6.52832L21.3477 6.79395C21.4401 7.22121 21.5857 7.63625 21.7812 8.02832L21.8457 8.15723C22.1004 8.66784 22.2735 9.21442 22.3584 9.77734L22.3838 9.94629C22.4495 10.3823 22.4484 10.8261 22.3799 11.2617L22.373 11.3018C22.324 11.6134 22.2382 11.9191 22.1172 12.2109C22.0133 12.4613 21.8838 12.701 21.7314 12.9258L20.9189 14.124L20.916 14.1279L20.9141 14.1318L15.5781 20.6992C15.1364 21.2428 14.5933 21.6996 13.9795 22.0439L13.8193 22.1328C13.3359 22.4039 12.8142 22.6035 12.2715 22.7227L11.6211 22.8643L11.6162 22.8662H11.6123L11.4229 22.8877C11.3951 22.8908 11.3667 22.8927 11.3389 22.8945H11.3379C11.3235 22.8955 11.3083 22.8969 11.2939 22.8975C11.289 22.8977 11.2833 22.8973 11.2783 22.8975C11.2729 22.8976 11.2671 22.8983 11.2617 22.8984H11.1709C11.1654 22.8983 11.1588 22.8977 11.1533 22.8975C11.1486 22.8973 11.1434 22.8976 11.1387 22.8975C11.1242 22.8969 11.1091 22.8955 11.0947 22.8945H11.0928C11.0651 22.8927 11.0364 22.8908 11.0088 22.8877L10.8203 22.8662H10.8164L10.8115 22.8643L10.1611 22.7217C9.61822 22.6026 9.09584 22.404 8.6123 22.1328L8.45312 22.0439C7.83916 21.6996 7.29625 21.2429 6.85449 20.6992L1.51855 14.1318L1.51562 14.1279L1.51367 14.124L0.701172 12.9258C0.548714 12.7009 0.419311 12.4613 0.31543 12.2109C0.194348 11.9189 0.10763 11.6135 0.0585938 11.3018L0.0527344 11.2617C-0.0157736 10.8261 -0.0168788 10.3824 0.0488281 9.94629L0.0742188 9.77734C0.159104 9.21441 0.332186 8.66784 0.586914 8.15723L0.650391 8.02832C0.845913 7.63633 0.991579 7.22111 1.08398 6.79395L1.1416 6.52832C1.22 6.16577 1.24502 5.7934 1.21582 5.42383C1.20757 5.31954 1.19549 5.21539 1.17871 5.1123C1.13952 4.87149 1.08601 4.63272 1.03516 4.38867C0.984964 4.14778 0.937257 3.90241 0.910156 3.65332L0.749023 2.74414C0.704254 2.49201 0.70017 2.23396 0.736328 1.98047C0.763901 1.78746 0.814665 1.598 0.887695 1.41699L0.996094 1.14746L0.998047 1.14258L1.00098 1.13867L1.32422 0.511719L1.32812 0.503906L1.33398 0.496094L1.56445 0.196289C1.63357 0.106568 1.73159 0.0420807 1.8418 0.0146484C2.15705 -0.0633235 2.4667 0.17189 2.4668 0.49707V1.44141C2.4668 1.77627 2.63551 2.10509 2.88867 2.41113C3.14008 2.71492 3.46614 2.98653 3.76172 3.20605L4.31641 3.54883L4.31836 3.5498L4.31934 3.55078C4.58565 3.72932 4.82478 3.83425 5.06836 3.95703C5.3108 4.07925 5.55096 4.21617 5.79785 4.45508L6.02539 4.6748C6.7254 5.35232 7.10588 6.25849 7.41895 7.15723L7.5498 7.54199L9.78027 14.3516C10.2298 15.7237 12.1698 15.7271 12.624 14.3564L14.8828 7.54199L15.1523 6.77246C15.4416 6.00444 15.8071 5.25554 16.4072 4.6748L16.6348 4.45508C16.8816 4.21632 17.1218 4.07922 17.3643 3.95703C17.6076 3.83438 17.8462 3.72917 18.1123 3.55078L18.1162 3.54883L18.6709 3.20508C18.9663 2.98565 19.2918 2.71464 19.543 2.41113C19.7961 2.10508 19.9648 1.77628 19.9648 1.44141V0.49707C19.9649 0.17186 20.2746 -0.0633881 20.5898 0.0146484ZM39.3682 14.4658C39.4586 14.763 39.5681 14.9894 39.6973 15.1445C39.8266 15.2997 39.9566 15.4165 40.0859 15.4941C40.215 15.5587 40.3313 15.5974 40.4346 15.6104C40.551 15.6233 40.6292 15.6299 40.668 15.6299L42.8203 7.21094H45.2646L41.9287 20.2852L40.9971 22.2061H39.0381L40.2412 17.6084C39.7369 17.6084 39.2771 17.5114 38.8633 17.3174C38.4625 17.1234 38.1194 16.8322 37.835 16.4443C37.5506 16.0565 37.3177 15.5587 37.1367 14.9512L35.0029 7.21094H37.4863L39.3682 14.4658ZM72.2373 7.11426C72.651 7.11427 73.0969 7.133
25601 73.5752 7.17188C74.0535 7.21066 74.5126 7.26252 74.9521 7.32715C75.3918 7.37887 75.7414 7.4439 76 7.52148V8.9375H71.7715C71.2932 8.9375 70.9246 9.02147 70.666 9.18945C70.4203 9.34464 70.2969 9.64234 70.2969 10.082V10.4502C70.2969 10.7347 70.3553 10.9486 70.4717 11.0908C70.588 11.233 70.7625 11.3301 70.9951 11.3818C71.2278 11.4335 71.506 11.459 71.8291 11.459H73.4395C74.4609 11.459 75.2176 11.6918 75.709 12.1572C76.2003 12.6227 76.4462 13.2824 76.4463 14.1357V14.9893C76.4463 15.6876 76.2842 16.2378 75.9609 16.6387C75.6376 17.0394 75.1721 17.3241 74.5645 17.4922C73.9696 17.6473 73.2516 17.7246 72.4111 17.7246C72.1139 17.7246 71.7714 17.7114 71.3838 17.6855C71.0089 17.6726 70.6271 17.6472 70.2393 17.6084C69.8642 17.5825 69.5147 17.5439 69.1914 17.4922C68.8683 17.4405 68.6033 17.382 68.3965 17.3174V15.9014H72.877C73.2 15.9014 73.4716 15.8759 73.6914 15.8242C73.9242 15.7725 74.0994 15.6688 74.2158 15.5137C74.3322 15.3586 74.3896 15.1256 74.3896 14.8154V14.4463C74.3896 14.1233 74.2801 13.8714 74.0605 13.6904C73.8537 13.4965 73.485 13.3995 72.9551 13.3994H71.3838C70.776 13.3994 70.2324 13.3146 69.7539 13.1465C69.2884 12.9784 68.92 12.6938 68.6484 12.293C68.377 11.8921 68.2412 11.3493 68.2412 10.6641V10.082C68.2412 9.4225 68.3637 8.87891 68.6094 8.45215C68.868 8.01258 69.2883 7.6827 69.8701 7.46289C70.465 7.23011 71.2545 7.11426 72.2373 7.11426ZM82.6328 7.0752C83.6285 7.0752 84.4237 7.17884 85.0186 7.38574C85.6263 7.5797 86.0663 7.93497 86.3379 8.45215C86.6224 8.95646 86.7646 9.67446 86.7646 10.6055C86.7646 11.2649 86.6355 11.7954 86.377 12.1963C86.1183 12.5843 85.7424 12.8622 85.251 13.0303C84.7726 13.1983 84.2033 13.2822 83.5439 13.2822H80.499C80.5249 13.9286 80.6088 14.4461 80.751 14.834C80.9061 15.2089 81.1776 15.4813 81.5654 15.6494C81.9663 15.8175 82.5486 15.9014 83.3115 15.9014H86.4541V17.3174C85.9239 17.4208 85.3614 17.5113 84.7666 17.5889C84.1848 17.6664 83.493 17.7051 82.6914 17.7051C81.5667 17.7051 80.6675 17.5504 79.9951 17.2402C79.3357 16.9299 78.857 16.3928 78.5596 15.6299C78.2622 14.854 78.1133 13.7807 78.1133 12.4102C78.1133 11.0135 78.2555 9.93291 78.54 9.16992C78.8246 8.39417 79.2966 7.85134 79.9561 7.54102C80.6156 7.23067 81.5078 7.0752 82.6328 7.0752ZM29.041 14.0195C29.041 14.3816 29.106 14.6727 29.2354 14.8926C29.3646 15.0994 29.5324 15.2418 29.7393 15.3193C29.9591 15.3969 30.1984 15.4355 30.457 15.4355H35.21V17.6084H29.8555C29.1833 17.6084 28.6016 17.5046 28.1104 17.2979C27.6319 17.0909 27.2691 16.7546 27.0234 16.2891C26.7778 15.8106 26.6553 15.183 26.6553 14.4072V3.29297H29.041V14.0195ZM52.6475 7.03613C53.4621 7.03614 54.1019 7.20487 54.5674 7.54102C55.0328 7.86421 55.3626 8.30356 55.5566 8.85938C55.7635 9.41545 55.8672 10.0241 55.8672 10.6836V17.6084H53.4619V10.9746C53.4619 10.5996 53.3913 10.2821 53.249 10.0234C53.1068 9.76492 52.906 9.56508 52.6475 9.42285C52.4018 9.2806 52.0974 9.20898 51.7354 9.20898C51.3993 9.20901 51.0825 9.24103 50.7852 9.30566C50.5008 9.37031 50.2293 9.46742 49.9707 9.59668C49.7121 9.726 49.4464 9.88145 49.1748 10.0625V17.6084H46.7695V7.21094H48.7295L49.1748 8.29688C49.6016 7.97357 50.1197 7.68345 50.7275 7.4248C51.3482 7.16623 51.988 7.03613 52.6475 7.03613ZM60.6738 11.0127H61.9932L64.5918 7.21094H67.0557L63.7578 12.0996L67.3271 17.6084H64.8633L61.9541 13.166H60.6738V17.6084H58.2686V2.80762H60.6738V11.0127ZM94.7773 7.03613C95.5919 7.03619 96.2318 7.20484 96.6973 7.54102C97.1626 7.86423 97.4925 8.30354 97.6865 8.85938C97.8934 9.41545 97.9971 10.0241 97.9971 10.6836V17.6084H95.5918V10.9746C95.5918 10.5996 95.5202 10.2821 95.3779 10.0234C95.2358 9.76514 95.0356 9.56502 94.7773 9.42285C94.5316 9.2806 94.2273 9.20898 93.8652 9.20898C93.5291 9.20898 93.2124 9.24105 92.915 9.30566C92.6305 9.37033 92.3582 9.46736 92.0996 9.59668C91.841 9.72598 91.5762 9.88151 91.3047 10.0625V17.6084H88.8994V7.21094H90.8584L91.3047 8.29688C91.7313 7.97367 92.2488 7.68338 92.8564 7.4248C93.4772 7.16616 94.1178 7.03613 94.7773 7.03613ZM12.8418 6.22852C13.2044 6.12876 13.5609 6.45395 13.4668 6.83691L11.874 13.3057C11.7141 13.9546 10.7974 13.9709 10.6143 13.3281L8.77051 6.85645C8.66203 6.47445 9.015 6.12769 9.38867 6.23047L9.4248 6.24219L9.52734 6.27734C10.5907 6.62698 11.7485 6.61279 12.8066 6.23926L12.8418 6.22852ZM82.6328 8.82129C82.0897 8.82129 81.6629 8.90514 81.3525 9.07324C81.0422 9.24136 80.8161 9.54566 80.6738 9.98535C80.5446 10.4121 80.4795 11.0265 80.4795 11.8281H83.3115C83.7641 11.8281 84.0939 11.7433 84.3008 11.5752C84.5206 11.3941 84.6309 11.071 84.6309 10.6055C84.6308 10.153 84.5658 9.79765 84.4365 9.53906C84.3073 9.28053 84.0941 9.09957 83.7969 8.99609C83.4995 8.87971 83.1113 8.8213 82.6328 8.82129Z" fill="currentColor"/> 2561</svg></div></div></a><a link-hover="" data-curtain="" href="/terms-conditions" class="text-18-regular link-purple bottom__link">Terms & Conditions</a><a link-hover="" data-curtain="" href="/privacy-policy" class="text-18-regular link-purple bottom__link">Privacy Policy</a><p class="text-18-regular text-purple-300">All rights reserved</p><div class="w-layout-blockcontainer container-2 w-container"></div>
2561<div class="footer__copyright__wrap"></div></div><div class="contacts-mobile"><div class="contacts-heading">Contacts<br/></div><div class="links-wrapper"><a href="https://www.linkedin.com/company/elecctro" target="_blank" class="social-link">LinkedIn</a><a href="mailto:[email protected]?subject=comercial%40elecctro.com" class="social-link">[email protected]</a></div><div class="contacts-heading">General<br/></div><div class="links-wrapper"><a href="/privacy-policy" class="social-link">Privacy Policy</a><div>All rights reserved</div><a href="/terms-conditions" class="social-link">Terms & Conditions</a></div><div class="div-block-14"><div>© 2025.  Elecctro Solutions, Lda<br/></div><a href="https://www.lynksen.com/" target="_blank" class="link-purple link__with__logo w-inline-block"><div class="text-block text-18-regular link__text">Made by</div><div class="link_with_logo__icon__wrap"><div class="code-embed-24 w-embed"><svg xmlns="http://www.w3.org/2000/svg" width="98" height="23" viewBox="0 0 98 23" fill="none"> 2562 <path d="M20.5898 0.0146484C20.7001 0.0421349 20.7991 0.106427 20.8682 0.196289L21.0986 0.496094L21.1045 0.503906L21.1084 0.511719L21.4316 1.13867L21.4336 1.14258L21.4355 1.14746L21.5449 1.41699C21.618 1.59803 21.6687 1.78742 21.6963 1.98047C21.7324 2.2339 21.7283 2.49206 21.6836 2.74414L21.5225 3.65137C21.4954 3.9012 21.4468 4.14709 21.3965 4.38867C21.3456 4.63266 21.2931 4.87154 21.2539 5.1123C21.2371 5.21538 21.2241 5.31955 21.2158 5.42383C21.1866 5.79344 21.2116 6.16573 21.29 6.52832L21.3477 6.79395C21.4401 7.22121 21.5857 7.63625 21.7812 8.02832L21.8457 8.15723C22.1004 8.66784 22.2735 9.21442 22.3584 9.77734L22.3838 9.94629C22.4495 10.3823 22.4484 10.8261 22.3799 11.2617L22.373 11.3018C22.324 11.6134 22.2382 11.9191 22.1172 12.2109C22.0133 12.4613 21.8838 12.701 21.7314 12.9258L20.9189 14.124L20.916 14.1279L20.9141 14.1318L15.5781 20.6992C15.1364 21.2428 14.5933 21.6996 13.9795 22.0439L13.8193 22.1328C13.3359 22.4039 12.8142 22.6035 12.2715 22.7227L11.6211 22.8643L11.6162 22.8662H11.6123L11.4229 22.8877C11.3951 22.8908 11.3667 22.8927 11.3389 22.8945H11.3379C11.3235 22.8955 11.3083 22.8969 11.2939 22.8975C11.289 22.8977 11.2833 22.8973 11.2783 22.8975C11.2729 22.8976 11.2671 22.8983 11.2617 22.8984H11.1709C11.1654 22.8983 11.1588 22.8977 11.1533 22.8975C11.1486 22.8973 11.1434 22.8976 11.1387 22.8975C11.1242 22.8969 11.1091 22.8955 11.0947 22.8945H11.0928C11.0651 22.8927 11.0364 22.8908 11.0088 22.8877L10.8203 22.8662H10.8164L10.8115 22.8643L10.1611 22.7217C9.61822 22.6026 9.09584 22.404 8.6123 22.1328L8.45312 22.0439C7.83916 21.6996 7.29625 21.2429 6.85449 20.6992L1.51855 14.1318L1.51562 14.1279L1.51367 14.124L0.701172 12.9258C0.548714 12.7009 0.419311 12.4613 0.31543 12.2109C0.194348 11.9189 0.10763 11.6135 0.0585938 11.3018L0.0527344 11.2617C-0.0157736 10.8261 -0.0168788 10.3824 0.0488281 9.94629L0.0742188 9.77734C0.159104 9.21441 0.332186 8.66784 0.586914 8.15723L0.650391 8.02832C0.845913 7.63633 0.991579 7.22111 1.08398 6.79395L1.1416 6.52832C1.22 6.16577 1.24502 5.7934 1.21582 5.42383C1.20757 5.31954 1.19549 5.21539 1.17871 5.1123C1.13952 4.87149 1.08601 4.63272 1.03516 4.38867C0.984964 4.14778 0.937257 3.90241 0.910156 3.65332L0.749023 2.74414C0.704254 2.49201 0.70017 2.23396 0.736328 1.98047C0.763901 1.78746 0.814665 1.598 0.887695 1.41699L0.996094 1.14746L0.998047 1.14258L1.00098 1.13867L1.32422 0.511719L1.32812 0.503906L1.33398 0.496094L1.56445 0.196289C1.63357 0.106568 1.73159 0.0420807 1.8418 0.0146484C2.15705 -0.0633235 2.4667 0.17189 2.4668 0.49707V1.44141C2.4668 1.77627 2.63551 2.10509 2.88867 2.41113C3.14008 2.71492 3.46614 2.98653 3.76172 3.20605L4.31641 3.54883L4.31836 3.5498L4.31934 3.55078C4.58565 3.72932 4.82478 3.83425 5.06836 3.95703C5.3108 4.07925 5.55096 4.21617 5.79785 4.45508L6.02539 4.6748C6.7254 5.35232 7.10588 6.25849 7.41895 7.15723L7.5498 7.54199L9.78027 14.3516C10.2298 15.7237 12.1698 15.7271 12.624 14.3564L14.8828 7.54199L15.1523 6.77246C15.4416 6.00444 15.8071 5.25554 16.4072 4.6748L16.6348 4.45508C16.8816 4.21632 17.1218 4.07922 17.3643 3.95703C17.6076 3.83438 17.8462 3.72917 18.1123 3.55078L18.1162 3.54883L18.6709 3.20508C18.9663 2.98565 19.2918 2.71464 19.543 2.41113C19.7961 2.10508 19.9648 1.77628 19.9648 1.44141V0.49707C19.9649 0.17186 20.2746 -0.0633881 20.5898 0.0146484ZM39.3682 14.4658C39.4586 14.763 39.5681 14.9894 39.6973 15.1445C39.8266 15.2997 39.9566 15.4165 40.0859 15.4941C40.215 15.5587 40.3313 15.5974 40.4346 15.6104C40.551 15.6233 40.6292 15.6299 40.668 15.6299L42.8203 7.21094H45.2646L41.9287 20.2852L40.9971 22.2061H39.0381L40.2412 17.6084C39.7369 17.6084 39.2771 17.5114 38.8633 17.3174C38.4625 17.1234 38.1194 16.8322 37.835 16.4443C37.5506 16.0565 37.3177 15.5587 37.1367 14.9512L35.0029 7.21094H37.4863L39.3682 14.4658ZM72.2373 7.11426C72.651 7.11427 73.0969 7.133
25621 73.5752 7.17188C74.0535 7.21066 74.5126 7.26252 74.9521 7.32715C75.3918 7.37887 75.7414 7.4439 76 7.52148V8.9375H71.7715C71.2932 8.9375 70.9246 9.02147 70.666 9.18945C70.4203 9.34464 70.2969 9.64234 70.2969 10.082V10.4502C70.2969 10.7347 70.3553 10.9486 70.4717 11.0908C70.588 11.233 70.7625 11.3301 70.9951 11.3818C71.2278 11.4335 71.506 11.459 71.8291 11.459H73.4395C74.4609 11.459 75.2176 11.6918 75.709 12.1572C76.2003 12.6227 76.4462 13.2824 76.4463 14.1357V14.9893C76.4463 15.6876 76.2842 16.2378 75.9609 16.6387C75.6376 17.0394 75.1721 17.3241 74.5645 17.4922C73.9696 17.6473 73.2516 17.7246 72.4111 17.7246C72.1139 17.7246 71.7714 17.7114 71.3838 17.6855C71.0089 17.6726 70.6271 17.6472 70.2393 17.6084C69.8642 17.5825 69.5147 17.5439 69.1914 17.4922C68.8683 17.4405 68.6033 17.382 68.3965 17.3174V15.9014H72.877C73.2 15.9014 73.4716 15.8759 73.6914 15.8242C73.9242 15.7725 74.0994 15.6688 74.2158 15.5137C74.3322 15.3586 74.3896 15.1256 74.3896 14.8154V14.4463C74.3896 14.1233 74.2801 13.8714 74.0605 13.6904C73.8537 13.4965 73.485 13.3995 72.9551 13.3994H71.3838C70.776 13.3994 70.2324 13.3146 69.7539 13.1465C69.2884 12.9784 68.92 12.6938 68.6484 12.293C68.377 11.8921 68.2412 11.3493 68.2412 10.6641V10.082C68.2412 9.4225 68.3637 8.87891 68.6094 8.45215C68.868 8.01258 69.2883 7.6827 69.8701 7.46289C70.465 7.23011 71.2545 7.11426 72.2373 7.11426ZM82.6328 7.0752C83.6285 7.0752 84.4237 7.17884 85.0186 7.38574C85.6263 7.5797 86.0663 7.93497 86.3379 8.45215C86.6224 8.95646 86.7646 9.67446 86.7646 10.6055C86.7646 11.2649 86.6355 11.7954 86.377 12.1963C86.1183 12.5843 85.7424 12.8622 85.251 13.0303C84.7726 13.1983 84.2033 13.2822 83.5439 13.2822H80.499C80.5249 13.9286 80.6088 14.4461 80.751 14.834C80.9061 15.2089 81.1776 15.4813 81.5654 15.6494C81.9663 15.8175 82.5486 15.9014 83.3115 15.9014H86.4541V17.3174C85.9239 17.4208 85.3614 17.5113 84.7666 17.5889C84.1848 17.6664 83.493 17.7051 82.6914 17.7051C81.5667 17.7051 80.6675 17.5504 79.9951 17.2402C79.3357 16.9299 78.857 16.3928 78.5596 15.6299C78.2622 14.854 78.1133 13.7807 78.1133 12.4102C78.1133 11.0135 78.2555 9.93291 78.54 9.16992C78.8246 8.39417 79.2966 7.85134 79.9561 7.54102C80.6156 7.23067 81.5078 7.0752 82.6328 7.0752ZM29.041 14.0195C29.041 14.3816 29.106 14.6727 29.2354 14.8926C29.3646 15.0994 29.5324 15.2418 29.7393 15.3193C29.9591 15.3969 30.1984 15.4355 30.457 15.4355H35.21V17.6084H29.8555C29.1833 17.6084 28.6016 17.5046 28.1104 17.2979C27.6319 17.0909 27.2691 16.7546 27.0234 16.2891C26.7778 15.8106 26.6553 15.183 26.6553 14.4072V3.29297H29.041V14.0195ZM52.6475 7.03613C53.4621 7.03614 54.1019 7.20487 54.5674 7.54102C55.0328 7.86421 55.3626 8.30356 55.5566 8.85938C55.7635 9.41545 55.8672 10.0241 55.8672 10.6836V17.6084H53.4619V10.9746C53.4619 10.5996 53.3913 10.2821 53.249 10.0234C53.1068 9.76492 52.906 9.56508 52.6475 9.42285C52.4018 9.2806 52.0974 9.20898 51.7354 9.20898C51.3993 9.20901 51.0825 9.24103 50.7852 9.30566C50.5008 9.37031 50.2293 9.46742 49.9707 9.59668C49.7121 9.726 49.4464 9.88145 49.1748 10.0625V17.6084H46.7695V7.21094H48.7295L49.1748 8.29688C49.6016 7.97357 50.1197 7.68345 50.7275 7.4248C51.3482 7.16623 51.988 7.03613 52.6475 7.03613ZM60.6738 11.0127H61.9932L64.5918 7.21094H67.0557L63.7578 12.0996L67.3271 17.6084H64.8633L61.9541 13.166H60.6738V17.6084H58.2686V2.80762H60.6738V11.0127ZM94.7773 7.03613C95.5919 7.03619 96.2318 7.20484 96.6973 7.54102C97.1626 7.86423 97.4925 8.30354 97.6865 8.85938C97.8934 9.41545 97.9971 10.0241 97.9971 10.6836V17.6084H95.5918V10.9746C95.5918 10.5996 95.5202 10.2821 95.3779 10.0234C95.2358 9.76514 95.0356 9.56502 94.7773 9.42285C94.5316 9.2806 94.2273 9.20898 93.8652 9.20898C93.5291 9.20898 93.2124 9.24105 92.915 9.30566C92.6305 9.37033 92.3582 9.46736 92.0996 9.59668C91.841 9.72598 91.5762 9.88151 91.3047 10.0625V17.6084H88.8994V7.21094H90.8584L91.3047 8.29688C91.7313 7.97367 92.2488 7.68338 92.8564 7.4248C93.4772 7.16616 94.1178 7.03613 94.7773 7.03613ZM12.8418 6.22852C13.2044 6.12876 13.5609 6.45395 13.4668 6.83691L11.874 13.3057C11.7141 13.9546 10.7974 13.9709 10.6143 13.3281L8.77051 6.85645C8.66203 6.47445 9.015 6.12769 9.38867 6.23047L9.4248 6.24219L9.52734 6.27734C10.5907 6.62698 11.7485 6.61279 12.8066 6.23926L12.8418 6.22852ZM82.6328 8.82129C82.0897 8.82129 81.6629 8.90514 81.3525 9.07324C81.0422 9.24136 80.8161 9.54566 80.6738 9.98535C80.5446 10.4121 80.4795 11.0265 80.4795 11.8281H83.3115C83.7641 11.8281 84.0939 11.7433 84.3008 11.5752C84.5206 11.3941 84.6309 11.071 84.6309 10.6055C84.6308 10.153 84.5658 9.79765 84.4365 9.53906C84.3073 9.28053 84.0941 9.09957 83.7969 8.99609C83.4995 8.87971 83.1113 8.8213 82.6328 8.82129Z" fill="currentColor"/> 2563</svg></div></div></a></div></div></footer><div class="code-embed-28 w-embed w-script"><style> 2564*:focus { 2565 outline: none !important; 2566 border-color: transparent !important; 2567 } 2568input::placeholder { 2569 font-weight: 500 !important; 2570 font-family: 'Poppins' !important; 2571 color: #A9ADB4 !important; 2572} 2573 2574 .bottom__link:hover { 2575 text-shadow: 0 0 0.05rem #615E84; 2576 } 2577 2578 .link__with__logo svg { 2579 transition: opacity 0.2s ease; 2580} 2581 2582.text-18-medium.form__submit__text { 2583 right: 1rem; 2584} 2585 2586@media (max-width: 1260px) and (min-width: 1024px) {
2587 .footer__copyright .text-18-regular { 2588 font-size: 1rem; 2589 } 2590} 2591 2592@media screen and (max-width: 479px) { 2593 .footer .empty-input-error, .empty-input-error.contacts { 2594 bottom: -16px; 2595 } 2596} 2597 2598@media screen and (max-width: 1200px) and (min-width: 991px) { 2599 .footer__col__left { 2600 margin-bottom: 32px; 2601 } 2602 .link.footer__email { 2603 line-height: 120%; 2604 display: none; 2605 } 2606 2607 .socials { 2608 margin-bottom: 2rem; 2609 display: none; 2610 } 2611 2612 .footer__col__right { 2613 width: 100%; 2614 margin-bottom: 32px; 2615 } 2616 2617 .form__row { 2618 flex-flow: column; 2619 } 2620 2621 .form__item.footer-ver { 2622 height: 3.875rem; 2623 padding: 12px 18px 14px; 2624 } 2625 2626 .text-14-medium.form__item__text { 2627 margin-bottom: 0; 2628 } 2629 2630 .form__item, .form__item.form__item__full { 2631 width: 100%; 2632 } 2633 2634 .form__submit.button--middle { 2635 width: 100%; 2636 height: 3.875rem; 2637 } 2638 2639 .btn-group.sumbit.pointer-events-none, .btn-group.long-ver { 2640 height: 100%; 2641 } 2642 2643 .btn-icon-link.footer-ver { 2644 height: 100%; 2645 } 2646 2647 .btn-icon-content { 2648 height: 100%; 2649 } 2650 2651 .socials.socials__mobile { 2652 margin-top: 4rem; 2653 margin-bottom: 1rem; 2654 display: none; 2655 } 2656 2657 .footer__copyright.full { 2658 opacity: 0; 2659 pointer-events: none; 2660 position: absolute; 2661 } 2662 2663 .contacts-mobile { 2664 color: var(--purple-300); 2665 width: 100%; 2666 font-family: Poppins, sans-serif; 2667 font-size: 16px; 2668 font-weight: 300; 2669 line-height: 130%; 2670 display: block; 2671 } 2672 2673 .contacts-heading { 2674 border-bottom: 1px solid var(--border-color); 2675 color: var(--purple-600); 2676 margin-bottom: 16px; 2677 padding-bottom: 8px; 2678 font-family: Poppins, sans-serif; 2679 font-weight: 400; 2680 } 2681 2682 .links-wrapper { 2683 grid-column-gap: 8px; 2684 grid-row-gap: 8px; 2685 flex-flow: column; 2686 margin-bottom: 32px; 2687 display: flex; 2688 } 2689 2690 .social-link { 2691 color: var(--purple-300); 2692 text-decoration: none; 2693 display: block; 2694 } 2695 2696 .contacts-heading { 2697 border-bottom: 1px solid var(--border-color); 2698 color: var(--purple-600); 2699 margin-bottom: 16px; 2700 padding-bottom: 8px; 2701 font-family: Poppins, sans-serif; 2702 font-weight: 400; 2703 } 2704 2705 .links-wrapper { 2706 grid-column-gap: 8px; 2707 grid-row-gap: 8px; 2708 flex-flow: column; 2709 margin-bottom: 32px; 2710 display: flex; 2711 } 2712 2713 .div-block-14 { 2714 justify-content: space-between; 2715 align-items: center; 2716 font-size: 14px; 2717 display: flex; 2718 } 2719 2720 .text-block.text-18-regular.link__text { 2721 font-size: 14px; 2722 } 2723} 2724 2725@media (hover: none) { 2726 .link-purple.link__with__logo:hover { 2727 color: inherit; 2728 } 2729} 2730</style> 2731
2732<script nonce="aPXsNxecKITnUVboEbCnig=="> 2733document.querySelector(".button--restart").addEventListener("click", () => { 2734 location.reload(); // пеÑезагÑÑÐ¶Ð°ÐµÑ ÑекÑÑÑÑ ÑÑÑаниÑÑ 2735 }); 2736 2737document.addEventListener("DOMContentLoaded", () => { 2738 // --- 1. LANGUAGE CONFIGURATION --- 2739 function getSelectedLanguage() { 2740 const path = window.location.pathname; 2741 const segments = path.split('/').filter(Boolean); 2742 const langSegment = segments[0]; 2743 2744 switch (langSegment) { 2745 case 'es-es': return 'es'; 2746 case 'pt-pt': return 'pt'; 2747 default: return 'en'; 2748 } 2749 } 2750 2751 const i18n = { 2752 en: { 2753 required: "This field is required", 2754 phoneRequired: "Phone required", 2755 emailRequired: "Email required", 2756 emailInvalid: "The email format isn't correct", 2757 phoneInvalid: "The phone number format isn't correct", 2758 nameInvalid: "Only letters allowed", 2759 tooShort: "The text is shorter than allowed" 2760 }, 2761 es: { 2762 required: "Este campo es obligatorio", 2763 phoneRequired: "Teléfono obligatorio", 2764 emailRequired: "Correo obligatorio", 2765 emailInvalid: "Formato de correo inválido", 2766 phoneInvalid: "Formato de teléfono inválido", 2767 nameInvalid: "Solo se permiten letras", 2768 tooShort: "El texto es más corto de lo permitido" 2769 }, 2770 pt: { 2771 required: "Este campo é obrigatório", 2772 phoneRequired: "Telefone obrigatório", 2773 emailRequired: "E-mail obrigatório", 2774 emailInvalid: "Formato de e-mail inválido", 2775 phoneInvalid: "Formato de telefone inválido", 2776 nameInvalid: "Apenas letras permitidas", 2777 tooShort: "O texto é mais curto do que o permitido" 2778 } 2779 }; 2780 2781 const lang = getSelectedLanguage(); 2782 const t = i18n[lang] || i18n.en; 2783 2784 // --- 2. FORM LOGIC --- 2785 const form = document.querySelector("footer form"); 2786 if (!form) return; // Guard clause 2787 2788 const submitBtn = form.querySelector(".form__submit"); 2789 2790 const patterns = { 2791 email: /^[^\s@]+@[^\s@]+\.[^\s@]+$/, 2792 phone: /^\+?[\d\s-]{4,15}$/, 2793 // \p{L} matches any Unicode letter, \s matches spaces, '- matches hyphens/apostrophes 2794 name: /^[\p{L}\s'-]+$/u 2795 }; 2796 2797 const validateInput = (input) => { 2798 const parent = input.closest(".form__item"); 2799 const errorText = parent.querySelector(".empty-input-error"); 2800 const value = input.value.trim(); 2801 const type = input.type; 2802 const id = input.id.toLowerCase(); 2803 2804 let isValid = true; 2805 let message = ""; 2806 2807 input.classList.remove("should-be-filled"); 2808 2809 // CHECK 1: Is it empty? 2810 if (input.hasAttribute("required") && !value) { 2811 isValid = false; 2812 if (id.includes("phone")) message = t.phoneRequired; 2813 else if (type === "email") message = t.emailRequired; 2814 else message = t.required; 2815 } 2816 2817 // CHECK 2: Specific formats 2818 else if (value) { 2819 if (type === "email" && !patterns.email.test(value)) { 2820 isValid = false; 2821 message = t.emailInvalid; 2822 } else if (input.id === "Phone" && !patterns.phone.test(value)) { 2823 isValid = false; 2824 message = t.phoneInvalid; 2825 } else if (input.id === "name" && !patterns.name.test(value)) { 2826 isValid = false; 2827 message = t.nameInvalid; 2828 } else if (value.length < 2) { 2829 isValid = false; 2830 message = t.tooShort; 2831 } 2832 } 2833 2834 if (!isValid) { 2835 input.classList.add("should-be-filled"); 2836 if (errorText) errorText.textContent = message; 2837 parent.style.marginBottom = '30px'; 2838 } else { 2839 parent.style.marginBottom = ''; 2840 } 2841 2842 return isValid; 2843 }; 2844 2845 const inputs = form.querySelectorAll("input"); 2846 2847 inputs.forEach((input) => { 2848 // 1. Validate on Blur 2849 input.addEventListener("blur", () => { 2850 validateInput(input); 2851 }); 2852 2853 // 2. Clear error on Input 2854 input.addEventListener("input", () => { 2855 const parent = input.closest(".form__item"); 2856 input.classList.remove("should-be-filled"); 2857 parent.style.marginBottom = ''; 2858 }); 2859 }); 2860 2861 submitBtn.addEventListener("click", (e) => { 2862 let formIsValid = true; 2863 const requiredInputs = form.querySelectorAll("input[required], input#name"); 2864
2865 requiredInputs.forEach((input) => { 2866 const isInputValid = validateInput(input); 2867 if (!isInputValid) formIsValid = false; 2868 }); 2869 2870 if (!formIsValid) { 2871 e.preventDefault(); 2872 e.stopPropagation(); 2873 } 2874 }); 2875}); 2876</script>
2876 2877
2878<script nonce="aPXsNxecKITnUVboEbCnig=="> 2879const wrapLines1 = (lines) => { 2880 lines.forEach((line) => { 2881 const wrapper = document.createElement("div"); 2882 wrapper.classList.add("line-wrap"); 2883 line.parentNode.insertBefore(wrapper, line); 2884 wrapper.appendChild(line); 2885 }); 2886} 2887 2888const initFooterAnim = () => { 2889 const isMobile = window.innerWidth <= 1200; 2890 2891 const heading1 = document.querySelector(".footer .heading-3-medium") 2892 const heading2 = document.querySelector(".footer .heading-3-medium.heading__grey") 2893 const email = document.querySelector(".footer .footer__email") 2894 const socialItems = document.querySelectorAll(".footer .social__item") 2895 const copyrights = document.querySelector(".footer .footer__copyright").childNodes 2896 2897 const formInputs = document.querySelectorAll(".footer .form__item") 2898 const formSubmitBtn = document.querySelector(".footer .form__submit") 2899 2900 const splitHeading1 = new SplitText(heading1, { type: "lines" }); 2901 wrapLines1(splitHeading1.lines) 2902 const splitHeading2 = new SplitText(heading2, { type: "lines" }); 2903 wrapLines1(splitHeading2.lines) 2904 const splitEmail = new SplitText(email, { type: "lines" }); 2905 wrapLines1(splitEmail.lines) 2906 2907 gsap.from( 2908 splitHeading1.lines, 2909 { 2910 yPercent: 100, 2911 ease: "power2.out", 2912 duration: 0.7, 2913 stagger: 0.1, 2914 scrollTrigger: { 2915 trigger: heading1, 2916 start: `top 95%`, 2917 toggleActions: "play none none reverse", 2918 }, 2919 } 2920 ); 2921 2922 gsap.from( 2923 splitHeading2.lines, 2924 { 2925 yPercent: 100, 2926 ease: "power2.out", 2927 duration: 0.7, 2928 stagger: 0.1, 2929 scrollTrigger: { 2930 trigger: heading1, 2931 start: `top 95%`, 2932 toggleActions: "play none none reverse", 2933 }, 2934 } 2935 ); 2936 2937 gsap.from( 2938 splitEmail.lines, 2939 { 2940 yPercent: 100, 2941 ease: "power2.out", 2942 duration: 0.7, 2943 stagger: 0.1, 2944 scrollTrigger: { 2945 trigger: email, 2946 start: `top 95%`, 2947 toggleActions: "play none none reverse", 2948 }, 2949 } 2950 ); 2951 2952 gsap.from(formInputs, { 2953 xPercent: isMobile ? (index) => (index % 2 === 0 ? -25 : 25) : 0, 2954 yPercent: isMobile ? 0 : 10, 2955 opacity: 0, 2956 duration: 0.5, 2957 stagger: 0.1, 2958 ease: "power2.out", 2959 scrollTrigger: { 2960 trigger: ".form", 2961 start: "top 80%", 2962 toggleActions: "play none none reverse", 2963 }, 2964 }); 2965 2966 gsap.from(formSubmitBtn, { 2967 //xPercent: isMobile ? -25 : 0, 2968 yPercent: 100, 2969 opacity: 0, 2970 duration: 0.5, 2971 scrollTrigger: { 2972 trigger: ".form", 2973 start: "top 80%", 2974 toggleActions: "play none none reverse", 2975 }, 2976 }); 2977 2978 gsap.from( 2979 socialItems, 2980 { 2981 yPercent: 100, 2982 opacity: 0, 2983 ease: "power2.out", 2984 duration: 0.5, 2985 stagger: 0.1, 2986 scrollTrigger: { 2987 trigger: ".socials", 2988 start: `top 95%`, 2989 toggleActions: "play none none reverse", 2990 }, 2991 } 2992 ); 2993 2994 gsap.from(copyrights, { 2995 yPercent: 100, 2996 opacity: 0, 2997 duration: 0.5, 2998 stagger: 0.1, 2999 scrollTrigger: { 3000 trigger: ".footer__copyright", 3001 start: "top bottom", 3002 toggleActions: "play none none reverse", 3003 }, 3004 }); 3005} 3006 3007document.addEventListener("DOMContentLoaded", initFooterAnim); 3008</script>
3008</div><div class="code-embed-52 w-embed w-script"><style> 3009 .dropdown-toggle { 3010 position: relative; 3011 top: -6px; 3012 } 3013 .form__item { 3014 border: 1px solid transparent; 3015 transition: border 0.3s ease-in-out, border 0.3s ease-in-out; 3016 } 3017 3018 .form__item label { 3019 color: #A9ADB4; 3020 transition: color 0.3s ease-in-out; 3021 } 3022 3023 .form__item:has(input:placeholder-shown) label { 3024 color: #1D1131; 3025 } 3026 3027 /* MODIFICATION: Hover effect restricted to non-touch devices */ 3028 @media (hover: hover) { 3029 .form__item:not(:has(.selected-option span)):hover { 3030 border: 1px solid #A9ADB4; 3031 } 3032 } 3033 3034 .form__item:not(:has(.selected-option span)):has(input:focus) { 3035 border: 1px solid var(--purple-600); 3036 } 3037 3038 .form__item:has(should-be-filled) { 3039 border: 1px solid #FF4E3E; 3040 } 3041 3042 .form__item:has(should-be-filled) label { 3043 color: #FF4E3E; 3044 } 3045 3046 .form__item:has(input:placeholder-shown) label { 3047 color: #1D1131; 3048 } 3049 3050 input.should-be-filled .empty-input-error { 3051 display: block; 3052 } 3053 3054 .form__item:has(.dropdown-menu.open) .empty-input-error { 3055 display: none !important; 3056 } 3057 3058 .form__item:has(input:disabled) { 3059 background: var(--grey-100); 3060 border: none; 3061 } 3062 3063 label + input:disabled { 3064 color: var(--grey-200) 3065 } 3066 3067 input:disabled { 3068 color: var(--grey-200) 3069 } 3070 3071 input::placeholder { 3072 font-weight: 400; 3073 } 3074 3075 .dropdown-menu + .empty-input-error { 3076 bottom: -10px; 3077 } 3078</style> 3079
3080<script nonce="aPXsNxecKITnUVboEbCnig=="> 3081const phoneInpunts = document.querySelectorAll('[type="tel"]'); 3082phoneInpunts.forEach(i => { 3083 i.addEventListener('input', function (e) { 3084 // Remove any character that is not a digit 3085 this.value = this.value.replace(/[^0-9+\-\s]/g, ''); 3086 }); 3087}) 3088</script>
3088</div></section></div></div><div class="cookie"><h5 class="cookie__title">Cookie Settings</h5><div class="cookie__content"><div class="cookie__text w-richtext"><p class="paragraph-7">We use essential cookies to run our site. By clicking "Accept," you agree to our <a href="/privacy-policy">Privacy Policy</a>. You can manage your settings anytime in "Preferences."</p></div><div class="cookie-accordion"><button class="cookie-accordion__button"><div class="text-16-regular cookie-accordion__button__text">Options<br/></div><div class="cookie-accordion__button__icon w-embed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"> 3089 <path d="M20.031 9.53104L12.531 17.031C12.4614 17.1008 12.3787 17.1561 12.2876 17.1938C12.1966 17.2316 12.099 17.251 12.0004 17.251C11.9019 17.251 11.8043 17.2316 11.7132 17.1938C11.6222 17.1561 11.5394 17.1008 11.4698 17.031L3.96979 9.53104C3.82906 9.39031 3.75 9.19944 3.75 9.00042C3.75 8.80139 3.82906 8.61052 3.96979 8.46979C4.11052 8.32906 4.30139 8.25 4.50042 8.25C4.69944 8.25 4.89031 8.32906 5.03104 8.46979L12.0004 15.4401L18.9698 8.46979C19.0395 8.40011 19.1222 8.34483 19.2132 8.30712C19.3043 8.26941 19.4019 8.25 19.5004 8.25C19.599 8.25 19.6965 8.26941 19.7876 8.30712C19.8786 8.34483 19.9614 8.40011 20.031 8.46979C20.1007 8.53947 20.156 8.6222 20.1937 8.71324C20.2314 8.80429 20.2508 8.90187 20.2508 9.00042C20.2508 9.09896 20.2314 9.19654 20.1937 9.28759C20.156 9.37863 20.1007 9.46136 20.031 9.53104Z" fill="white"/> 3090</svg></div></button><div class="cookie-accordion__content"><div cookie-group="necessary" class="cookie-accordion__group"><div class="cookie-accordion__group__header"><div class="text-16-regular cookie-accordion__group__title">Strictly necessary</div><div class="w-embed"><div class="custom-toggle disabled"> 3091 <div class="custom-toggle__thumb"></div> 3092 <input type="checkbox" class="custom-toggle__input" disabled /> 3093</div></div></div><div class="text-16-regular cookie-accordion__group__description">Strictly necessary cookies enable core functions (e.g., language, timezone, secure access) and are required for the site to work</div></div><div cookie-group="performance" class="cookie-accordion__group"><div class="cookie-accordion__group__header"><div class="text-16-regular cookie-accordion__group__title">Performance</div><div class="w-embed"><div class="custom-toggle"> 3094 <div class="custom-toggle__thumb"></div> 3095 <input type="checkbox" class="custom-toggle__input" /> 3096</div></div></div><div class="text-16-regular cookie-accordion__group__description">Performance cookies gather usage data â¨to improve site performance and content without directly identifying you</div></div><div cookie-group="targeting" class="cookie-accordion__group"><div class="cookie-accordion__group__header"><div class="text-16-regular cookie-accordion__group__title">Targeting</div><div class="w-embed"><div class="custom-toggle"> 3097 <div class="custom-toggle__thumb"></div> 3098 <input type="checkbox" class="custom-toggle__input" /> 3099</div></div></div><div class="text-16-regular cookie-accordion__group__description">Targeting cookies track browsing to deliver relevant content and ads, often via third parties who may build interest profiles</div></div></div></div></div><div class="cookie__btns"><button id="cookie-decline" cta-dark="" class="cookie__btn"><div class="cookie__btn__text">Decline</div><div class="w-embed"><svg width="33" height="32" viewBox="0 0 33 32" fill="none" xmlns="http://www.w3.org/2000/svg"> 3100<path d="M16.5 3C13.9288 3 11.4154 3.76244 9.27759 5.1909C7.13975 6.61935 5.47351 8.64968 4.48957 11.0251C3.50563 13.4006 3.24819 16.0144 3.7498 18.5362C4.25141 21.0579 5.48953 23.3743 7.30762 25.1924C9.1257 27.0105 11.4421 28.2486 13.9638 28.7502C16.4856 29.2518 19.0995 28.9944 21.4749 28.0104C23.8503 27.0265 25.8807 25.3603 27.3091 23.2224C28.7376 21.0846 29.5 18.5712 29.5 16C29.4964 12.5533 28.1256 9.24882 25.6884 6.81163C23.2512 4.37445 19.9467 3.00364 16.5 3ZM21.2075 19.2925C21.3004 19.3854 21.3741 19.4957 21.4244 19.6171C21.4747 19.7385 21.5006 19.8686 21.5006 20C21.5006 20.1314 21.4747 20.2615 21.4244 20.3829C21.3741 20.5043 21.3004 20.6146 21.2075 20.7075C21.1146 20.8004 21.0043 20.8741 20.8829 20.9244C20.7615 20.9747 20.6314 21.0006 20.5 21.0006C20.3686 21.0006 20.2385 20.9747 20.1171 20.9244C19.9957 20.8741 19.8854 20.8004 19.7925 20.7075L16.5 17.4137L13.2075 20.7075C13.1146 20.8004 13.0043 20.8741 12.8829 20.9244C12.7615 20.9747 12.6314 21.0006 12.5 21.0006C12.3686 21.0006 12.2385 20.9747 12.1171 20.9244C11.9957 20.8741 11.8854 20.8004 11.7925 20.7075C11.6996 20.6146 11.6259 20.5043 11.5756 20.3829C11.5253 20.2615 11.4994 20.1314 11.4994 20C11.4994 19.8
3100686 11.5253 19.7385 11.5756 19.6171C11.6259 19.4957 11.6996 19.3854 11.7925 19.2925L15.0863 16L11.7925 12.7075C11.6049 12.5199 11.4994 12.2654 11.4994 12C11.4994 11.7346 11.6049 11.4801 11.7925 11.2925C11.9801 11.1049 12.2346 10.9994 12.5 10.9994C12.7654 10.9994 13.0199 11.1049 13.2075 11.2925L16.5 14.5863L19.7925 11.2925C19.8854 11.1996 19.9957 11.1259 20.1171 11.0756C20.2385 11.0253 20.3686 10.9994 20.5 10.9994C20.6314 10.9994 20.7615 11.0253 20.8829 11.0756C21.0043 11.1259 21.1146 11.1996 21.2075 11.2925C21.3004 11.3854 21.3741 11.4957 21.4244 11.6171C21.4747 11.7385 21.5006 11.8686 21.5006 12C21.5006 12.1314 21.4747 12.2615 21.4244 12.3829C21.3741 12.5043 21.3004 12.6146 21.2075 12.7075L17.9138 16L21.2075 19.2925Z" fill="currentColor"/> 3101</svg></div></button><button id="cookie-accept" cta-white="" class="cookie__btn cookie__btn--light"><div class="cookie__btn__text cookie__btn__text--dark">Accept</div><div class="w-embed"><svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"> 3102<path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM21.7075 13.7075L14.7075 20.7075C14.6146 20.8005 14.5043 20.8742 14.3829 20.9246C14.2615 20.9749 14.1314 21.0008 14 21.0008C13.8686 21.0008 13.7385 20.9749 13.6171 20.9246C13.4957 20.8742 13.3854 20.8005 13.2925 20.7075L10.2925 17.7075C10.1049 17.5199 9.99945 17.2654 9.99945 17C9.99945 16.7346 10.1049 16.4801 10.2925 16.2925C10.4801 16.1049 10.7346 15.9994 11 15.9994C11.2654 15.9994 11.5199 16.1049 11.7075 16.2925L14 18.5863L20.2925 12.2925C20.3854 12.1996 20.4957 12.1259 20.6171 12.0756C20.7385 12.0253 20.8686 11.9994 21 11.9994C21.1314 11.9994 21.2615 12.0253 21.3829 12.0756C21.5043 12.1259 21.6146 12.1996 21.7075 12.2925C21.8004 12.3854 21.8741 12.4957 21.9244 12.6171C21.9747 12.7385 22.0006 12.8686 22.0006 13C22.0006 13.1314 21.9747 13.2615 21.9244 13.3829C21.8741 13.5043 21.8004 13.6146 21.7075 13.7075Z" fill="currentColor"/> 3103</svg></div></button></div><div class="hidden w-embed w-script"><style> 3104 .custom-toggle { 3105 position: relative; 3106 width: 2rem; 3107 height: 1.125rem; 3108 border-radius: 0.5rem; 3109 background-color: #fff; 3110 cursor: pointer; 3111 } 3112 3113 .custom-toggle.disabled { 3114 opacity: 0.6; 3115 pointer-events: none; 3116 } 3117 3118 .custom-toggle__thumb { 3119 position: absolute; 3120 width: 0.875rem; 3121 height: 0.875rem; 3122 border-radius: 0.5rem; 3123 background-color: #0f081a; 3124 transition: transform 0.3s ease-in-out; 3125 top: 50%; 3126 left: 0.125rem; 3127 transform: translateY(-50%); 3128 } 3129 3130 .custom-toggle__input { 3131 display: none; 3132 } 3133 3134 .cookie__btn * { 3135 position: relative; 3136 z-index: 3; 3137 } 3138 3139 .cookie__text a { 3140 color: #fff; 3141 } 3142 .cookie__text a:hover { 3143 opacity: 0.7; 3144 } 3145 3146 .cookie-accordion__button { 3147 transition: padding 0.3s ease-in-out; 3148 } 3149</style> 3150
3151<script nonce="aPXsNxecKITnUVboEbCnig==" test-src="http://localhost:3000/dist/external/elecctro/cookie.js"> 3152(() => { function require(key) { return window._custom_vendors__[key]; }; 3153"use strict";(()=>{var d="cookieConsent";window.addEventListener("DOMContentLoaded",()=>{let t={necessary:!0,performance:!0,targeting:!0},r=document.querySelector(".cookie-accordion"),l=r.querySelector(".cookie-accordion__button"),p=l.querySelector(".cookie-accordion__button__icon"),k=r.getBoundingClientRect().height,u=!1,g=(e=!1)=>{u=!1;let c=l.getBoundingClientRect();gsap.to(r,{height:`${c.height}px`,duration:e?0:.3,ease:"power2.inOut"}),gsap.to(p,{rotation:0,duration:e?0:.3,ease:"power2.inOut"})},h=()=>{u=!0,gsap.to(r,{height:`${k}px`,duration:.3,ease:"power2.inOut"}),gsap.to(p,{rotation:180,duration:.3,ease:"power2.inOut"})};g(!0),l.addEventListener("click",()=>{u?g():h()}),r.querySelectorAll(".custom-toggle").forEach(e=>{let o=e.closest("[cookie-group]").getAttribute("cookie-group"),a=s=>{let i=e.querySelector(".custom-toggle__thumb");s.checked=!0,i.style.transform="translateY(-50%) translateX(0.875rem)",t[o]=!0},L=s=>{let i=e.querySelector(".custom-toggle__thumb");s.checked=!1,i.style.transform="translateY(-50%) translateX(0rem)",t[o]=!1};e.addEventListener("click",s=>{let i=e.querySelector("input");i.checked?L(i):a(i)});let v=e.querySelector("input");a(v)});let m=localStorage.getItem(d),n=document.querySelector(".cookie"),y=document.getElementById("cookie-accept"),f=document.getElementById("cookie-decline");if(!n||!y||!f){console.error("Cookie banner, accept button, or decline button not found");return}let E=e=>{if(e==="declined")return;if(t.necessary=!1,t.performance=!1,t.targeting=!1,e.split(",").forEach(o=>{t[o]=!0}),t.performance){let o=document.createElement("script");o.async=!0,o.src="https://www.googletagmanager.com/gtag/js?id=G-BPG7F31N87",document.head.appendChild(o);let a=document.createElement("script");a.textContent=` 3154
vendor: 160 bytes, lines 3154-3158
3154window.dataLayer = window.dataLayer || []; 3155 function gtag(){dataLayer.push(arguments);} 3156 gtag('js', new Date()); 3157 3158 gtag('config', '
3158G-BPG7F31N87
vendor: 4 bytes, line 3158
3158');
3158// Existing Client Tag 3159 gtag('config', 'G-KKPN8ZM7MD'); // Your New Tag 3160 `,document.head.appendChild(a)}t.targeting};m?E(m):(n.style.opacity="1",n.style.pointerEvents="all"),y.addEventListener("click",()=>{let e=Array.from(Object.entries(t)).filter(c=>c[1]).map(c=>`${c[0]}`).join(",");localStorage.setItem(d,e),E(e),n.style.opacity="0",n.style.pointerEvents="none"}),f.addEventListener("click",()=>{localStorage.setItem(d,"declined"),n.style.opacity="0",n.style.pointerEvents="none"})});})(); 3161})(); 3162 3163</script>
3163</div></div><div class="code-embed-36 w-embed w-script">
3163<script nonce="aPXsNxecKITnUVboEbCnig=="> 3164document.addEventListener("DOMContentLoaded", () => { 3165 setTimeout(() => { 3166 // --- Select both dotlottie-wc and normal Webflow Lotties --- 3167 const allLotties = document.querySelectorAll( 3168 '[data-animation-type="lottie"]:not(.header [data-animation-type="lottie"]), [role="listitem"] dotlottie-wc' 3169 ); 3170 3171 allLotties.forEach((el) => { 3172 // === 1. GSAP ScrollTrigger logic === 3173 gsap.to(el, { 3174 scrollTrigger: { 3175 trigger: el, 3176 start: "bottom bottom", 3177 onEnter: () => { 3178 //console.log("[Lottie Scroll] Triggering:", el); 3179 3180 // Handle native Webflow Lottie elements 3181 if (el.matches('[data-animation-type="lottie"]')) { 3182 if (window.Webflow) { 3183 const lottie = window.Webflow.require("lottie").lottie; 3184 const animations = lottie.getRegisteredAnimations(); 3185 animations.forEach((anim) => { 3186 if (anim.wrapper === el) { 3187 anim.goToAndPlay(0); 3188 } 3189 }); 3190 } 3191 3192 // Also trigger any hover-based animations 3193 el.dispatchEvent( 3194 new MouseEvent("mouseenter", { 3195 bubbles: true, 3196 cancelable: true, 3197 view: window, 3198 }) 3199 ); 3200 } 3201 3202 // Handle <dotlottie-wc> elements 3203 if (el.tagName.toLowerCase() === "dotlottie-wc") { 3204 el.dotLottie.play(); 3205 } 3206 }, 3207 }, 3208 }); 3209 3210 // === 2. Hover / Touch interactions for listitems === 3211 const container = el.closest('[role="listitem"]'); 3212 if (container && el.tagName.toLowerCase() === "dotlottie-wc") { 3213 container.addEventListener("mouseenter", () => { 3214 el.dotLottie.play(); 3215 }); 3216 container.addEventListener("touchstart", () => { 3217 el.dotLottie.play(); 3218 }); 3219 } 3220 }); 3221 }, 1000); 3222}); 3223</script>
3223</div>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=68376a06cad09fdde4574f6c" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/js/webflow.schunk.f2efb3c5440a81cf.js" type="text/javascript" integrity="sha384-VK02VJvMib7ytrF5M2joPWNtDQs366FZgEQ5B+Iwnjx0WBnwQXfootyziSYxdrmS" crossorigin="anonymous"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/68376a06cad09fdde4574f6c/js/webflow.39721289.c1db167e795bde72.js" type="text/javascript" integrity="sha384-IRN8VqBpjCWcGW17xERNBmbICsj0XK6AP8UdskrsVn6hh9CMCcLWHS4O06CdyC9b" crossorigin="anonymous"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/gsap/3.15.0/gsap.min.js" type="text/javascript"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/gsap/3.15.0/ScrollTrigger.min.js" type="text/javascript"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/gsap/3.15.0/SplitText.min.js" type="text/javascript"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/gsap/3.15.0/ScrollSmoother.min.js" type="text/javascript"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" src="https://cdn.prod.website-files.com/gsap/3.15.0/MorphSVGPlugin.min.js" type="text/javascript"></script>
3223<script nonce="aPXsNxecKITnUVboEbCnig==" type="text/javascript">gsap.registerPlugin(ScrollTrigger,SplitText,ScrollSmoother,MorphSVGPlugin);</script>
3223<div id="awwwards-embed" data-appearance="horizontal" data-color="#ADAF40" data-type="1" data-category="Product" data-date="Mar. 26" data-link="https://www.awwwards.com/sites/elecctro"> 3224 <p>He sido nominado como <strong>submission.awardCategory.nameHonors </strong>en <a href="https://www.awwwards.com/">Awwwards</a>.</p> 3225</div>
3226<script nonce="aPXsNxecKITnUVboEbCnig==" async src="https://assets.awwwards.com/assets/js/embed_ribbon.js"></script>
3226 3227
3228<script nonce="aPXsNxecKITnUVboEbCnig==" type="module" defer> 3229 window._custom_vendors__ = { 3230 gsap: window.gsap, 3231 }; 3232 3233 (() => { 3234 function require(key) { 3235 return window._custom_vendors__[key]; 3236 } 3237 ('use strict'); 3238 (() => { 3239 (function () { 3240 let r = 0, 3241 e = !1, 3242 t = document.querySelector('[header]'); 3243 if (!t) { 3244 console.warn('Header element not found'); 3245 return; 3246 } 3247 t.style.transform = 'translateY(0)'; 3248 function l() { 3249 let n = window.scrollY; 3250 if (n < 50) { 3251 (e && ((t.style.transform = 'translateY(0)'), (e = !1)), (r = n)); 3252 return; 3253 } 3254 let s = n > r, 3255 o = n < r; 3256 (s && !e ? ((t.style.transform = 'translateY(-20rem)'), (e = !0), window.dispatchEvent(new CustomEvent('scroll-direction'))) : o && e && ((t.style.transform = 'translateY(0)'), (e = !1)), (r = n)); 3257 } 3258 window.addEventListener('scroll', l, { passive: !0 }); 3259 })(); 3260 })(); 3261 })(); 3262</script>
3262 3263<div id="pictures-lightbox"> 3264 <img src="" alt="" /> 3265 <button class="lightbox__close"> 3266 <svg class="lightbox__close__icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19 18" fill="none"> 3267 <path d="M15.1861 13.3805C15.3416 13.536 15.4289 13.7468 15.4289 13.9667C15.4289 14.1866 15.3416 14.3974 15.1861 14.5529C15.0306 14.7084 14.8198 14.7957 14.5999 14.7957C14.38 14.7957 14.1692 14.7084 14.0137 14.5529L9.63507 10.1729L5.25507 14.5515C5.0996 14.707 4.88874 14.7944 4.66887 14.7944C4.449 14.7944 4.23813 14.707 4.08266 14.5515C3.92719 14.3961 3.83984 14.1852 3.83984 13.9653C3.83984 13.7455 3.92719 13.5346 4.08266 13.3791L8.46266 9.00051L4.08404 4.62051C3.92857 4.46504 3.84122 4.25417 3.84122 4.0343C3.84122 3.81443 3.92857 3.60357 4.08404 3.44809C4.23951 3.29262 4.45037 3.20528 4.67024 3.20528C4.89011 3.20528 5.10098 3.29262 5.25645 3.44809L9.63507 7.82809L14.0151 3.4474C14.1705 3.29193 14.3814 3.20459 14.6013 3.20459C14.8211 3.20459 15.032 3.29193 15.1875 3.4474C15.343 3.60288 15.4303 3.81374 15.4303 4.03361C15.4303 4.25348 15.343 4.46435 15.1875 4.61982L10.8075 9.00051L15.1861 13.3805Z" fill="currentColor"></path> 3268 </svg> 3269 </button> 3270</div> 3271<!-- Lightbox --> 3272<div id="pictures-lightbox"> 3273 <img src="" alt="" /> 3274 <button class="lightbox__close"> 3275 <svg class="lightbox__close__icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19 18" fill="none"> 3276 <path d="M15.1861 13.3805C15.3416 13.536 15.4289 13.7468 15.4289 13.9667C15.4289 14.1866 15.3416 14.3974 15.1861 14.5529C15.0306 14.7084 14.8198 14.7957 14.5999 14.7957C14.38 14.7957 14.1692 14.7084 14.0137 14.5529L9.63507 10.1729L5.25507 14.5515C5.0996 14.707 4.88874 14.7944 4.66887 14.7944C4.449 14.7944 4.23813 14.707 4.08266 14.5515C3.92719 14.3961 3.83984 14.1852 3.83984 13.9653C3.83984 13.7455 3.92719 13.5346 4.08266 13.3791L8.46266 9.00051L4.08404 4.62051C3.92857 4.46504 3.84122 4.25417 3.84122 4.0343C3.84122 3.81443 3.92857 3.60357 4.08404 3.44809C4.23951 3.29262 4.45037 3.20528 4.67024 3.20528C4.89011 3.20528 5.10098 3.29262 5.25645 3.44809L9.63507 7.82809L14.0151 3.4474C14.1705 3.29193 14.3814 3.20459 14.6013 3.20459C14.8211 3.20459 15.032 3.29193 15.1875 3.4474C15.343 3.60288 15.4303 3.81374 15.4303 4.03361C15.4303 4.25348 15.343 4.46435 15.1875 4.61982L10.8075 9.00051L15.1861 13.3805Z" fill="currentColor"></path> 3277 </svg> 3278 </button> 3279</div> 3280<style> 3281 #pictures-lightbox { 3282 position: fixed; 3283 top: 0; 3284 left: 0; 3285 width: 100%; 3286 height: 100%; 3287 background-color: rgba(0, 0, 0, 0.5); 3288 opacity: 0; 3289 pointer-events: none; 3290 transition: opacity 0.3s ease-in-out; 3291 z-index: 1000; 3292 } 3293 3294 .lightbox__close { 3295 position: absolute; 3296 top: 1.5rem; 3297 right: 1.5rem; 3298 width: 2rem; 3299 height: 2rem; 3300 display: flex; 3301 background-color: #1d1131; 3302 border-radius: 0.25rem; 3303 justify-content: center; 3304 align-items: center; 3305 } 3306 3307 .lightbox__close__icon { 3308 color: #fff; 3309 width: 1rem; 3310 height: 1rem; 3311 } 3312 3313 #pictures-lightbox img { 3314 width: 100%; 3315 height: 100%; 3316 object-fit: contain; 3317 padding: 1.5rem; 3318 pointer-events: none; 3319 } 3320</style>
3321<script nonce="aPXsNxecKITnUVboEbCnig=="> 3322 document.addEventListener('DOMContentLoaded', () => { 3323 setTimeout(() => { 3324 const lightbox = document.querySelector('#pictures-lightbox'); 3325 const image = lightbox.querySelector('img'); 3326 const closeBtn = lightbox.querySelector('.lightbox__close'); 3327 const header = document.querySelector('[header]'); 3328 const groups = document.querySelectorAll('[data-gsap-slider-item]'); 3329 3330 const open = (img) => { 3331 document.querySelector('.service__gallery')?.scrollIntoView({ behavior: 'smooth' }); 3332 3333 image.src = img.style.backgroundImage.replace(/^url\(["']?(.+?)["']?\)$/, '$1'); 3334 lightbox.style.opacity = '1'; 3335 lightbox.style.pointerEvents = 'auto'; 3336 if (header) header.style.display = 'none'; 3337 }; 3338 3339 const close = () => { 3340 lightbox.style.opacity = '0'; 3341 lightbox.style.pointerEvents = 'none'; 3342 if (header) header.style.display = 'flex'; 3343 }; 3344 3345 Array.from(groups).forEach((group) => { 3346 group.addEventListener('click', () => open(group)); 3347 }); 3348 3349 lightbox.addEventListener('click', (e) => { 3350 if (e.target === lightbox) close(); 3351 }); 3352 3353 document.addEventListener('keydown', (e) => { 3354 if (e.key === 'Escape') close(); 3355 }); 3356 3357 closeBtn.addEventListener('click', () => close()); 3358 }, 1000); 3359 }); 3360</script>
3360<script nonce="aPXsNxecKITnUVboEbCnig=="> 3361document.addEventListener("DOMContentLoaded", () => { 3362// values scroll mobile 3363const ease = "power2.out" 3364const easeFast = "power1.out" 3365 3366const cardsContainer = document.querySelector("[values-cards]"); 3367const scrollWrapper = document.querySelector(".about__values"); 3368 3369function wrapLines(linesArray) { 3370 linesArray.forEach((line) => { 3371 const wrapper = document.createElement("div"); 3372 wrapper.classList.add("line-wrap"); 3373 line.parentNode.insertBefore(wrapper, line); 3374 wrapper.appendChild(line); 3375 }); 3376} 3377 3378//benefits cards animate on scroll 3379// Select all cards 3380const cards = gsap.utils.toArray(".about__culture__card"); 3381 3382// Group them into chunks of 3 3383for (let i = 0; i < cards.length; i += window.innerWidth < 1200 ? 2 : 3) { 3384 const group = cards.slice(i, i + (window.innerWidth < 1200 ? 2 : 3)); 3385 3386 gsap.from(group, { 3387 opacity: 0, 3388 y: 40, 3389 duration: 0.6, 3390 ease: "power2.out", 3391 stagger: 0.2, 3392 scrollTrigger: { 3393 trigger: group[0], // Triggers when the first card of the row appears 3394 start: "top 85%", // Slightly lower to ensure it triggers 3395 once: true, 3396 toggleActions: "play none none reverse", 3397 // markers: true, // UNCOMMENT THIS TO DEBUG 3398 }, 3399 }); 3400} 3401 3402// animation on init 3403 function animateHero() { 3404 const tl = gsap.timeline({ paused: true }); 3405 document.addEventListener("pageEntryAnimationEnded", () => { 3406 tl.play() 3407 }); 3408 3409 const title = document.querySelector("[data-hero='title']"); 3410 const text = document.querySelector("[data-hero='text']"); 3411 const line = document.querySelector(".animation-line"); 3412 const socials = document.querySelectorAll('.socials .social__item-2'); 3413 const sup = document.querySelector('.about__hero__sup-2'); 3414 3415 const splitTitle = new SplitText(title, { type: "lines" }); 3416 wrapLines(splitTitle.lines) 3417 const textTitle = new SplitText(text, { type: "lines" }); 3418 wrapLines(textTitle.lines) 3419 3420 const duration = 1.2; 3421 const ease = "power4.out"; 3422 const stagger = 0.08; 3423 3424 tl.from(splitTitle.lines, { 3425 yPercent: 110, 3426 duration: duration, 3427 stagger: stagger,
3428 ease: ease 3429 }) 3430 3431 .from(socials, { 3432 y: 20, 3433 autoAlpha: 0, 3434 duration: duration, 3435 ease: ease 3436 }, "<0.2") 3437 .from(sup, { 3438 y: 20, 3439 autoAlpha: 0, 3440 duration: duration, 3441 ease: ease 3442 }, "<") 3443 3444 .from(textTitle.lines, { 3445 yPercent: 110, 3446 duration: duration, 3447 stagger: stagger, 3448 ease: ease 3449 }, "<0.1") 3450 .from(line, { 3451 scaleX: 0, 3452 transformOrigin: "left center", 3453 duration: duration * 0.8, 3454 ease: "power3.out" 3455 }, "<") 3456 } 3457 3458//sticky on scrolltrigger 3459if (document.documentElement.clientWidth > 1200) { 3460 document.querySelectorAll("[data-sticky]").forEach((sticky) => { 3461 const wrapper = sticky.parentElement; 3462 const stickyH = document.querySelector("[sticky-wrap]").clientHeight; 3463 const topOffset = sticky.dataset.top 3464 ? `top ${sticky.dataset.top}px` 3465 : "top top"; 3466 3467 ScrollTrigger.create({ 3468 trigger: wrapper, 3469 start: topOffset, 3470 end: `bottom ${+sticky.dataset.top + stickyH}px`, 3471 pin: sticky, 3472 markers: false, 3473 pinSpacing: false, 3474 scrub: false, 3475 }); 3476 }); 3477} 3478 3479//image parallax 3480setTimeout(() => { 3481 const parallaxEls = document.querySelectorAll("[data-parallax]"); 3482 parallaxEls.forEach((el, index) => { 3483 const moveY = el.dataset.parallax; 3484 const start = el.dataset.start; 3485 if (start) gsap.set(el, {yPercent: -start}) 3486 gsap.to(el, { 3487 yPercent: moveY ? -moveY : -20, 3488 //ease: "none", 3489 ease, 3490 scrollTrigger: { 3491 trigger: el, 3492 start: index === 0 ? "top 25% " : "top bottom", 3493 end: "bottom top", 3494 scrub: true, 3495 markers: false, 3496 }, 3497 }); 3498 }); 3499}, 500); 3500 3501// heading mask animation 3502const headings = document.querySelectorAll("[data-text]"); 3503
3504headings.forEach((h) => { 3505 // 1. Split ONLY once 3506 const split = new SplitText(h, { type: "lines" }); 3507 3508 // 2. Manually wrap lines for the mask effect 3509 wrapLines(split.lines) 3510 3511 // 3. getAttribute fix (was previously returning a boolean) 3512 const startOffset = h.getAttribute("start") || "75%"; 3513 3514 const duration = h.dataset.text === "slow" ? 0.8 : 0.6; 3515 const stagger = h.dataset.text === "slow" ? 0.1 : 0; 3516 const delay = h.dataset.text === "slow" ? 0 : 0.05 3517 3518 // 4. Animate the lines (which are now inside the wrappers) 3519 // We can set them immediately since the variable 'split' is still valid 3520 gsap.set(split.lines, { yPercent: 120 }); 3521 3522 const headingTl = gsap.to( // changed from fromTo to 'to' since we set values above 3523 split.lines, 3524 { 3525 yPercent: 0, 3526 ease: h.dataset.text === "slow" ? ease : easeFast, 3527 duration, 3528 stagger, 3529 scrollTrigger: { 3530 trigger: h, 3531 start: `top ${startOffset}`, 3532 end: "top 0%", 3533 markers: false, 3534 scrub: false, 3535 toggleActions: "play none none reverse", // Optional: if you want it to replay 3536 }, 3537 }, delay 3538 ); 3539}); 3540 3541const fadeUps = document.querySelectorAll("[data-hero='fadeUp']"); 3542 3543fadeUps.forEach(fadeUp => { 3544 const revealPos = fadeUp.dataset.revealPos || '75%'; 3545 const delay = fadeUp.dataset.delay ? parseFloat(fadeUp.dataset.delay) : 0; 3546 3547 gsap.from(fadeUp, { 3548 scrollTrigger: { 3549 trigger: fadeUp, 3550 start: `top ${revealPos}`, 3551 toggleActions: "play none none reverse", 3552 }, 3553 y: 50, 3554 opacity: 0, 3555 duration: 1, 3556 ease: "power2.out", 3557 delay: delay 3558 }); 3559}); 3560 3561animateHero() 3562}) 3563</script>
3563</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.