*,*::before,*::after{box-sizing:border-box}html,body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol{margin:0;padding:0}html,body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;background:#fff;color:#111}img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}ul,ol,ul[role="list"],ol[role="list"]{list-style:none}input,button,textarea,select{font:inherit;color:inherit;background:transparent;border:none;outline:none}a{color:inherit;text-decoration:none}table{border-collapse:collapse;border-spacing:0}button{cursor:pointer;background:transparent}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

::-webkit-scrollbar {  display: none;}

html { scroll-behavior: smooth; }
body {background: #030607;color: #fff; font-family: "Jost", sans-serif; font-weight:400; font-size:20px; scrollbar-width: none; -ms-overflow-style: none;}
#wrapper { scroll-behavior: smooth; }
#loadmask {position: fixed;top:0;left: 0;z-index: 1000;height: 100%;background: #1B1E1F;width: 100%;opacity: 1;transition: opacity 1s ease;}
body.body-loaded #loadmask  {opacity: 0;}

section {position: relative; }
.container {margin: 0 auto;width: 90%;}

h1 { font-weight:400;line-height: 1em;}
h2 {font-size: 70px;font-weight:400;line-height: 1em;}
h3 { font-weight:400;line-height: 1em;}
p {margin-bottom: 25px;}
* > p:last-child { margin-bottom:0; }
.btn-primary {background: #D72630;color: #fff;border-radius: 25px;padding: 10px 20px;display: inline-block;font-weight: 500;font-size: 20px;transition: all 0.3s ease;text-align: center;/* display: flex; */}
.btn-primary:hover {background: #fff;color: #D72630; }
.btn-white {background: #fff;color: #000;  }
.btn-white:hover {background: #D72630;color: #fff; }
.highlight { color:#D72630; }

a:not(.btn-primary, #header .nav a):hover {  color:#D72630; text-decoration:underline; }

.slick-dots {display: flex;align-items: center;justify-content: center;gap: 10px;}
.slick-dots li { }
.slick-dots li button {padding: 0;width: 20px;height: 20px;border-radius: 50%;text-indent: -999em;background: #fff;transition: background 0.3s ease;}
.slick-dots li.slick-active button { background:#d72630; }

#wrapper .form .hsfc-Step__Content {padding: 3vh 0 0;}
#wrapper .form .hsfc-FieldLabel {font-family: "Jost", sans-serif; font-weight:400; }
#wrapper .form .hsfc-TextInput {border: none;border-bottom: 1px solid #707070;box-shadow: none;}
#wrapper .form .hsfc-TextInput:focus {border-bottom: 1px solid #d72630;}
#wrapper .form .hsfc-Button{border-radius: 30px;}

#header {position: fixed;top: 0;left: 0;width: 100%;z-index: 100;transition: all 0.3s ease;}
#header .inner {display: flex;align-items: center;justify-content: space-between;border-bottom: 1px solid #fff;padding: 2vh 0;}
#header .logo {max-width: 330px;transition: all 0.3s ease;}
#header .logo .white { }
#header .logo .black {display: none;}
#header .nav { }
#header .nav ul {display: flex;align-items: center;gap: 25px;}
#header .nav ul li { }
#header .nav ul li a {color: #fff;transition: color 0.3s ease;font-weight: 400;}
#header .nav ul li a:hover { color: #D72630 }
#header .nav ul li.cta { }
#header:hover { background:#fff; color:#000;}
#header:hover .nav ul li:not(.cta) a {color: #D72630;}
#header:hover .nav ul li:not(.cta) a:hover { color:#000; }
#header:hover .nav ul li.cta a:hover { background:#000; color:#fff; }
#header:hover .logo .white { display:none; }
#header:hover .logo .black { display:block; }

#header.scrolled-header  {background: #fff;position: fixed;color: #000; }
#header.scrolled-header .logo {max-width: 240px;}
#header.scrolled-header .logo .white { display:none; }
#header.scrolled-header .logo .black { display:block; }
#header.scrolled-header .nav ul li:not(.cta) a {color: #D72630;}
#header.scrolled-header .nav ul li:not(.cta) a:hover { color:#000; }
#header.scrolled-header .nav ul li.cta a:hover { background:#000; color:#fff; }

#header.black {background: #000; color: #fff; }
#header.black .logo .white { display:block; }
#header.black .logo .black { display:none; }
#header.black .nav ul li:not(.cta) a {color: #fff;}
#header.black .nav ul li:not(.cta) a:hover { color:#D72630; }
#header.black .nav ul li.cta a:hover { background:#fff; color:#000; }


#intro {overflow: hidden;width: 100%;aspect-ratio: 2.0779220779220777 / 1;position: relative;}
#intro .hero-text {max-width: 980px;position: relative;z-index: 20;}
#intro .hero-text h1 {font-size: 90px;margin: 0 0 30px;opacity: 0;transition: all 0.3s ease;transform: translateY(50%);}
#intro .hero-text .cta {transition: all 1.3s ease 2s;transform: translateY(100%);opacity: 0;}
#intro::before {content:"";top: 0;left: 0;position: absolute;background: #000;width: 100%;height: 100%;z-index: 15;background: linear-gradient(90deg,rgba(0, 0, 0, 1) 0%, rgba(95, 95, 95, 0) 41%, rgba(255, 255, 255, 0) 100%);}
#intro::after {content:"";top: 0;left: 0;position: absolute;background: #000;width: 100%;height: 100%;z-index: 15;background: linear-gradient(180deg,rgba(0, 0, 0, 1) 0%, rgba(95, 95, 95, 0) 41%, rgba(255, 255, 255, 0) 100%);}


body.body-loaded #intro .hero-text h1 {opacity: 1;transform: translateY(0);}
body.body-loaded #intro .hero-text .cta {opacity: 1;transform: translateY(0);}

#intro .hero-text #hero-rotating-text {overflow: hidden;height: 100px;transform-origin: left;}
#intro .hero-text #hero-rotating-text ul {  margin: 0;  padding: 0;  list-style: none;  }
#intro .hero-text #hero-rotating-text ul.animate { animation: heroScrollingWordsUp 14s linear infinite; }
#intro .hero-text #hero-rotating-text ul li {  font-size: 100px;  font-weight: 500;  color: #d72630;  line-height: 100px;  height: 100px;  white-space: nowrap;   overflow: hidden;}

@keyframes heroScrollingWordsUp {
  0%, 20% { transform: translateY(0); }
  21%, 30% { transform: translateY(-100px); }
  31%, 50% { transform: translateY(-100px); }
  51%, 60% { transform: translateY(-200px); }
  61%, 80% { transform: translateY(-200px); }
  81%, 90% { transform: translateY(-300px); }
  91%, 100% { transform: translateY(-300px); }
}

#intro .bg-video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;transform: rotate(10deg) translate(-5%, 60%) scale(1.4);transition: transform 1.3s ease 0s;display: flex;align-items: center;}
#intro .bg-video .bg-video-wrapper {height: 100%;width: 100%;/* object-fit: cover; */max-height: 100%;/* object-position: center; *//* object-fit: contain; */}
#intro .bg-video .bg-video-wrapper video {width: 100%;height: 100%;object-fit: cover;object-position: center;}
body.body-loaded #intro .bg-video {   transform: rotate(0deg) translate(0%, 0%) scale(1); }

#recognition {background: #D72630;padding: 15px 0;}
#recognition .recognition-badges {max-width: 1200px;margin: 0 auto;padding: 10px 0;}
#recognition .recognition-badges ul {display: flex;align-items: center;justify-content: space-between;}
#recognition .recognition-badges ul li { }
#recognition .recognition-badges ul li img {max-height: 80px;max-width: 240px;}

#about {padding: 10vh 0;}
#about .copy {text-align: center;margin: 0 auto;max-width: 940px;}
#about .copy h2 {margin: 0 0 25px;}
#about .video {padding: 5vh 0 0;margin: 0 auto;max-width: 1400px;}

#products {background: #1B1E1F;padding: 10vh 0;}
#products .headline {text-align: center;}
#products .headline h2 {padding: 3vh 0;}
#products .product-cards {padding: 7vh 0 0 5vw;/* overflow-x: scroll; */}
#products .product-cards .stage {position: relative;height: 600px;overflow-y: hidden;overflow-x: auto;white-space: nowrap;/* overflow-x: scroll; */}
#products .product-cards .track {display: flex;transition: left 1s ease;gap: 15px;position: relative;top: 0; width: 10000px;display: inline-flex;/* overflow-x: scroll; */}
#products .product-cards .product {background: #353738;border-radius: 15px;height: 600px;width: 25vw;/;aspect-ratio: 1 / 1.81;position: relative;transition: all 0.3s ease;}
#products .product-cards .product .product-inner {padding: 20px;display: flex;flex-flow: column;justify-content: space-between;align-items: flex-start;height: 100%;}
#products .product-cards .product .name {font-size: 31px;line-height: 1.2em;white-space: normal;}
#products .product-cards .product .image {/* flex: 1; */max-height: 80%;overflow: hidden;width: 100%;}
#products .product-cards .product .image img {/* display: inline; */object-fit: contain;height: 100%;width: 100%;object-position: center;}
#products .product-cards .product .cta {width: 100%;}
#products .product-cards .product .cta a {display: flex;align-items: center;justify-content: center;}
#products .product-cards .product .cta a::before {content:"";position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
#products .product-cards .product .cta a i{transform: rotate(-45deg);color: #000;width: 0; margin: 0 0 0 6px;transition: all 0.3s ease;opacity: 0;}
#products .product-cards .product:hover { background: #D72630;}
#products .product-cards .product:hover .cta a {background: #fff;color: #D72630;}
#products .product-cards .product:hover .cta a i { width:26px; opacity:1; }
body.product-cards-in-viewport {height: 100vh;overflow: hidden;}



#how-it-works {padding: 8vh 0;overflow: visible;}
#how-it-works .headline {text-align: left;max-width: 900px;margin: 0 0 8vh; }
#how-it-works .headline h3 { margin:0 0 15px;}
#how-it-works .headline h2 {position:relative;margin: 0 0 15px;}
#how-it-works .headline h2::before {content:"";background: #D72630;width: 1000px;display: block;height: 100%;position: absolute;top: 0;right: 103%;}
#how-it-works .works-cards { }
#how-it-works .works-cards .works-cards-inner {}
#how-it-works .works-cards .item {background:#2F3132;position: sticky;margin: 0 0 50px;border-radius: 40px;    top: 1vh; transition: opacity 0.2s linear, transform 0.2s linear;}
#how-it-works .works-cards .item .item-inner {display: flex;padding: 50px;align-items: center;gap: 25px;}
#how-it-works .works-cards .item .text {flex: 1;}
#how-it-works .works-cards .item .text h3 {font-size: 40px;margin: 0 0 25px;}
#how-it-works .works-cards .item .text p { }
#how-it-works .works-cards .item .text .cta { }
#how-it-works .works-cards .item .image {flex: 1; }
#how-it-works .works-cards .item .image img {width: 100%;display: block;border-radius: 25px;}
#how-it-works .works-cards .item .image .video {width: auto;height: auto;aspect-ratio: 1.77777 / 1;display: flex;}
#how-it-works .works-cards .item .image .video video { width: 100%;}
#how-it-works .works-cards .slick-slider .item {position: static;margin: 0;opacity: 1!important;transform: scale(1)!important;margin:0 30px;border: none; height: inherit !important;}
#how-it-works .works-cards .slick-slider .slick-list {margin: 0 -30px 30px;}
#how-it-works .works-cards .slick-slider .slick-track {display: flex !important; }


#industries {padding: 8vh 0;}
#industries .headline {text-align: left;max-width: 900px;margin: 0 0 8vh; }
#industries .headline h3 { margin:0 0 15px;}
#industries .headline h2 {position:relative;margin: 0 0 15px;}
#industries .headline h2::before {content:"";background: #D72630;width: 1000px;display: block;height: 100%;position: absolute;top: 0;right: 103%;}
#industries .industries-slider { }
#industries .industries-slider .industries-slider-inner {display: flex;align-items: stretch;gap: 4vw; overflow: hidden;}
#industries .industries-slider .image {flex: 1; }
#industries .industries-slider .image .image-inner {position: sticky;height: 100%;max-height: 90vh;top: 5vh;}
#industries .industries-slider .image img {position: absolute;top: 0;left: 0; opacity: 0;    border-radius: 30px;transition: opacity 0.5s ease;}
#industries .industries-slider .image img.active {opacity: 1;}
#industries .industries-slider .image .fitter {height: 100%;background: #f00;width: 100%;opacity: 0;}
#industries .industries-slider .items {flex: 1; max-width: 100%;}
#industries .industries-slider .items .items-inner {padding-bottom: 40vh;}
#industries .industries-slider .items .item {padding: 5vh 0;opacity: 0.5;border-bottom: 1px solid #fff;transition: opacity 1s ease;}
#industries .industries-slider .items .item:last-child { border:none; }
#industries .industries-slider .items .item h3 {font-size: 40px;margin: 0 0 25px;}
#industries .industries-slider .items .item p { }
#industries .industries-slider .items .item img {display: none;}
#industries .industries-slider .items .item.active { opacity:1; }

#industries .industries-slider .items .slick-slider .item {margin:0 30px;border: none;}
#industries .industries-slider .items .slick-slider .slick-list {margin: 0 -30px;}






#benefits {padding: 10vh 0;background: #E5E5E5;color: #000; }
#benefits .headline {text-align: left;max-width: 660px;margin: 0 0 8vh;}
#benefits .headline h3 { margin:0 0 15px;}
#benefits .headline h2 {position:relative;margin: 0 0 15px;}
#benefits .headline h2::before {content:"";background: #D72630;width: 1000px;display: block;height: 100%;position: absolute;top: 0;right: 103%;}
#benefits .benefits-items { }
#benefits .benefits-items-inner { }
#benefits .benefits-items .item {margin: 0 0 6vh;background: #fff;border-radius: 25px;position: sticky;top: 1vh;transition: opacity 0.2s linear, transform 0.2s linear;}
#benefits .benefits-items .item .item-inner {display: flex;align-items: stretch; overflow: hidden;gap: 1vw;}
#benefits .benefits-items .item .content {flex: 1;display: flex;align-items: center; position: relative;z-index: 10;}
#benefits .benefits-items .item .content .content-inner {padding: 75px;}
#benefits .benefits-items .item .content h3 {font-size: 50px;margin: 0 0 15px;font-weight: 400;}
#benefits .benefits-items .item .content h3 .highlight { display:block; }
#benefits .benefits-items .item .content p {font-weight: 400;font-size: 24px;}
#benefits .benefits-items .item .content .cta a {color: #D72630;font-weight: 600;font-size: 22px;}
#benefits .benefits-items .item .image {flex: 1;position: relative; z-index: 5;}
#benefits .benefits-items .item .image img {border-radius: 25px;object-fit: cover;height: 100%;width: 100%;}
#benefits .benefits-items .item:nth-child(even) .image { }
#benefits .benefits-items .item.el-above-half-window .image { transform:translateX(0); }
#benefits .slick-slider .item  {margin:0 30px;border: none; height: inherit !important;}
#benefits .slick-slider .slick-list {margin: 0 -30px 30px;}
#benefits .slick-slider .slick-track {display: flex !important; }



#mapstats {padding: 10vh 0;}
#mapstats .headline {text-align: center;}
#mapstats .headline h2 { }
#mapstats .headline h2 .highlight { display:block; }
#mapstats .stats {position: relative;}
#mapstats .stats .map-wrapper { }
#mapstats .stats .map-wrapper .map-wrapper-inner {position: relative;}
#mapstats .stats .map {height: 50vh;top: 0;left: 0;width: 100%;background-image: url(../img/world-map2.png);background-repeat: no-repeat;background-size: 100%;box-shadow: 0 0 150px 50px #000 inset;background-position: top left;}
#mapstats .stats .dots-wrapper {position: absolute;height: 100%;width: 100%;top: 0;left: 0;margin: 0;/* padding: 0 10vw; */}
#mapstats .stats .dots-wrapper .dots-inner {position: relative;width: 100%;height: 100%;}

@keyframes mapstats_pin {
  0% {   box-shadow: 0 0 0px 0px rgba(192,33,42, 0.75) }
  100% {  box-shadow: 0 0 0px 20px rgba(192,33,42, 0)  }
} 

#mapstats .stats .dots-wrapper .dot {background: rgb(192 33 42);width: 30px;height: 30px;border-radius: 100%;position: relative; transition: all 0.2s ease;box-shadow: 0 0 0px 7px #ffffff1a;animation: mapstats_pin 2s infinite;z-index: 50;position: absolute;}

#mapstats .stats .stat-items {display: flex;align-items: flex-start;justify-content: space-around;padding: 5vh 0 8vh;position: relative;z-index: 10;max-width: 1200px;margin: 0 auto;}
#mapstats .stats .stat-items .item {text-align: center;}
#mapstats .stats .stat-items .item .stat {color:#D72630;font-size: 70px;font-weight:400;}
#mapstats .stats .stat-items .item p {max-width: 200px;margin: 0 auto;line-height: 1.35em;}
#mapstats .stats .info {text-align: center; position: relative;top: -25vh;font-size: 28px;}




#contact {background: #D72630; padding: 25vh 0;}
#contact .inner {display: flex;align-items: center;justify-content: space-between;}
#contact h2 {color: #000;font-size: 150px;}
#contact h2 .highlight {color:#fff;display: block;}
#contact .contact-form-opener {background: #fff;height: 190px;width: 190px;border-radius: 50%;display: flex;align-items: center;justify-content: center;transition: all 0.3s ease; }
#contact .contact-form-opener path {transition: all 0.3s ease; }
#contact .contact-form-opener:hover { background:#000;  }
#contact .contact-form-opener:hover path { stroke:#fff;}



#contact-modal {position: fixed;top: 105vh;left: 0;z-index: 200;width: 100%;height: 100vh;transition: top 0.5s cubic-bezier(0.65, 0.05, 0.36, 1);background: #fff;color: #000;/* border-top-left-radius: 35px; *//* border-top-right-radius: 35px; */}
#contact-modal .contact-modal-inner {height: 100%;overflow-y: scroll;position: relative;display: flex;align-items: flex-start;justify-content: space-between;gap: 10vw;padding: 10vh 5vw 5vh;}
#contact-modal .contact-modal-closer {position: absolute;top: 10px;right: 10px;background: #000;z-index: 10;cursor: pointer;height: 60px;width: 60px;display: flex;align-items: center;justify-content: center;border-radius: 50%;font-size: 30px;color: #fff;transition: all 0.3s ease;}
#contact-modal .contact-modal-closer:hover { background: #D72630;}
#contact-modal .col-text {font-size: 18px;flex: 1;}
#contact-modal .col-text h2 {margin: 0 0 35px;}
#contact-modal .col-text a {    font-weight: 500;color: #D72630; }
#contact-modal .col-form {flex: 2;}
#contact-modal .col-form  h4 {font-size: 40px;font-weight: 300;}


#contact-modal.active {top: 0;}
body:has(#contact-modal.active) {height: 100%;overflow: hidden;}


#download-modal {position: fixed;top: 105vh;left: 0;z-index: 200;width: 100%;height: 100vh;transition: top 0.5s cubic-bezier(0.65, 0.05, 0.36, 1);background: #fff;color: #000;/* border-top-left-radius: 35px; *//* border-top-right-radius: 35px; */}
#download-modal .download-modal-inner {height: 100%;overflow-y: scroll;position: relative;display: flex;align-items: flex-start;justify-content: space-between;gap: 10vw;padding: 10vh 5vw 5vh;}
#download-modal .download-modal-closer {position: absolute;top: 10px;right: 10px;background: #000;z-index: 10;cursor: pointer;height: 60px;width: 60px;display: flex;align-items: center;justify-content: center;border-radius: 50%;font-size: 30px;color: #fff;transition: all 0.3s ease;}
#download-modal .download-modal-closer:hover { background: #D72630;}
#download-modal .col-text {font-size: 18px;flex: 1;}
#download-modal .col-text h2 {margin: 0 0 35px;}
#download-modal .col-text a {    font-weight: 500;color: #D72630; }
#download-modal .col-form {flex: 2;}
#download-modal .col-form  h4 {font-size: 40px;font-weight: 300;}
#download-modal.active {top: 0;}
body:has(#download-modal.active) {height: 100%;overflow: hidden;}


#footer {background: #fff;padding: 5vh 0;color: #030607;font-weight: 300;}
#footer .inner {display: flex;align-items: center;justify-content: space-between;}
#footer .logo-col { }
#footer .logo {max-width: 330px;margin: 0 0 15px;}
#footer .meta-col {text-align: right;display: flex;flex-flow: column;align-items: flex-end;}
#footer .scroll-to-top {display: block;width: 50px;height: 50px;background: #000;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin: 0 0 25px; transition: all 0.3s ease;}
#footer .scroll-to-top:hover { background: #D72630;}


#modal-backdrop {position: fixed;top:110vh;height: 100vh;width:100%;background: #000000c7;opacity: 0;transition: opacity 0.3s ease;left: 0;z-index: 150;}
.product-modal {position: fixed;top: 105vh;left: 0;z-index: 150;width: 100%;height: 100vh;transition: top 0.5s cubic-bezier(0.65, 0.05, 0.36, 1);}
.product-modal .product-modal-inner {height: 100%;overflow-y: scroll;position: relative;}
.product-modal .panel { top: 5vh;}
.product-modal .panel .panel-inner {padding: 25px 3vw;}
.product-modal .product-modal-closer {position: absolute;top: 10px;right: 10px;background: #D72630;z-index: 10;cursor: pointer;height: 60px;width: 60px;display: flex;align-items: center;justify-content: center;border-radius: 50%;font-size: 30px;transition: all 0.3s ease;}
.product-modal .product-modal-closer:hover { background: #000;}

.product-modal .panel-a {background: #fff;color: #000; padding: 5vh 0 0; }
.product-modal .panel-a .panel-inner {display: flex;gap: 50px;}
.product-modal .panel-a .images {flex: 1; max-width: 50%;}
.product-modal .panel-a .images .image-stage {}
.product-modal .panel-a .images .image-slider {margin-bottom: 120px;}
.product-modal .panel-a .images .image-slider .slick-list { margin:0 -15px; }
.product-modal .panel-a .images .image-slider .item { aspect-ratio:5 / 3; border-radius: 30px;overflow: hidden; margin:0 15px;}
.product-modal .panel-a .images .image-slider .image img { object-fit: cover;height: 100%; object-position: center; width: 100%;  }
.product-modal .panel-a .images .image-slider .video video { object-fit: cover;height: 100%; object-position: center; width: 100%;  }

.product-modal .panel-a .images .image-slider .slick-arrow {position: absolute;top: 50%;width: 65px;height: 65px;background: #0000005c;z-index: 1;color: #fff;border-radius: 50%;transform: translateY(-50%);font-size: 30px;transition: all 0.3s ease;/* transform-origin: top; */}
.product-modal .panel-a .images .image-slider .slick-arrow:hover { background:#d72630;    }
.product-modal .panel-a .images .image-slider .slick-arrow.slick-prev {left: 10px;}
.product-modal .panel-a .images .image-slider .slick-arrow.slick-next {right: 10px;}
.product-modal .panel-a .images .image-slider .slick-dots {display: flex;align-items: center;justify-content: center; gap: 0.5vw;padding: 2vh 0;position: absolute;width: 100%;}
.product-modal .panel-a .images .image-slider .slick-dots li {width: 100px;height: 80px;}
.product-modal .panel-a .images .image-slider .slick-dots li button {display: block;height: 100%;width: 100%;background-size: cover;border-radius: 15px;border: 3px solid #fff;text-indent: -999em;background-repeat: no-repeat;background-position: center;}
.product-modal .panel-a .images .image-slider .slick-dots li.slick-active button {border-color: #d72630;}

.product-modal .panel-a .content {flex: 1;font-weight: 300;}
.product-modal .panel-a .content .title {font-size: 54px;font-weight: 400;margin: 0 0 3vh;}
.product-modal .panel-a .content .desc {font-weight: 400;font-size: 24px;margin: 0 0 3vh;}
.product-modal .panel-a .content .cta {margin: 0 0 4vh;}
.product-modal .panel-a .content .cta a:hover {background: #000;color: #fff;}
.product-modal .panel-a .content .accord {border-top: 1px solid #707070;}
.product-modal .panel-a .content .accord .item {border-bottom: 1px solid #707070;}
.product-modal .panel-a .content .accord .item .item-header {padding: 15px 0;display: flex;align-items: center;justify-content: space-between;cursor: pointer;}
.product-modal .panel-a .content .accord .item .item-header h4 {text-transform: uppercase;font-weight: 400;font-size: 24px;letter-spacing: 1px;}
.product-modal .panel-a .content .accord .item .item-header .toggler {background: #D72630;color: #fff;height: 30px;width: 30px;display: flex;align-items: center;justify-content: center;border-radius: 50%;cursor: pointer;pointer-events: none;}
.product-modal .panel-a .content .accord .item .item-header .toggler::after {content:'\f067';display: inline-block;transition: all 0.2s ease;font-family: "Font Awesome 5 Free";font-weight: 700;font-style: normal;margin: 0;text-decoration:none; }
.product-modal .panel-a .content .accord .item .item-content {display: grid;grid-template-rows: 0fr;overflow: hidden; font-weight: 400;transition: all 0.5s ease;}
.product-modal .panel-a .content .accord .item .item-content ul {list-style: disc outside;padding: 0 0 0 25px;}
.product-modal .panel-a .content .accord .item .item-content .item-content-inner {overflow: hidden; }
.product-modal .panel-a .content .accord .item.active .item-content {margin: 0 0 15px;grid-template-rows: 1fr;}
.product-modal .panel-a .content .accord .item.active .item-header .toggler::after { content:'\f068';}

.product-modal .panel-b {background: #1B1E1F;color: #fff;padding: 3vh 0; top: 3vh;}
.product-modal .panel-b .video-wrapper { }
.product-modal .panel-b .video-wrapper .video {display: flex;max-height: 80vh;aspect-ratio: 1.7777777777777777 / 1;justify-content: center;margin: 0 auto;position: relative;z-index: 1;}
.product-modal .panel-b .highlights {display: flex;padding: 80px 0 3vh;}
.product-modal .panel-b .highlights .col-media {flex: 1;max-width: 50%;}
.product-modal .panel-b .highlights .highlights-media { }
.product-modal .panel-b .highlights .highlights-media .highlights-media-circle-outer { width: 460px;height: 460px;border-radius: 100%;position: relative;text-align: center; margin: 0 auto;z-index: 2; transition: all 0.3s ease;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-circle {background: #2F3132;width: 450px;height: 450px;border-radius: 100%;position: relative;top: 5px;left: 5px;overflow: hidden;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-slider  {width: 450px;height: 450px;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-slider .item {width: 450px;height: 450px;padding: 10px;position: relative;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-slider .item .item-image {height: 100%;overflow: hidden;padding: 25px;border-radius: 100%;width: 100%;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-slider .item .item-image img {object-fit: contain;width: 100%;height: 100%;}
.product-modal .panel-b .highlights .highlights-media .highlights-media-slider .item .item-count {position: absolute;width: 100px;height: 100px;border-radius: 50%;background: #D72630;top: 0;left: 0;display: none;z-index: 10;}

.product-modal .panel-b .highlights .col-text {flex:1;max-width: 50%;display: flex;/* align-items: center; */flex-flow: column;justify-content: center;}
.product-modal .panel-b .highlights .col-text .headline h3 {font-size: 54px;margin: 0 0 2vh;font-weight: 400;}
.product-modal .panel-b .highlights .highlights-content { }
.product-modal .panel-b .highlights .highlights-content-slider .slick-list {margin: 0 -30px;}
.product-modal .panel-b .highlights .highlights-content .item {margin: 0 30px;}
.product-modal .panel-b .highlights .highlights-content .item .item-content { }
.product-modal .panel-b .highlights .highlights-content .item .item-content h4 {font-size: 38px;font-weight: 400;}
.product-modal .panel-b .highlights .highlights-content .item .item-content p {color: #9A9B9B;}
.product-modal .panel-b .highlights .highlights-content-slider-arrows {display: flex;align-items: center;gap: 10px;padding: 2vh 0 0;}
.product-modal .panel-b .highlights .highlights-content-slider-arrows button {display: flex;background: #353738;width: 60px;height: 60px;align-items: center;justify-content: center;border-radius: 50%;transition: all 0.3s ease;}
.product-modal .panel-b .highlights .highlights-content-slider-arrows button:hover {background: #D72630; }

.product-modal .panel-c {background: #353738;color: #fff;padding: 3vh 0;padding-bottom:calc(3vh + 40px); top: 6vh;}
.product-modal .panel-c h3 {font-size: 50px;margin: 0 0 3vh;}
.product-modal .panel-c .faq {border-top: 1px solid #707070;}
.product-modal .panel-c .faq .item {border-bottom: 1px solid #707070;}
.product-modal .panel-c .faq .item .item-header {padding: 25px 0;display: flex;align-items: center;justify-content: space-between;cursor: pointer;gap: 15px;}
.product-modal .panel-c .faq .item .item-header h4  {font-weight: 400;font-size: 24px;l;/* letter-spacing: 1px; */flex: 1;}
.product-modal .panel-c .faq .item .item-header .toggler {background: #D72630;color: #fff;height: 30px;width: 30px;display: flex;align-items: center;justify-content: center;border-radius: 50%;cursor: pointer;line-height: 1em;display: flex;}
.product-modal .panel-c .faq .item .item-header .toggler::after {content:'\f067';display: inline-block;transition: all 0.2s ease;font-family: "Font Awesome 5 Free";font-weight: 700;font-style: normal;margin: 0;text-decoration:none; }
.product-modal .panel-c .faq .item .item-content {display: grid;transition: all 0.5s ease;grid-template-rows: 0fr; overflow: hidden;}
.product-modal .panel-c .faq .item .item-content ul {list-style: disc outside;padding: 0 0 0 25px;}
.product-modal .panel-c .faq .item .item-content ul li { }
.product-modal .panel-c .faq .item .item-content .item-content-inner { overflow: hidden;}
.product-modal .panel-c .faq .item.active .item-content { margin: 0 0 15px; grid-template-rows: 1fr; }
.product-modal .panel-c .faq .item.active .item-header .toggler::after { content:'\f068';}

.product-modal .panel-d {background: #F4F4F5;color: #000;padding: 8vh 0;border-top-left-radius: 35px;border-top-right-radius: 35px;margin-top: -35px;/* z-index: 4; */top: 9vh;}
.product-modal .panel-d h3 {font-size: 90px;margin: 0 0 7vh;}
.product-modal .panel-d .form {background: #fff;min-height: 300px;border-radius: 35px;padding: 30px 4vw;}


[class*="modal"].active {top: 0;}
body:has([class*="modal"].active) {height: 100%;overflow: hidden;}
body:has([class*="modal"].active) #modal-backdrop { opacity:1; top:0;}

.progress-ring-wrapper {position: absolute;top: 0;left: 0;width: 100%;height: 100%;transform: rotate(-92deg);}
.progress-ring-wrapper input {display: none;}
.progress-ring-wrapper svg circle {     transition: stroke-dashoffset 1s ease; }

.progress-index-counter {width: 450px; height: 450px;transition:all 1s ease;  position: absolute; top: 0; left: 0;}
.progress-index-counter-circle {background: #D72630;width: 80px;height: 80px;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 24px;position: relative;left: 40%;top: -10%;}
.progress-index-counter .text { transition:all 1s ease;  }


@media screen and (max-width:1200px){

  [data-hsfc-id=Renderer] .hsfc-Row {grid-template-columns: 1fr!important;}
  
  #header  .logo {width: 50vw;}
  #header .nav li:not(.cta) { display:none; }

  #intro {aspect-ratio:auto;padding-bottom: 5vh;margin-top: -5vh;}
  #intro .bg-video .bg-video-wrapper {/* transform: scale(2); *//* margin-top: 5vh; *//* transform-origin: top; */}
  #intro .hero-text h1 {font-size: 70px;}


#intro .hero-text #hero-rotating-text {
  overflow: hidden;
  height: 70px; /* one line height */
}

#intro .hero-text #hero-rotating-text ul li {
  font-size: 70px;
  font-weight: 500;
  color: #d72630;
  line-height: 70px;
  height: 70px;
  white-space: nowrap;
  overflow: hidden;
}

@keyframes heroScrollingWordsUp {
  0%, 20% { transform: translateY(0); }
  21%, 30% { transform: translateY(-70px); }
  31%, 50% { transform: translateY(-70px); }
  51%, 60% { transform: translateY(-140px); }
  61%, 80% { transform: translateY(-140px); }
  81%, 90% { transform: translateY(-210px); }
  91%, 100% { transform: translateY(-210px); }
}

#intro .hero-text #hero-rotating-text ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

  #recognition .recognition-badges ul   {grid-gap: 30px;text-align: center;display: grid;grid-template-columns: 1fr 1fr;/* justify-content: center; */}
  #recognition .recognition-badges ul li {display:flex;align-items: center;justify-content: center;}
  #recognition .recognition-badges ul li img {max-width: 80%;max-height: 10vh;}

  #products .product-cards .track {width: auto!important;padding-right: 5vw;left: 0!important;}
  #products .product-cards .product {width: 40vw;}

  #how-it-works .works-cards .item {  position: static;margin: 0 0 25px; }
  #how-it-works .works-cards .item .item-inner {flex-flow: column-reverse;}


  #industries .industries-slider .image { display:none; }
  #industries .industries-slider .items .item { opacity:1; }
  #industries .industries-slider .items .item img {display:block;border-radius: 25px;}
  #industries .industries-slider .items .items-inner { padding-bottom:0; }

  #benefits .headline h2 {font-size: 50px;}
  #benefits .benefits-items .item {background:#fff;border-radius: 25px;margin: 0 0 25px;position: static; }
  #benefits .benefits-items .item .content { background:none; border-radius:0;}
  #benefits .benefits-items .item .content .content-inner {padding: 40px;}
  #benefits .benefits-items .item .item-inner {flex-flow: column-reverse;align-items: center;}
  #benefits .benefits-items .item .item-inner:has(.image + .content) {flex-flow: column;}
  #benefits .benefits-items .item .image {transform: none!important;position: static;padding: 15px;}

  #mapstats .headline h2 {font-size: 50px;}
  #mapstats .headline h2 .highlight { display:inline; }


  #contact .inner {flex-flow: column;gap: 25px;align-items: flex-start;}
  #contact h2 {font-size: 16vw;max-width: 100%;}
  #contact .contact-form-opener {width: 25vw;height: 25vw;}

  #footer .inner {flex-flow: column;gap: 40px;text-align: center;}
  #footer .logo {margin: 0 auto 25px;}
  #footer .meta-col {text-align: center;align-items: center;}



  #contact-modal.active {top: 0;height: 100vh;width: 100vw;left: 0; }
  #contact-modal .contact-modal-inner {flex-flow: column;padding: 10vh 5vw;}
  #contact-modal .contact-modal-inner > div {width: 100%;}
  #contact-modal .col-text h2 {font-size: 50px;}
  #contact-modal .col-form h4 {font-size: 28px;}

  #download-modal.active {top: 0;height: 100vh;width: 100vw;left: 0; }
  #download-modal .download-modal-inner {flex-flow: column;padding: 10vh 5vw;}
  #download-modal .download-modal-inner > div {width: 100%;}
  #download-modal .col-text h2 {font-size: 50px;}
  #download-modal .col-form h4 {font-size: 28px;}


  [class*="modal"].active { top: 0;height: 100vh;width: 100vw;left: 0; }
  .product-modal .panel-a .panel-inner {flex-flow: column;}
  .product-modal .panel-a .images { max-width:100%; }
  .product-modal .panel-a .content {max-width:100%;padding: 0 2vw;}
  .product-modal .panel-a .content .title {font-size: 44px;}
  .product-modal .panel-a .images .image-slider .image {   }
  .product-modal .panel-a .images .image-slider .slick-dots li {flex:1;aspect-ratio:1 /1;width: auto;height: auto;}

  .product-modal .panel-b .highlights {flex-flow: column;gap: 30px;}
  .product-modal .panel-b .highlights .col-media {max-width: 100%;        padding: 50px 0;overflow: hidden;}
  .product-modal .panel-b .highlights .highlights-media {width: 80vw;margin: 0 auto;aspect-ratio: 1 /1;height: 80vw;}
  .product-modal .panel-b .highlights .highlights-media .highlights-media-circle-outer {width: 81vw;aspect-ratio: 1/ 1;height: 81vw;}
  .product-modal .panel-b .highlights .highlights-media .highlights-media-circle, .product-modal .panel-b .highlights .highlights-media .highlights-media-slider, .product-modal .panel-b .highlights .highlights-media .highlights-media-slider .item {width: 80vw;aspect-ratio: 1/ 1;height: 80vw;top: 2px;left: 2px;}
  .product-modal .panel-b .highlights .col-text {max-width: 100%;         overflow: hidden;}
  


  .product-modal .panel-d h3 {font-size: 40px;}


  

}

@media screen and (max-width:1000px){
  #products .product-cards .product {width: 50vw;}

}


@media screen and (max-width:700px){

  #header .nav ul li a {font-size: 16px; padding: 7px 13px;}

  #intro .hero-text h1 {font-size:45px;}

  #intro .hero-text #hero-rotating-text {
    overflow: hidden;
    height: 45px; /* match one line */
  }

  #intro .hero-text #hero-rotating-text ul li {
    font-size: 45px;
    font-weight: 500;
    color: #d72630;
    line-height: 45px;
    height: 45px;
    white-space: nowrap;
    overflow: hidden;
  }

  @keyframes heroScrollingWordsUp {
    0%, 20% { transform: translateY(0); }
    21%, 30% { transform: translateY(-45px); }
    31%, 50% { transform: translateY(-45px); }
    51%, 60% { transform: translateY(-90px); }
    61%, 80% { transform: translateY(-90px); }
    81%, 90% { transform: translateY(-135px); }
    91%, 100% { transform: translateY(-135px); }
  }

  #intro .hero-text #hero-rotating-text ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #products .product-cards .product {width: 80vw;}
  .progress-index-counter {width: 100%;height: auto;aspect-ratio: 1 /1;}


  #mapstats .stats .map-wrapper {position: absolute;top: 0;left: 0;height: 100%;width: 100%;margin-top: 300px;}
  #mapstats .stats .map-wrapper-inner {height: 100%;}
  #mapstats .stats .map {background-image: url(../img/world-map2-m.png);height: 100%;}
  #mapstats .stats .info {top: 0;}
  #mapstats .stats .stat-items {flex-flow: column;justify-content: center;align-items: center;margin-bottom: 50vh;}
  #mapstats .stats .dots-wrapper  {margin: 60vw auto 0;position: absolute;}
  #mapstats .stats .dots-wrapper .dots-inner {width: 80%;margin: 0 auto;}
  #mapstats .stats .dots-wrapper .dots-inner .dot:nth-child(1) {left: 50vw!important;top: 15vw!important;}


  #contact h2 {font-size: 20vw;max-width: 50%;}




  

}