.testimonials-hm {
background: #F3F1EC;
padding: 80px 0 0;
position: relative;
}
.testimonials-hm .swiper:before{
content: '';
display: block;
width: 120px;
height: 100%;
background: linear-gradient(270deg, #F3F1EC 0%, rgba(243, 241, 236, 0) 84.68%);
position: absolute;
top: 0;
bottom: 0;
left: 0;
z-index: 2;
rotate: 180deg;
}
.testimonials-hm .swiper:after {
content: '';
display: block;
width: 120px;
height: 100%;
background: linear-gradient(270deg, #F3F1EC 0%, rgba(243, 241, 236, 0) 84.68%);
position: absolute;
top: 0;
bottom: 0;
right: 0;
z-index: 2;
}
.testimonials-hm__title {
font-weight: 700;
font-size: 40px;
line-height: 120%;
text-align: center;
margin-bottom: 24px;
}
.testimonials-hm .swiper-button-next,
.testimonials-hm .swiper-button-prev {
width: 80px !important;
height: 80px !important;
background: none;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
color: transparent;
z-index: 30; -webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
outline: none;
border: none;
}
.testimonials-hm .swiper-button-prev {
left: 0;
top: 272px
}
.testimonials-hm .swiper-button-next {
right: 0;
top: 300px;
}
.testimonials-hm .swiper-button-next {
background-image: url(//hurma.work/wp-content/themes/hurma/img/swiper-arrow.png);
right: 0;
}
.testimonials-hm .swiper-button-prev {
background-image: url(//hurma.work/wp-content/themes/hurma/img/swiper-arrow.png);
left: 0;
transform: rotate(180deg);
}
.testimonials-hm .swiper-button-next:after, 
.testimonials-hm .swiper-button-prev:after {
display: none;
}
.testimonials-hm .swiper-slide {
width: 454px !important;
border-radius: 24px;
padding: 40px 32px 8px;
background: #fff;
display: flex !important;
flex-direction: column;
justify-content: space-between;
margin-left: 24px;
}
.testimonials-hm .swiper-wrapper{
padding-bottom: 60px;
margin-top: 50px;
}
.swiper-pagination {
top: 0 !important;
}
.testimonials-hm .swiper-slide__title {
font-weight: 700;
font-size: 24px;
line-height: 130%;
margin-bottom: 24px;
}
.testimonials-hm .swiper-pagination-bullet {
border-radius: 8px !important;
width: 27px !important;
height: 6px !important;
background: #D8D8D8;
opacity: 1;
}
.testimonials-hm .swiper-pagination-bullet-active {
background: #FF6D12 !important;
}
.testimonial__text {
font-weight: 400;
font-size: 16px;
line-height: 150%;
margin-bottom: 24px;
}
.testimonial__author {
display: flex;
align-items: center;
padding: 16px 0;
border-top: 1px solid #D8D8D8;
}
.testimonial__avatar {
width: 80px;
height: 80px;
flex: 0 0 80px;
border-radius: 50%;
overflow: hidden;
margin-right: 16px;
}
.testimonial__avatar img {
width: 100%;
height: 100%;
object-fit: cover;
}
.testimonial__name {
font-weight: 500;
font-size: 18px;
line-height: 32px;
}
.testimonial__position {
font-size: 16px;
line-height: 120%;
}
@media screen and (max-width: 1000px) {
.testimonials-hm {
padding: 32px 0 12px;
}
.testimonials-hm .testimonials-hm__title {
font-size: 24px;
}
}
@media screen and (max-width: 768px) {
.testimonials-hm .swiper-slide {
width: 312px !important;
}
.testimonials-hm .swiper-slide__title {
font-weight: 700;
font-size: 16px;
line-height: 130%;
}
.testimonials-hm .testimonial__text {
font-size: 14px;
}
.testimonial__name,
.testimonial__position {
font-size: 14px;
}
.testimonials-hm .swiper:before,
.testimonials-hm .swiper:after {
display: none;
}
}
.faq-hm {
background: #F3F1EC;
}
.faq-hm .container {
max-width: 1100px;
padding: 28px 20px 72px;
}
.faq-hm__title {
text-align: center;
font-weight: 700;
font-size: 40px;
line-height: 120%;
text-align: center;
margin-bottom: 32px;
}
.faq-hm__question {
padding: 16px 40px;
font-size: 24px;
font-weight: 400;
line-height: 32px;   
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
.faq-hm__item:not(.active):hover {
background: #FFFFFFB2;
}
.faq-hm__item {
background: #fff;
border-radius: 12px;
margin-bottom: 8px;
overflow: hidden;
transition: all 0.3s ease;
}
.faq-hm__answer {
padding: 8px 40px 40px;
font-size: 18px;
line-height: 160%;
display: none;
white-space: pre-line;
} .faq-hm__answer ul,
.faq-hm__answer ol {
margin: 16px 0;
padding-left: 24px;
}
.faq-hm__answer li {
margin-bottom: 8px;
line-height: 160%;
} .faq-hm__answer ul {
margin: 16px 0;
padding-left: 24px;
list-style: none;
}
.faq-hm__answer ul li {
margin-bottom: 8px;
line-height: 160%;
position: relative;
padding-left: 20px;
}
.faq-hm__answer ul li::before {
content: "•";
position: absolute;
left: 0;
color: var(--black);
} .faq-hm__answer ol {
margin: 12px 0;
padding-left: 20px;
list-style: decimal;
} .faq-hm__answer ol {
margin: 16px 0;
padding-left: 36px;
list-style: decimal;
}
.faq-hm__answer ol li {
margin-bottom: 8px;
line-height: 160%;
padding-left: 8px;
}
.faq-hm__answer ol li:before {
display: none !important;
}
.faq-hm__item.active .faq-hm__answer {
display: block;
}
.faq-hm__arrow {
transition: transform 0.3s ease;
transform: rotate(180deg);
cursor: pointer;
flex: 0 0 16px;
}
.faq-hm__item.active .faq-hm__arrow {
transform: rotate(0deg);
}
@media screen and (max-width: 1000px) {
.faq-hm__title {
font-size: 24px;
margin-bottom: 24px;
}
.faq-hm__question {
font-size: 18px;
padding: 16px 32px;
line-height: 130%;
}
.faq-hm__answer {
font-size: 14px;
padding: 8px 32px 28px;
white-space: pre-line;
} .faq-hm__answer ul {
margin: 12px 0;
padding-left: 20px;
list-style: none;
}
.faq-hm__answer ul li {
margin-bottom: 6px;
line-height: 160%;
position: relative;
padding-left: 16px;
}
.faq-hm__answer ul li::before {
content: "•";
position: absolute;
left: 0;
color: var(--black);
}
.faq-hm .container {
padding: 28px 8px 40px;
}
}
.try-section-hm {
background-color: #292F42;
background-image:
radial-gradient(50.53% 363.48% at 100.56% 100%, rgba(0, 194, 255, 0.8) 0%, rgba(255, 0, 214, 0) 100%),
radial-gradient(52.66% 159.21% at 0% 0%, rgba(255, 183, 74, 0.8) 0%, rgba(41, 47, 66, 0) 100%),
linear-gradient(180deg, rgba(0, 0, 0, 0.22) 30.66%, rgba(0, 0, 0, 0) 58.7%);
background-repeat: no-repeat;
background-size: cover;
padding: 34px 0;
}
.try-section-hm .container {
max-width: 1100px;
display: flex;
}
.try-section-hm__content {
max-width: 546px;
margin-right: 96px;
margin-top: 100px;
}
.try-section-hm__content p {
font-weight: 700;
font-size: 40px;
line-height: 110%;
color: #fff;
margin-bottom: 48px;
}
.try-section-hm .main-hm-button {
margin: 0;
display: inline-block;
background-color: #F98B25;
padding: 16px 48px;
border-radius: 12px;
font-weight: 500;
font-size: 20px;
line-height: 24px;
letter-spacing: 2%;
text-align: center;
cursor: pointer;
transition: background-color 0.3s ease;
color: #fff;
}
.try-section-hm .main-hm-button:hover {
background-color: #FF9737;
}
.try-section-hm .main-hm-button:active {
transform: scale(0.97);
}
.try-section-hm__img {
width: 312px;
border-radius: 24px;
overflow: hidden;
}
@media screen and (max-width: 1000px) {
.try-section-hm {
padding-top: 46px;
}
.try-section-hm .container {
flex-direction: column;
align-items: center;
}
.try-section-hm__content p{
font-size: 24px;
margin-bottom: 32px;
text-align: center;
}
.try-section-hm__content {
max-width: 100%;
margin: 0;
align-items: center;
display: flex;
flex-direction: column;
margin-bottom: 36px;
}
}
.comparison-with-competitors {
background: #fff;
padding: 60px 0 0;
}
.comparison-with-competitors .container {
max-width: 1100px;
}
.comparison-with-competitors__wrap {
display: flex;  
align-items: flex-end;
margin-bottom: 50px;
justify-content: space-between;
}
.comparison-with-competitors__title {
font-weight: 700;
font-size: 40px;
line-height: 120%;
margin-bottom: 16px;
}
.comparison-with-competitors__subtitle {
color: #2C2C2CB2;
font-weight: 500;
font-size: 20px;
line-height: 150%;
}
.comparison-with-competitors__btn {
border: 2px solid #F98B25;
background: #fff;
color: #F98B25;
padding: 10px 48px;
font-weight: 500;
font-size: 18px;
line-height: 24px;
display: flex;
align-items: center;
border-radius: 12px;
cursor: pointer;
display: flex;
white-space: nowrap;
}
.comparison-with-competitors__btn svg {
margin-left: 10px;
}
.comparison-with-competitors__btn:hover {
background: #FF9737;
color: #fff;
}
.comparison-with-competitors__btn:active {
transform: scale(.97);
}
.comparison-with-competitors__btn:hover svg path {
fill: #fff;
}
@media screen and (max-width: 1000px) {
.comparison-with-competitors__wrap {
flex-direction: column;
align-items: center;
text-align: center;
}
.comparison-with-competitors__title {
font-size: 24px;
margin-bottom: 11px;
}
.comparison-with-competitors__subtitle {
font-size: 16px;
margin-bottom: 16px;
}
}
@media screen and (max-width: 700px) {
.comparison-with-competitors__btn {
padding: 10px 32px;
}
.comparison-with-competitors__subtitle {
margin-bottom: 26px;
}
.comparison-with-competitors {
padding-top: 32px;
}
.comparison-with-competitors__wrap {
margin-bottom: 32px;
}
}
.tariffs-hm {
padding: 40px 0 80px;
background: #F3F1EC;
overflow: hidden;
}
.tariffs-hm .container {
padding: 0 15px;
}
.tariffs-hm__content {
margin: 0 auto;
}
.tariffs-hm__title {
font-weight: 700;
font-size: 40px;
line-height: 120%;
text-align: center;
margin-bottom: 16px;
}
.tariffs-hm__subtitle {
font-weight: 500;
font-size: 20px;
line-height: 150%;
color: #2C2C2CB2;
text-align: center;
margin-bottom: 32px;
}
.tariffs-hm__cards {
display: flex;
justify-content: space-between;
align-items: stretch;
padding: 0;
}
.tariffs-hm__left .tariffs-hm__cards,
.tariffs-hm__right .tariffs-hm__cards {
flex: 1 1 auto;
}
.tariffs-hm__cards-wrap {
display: flex;
align-items: stretch;
margin-bottom: 32px;
}
.tariffs-hm__left, .tariffs-hm__right {
box-shadow: 0px 15px 20px 0px #0000000F;
border-radius: 24px;
background: #F9F8F5;
display: flex;
flex-direction: column;
}
.tariffs-hm__section-label {
padding: 24px 12px;
text-align: center;
font-family: Fira Sans;
font-weight: 700;
font-size: 24px;
line-height: 120%;
letter-spacing: 5%;
color: #A19F9A;
}
.tariffs-hm__left,
.tariffs-hm__right {
margin-right: 24px;
width: 708px;
}
.tariffs-hm__right .tariffs-hm__card,
.tariffs-hm__left .tariffs-hm__card {
background: #fff;
border-radius: 24px;
padding: 30px 40px;
display: flex;
flex-direction: column;
min-height: 300px;
width: 50%;
}
.tariffs-hm__left .tariffs-hm__card--highlight,
.tariffs-hm__right .tariffs-hm__card--highlight {
background: linear-gradient(180deg, #D9ECFF 0%, #F4EEF4 49.91%, #F9F8F5 100%);
}
.tariffs-hm__card-title {
font-weight: 700;
font-size: 24px;
line-height: 48px;
}
.tariffs-hm__badge {
font-weight: 500;
font-size: 20px;
line-height: 43px;
width: 51px;
height: 24px;
gap: 8px;
border-radius: 4px;
padding: 1px 10px;
background: #2C2C2C;
color: #fff;
}
.tariffs-hm__price .tariffs-hm__price-value {
font-weight: 700;
font-size: 48px;
line-height: 48px;
}
.tariffs-hm__price span {
font-weight: 700;
font-size: 24px;
line-height: 48px;
}
.tariffs-hm__right .tariffs-hm__price-info-wrap {
display: flex;
align-items: end;
gap: 4px;
margin-top: -4px;
}
.tariffs-hm__right  .tariffs-hm__card-subtitle {
min-height: 62px;
}
.tariffs-hm__left .tariffs-hm__card-subtitle {
min-height: 85px;
}
.tariffs-hm__price .tariffs-hm__price-info-text {
font-weight: 400;
font-size: 14px;
line-height: 150%;
}
.tariffs-hm__price-info {
font-weight: 400;
font-size: 14px;
line-height: 128%;
display: inline-block;
} .tariffs-section__price-info-wrap {
display: flex;
align-items: center;
}
.tariffs-section__price-info-wrap .tariffs-info-tooltip {
width: 24px;
height: 24px;
flex: 0 0 24px;
margin-left: 4px;   
}
.tariffs-info-tooltip {
position: relative;
display: inline-block;
}
.tariffs-info-tooltip .tariffs-section__info-icon {
cursor: pointer;
}
.tariffs-info-tooltip .tooltip-content {
visibility: hidden;
opacity: 0;
position: absolute;
left: 100%;
top: 50%;
transform: translateY(-50%);
margin-left: 10px;
background: #ffffff;
font-weight: 400;
font-size: 14px;
line-height: 120%;
color: #656F82;
box-shadow: 0px 5px 20px 0px #00000024;
padding: 16px;
border-radius: 8px;
z-index: 10;
transition: opacity 0.3s ease, visibility 0.3s ease;
width: fit-content;
max-width: 328px;
min-width: 200px;
}
.tariffs-info-tooltip:hover .tooltip-content {
visibility: visible;
opacity: 1;
}
.tariffs-hm__price-wrap {
margin-bottom: 16px;
}
.tariffs-hm__card-subtitle {
font-size: 18px;
line-height: 130%;
margin-bottom: 0;
}
.tariffs-hm__card-subtitle-2 {
font-weight: 500;
font-size: 16px;
line-height: 130%;
margin-bottom: 6px;
}
.tariffs-hm__features li{
font-size: 16px;
line-height: 130%;
margin-bottom: 4px;
list-style-image: url(//hurma.work/wp-content/themes/hurma/img/list-icon.svg);
margin-left: 24px;
}
.tariffs-hm__button {
background: #F98B25;
color: #fff;
padding: 12px 45px;
font-weight: 500;
font-size: 20px;
line-height: 24px;
border-radius: 12px;
display: inline-block;
}
.tariffs-hm__button:hover {
background: #FF9737;
}
.tariffs-hm__button:active {
transform: scale(.97);
}
.tariffs-hm__button-wrap {
text-align: center;
}
.tariffs-hm__card-label {
display: none;
}
@media screen and (max-width: 1150px) {
.tariffs-hm__left,
.tariffs-hm__right  {
width: 100%;
margin-bottom: 16px;
}
.tariffs-hm__cards-wrap {
flex-direction: column;
}
.tariffs-hm__card-subtitle,
.tariffs-hm__features li {
font-size: 16px;
}
}
@media screen and (max-width: 1000px) {
.tariffs-hm__title {
font-size: 24px;
margin-bottom: 11px;
}
.tariffs-hm__subtitle {
font-size: 16px;
margin-bottom: 16px;
}
}
@media screen and (max-width: 700px) {
.tariffs-hm__left .tariffs-hm__card-subtitle,
.tariffs-hm__right .tariffs-hm__card-subtitle {
min-height: auto;
}
.tariffs-info-tooltip .tooltip-content {
bottom: 100%;
left: 50%;
top: auto;
transform: translateX(-50%);
margin-left: 0;
width: fit-content;
min-width: 150px;
max-width: 230px;
}
.tariffs-hm__card-label {
font-weight: 700;
font-size: 14px;
line-height: 120%;
letter-spacing: 5%;
color: #A19F9A;
display: block;
}
.tariffs-hm__section-label {
display: none;
}
.tariffs-hm__cards {
background: #F3F1EC;
padding: 0;
}
.tariffs-hm__right .tariffs-hm__card, 
.tariffs-hm__left .tariffs-hm__card {
box-shadow: 0px 15px 20px 0px #0000000F;
margin: 0;
padding: 24px 32px;
height: auto;
margin-bottom: 16px;
width: 100%;
}
.tariffs-hm__left .tariffs-hm__cards,
.tariffs-hm__right .tariffs-hm__cards {
flex-direction: column;
}
.tariffs-hm__left, .tariffs-hm__right {
box-shadow: none;
}
.tariffs-hm {
padding: 24px 0 40px;
}
.tariffs-hm__card-subtitle {
margin-bottom: 16px;
font-size: 14px;
}
.tariffs-hm__left,
.tariffs-hm__right {
margin-bottom: 0;
}
.tariffs-hm__cards-wrap {
margin-bottom: 24px;
} 
}
.contact-us-hm__form {
position: relative;
}
.contact-us-hm__form .iti__selected-flag {
display: flex;
align-items: center;
background-color: transparent !important;
padding: 0 !important;
}
.contact-us-hm__form .iti {
position: relative;
width: 254px;
}
.iti--separate-dial-code .iti__selected-dial-code {
margin-left: 9px !important;
}
.contact-us-hm__form .iti {
display: flex;
align-items: center;
}
.contact-us-hm__form .iti__flag-container {
padding-left: 16px;
position: relative;
width: auto !important;
}
.contact-us-hm__form .iti__country-list {
position: absolute;
z-index: 9999;
list-style: none;
text-align: left;
padding: 0;
margin: 0 0 0 -1px;
box-shadow: 1px 1px 4px rgba(0,0,0,.2);
background-color: #fff;
border: 1px solid #ccc;
white-space: nowrap;
max-height: 250px;
min-height: 250px;
overflow: auto;
left: 0px;
top: 41px;
max-width: 421px; -webkit-overflow-scrolling: touch;
-webkit-transform: translateZ(0);
transform: translateZ(0); -webkit-appearance: none;
appearance: none;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
.contact-us-hm__form .iti__country-name {
display: flex;
align-items: center;
}
.contact-us-hm__form .iti__country {
display: flex;
align-items: center;
}
.contact-us-hm__form.focus {
border: 2px solid #4A90E2;
}
.contact-us-hm__form.focus .iti {
width: 253px;
}
.contact-us-hm {
padding: 40px 0;
background: #F3F1EC;
display: flex;
}
.contact-us-hm__content {
box-shadow: 0px 15px 20px 0px #0000000F;
width: 1100px;
margin: 0 auto;
border-radius: 24px;
background: #F9F8F5;
}
.contact-us-hm__left-title {
font-weight: 700;
font-size: 40px;
line-height: 120%;
text-align: center;
margin-bottom: 32px;
}
.contact-us-hm__content {
display: flex;
justify-content: space-between;
}
.contact-us-hm__left {
width: 600px;
padding: 40px 60px 20px 40px;
}
.contact-us-hm__right-2 {
display: none;
}
.contact-us-hm__right-2.active {
display: block;
}
.contact-us-hm__right.hide {
display: none;
}
.contact-us-hm__right,
.contact-us-hm__right-2 {
width: 500px;
background: #fff;
padding: 52px 40px 20px;
border-radius: 0 24px 24px 0;
min-height: 423px;
}
.contact-us-hm__right-2-item {
display: flex;
flex-direction: column;
align-items: center;
}
.contact-us-hm__success-img {
margin-bottom: 9px;
}
.contact-us-hm__success-text {
font-weight: 600;
font-size: 24px;
line-height: 32px;
margin-bottom: 16px;
}
.contact-us-hm__success-text-2 {
font-size: 18px;
line-height: 140%;
}
.contact-us-hm__list {
margin-top: 20px;
}
.contact-us-hm__item {
display: flex;
align-items: center;
margin: 0 0 40px;
font-weight: 500;
font-size: 20px;
line-height: 130%;
color: #2C2C2C;
}
.contact-us-hm__item img {
margin-right: 16px;
}
.contact-us-hm__avatars {
display: flex;
justify-content: center;
margin-bottom: 24px;
}
.contact-us-hm__avatars img {
max-width: 238px;
}
.contact-us-hm__subtitle {
font-weight: 600;
font-size: 24px;
line-height: 32px;
text-align: center;
margin-bottom: 24px;
}
.contact-us-hm__note {
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #9DA3AE;
}
.contact-us-hm__note a {
text-decoration: underline;
}
.contact-us-hm__form {
margin-bottom: 16px;
width: 420px;
height: 56px;
border: 1px solid #9DA3AE;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: space-between;
}
.contact-us-hm__phone::placeholder {
font-weight: 400;
font-size: 18px;
line-height: 24px;
color: #BCC4D2;
}
.contact-us-hm__phone {
padding-left: 21px !important;
}
.contact-us-hm__button {
height: 50px;
border-radius: 10px;
padding: 13px 31px !important;
background-color: #F98B25;
color: #fff;
font-weight: 500;
font-size: 18px;
line-height: 24px;
letter-spacing: 0.3px;
cursor: pointer;
margin-right: 3px;
}
.contact-us-hm__button:hover {
background-color: #FF9737;
}
.contact-us-hm__button:active {
transform: scale(.97);
}
.contact-us-hm__note-2 {
font-size: 14px;
line-height: 20px;
color: #E25A5A;
text-align: center;
margin-top: -10px;
margin-bottom: 16px;
display: none;
}
@media screen and (max-width: 1160px) {
.contact-us-hm__content {
width: 100%;
}
}
@media screen and (max-width: 1000px) {
.contact-us-hm__left {
padding-right: 30px;
}
.contact-us-hm__right-2 {
width: 100%;
}
.contact-us-hm__item {
font-size: 16px;
margin-bottom: 16px
}
.contact-us-hm .container {
padding: 0;
background: #F9F8F5;
box-shadow: 0px 15px 20px 0px #0000000F;
border-radius: 12px;
}
.contact-us-hm {
background: #F3F1EC;
padding: 40px 8px;
}
.contact-us-hm__left-title {
padding: 24px 16px 18px;
margin-bottom: 0;
font-size: 24px;
}
.contact-us-hm__content {
flex-direction: column;
}
.contact-us-hm__left {
width: 100%;
padding: 0 16px 6px;
}
.contact-us-hm__right {
width: 100%;
padding: 32px;
border-radius: 0 0 12px 12px;
}
.contact-us-hm__form {
margin: 0 auto 24px;
}
.contact-us-hm__note {
max-width: 420px;
margin: 0 auto;
}
}
@media screen and (max-width: 510px) {
.contact-us-hm__form.focus {
border: none !important;
}
.contact-us-hm__form.focus .iti {
border: 2px solid #4A90E2 !important;
width: 100%;
}
.contact-us-hm__subtitle{
font-size: 16px;
margin-bottom: 7px;
}
.contact-us-hm__form {
flex-direction: column;
width: 100%;
height: auto;
border: none;
}
.contact-us-hm__form .iti {
width: 100%;
height: 48px;
border: 1px solid #9DA3AE;
border-radius: 12px;
display: flex;
align-items: center;
}
.contact-us-hm__button {
margin-top: 8px;
width: 100%;
padding: 12px 32px;
}
.contact-us-hm__note {
font-size: 12px;
}
.contact-us-hm {
padding: 8px 8px 16px;
}
.contact-us-hm__list {
margin-top: 0; 
}
} .iti-mobile .iti--container {
top: 30px !important;
bottom: 30px !important;
left: 30px !important;
position: fixed !important;
z-index: 99999 !important;
background: #fff !important;
}
.iti-mobile .iti__country-list {
background: #fff !important;
}
.hw-site-header.transpatent {
background-color: transparent;
}
.main-hm-section {
padding-top: 88px;
position: relative;
padding-bottom: 134px;
}
.marquee-section {
margin-top: -134px;
background: transparent;
} .bg-layers {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1;
}
.bg-layer {
position: absolute;
inset: 0;
background-color: #F3F1EC;
background-blend-mode: normal;
opacity: 0;
transition: opacity 0.8s cubic-bezier(.4,0,.2,1);
}
.bg-layer.current { opacity: 1; }
.bg-layer.next { opacity: 0; } .bg-gradient-main {
background-image:
radial-gradient(100.66% 100.66% at 20.97% 100%, rgba(0, 153, 255, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%),
radial-gradient(99.2% 99.2% at 84.78% 100%, rgba(255, 111, 229, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%);
}
.bg-gradient-hr {
background:
radial-gradient(100.66% 100.66% at 20.97% 100%, rgba(0, 255, 234, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%),
radial-gradient(99.2% 99.2% at 84.78% 100%, rgba(255, 111, 114, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%);
}
.bg-gradient-recruting {
background:
radial-gradient(100.66% 100.66% at 20.97% 100%, rgba(17, 0, 255, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%),
radial-gradient(99.2% 99.2% at 84.78% 100%, rgba(111, 255, 238, 0.2) 0%, rgba(243, 241, 236, 0.2) 100%);
}
.main-hm-title {
font-weight: 800;
font-size: 60px;
line-height: 110.00000000000001%;
text-align: center;
color: #292F42;
max-width: 991px !important;
margin: 0 auto 24px;
}
.main-hm-section .main-hm-text {
font-weight: 500;
font-size: 20px;
line-height: 150%;
text-align: center;
color: #2C2C2CB2;
max-width: 750px !important;
margin: 0 auto 40px;
height: auto !important;
}
.main-hm-button-wrap {
text-align: center;
}
.main-hm-section .main-hm-button {
background-color: #F98B25;
color: white;
border: none;
padding: 16px 48px;
border-radius: 12px;
font-weight: 500;
font-size: 20px;
line-height: 24px;
letter-spacing: 2%;
text-align: center;
cursor: pointer;
transition: background-color 0.3s ease;
display: block;
margin: 0 auto 12px;
display: inline-block !important;
}
.main-hm-button:hover {
background-color: #FF9737;
}
.main-hm-button:active {
transform: scale(0.97);
}
.main-hm-img {
margin: 0 auto 44px;
}
.main-hm-section .tabs-main {
display: flex;
align-items: end;
justify-content: center;
max-width: 1160px;
margin: 0 auto !important;
position: relative;
}
.main-hm-section .subtabs-main {
border: 2px solid #fff;
border-radius: 16px 16px 0 0;
border-bottom: none;
text-align: center;
padding: 23px 24px 21px;
max-width: 1100px;
margin: 0 auto !important; 
}
.tab-btn-main {
color: #1D1D1D;
font-size: 16px;
line-height: 22px;
padding: 8px 32px;
background: transparent;
border-radius: 12px 12px 0 0;
margin: 0 2px;
cursor: pointer;
border: 2px solid #fff;
border-bottom: none;
font-weight: 500;
} .tab-btn-main.active{
background-color: transparent;
border-width: 2px 2px 0px 2px;
border-color: #fff;
border-width: 2px, 2px, 0px, 2px;
border-style: solid;
padding: 12px 32px;
background: #fff;
}
.tab-btn-main:not(.active):hover {
background: #FFFFFF80;
}
.subtab-btn-main {
color: #292F42;
font-weight: 400;
font-size: 16px;
line-height: 22px;
padding: 6px 16px;
background: #fff;
border-radius: 8px;
margin: 0 4px;
cursor: pointer;
}
.subtab-btn-main.active {
font-weight: 500;
background-color: #292F42;
color: #fff;
}
.subtab-btn-main:not(.active):hover {
background: #FFFFFF80;
}
.tab-content, .subtab-content {
display: none;
position: relative;
}
.tab-content.active, .subtab-content.active {
display: block;
max-width: 1160px;
margin: 0 auto;
position: relative;
z-index: 1;
}
.screenshot-container {
border: 12px solid #FFFFFF1F;
box-shadow: 0px 10px 50px 0px #00000033;
border-radius: 24px;
overflow: hidden;
opacity: 0;
transition: opacity 0.3s ease-in-out;
position: relative;
z-index: 1;
}
.screenshot-container img {
width: 100%;
height: auto;
border-radius: 12px !important;
overflow: hidden;
box-shadow: none !important;
}
.subtab-content.active .screenshot-container {
opacity: 1;
}
@media (max-width: 1000px) {
.main-hm-title {
font-size: 32px !important;
margin-bottom: 14px !important;
}
.main-hm-section .main-hm-text {
font-size: 16px;
margin-bottom: 24px;
}
.main-hm-section .main-hm-button {
padding: 12px 32px;
margin-bottom: 12px;
font-size: 18px;
}
.main-hm-img {
margin-bottom: 28px;
}
.tab-btn-main {
font-size: 14px;
padding: 8px 16px;
}
.tab-btn-main.active {
padding: 12px 16px;
}
.main-hm-section  .subtabs-main {
padding-bottom: 16px;
}
.screenshot-container img {
border-radius: 8px;
border-width: 0;
}
.main-hm-section .main-hm-button {
margin-top: 16px;
}
.subtab-btn-main {
font-size: 14px;
padding: 4px 8px;
margin-bottom: 8px;
}
.main-hm-section {
padding-top: 96px
}
}
@media (max-width: 600px) {
.tab-btn-main {
font-size: 12px;
}
.tab-btn-main.active {
padding: 11px;
}
.main-hm-section .subtab-btn-main {
font-size: 11px;
border-radius: 6px;
line-height: 16px;
padding: 3px 6px;
margin: 0 4px 7px;
}
.main-hm-section .subtabs-main {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 18px 10px 15px;
}
.screenshot-container {
border-width: 6px;
}
}
.marquee-section .marquee-container {
overflow: hidden;
padding: 54px 0 24px;
margin-top: 0; 
background: transparent !important; 
}
.marquee {
display: flex;
}
.marquee-track {
display: flex;
gap: 24px;
animation: scroll-loop 50s linear infinite;
white-space: nowrap;
align-items: center;
width: max-content;
will-change: transform;
transition: transform 0.3s ease;
}
.marquee-track span {
flex-shrink: 0;
display: flex;
align-items: center;
}
.marquee-track img {
height: 56px;
display: block;
}
@keyframes scroll-loop {
0% {
transform: translateX(0);
}
50% {
transform: translateX(-50%);
}
100% {
transform: translateX(-100%);
}
}
@media (max-width: 1000px) {
.marquee-container {
padding: 40px 0 16px;
}
}
.cookie-banner {
width: 100%;
max-width: 1099px;
border-radius: 12px;
padding: 40px 32px;
gap: 24px;
background: #FFFA94;
color: #2C2C2C;
position: fixed;
bottom: 12px;
left: 50%;
transform: translateX(-50%);
z-index: 1000;
display: none;
}
.cookie-banner__title {
font-weight: 700;
font-size: 20px;
line-height: 24px;
margin-bottom: 16px;
}
.cookie-banner__text {
font-size: 16px;
line-height: 24px;
margin-bottom: 24px;
}
.cookie-button {
padding: 10px 48px;
margin-left: 10px;
font-weight: 500;
font-size: 18px;
line-height: 24px;
letter-spacing: 0.2px;
border-radius: 12px;
cursor: pointer;
}
.cookie-button__wrapper {
display: flex;
justify-content: flex-end;
}
.cookie-reject-button {
color: #fff;
background: #2C2C2C;
}
.cookie-accept-button {
border: 2px solid #2C2C2C;
background: transparent;
}
@media screen and (max-width: 500px) {
.cookie-button {
padding: 10px 16px;
}
}
.cases-hm {
padding: 80px 0;
}
.cases-hm .container {
max-width: 1140px;
margin: 0 auto;
padding: 0 20px;
}
.cases-hm__title {
font-weight: 700;
font-style: Bold;
font-size: 40px;
line-height: 120%;
margin-bottom: 48px;
text-align: center;
}
.cases-hm__grid {
display: flex;
gap: 40px;
}
.cases-hm__main-text {
font-weight: 500;
font-size: 24px;
line-height: 32px;
margin-top: 16px;
display: inline-block;
}
.cases-hm__main-text:hover {
text-decoration: underline;
}
.cases-hm__main {
max-width: 528px;
}
.cases-hm__item {
display: flex;
margin-bottom: 28px;
gap: 16px;
}
.cases-hm__item-text {
font-weight: 500;
font-size: 18px;
line-height: 140%;
}
.cases-hm__item-text:hover {
text-decoration: underline;
}
.cases-hm__list {
max-width: 488px;
}
.cases-hm__button-wrap {
text-align: center;
margin-top: 20px;
}
.cases-hm__button {
border: 2px solid #F98B25;
background: #fff;
color: #F98B25;
padding: 10px 48px;
font-weight: 500;
font-size: 18px;
line-height: 24px;
display: flex;
align-items: center;
border-radius: 12px;
cursor: pointer;
display: inline-block;
white-space: nowrap;
}
.cases-hm__button:hover {
background: #FF9737;
color: #fff;
}
.cases-hm__button:active {
transform: scale(.97);
}
.cases-hm__item-img {
max-width: 180px;
}
@media screen and (max-width: 1000px) {
.cases-hm__main-img {
max-width: 180px;
height: 114px;
}
.cases-hm {
padding: 40px 0;
}
.cases-hm__title {
font-size: 24px;
margin-bottom: 32px;
margin-bottom: 24px;
}
.cases-hm__grid {
flex-direction: column;
gap: 28px;
}
.cases-hm__main {
display: flex;
}
.cases-hm__list,
.cases-hm__main {
max-width: 100%;
}
.cases-hm__main {
gap: 16px;
}
.cases-hm__main-text {
font-weight: 500;
font-size: 18px;
line-height: 140%;
margin-top: 0;
}
}
@media screen and (max-width: 450px) {
.cases-hm {
padding-bottom: 27px;
}
.cases-hm__item,
.cases-hm__main {
flex-direction: column;
}
.cases-hm__item-text,
.cases-hm__main-text {
font-size: 16px;
line-height: 150%;
}
.cases-hm__main-img,
.cases-hm__item-img {
max-width: 100%;
height: auto;
}
.cases-hm__button{
width: 100%;
}
}