@charset "UTF-8"; /*** The new CSS reset - version 1.11.2 (last updated 15.11.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } html { scroll-behavior: smooth; } body { display: flex; flex-direction: column; min-height: 100vh; font-family: "Montserrat", sans-serif; background-color: #FFFFFF; color: #171520; font-size: 14px; line-height: 1.4; overflow-x: hidden; } strong { font-weight: 700; } .container { max-width: calc(1292px + 2 * 16px); margin-left: auto; margin-right: auto; padding-left: 16px; padding-right: 16px; } .section-heading { display: flex; align-items: flex-start; gap: 24px; margin-bottom: 58px; } .section-heading::before { content: ""; display: block; width: 24px; height: 24px; flex-shrink: 0; margin-top: 20px; background-image: url("../images/list-style-image.svg"); background-repeat: no-repeat; background-size: contain; } .section-heading__title { font-size: clamp(2.5rem, 5vw, 3.25rem); line-height: 1.2; font-weight: 400; } .section-heading__title strong { font-weight: 700; } .section-text { font-size: 14px; line-height: 1.2; max-width: 484px; color: #171520; margin-left: 48px; } @media (max-width: 992px) { .section-text { margin-left: 0; } } .sub-heading { font-size: 14px; line-height: 1.6; max-width: 485px; } .btn { display: inline-block; font-weight: 700; font-size: 14px; line-height: 17px; color: #FFFFFF; border-radius: 6px; cursor: pointer; text-align: center; transition: transform 0.2s ease, box-shadow 0.2s ease; } .btn:hover { transform: translateY(-2px); box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); } .btn-primary { background: radial-gradient(50% 67.32% at 50% 0%, rgba(255, 194, 93, 0.5) 0%, rgba(242, 117, 39, 0.5) 100%); padding: 2px; border-radius: 6px; } .btn-primary .btn-primary-inner { display: block; padding: 12px 30px; background: radial-gradient(50% 67.32% at 50% 0%, #FFC25D 0%, #F27527 100%); border-radius: 4px; width: 100%; height: 100%; } .contact-form { width: 100%; max-width: 590px; margin: 0 auto; color: #FFFFFF; } .contact-form h1 { font-size: clamp(2.5rem, 5vw, 3.25rem); text-align: center; line-height: 1.2; margin-bottom: 34px; font-weight: 400; } .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } @media (max-width: 768px) { .form-grid { grid-template-columns: 1fr; } } .form-group:not(.in-grid) { margin-top: 14px; } .form-group input, .form-group textarea { width: 100%; padding: 12px 16px; background: #414048; border: 1px solid #6F7179; border-radius: 4px; color: #FFFFFF; font-family: "Montserrat", sans-serif; font-size: 14px; transition: border-color 0.2s ease; } .form-group input:focus, .form-group textarea:focus { outline: none; border-color: #F27527; } .form-group input::placeholder, .form-group textarea::placeholder { color: #A9A9B0; } .form-group input.error, .form-group textarea.error { border-color: #ff6b6b; } .form-group-checkbox { display: flex; align-items: flex-start; gap: 12px; margin: 24px 0 30px; font-size: 14px; color: #FFFFFF; } .form-group-checkbox input[type=checkbox] { appearance: none; -webkit-appearance: none; background-color: #414048; border: 1px solid #6F7179; border-radius: 4px; width: 22px; height: 22px; flex-shrink: 0; margin-top: 1px; position: relative; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease; } .form-group-checkbox input[type=checkbox].error { border-color: #ff6b6b; } .form-group-checkbox input[type=checkbox]:checked { background-color: #F27527; border-color: #F27527; } .form-group-checkbox input[type=checkbox]:checked::after { content: "✓"; font-size: 16px; color: white; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); line-height: 1; } .form-group-checkbox label { flex-grow: 1; } .form-group-checkbox a { text-decoration: underline; font-weight: 700; color: #FFFFFF; } .error-message { color: #ff6b6b; font-size: 12px; padding-top: 4px; min-height: 1.2em; display: block; } .error-message:empty { min-height: 0; padding-top: 0; } #form-messages { text-align: center; padding: 15px; margin-bottom: 20px; border-radius: 4px; display: none; } #form-messages.success { background-color: #2b7a4b; color: white; display: block; } #form-messages.error { background-color: #c53030; color: white; display: block; } .contact-form .btn { display: block; margin-left: auto; margin-right: auto; min-width: 162px; } .solutions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; margin-top: 42px; } .solution-card { border-radius: 4px; padding: 32px; min-height: 373px; position: relative; overflow: hidden; color: #171520; background: linear-gradient(180deg, #ECECEC 0%, #E6E6E6 100%); transition: background 0.4s ease, color 0.4s ease, transform 0.3s ease; cursor: pointer; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .solution-card__bg { position: absolute; top: 0; right: 0; height: 100%; width: auto; z-index: 0; opacity: 0.5; transition: opacity 0.4s ease; } .solution-card__bg img { height: 100%; width: auto; } .solution-card__content { position: relative; z-index: 1; width: 100%; } .solution-card h3 { font-size: 24px; margin-bottom: 16px; font-weight: 700; min-height: 2.4em; } .solution-card.active, .solution-card:hover { background: linear-gradient(180deg, #171520 0%, #323235 100%); color: #FFFFFF; } .solution-card.active .solution-card__bg, .solution-card:hover .solution-card__bg { opacity: 1; } .site-header { background-color: transparent; position: absolute; width: 100%; padding-top: 22px; padding-bottom: 22px; z-index: 100; } .contact-page .site-header { position: relative; } main { flex-grow: 1; } .header-container { display: flex; justify-content: space-between; align-items: center; background-color: transparent; } .logo { display: flex; align-items: center; gap: 12px; font-weight: 700; color: #FFFFFF; z-index: 110; } .logo img { height: 31px; width: auto; } .main-nav { display: flex; align-items: center; gap: 40px; } @media (max-width: 768px) { .main-nav { display: none; } } .main-nav ul { display: flex; gap: 30px; } .main-nav a { color: #FFFFFF; font-weight: 700; font-size: 14px; transition: color 0.2s ease; } .main-nav a:not(.btn):hover { color: #F27527; } .hamburger-menu { display: none; flex-direction: column; justify-content: space-around; width: 28px; height: 24px; z-index: 110; } @media (max-width: 768px) { .hamburger-menu { display: flex; } } .hamburger-menu span { width: 100%; height: 3px; background-color: #FFFFFF; border-radius: 2px; transition: transform 0.3s ease, opacity 0.3s ease; } .hamburger-menu.active span:nth-child(1) { transform: translateY(10px) rotate(45deg); } .hamburger-menu.active span:nth-child(2) { opacity: 0; } .hamburger-menu.active span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); } .mobile-nav-menu { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(23, 21, 32, 0.95); backdrop-filter: blur(10px); flex-direction: column; align-items: center; justify-content: center; z-index: 99; } .mobile-nav-menu.active { display: flex; } .mobile-nav-menu ul { text-align: center; } .mobile-nav-menu li { margin-bottom: 40px; } .mobile-nav-menu a { font-size: 24px; font-weight: 700; color: #FFFFFF; } .site-footer-main { background-color: #EFEFEF; color: #171520; padding: 60px 0; } .footer-container { display: grid; grid-template-columns: repeat(3, 1fr); align-items: flex-start; gap: 30px; } @media (max-width: 992px) { .footer-container { grid-template-columns: 1fr; text-align: center; } } .footer-column { display: flex; flex-direction: column; } @media (max-width: 992px) { .footer-column { align-items: center; } } .footer-nav { display: flex; flex-direction: row; gap: 40px; } .footer-nav a { font-weight: 700; } .footer-center { align-items: center; text-align: center; } .footer-center .footer-logo { height: 42px; margin-bottom: 20px; } .footer-center p { font-size: 14px; line-height: 1.6; text-transform: uppercase; } .footer-center p a { color: #2E75F1; text-transform: none; font-weight: 700; } .footer-right { align-items: flex-end; } @media (max-width: 992px) { .footer-right { align-items: center; } } .footer-right .footer-nav-legal { display: flex; gap: 20px; margin-bottom: 72px; flex-wrap: wrap; } @media (max-width: 992px) { .footer-right .footer-nav-legal { justify-content: center; margin-bottom: 20px; } } .footer-right .footer-nav-legal a { text-decoration: underline; } .cookie-consent-modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(23, 21, 32, 0.6); backdrop-filter: blur(5px); align-items: center; justify-content: center; } .cookie-consent-modal.visible { display: flex; } .cookie-consent-modal .cookie-consent-content { background-color: #FFFFFF; color: #171520; padding: 32px; border-radius: 8px; text-align: center; max-width: 500px; margin: 16px; box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2); } .cookie-consent-modal .cookie-consent-content h2 { font-size: 24px; font-weight: 700; margin-bottom: 16px; color: #171520; } .cookie-consent-modal .cookie-consent-content p { margin: 0 0 24px; font-size: 14px; line-height: 1.6; text-align: left; } .cookie-consent-modal .cookie-consent-content a { color: #F27527; text-decoration: underline; font-weight: 700; } .cookie-consent-modal .cookie-consent-content .btn { min-width: 150px; } @media (max-width: 768px) { .cookie-consent-modal .cookie-consent-content { padding: 24px; } } .section-padding { padding-top: 120px; padding-bottom: 120px; } @media (max-width: 992px) { .section-padding { padding-top: 80px; padding-bottom: 80px; } } .alternating-content-section .alternating-block { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; } .alternating-content-section .alternating-block:not(:last-child) { margin-bottom: 120px; } .alternating-content-section .alternating-block.reverse .alternating-block__image { order: 2; } .alternating-content-section .alternating-block.reverse .alternating-block__text { order: 1; } @media (max-width: 992px) { .alternating-content-section .alternating-block { grid-template-columns: 1fr; gap: 40px; } .alternating-content-section .alternating-block.reverse .alternating-block__image { order: 1; } .alternating-content-section .alternating-block.reverse .alternating-block__text { order: 2; } } .alternating-content-section .alternating-block__text .btn { margin-top: 30px; } .home-page .site-header { background: transparent; } .hero-section { color: #FFFFFF; padding: 154px 0 180px; position: relative; } .hero-section::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(105deg, #323235 20%, #171520 70%); z-index: -2; } .hero-section .hero-bg-shape { position: absolute; right: 0; width: 50%; max-width: 775px; z-index: -1; } .hero-section .hero-bg-shape img { width: 100%; height: auto; } @media (max-width: 992px) { .hero-section .hero-bg-shape { opacity: 0.3; width: 70%; } } @media (max-width: 768px) { .hero-section .hero-bg-shape { width: 100%; } } .hero-section .hero-content { position: relative; z-index: 1; max-width: 615px; } .hero-section .hero-content h1 { font-size: clamp(2.5rem, 5vw, 3.25rem); line-height: 1.2; margin-bottom: 34px; font-weight: 400; } .hero-section .hero-content h1 strong { font-weight: 700; } .hero-section .hero-line { position: absolute; bottom: 0; height: 4px; background-color: #F27527; z-index: -1; } .hero-section .hero-line--1 { left: 0; width: 154px; } .hero-section .hero-line--2 { left: 465px; right: 0; width: auto; } @media (max-width: 1200px) { .hero-section .hero-line { display: none; } } @media (max-width: 992px) { .hero-section { padding: 180px 0 120px; } } .intro-section { padding-top: 160px; padding-bottom: 0; overflow-x: clip; } .intro-section .intro-block { max-width: 60%; position: relative; } .intro-section .intro-block::after { content: ""; position: absolute; left: 100%; top: 32px; height: 1px; width: 701px; background-color: rgba(23, 21, 32, 0.2); margin-left: 48px; } @media (max-width: 1200px) { .intro-section .intro-block::after { display: none; } } @media (max-width: 992px) { .intro-section .intro-block { max-width: 100%; } } .solutions-section { overflow-x: clip; } .solutions-section .solutions-heading-wrapper { max-width: 60%; position: relative; } .solutions-section .solutions-heading-wrapper::after { content: ""; position: absolute; left: 100%; top: 32px; height: 1px; width: 701px; background-color: rgba(23, 21, 32, 0.2); margin-left: 48px; } @media (max-width: 1200px) { .solutions-section .solutions-heading-wrapper::after { display: none; } } .collaborative-process-section { padding: 180px 0; background: linear-gradient(117.05deg, #323235 10.66%, #171520 66.9%); color: #FFFFFF; position: relative; overflow: hidden; } .collaborative-process-section::after { content: ""; position: absolute; bottom: 0; left: 0; width: 50%; max-width: 858px; height: 4px; background-color: #F27527; } @media (max-width: 1200px) { .collaborative-process-section::after { display: none; } } @media (max-width: 992px) { .collaborative-process-section { padding: 120px 0; } } .collaborative-process-section .collaborative-process-bg { position: absolute; top: 0; left: 0; height: 100%; width: 50%; } .collaborative-process-section .collaborative-process-bg img { height: 100%; width: auto; max-width: none; object-fit: cover; } @media (max-width: 992px) { .collaborative-process-section .collaborative-process-bg { opacity: 0.1; width: 100%; } } .collaborative-process-section .container { display: flex; justify-content: flex-end; } .collaborative-process-section .collaborative-process-content { max-width: 586px; position: relative; z-index: 1; } .collaborative-process-section .collaborative-process-content h2 { font-size: clamp(2.5rem, 5vw, 3.25rem); font-weight: 400; line-height: 1.2; margin-bottom: 34px; } .collaborative-process-section .collaborative-process-content p { font-size: 14px; } .competitive-section { position: relative; overflow: hidden; } .competitive-section .competitive-bg-image { position: absolute; left: 0; top: 290px; width: 40%; max-width: 595px; z-index: -1; } @media (max-width: 992px) { .competitive-section .competitive-bg-image { display: none; } } .competitive-section .competitive-content-wrapper { display: flex; flex-direction: column; align-items: flex-end; gap: 120px; } @media (max-width: 992px) { .competitive-section .competitive-content-wrapper { align-items: stretch; } } .competitive-section .competitive-item { width: 100%; max-width: 679px; position: relative; } .competitive-section .competitive-item:first-child::before { content: ""; position: absolute; top: 32px; right: 100%; width: 100vw; height: 1px; background-color: rgba(23, 21, 32, 0.2); margin-right: 48px; } .competitive-section .competitive-item .section-heading { margin-bottom: 34px; } @media (max-width: 1200px) { .competitive-section .competitive-item:first-child::before { display: none; } } .embark-section { position: relative; overflow: hidden; } .embark-section .embark-bg-image { position: absolute; right: 0; bottom: 0; width: 35%; max-width: 500px; z-index: -1; } @media (max-width: 992px) { .embark-section .embark-bg-image { display: none; } } .embark-section .embark-content-wrapper { max-width: 656px; position: relative; margin-bottom: 105px; } .embark-section .embark-content-wrapper::after { content: ""; position: absolute; left: 100%; top: 26px; height: 1px; width: 701px; background-color: rgba(23, 21, 32, 0.2); } .embark-section .embark-content-wrapper .btn { margin-top: 30px; margin-left: 48px; min-width: 162px; } @media (max-width: 1200px) { .embark-section .embark-content-wrapper::after { display: none; } } @media (max-width: 992px) { .embark-section .embark-content-wrapper .btn { margin-left: 0; } } .contact-page { background: linear-gradient(117.05deg, #323235 10.66%, #171520 66.9%); } .contact-page .site-header { background: transparent; } .contact-section { position: relative; min-height: calc(100vh - 150px); display: flex; align-items: center; justify-content: center; padding: 60px 0; background-image: url("../images/contact-us-background.png"); background-size: cover; background-position: center; background-repeat: no-repeat; } .contact-section .container { width: 100%; } .contact-us-line { position: absolute; bottom: 0; height: 4px; background-color: #F27527; z-index: 0; } .contact-us-line--1 { left: 0; width: 154px; } .contact-us-line--2 { left: 465px; right: 0; width: auto; } @media (max-width: 1200px) { .contact-us-line { display: none; } } .static-page .site-header { position: relative; background: #171520; } .static-content-section { padding: 60px 0; background: #FFFFFF; color: #171520; } .static-content-section .container { max-width: 800px; } .static-content-section h1 { font-size: clamp(2rem, 4vw, 2.625rem); margin-bottom: 16px; border-bottom: 2px solid #F27527; padding-bottom: 16px; font-weight: 700; } .static-content-section h2 { font-size: clamp(1.25rem, 3vw, 1.5rem); margin-top: 40px; margin-bottom: 12px; font-weight: 700; } .static-content-section p, .static-content-section li { line-height: 1.7; margin-bottom: 16px; } .static-content-section ul { list-style-type: disc; padding-left: 20px; } .static-content-section .meta { font-style: italic; color: #59527c; margin-bottom: 30px; } .static-content-section a { color: #F27527; text-decoration: underline; font-weight: 700; } /*# sourceMappingURL=style.css.map */