/* RESET CSS */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* THEME CSS */
:root {
    --brand-color: #1A78BE;
    --blue: #0000EE;
    --asphalt: #0C0407;
    --mine-shaft: #333;
    --dusty-gray: #999;
    /* --alto: #E0E0E0; */
    --mercury: #E2E2E2;
    --baby-blue: #E3F1FC;
    /* --alabaster: #f9f9f9; */
    --white: #ffffff;

    --primary: var(--brand-color);
    --secondary: var(--blue);
    --accent-background: var(--brand-color);
    --accent-text: var(--asphalt);
    --body-color: var(--mine-shaft);
    --heading-color: var(--asphalt);
    --text-color: var(--mine-shaft);
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: sans-serif;
    height: 100%;
}

body {
    color: var(--body-color);
    font-family: "Inter", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 100%;
    margin: 0;
}

h1 {
    color: var(--heading-color);
    letter-spacing: -.06em;
    margin: .67em 0;
    font-family: Inter, sans-serif;
    font-size: 72px;
    font-weight: 600;
    line-height: 110%;
}

h2 {
    color: var(--heading-color);
    letter-spacing: -.04em;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Inter, sans-serif;
    font-size: 60px;
    font-weight: 600;
    line-height: 110%;
}

h3 {
    color: var(--heading-color);
    margin-top: 0;
    margin-bottom: 0;
    font-family: Inter, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 100%;
}

h4 {
    color: var(--heading-color);
    margin-top: 0;
    margin-bottom: 0;
    font-family: Inter, sans-serif;
    font-size: 40px;
    font-weight: 600;
    line-height: 110%;
}

h5 {
    color: var(--heading-color);
    margin-top: 10px;
    margin-bottom: 10px;
    font-family: Inter, sans-serif;
    font-size: 32px;
    font-weight: 600;
    line-height: 110%;
}

h6 {
    color: var(--heading-color);
    margin-top: 0;
    margin-bottom: 0;
    font-family: Inter, sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
}

p {
    margin-bottom: 0;
    line-height: 24px;
}

ul,
ol {
    margin-top: 0;
    margin-bottom: 10px;
    padding-left: 40px;
}

img {
    max-width: 100%;
    height: auto;
    display: inline-block;
}

blockquote {
    border-left: 5px solid var(--mercury);
    margin-bottom: 10px;
    padding: 10px 20px;
    font-size: 18px;
    line-height: 22px;
}

/* THEME LAYOUT CSS */
.section-spacing {
    padding-left: 20px;
    padding-right: 20px;
}

.container {
    width: 100%;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

/* Section Title */
.section-title-wrap {
    text-align: center;
    width: 100%;
    max-width: 50vw;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto;
}

.section-title {
    display: inline;
    font-size: 72px;
    line-height: 80px;
    background-image: linear-gradient(to right, var(--asphalt) 0%, var(--mercury) 100%);
    transition: background-size 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 2px;
}

.section-title-wrap:hover .section-title {
    background-size: 100% 2px;
}

.section-title-clr {
    color: var(--dusty-gray);
}

/* Section Call to Action */
.section-cta {
    margin-top: 30px;
    align-items: center;
    padding: 60px 0 40px;
    display: flex;
    flex-direction: column;
    row-gap: 30px;
}

.section-cta .btn-group {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: center;
    align-items: center;
    display: flex;
}

/* THEME HEADER CSS */
/* Layout and Structure */
header {
    z-index: 9999;
    position: fixed;
    width: 100%;
}

header.fixed {
    background: var(--baby-blue);
    backdrop-filter: blur(10px);
    box-shadow: 0 64px 56px -12px #0000000d;
}

.nav-section {
    z-index: 99;
    padding-top: 16px;
    padding-bottom: 16px;
    position: relative;
}

.nav-layout {
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.nav-left-wrap {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
    justify-content: flex-start;
    align-items: center;
    display: flex;
}

.nav-left {
    /* Add styles */
}

/* Logo and Branding */
.logo-wrap {
    width: 100%;
    max-width: 106px;
    display: inline-block;
}

.logo {
    /* Add styles */
}

.nav-middle {
    /* Add styles */
}

/* Navigation */
.nav-menu {
    grid-column-gap: 45px;
    grid-row-gap: 45px;
    justify-content: center;
    align-items: center;
    display: flex;
}

.nav-link {
    background-color: #0000;
    color: var(--heading-color);
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    text-decoration: none;
    transition: all .3slinear;
}

.nav-dropdown {
    text-align: left;
    z-index: 900;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    position: relative;
}

.nav-dropdown-toggle {
    user-select: none;
    cursor: pointer;
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    color: var(--heading-color);
    vertical-align: top;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    font-size: 14px;
    line-height: 150%;
    transition: all .3slinear;
    display: flex;
    text-align: left;
    white-space: nowrap;
    margin-left: auto;
    margin-right: auto;
    text-decoration: none;
    position: relative;
}

.nav-dropdown-icon {
    width: 18px;
    height: 18px;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
    position: static;
}

.nav-dropdown-list {
    display: none;
    background: #ddd;
    position: absolute;
    background-color: #fff;
    border-radius: 6px;
    width: auto;
    min-width: 100px;
    overflow: hidden;
}

.nav-dropdown:hover .nav-dropdown-list {
    display: block;
}

.nav-dropdown-inner {
    border: 1px solid #f7f7f7;
    border-radius: 6px;
    padding: 8px;
    overflow: hidden;
    box-shadow: 0 6px 10px -2px #0000000a;
}

.nav-dropdown-link {
    vertical-align: top;
    text-align: left;
    white-space: nowrap;
    margin-left: auto;
    margin-right: auto;
    text-decoration: none;
    position: relative;
    display: block;
    color: #0c0407;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
    transition: all .3slinear;
}

.nav-dropdown-link:hover {
    color: var(--heading-color);
    background-color: var(--mercury);
}

.nav-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    justify-content: flex-end;
    align-items: center;
    display: flex;
}

.nav-open {
    display: none;
}

.nav-bar {
    /* Add styles for _1, _2, and _3 bars */
}

.nav-bar._1,
.nav-bar._2,
.nav-bar._3 {
    /* Add styles for each bar */
}

/* Buttons and Call to Action */
.btn-wrap {
    z-index: 1;
    border: 1px solid var(--heading-color);
    background-color: var(--heading-color);
    color: #fff;
    letter-spacing: -.01em;
    border-radius: 100px;
    padding: 20px 47px;
    font-size: 16px;
    font-weight: 600;
    line-height: 122%;
    text-decoration: none;
    transition: all .3slinear;
    display: inline-block;
    position: relative;
    overflow: hidden;
}

.btn-wrap:hover {
    background-color: #333;
    border-color: #333;
}

.btn-wrap.btn-small {
    padding: 12px 16px;
    font-size: 14px;
    line-height: 112%;
}

.btn-wrap-2 {
    z-index: 1;
    color: var(--heading-color);
    letter-spacing: -.01em;
    background-color: #0000;
    border: 1px solid #e0e0e0;
    border-radius: 100px;
    padding: 20px 47px;
    font-size: 16px;
    font-weight: 600;
    line-height: 122%;
    text-decoration: none;
    transition: all .3slinear;
    position: relative;
    overflow: hidden;
}

.btn-wrap-2:hover {
    border-color: var(--heading-color);
    background-color: var(--heading-color);
    color: var(--white);
}

.btn-inner {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    justify-content: center;
    align-items: center;
    height: 16px;
    display: flex;
}

.btn-icon {
    width: 14px;
    line-height: 1%;
}

.btn-shape {
    /* Add styles */
}

.btn-small {
    /* Add styles */
}

.show-mobile {
    display: none;
}

.main-wrapper {
    margin-bottom: 0;
}

.hero-section,
.page-title-section {
    /* background-image: url("../images/top-dot.svg"), url("../images/top-background.webp");
    background-position: 50% 0, 50% 0;
    background-repeat: no-repeat, no-repeat;
    background-size: cover, cover; */
    padding-top: 120px;
}

.brand-section,
.services-section,
.process-section,
.projects-section,
.technology-section,
.testimonial-section,
.about-section,
.contact-section,
.services-detail-section {
    /* z-index: 11; */
    padding-top: 80px;
    padding-bottom: 120px;
}

/** FOOTER **/
/* Layout and Structure */
.footer-section {
    /* background-color: var(--baby-blue); */
    padding-top: 80px;
    padding-bottom: 40px;
    position: relative;
    overflow-x: clip;
}

.footer-layout {
    /* Add styles */
}

/* Footer Top Section */
.footer-top {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 141px;
    display: flex;
}

.footer-top-left {
    /* Add styles */
}

.footer-title-wrap {
    width: 100%;
    max-width: 747px;
}

.footer-title {
    font-size: 164px;
    line-height: 160px;
}

.footer-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: all .3s;
}


.footer-title:hover a {
    text-decoration: underline;
}

.footer-top-right {
    /* Add styles */
}

/* Footer Widgets */
.footer-widget {
    grid-column-gap: 134px;
    grid-row-gap: 134px;
    align-items: flex-start;
    margin-bottom: 48px;
    display: flex;
}

.footer-wiged.last {
    grid-column-gap: 106px;
    grid-row-gap: 106px;
    margin-bottom: 0;
}

.footer-widget-text-wrap {
    width: 25%;
}

.footer-widget-text {
    color: var(--heading-color);
}

.footer-widget-link-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    display: flex;
}

.footer-widget-link {
    color: var(--heading-color);
    letter-spacing: -.01em;
    font-size: 20px;
    font-weight: 600;
    line-height: 150%;
    text-decoration: none;
    transition: all .3s;
}

/* Footer Bottom Section */
.footer-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.footer-bottom-text-wrap {
    /* Add styles */
}

.footer-bottom-text {
    /* Add styles */
}

.footer-bottom-text-link {
    /* Add styles */
}

.footer-copyright-text-wrap {
    /* Add styles */
}

.footer-copyright-text {
    /* Add styles */
}

.footer-bottom-right-text-wrap {
    /* Add styles */
}

.footer-bottom-right-text {
    /* Add styles */
}

.footer-bottom-right-text-link {
    /* Add styles */
}

/* Footer Shape */
.footer-shape-wrap {
    z-index: -1;
    position: absolute;
    inset: 2% 0% 0%;
    overflow: hidden;
}

.footer-shape {
    width: 100%;
}

/** ERROR Page **/
/* Error Section */
.error-section {
    padding-top: 160px;
    min-height: 50vh;
    position: relative;
}

/* Error Content */
.error-content {
    text-align: center;
    width: 100%;
    max-width: 596px;
    margin-left: auto;
    margin-right: auto;
}

/* Error Titles */
.error-title-wrap {
    margin-bottom: 0;
}

.error-title {
    letter-spacing: -.03px;
    font-size: 300px;
    line-height: 1;
    margin: 0;
}

.error-sub-title-wrap {
    margin-bottom: 20px;
}

.error-sub-title {
    font-size: 32px;
    /* line-height: 120%; */
}

/* Error Text */
.error-text-wrap {
    margin-bottom: 40px;
}

.error-text {
    line-height: 150%;
}

/* Error Button */
.error-btn-wrap {
    /* Add styles */
}

/* Hero Shape */
.common-hero-shape-wrap.error {
    top: -6%;
}

.services-hero-shape {
    width: 100%;
    z-index: -2;
    pointer-events: none;
    position: absolute;
    inset: -30% 0% auto;
}

/** FRONT Page **/
/* Hero Section */
/* Hero Section Layout */
.hero-section {
    position: relative;
    overflow-x: clip;
}

.hero-layout {
    /* Add styles */
}

.hero-content {
    text-align: center;
    width: 100%;
    max-width: 985px;
    margin-left: auto;
    margin-right: auto;
}

.hero-title-wrap {
    margin-bottom: 60px;
    position: relative;
}

/* Hero Title and Subtitle */
.hero-title {
    font-size: 164px;
    line-height: 160px;
    color: var(--heading-color);
    letter-spacing: -.06em;
    margin-top: 0;
    margin-bottom: 0;
}

.hero-subtitle {
    /* Add styles */
}

.hero-title-tag {
    display: inline-block;
    position: absolute;
    inset: 5% auto auto 16%;
}

/* Hero Tags */
.hero-title-tag,
.hero-title-tag-2,
.hero-title-tag-3,
.hero-title-tag-4 {
    /* Add styles */
}

.hero-title-tag-text {
    background-color: var(--white);
    color: var(--heading-color);
    letter-spacing: -.02px;
    border-radius: 100px;
    padding: 16px 22px;
    font-weight: 600;
    line-height: 16px;
    transform: rotate(-15deg);
    box-shadow: 0 28px 72px var(--mine-shaft);
}

.hero-title-tag-text._2 {
    transform: rotate(-20deg);
}

.hero-title-tag-text._3 {
    transform: rotate(0);
}

.hero-title-tag-text._4 {
    transform: rotate(13deg);
}

.hero-title-tag-2 {
    display: inline-block;
    position: absolute;
    inset: 9% 15% auto auto;
}

.hero-title-tag-3 {
    display: inline-block;
    position: absolute;
    inset: auto auto 15% 6%;
}

.hero-title-tag-4 {
    display: inline-block;
    position: absolute;
    inset: auto 17% 17% auto;
}

/* Hero Buttons */
.hero-btn-wrap,
.page-title-btn-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: center;
    align-items: center;
    display: flex;
}

/* Hero Background and Shape */
.hero-shape-wrap,
.page-title-shape-wrap {
    z-index: -2;
    pointer-events: none;
    position: absolute;
    inset: -4% 0% auto;
}

.hero-shape {
    width: 100%;
    filter: blur(60px);
    height: 75vh;
}

/* Optional Hero Thumbnail Section */
.hero-thumb-wrap {
    margin-top: 80px;
    position: relative;
}

.hero-thumb {
    border-radius: 24px;
    width: 100%;
}

.hero-play-btn {
    background-color: var(--mercury);
    color: var(--heading-color);
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    width: 96px;
    height: 96px;
    transition: all .3slinear;
    display: flex;
    position: absolute;
    inset: 50% 0% 0% 50%;
    transform: translate(-50%, -50%);
}

.hero-play-btn-icon {
    width: 32px;
    height: 32px;
}

/** Brand Section **/
/* Layout and Structure */
.brand-section {}

.brand-heading {
    /* Add styles */
}

/* Brand Marquee */
.brand-layout {
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    padding-top: 40px;
    padding-bottom: 40px;
    box-shadow: 0 64px 40px #0000000a;
}

.brand-marquee-wrap {
    z-index: 1;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    display: flex;
    position: relative;
    overflow: hidden;
}

.brand-marquee {
    align-items: center;
    display: flex;
    justify-content: flex-end;
}

.brand-marquee-layout {
    flex: none;
    align-items: center;
    display: flex;
    gap: 20px;
    /* animation: scroll-infinite-left 15s linear infinite; */
}

.brand-marquee-layout:nth-child(2) {
    /* animation: scroll-infinite-right 15s linear infinite; */
}

.brand-marquee:hover .brand-marquee-layout {
    animation-play-state: paused;
}

@keyframes scroll-infinite-left {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@keyframes scroll-infinite-right {
    from {
        transform: translateX(-50%);
    }

    to {
        transform: translateX(0);
    }
}

.brand-item {
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    flex: none;
    margin-right: 20px;
    padding: 28px 33px 27px;
}

.brand-item img {
    /* Add styles for images */
}

/* Brand Shapes */
.brand-shape-1-wrap {
    height: 100%;
    position: absolute;
    inset: 0% auto auto 0%;
}

.brand-shape-2-wrap {
    height: 100%;
    position: absolute;
    inset: 0% 0% auto auto;
}

.brand-shape-1,
.brand-shape-2 {
    /* Add styles */
}

/* Services Section */
/* Services Section Layout */
.services-section {}

/* Services Layout */
.services-layout {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    display: flex;
}

.services {
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    justify-content: space-between;
    align-items: center;
    padding: 32px 51px 32px 32px;
    transition: box-shadow .3slinear;
    display: flex;
    overflow: hidden;
}

.services:hover {
    box-shadow: 0 64px 56px -12px #0000000f;
}

.services-left {
    gap: 60px;
    align-items: center;
    display: flex;
}

/* Services Icon */
.services-icon-wrap {
    background-color: #f7f7f7;
    border-radius: 60px;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 88px;
    height: 88px;
    display: flex;
    opacity: 0;
    margin-left: -150px;
    transition-duration: 0.2s;
    transition-timing-function: ease-in-out;
}

.services:hover .services-icon-wrap {
    opacity: 1;
    margin-left: 0;
}

.services-icon {
    width: 32px;
    height: 32px;
}

/* Services Title */
.services-title-wrap {
    /* Add styles */
}

.services-title {
    font-size: 40px;
}

/* Services Text & Image */
.services-text-wrap {
    width: 100%;
    max-width: 412px;
    position: relative;
    display: flex;
    align-items: center;
}

.services-text {
    width: 100%;
    color: var(--heading-color);
    letter-spacing: -.01em;
    font-size: 14px;
    line-height: 150%;
    position: relative;
    z-index: 2;
    transition-duration: 0.2s;
    transition-timing-function: ease-in-out;
}

.services:hover .services-text {
    opacity: 0;
    padding: 20px;
}

.services-image {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    border-radius: 8px;
    transition-duration: 0.2s;
    transition-timing-function: ease-in-out;
}

.services:hover .services-image {
    opacity: 1;
}

/* Process Section */
/* Layout and Structure */
.process-section {}

.process-layout {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: space-between;
    align-items: center;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
}

/* Process Thumbnail */
.process-thumb-wrap {
    position: relative;
    width: 100%;
    max-width: 670px;
    min-height: 375px;
    flex: 1;
}

.process-thumb {
    border-radius: 24px;
    position: sticky;
    top: 120px;
    left: 0;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

/* Process Content */
.process-content {
    width: 100%;
    max-width: 670px;
}

.process-text-wrap {
    padding: 40px;
    margin-bottom: 30px;
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    display: flex;
    gap: 20px;
    flex: 1;
    flex-direction: column;
    overflow: hidden;
}

.process-text-wrap:hover {
    box-shadow: 0 64px 40px #0000000a;
}

.process-text-wrap h2 {
    font-size: 40px;
}

.process-text-wrap .process-image {
    margin-bottom: -255px;
    transition: all .5s ease-in-out;
}

.process-text-wrap:hover .process-image {
    /* height: auto; */
    margin-bottom: -40px;
}

.process-text {
    color: var(--body-color);
    letter-spacing: -.03em;
    font-size: 20px;
    line-height: 150%;
}

/* Projects Section */
/* Projects Section */
.projects-section {
    /* Add styles */
}

/* Projects Layout */
.projects-layout,
.articles-layout {
    grid-column-gap: 40px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
}

.projects,
.articles-item {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
}

.projects:nth-child(even),
.articles-item:nth-child(even) {
    margin-top: 60px;
}

.projects-thumb-wrap,
.article-thumb-wrap {
    max-width: 100%;
    display: inline-block;
    margin-bottom: 12px;
    text-decoration: none;
    overflow: hidden;
    border-radius: 24px;
}

.projects-thumb-wrap img.projects-thumb,
.article-thumb-wrap img.article-thumb {
    width: 100%;
    transform: scale3d(1, 1, 1);
    transition: all .5s linear;
}

.projects:hover img.projects-thumb,
.articles-item:hover img.article-thumb {
    transform: scale3d(1.1, 1.1, 1.1);
    transform-style: preserve-3d;
}

.projects-content {
    margin-top: 20px;
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: space-between;
    display: flex;
    align-items: center;
}

.projects-title-wrap,
.article-title-wrap {}

.projects-title,
.article-title {
    color: var(--heading-color);
    letter-spacing: -.03em;
    font-size: 32px;
    font-weight: 600;
    line-height: 34px;
    text-decoration: none;
}

.projects-btn,
.article-btn {
    border-radius: 30px;
    padding: 12px 16px;
}

/* Partner Section */
/* Partner Section */
.partner-section {
    /* Add styles */
}

.partner-heading {
    /* Add styles */
}

/* Partner Layout */
.partner-layout {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
}

/* Partner Box */
.partner-box {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    align-items: flex-start;
    padding: 40px;
    transition: all .3slinear;
    display: flex;
}

/* Partner Icon */
.partner-icon-wrap {
    background-color: #f7f7f7;
    border-radius: 60px;
    justify-content: center;
    align-items: center;
    padding: 20px;
    display: flex;
}

.partner-icon {
    flex: none;
}

/* Partner Content */
.partner-content {
    /* Add styles */
}

/* Partner Title */
.partner-title-wrap {
    width: 100%;
    max-width: 300px;
    margin-bottom: 16px;
}

.partner-title {
    font-size: 32px;
    line-height: 40px;
}

/* Partner Text */
.partner-text-wrap {
    width: 100%;
    max-width: 670px;
}

.partner-text {
    color: var(--heading-color);
    letter-spacing: -.01em;
    font-size: 14px;
    line-height: 150%;
}

/* Technology Section */
/* Layout and Structure */
.technology-section {
    /* Add styles */
}

/* Section Title */
.section-title-wrap.technology-heading {
    /* Add styles */
}

/* Technology Logos */
.technology-layout {
    margin-top: 30px;
    margin-bottom: -30px;
    align-items: center;
    padding: 60px 0 40px;
}

.technology-logos-wrap {
    display: flex;
    gap: 40px;
    justify-content: space-evenly;
    align-items: center;
}

.technology-logo {
    /* Add styles */
}

/* Testimonial Section */
/* Layout and Structure */
.testimonial-section {
    /* Add styles */
}


.testimonial-heading .section-cta {
    /* Add styles */
}

.testimonial-layout {
    width: 100%;
    overflow: hidden;
}

.testimonial-items-wrap {
    flex: none;
    align-items: center;
    display: flex;
    margin-bottom: 20px;
}

.testimonial-items-wrap:nth-last-child(1) {
    padding-bottom: 60px;
}

.testimonial-item {
    width: 25vw;
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    flex: none;
    margin-right: 20px;
    padding: 40px;
}

.testimonial-item:hover {
    box-shadow: 0 64px 56px -12px #0000000f;
}

.testimonial-rating-image {
    margin-bottom: 30px;
}

.testimonial-title-wrap {
    width: 100%;
    max-width: 502px;
    margin-bottom: 40px;
}

.testimonial-title {
    letter-spacing: -.03em;
    font-family: Inter, sans-serif;
    font-size: 32px;
    line-height: 34px;
}

.testimonial-text-wrap {
    width: 100%;
    max-width: 522px;
    margin-bottom: 75px;
}

.testimonial-text {
    color: var(--heading-color);
    letter-spacing: -.03em;
    font-size: 20px;
    line-height: 150%;
}

.testimonial-info-wrap {
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.testimonial-info-left {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    align-items: center;
    display: flex;
}

.testimonial-author-wrap {
    width: 100%;
    max-width: 60px;
}

.testimonial-author {
    /* Add styles */
}

.testimonial-info {
    /* Add styles */
}

.testimonial-author-name-wrap {
    /* Add styles */
}

.testimonial-author-name {
    font-family: Inter, sans-serif;
    font-size: 24px;
    line-height: 112%;
}

.testimonial-author-text-wrap {
    /* Add styles */
}

.testimonial-author-text {
    color: var(--heading-color);
}

.testimonial-info-brand-wrap {
    /* Add styles */
}

.testimonial-info-brand {
    /* Add styles */
}

.testimonial-section .section-cta {
    /* margin-top: 0; */
    padding-top: 0;
}

/** 
 ** Pricing Section
**/
/* Layout and Structure */
.pricing-section {
    z-index: 13;
    padding-top: 80px;
    padding-bottom: 70px;
    position: relative;
}

.pricing-layout {
    z-index: 10;
    background-color: var(--white);
    border: 1px solid #e2e2e2;
    border-radius: 36px;
    margin-bottom: 28px;
    padding: 40px 39px 40px 40px;
    display: flex;
    gap: 24px;
    position: relative;
    box-shadow: 0 32px 40px #0000000a;
}

.pricing-item {
    border: 1px solid var(--mercury);
    border-radius: 24px;
    height: 100%;
}

.pricing-item:hover {
    background-color: var(--mine-shaft);
    color: var(--mercury);
}

.pricing-item h2,
.pricing-info-title {
    font-family: Inter, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 112%;
}

.pricing-item:hover h2,
.pricing-item:hover .pricing-info-title {
    background-color: var(--mine-shaft);
    color: var(--baby-blue);
}


/* Pricing Top Section */
.pricing-top,
.pricing-bottom {
    padding: 32px 28px 20px;
}

.pricing-info-wrap {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    align-items: center;
    margin-bottom: 48px;
    display: flex;
    justify-content: space-between;
}

.pricing-info-title {
    color: var(--heading-color);
    letter-spacing: -.04em;
    margin-top: 0;
    margin-bottom: 0;
}

.pricing-info-text {
    border-radius: 20px;
    padding: 8px 12px;
    color: var(--asphalt);
    background-color: var(--baby-blue);
}

.pricing-info-package {
    margin-bottom: 40px;
}

.pricing-item:hover .pricing-info-package span {
    color: var(--dusty-gray);
}

.pricing-info-price {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    align-items: flex-end;
    margin-bottom: 16px;
    display: flex;
}

.pricing-periode {
    letter-spacing: -.01em;
    padding-left: 4px;
    font-size: 14px;
    font-weight: 500;
    line-height: 150%;
}

.pricing-periode::before {
    content: " / "
}

/* Pricing Button */
.pricing-btn {
    padding: 12px 16px;
    font-size: 14px;
    line-height: 112%;
}

/* Pricing Bottom Section */
.pricing-bottom {
    border-top: 1px solid var(--mercury);
}

.pricing-item:hover .pricing-bottom {
    border-color: var(--mercury);
}

.pricing-bottom ul {
    padding: 0;
}

.pricing-bottom li {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="11" viewBox="0 0 15 11" fill="none"><path d="M5.33312 8.64301L12.9931 0.982178L14.1723 2.16051L5.33312 10.9997L0.0297852 5.69634L1.20812 4.51801L5.33312 8.64301Z" fill="%23333333"/></svg>');
    background-position: 0%;
    background-repeat: no-repeat;
    background-size: auto;
    margin-bottom: 18px;
    padding-left: 20px;
    list-style-type: none;
}

.pricing-item:hover .pricing-bottom li {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="11" viewBox="0 0 15 11" fill="none"><path d="M5.33312 8.64301L12.9931 0.982178L14.1723 2.16051L5.33312 10.9997L0.0297852 5.69634L1.20812 4.51801L5.33312 8.64301Z" fill="%23ececec"/></svg>');
}

/** ARCHIVE PAGE **/
/** 
 ** Articles / Blog Section
**/
.page-title-layout.archive-page .page-title {
    text-align: center;
}

.articles-section {
    padding-top: 80px;
    padding-bottom: 70px;
}

/* Category Tabs */
.category-tabs {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    justify-content: center;
    align-items: center;
    /* margin-bottom: 80px; */
    padding-bottom: 0;
    display: flex;
}

.category-tabs-link {
    color: var(--heading-color);
    letter-spacing: -.01em;
    background-color: #0000;
    border: 1px solid #ccc;
    border-radius: 32px;
    flex: none;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 112%;
    transition: all .3slinear;
}

.category-tabs-link:hover,
.category-current {
    background-color: var(--heading-color);
    color: var(--white);
    transition: all .3slinear;
}

/* Articles Layout */
.articles-layout {
    /* Add styles */
}

.articles-item {
    /* Add styles */
}

/* Article Thumbnail */
.article-thumb-wrap {
    /* Add styles */
}

.article-thumb {
    /* Add styles */
}

/* Article Content */
.article-content {
    margin-top: 20px;
    /* Add styles */
}

.article-title-wrap {
    /* Add styles */
}

.article-title {
    /* Add styles */
}

/* Article Info */
.article-info-wrap {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    align-items: center;
    margin: 22px 0;
    display: flex;
}

.article-info-wrap .info-author,
.article-info-wrap .info-date,
.article-info-wrap .info-read-time {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    align-items: center;
    display: flex;
    font-weight: 500;
    line-height: 100%;
}

.article-info-wrap .info-author svg,
.article-info-wrap .info-date svg,
.article-info-wrap .info-read-time svg {
    color: var(--heading-color);
    width: 16px;
    height: 16px;
    line-height: 1px;
}

/* Article Button */
.article-button-wrap {
    max-width: 100%;
    display: inline-block;
}

.article-btn {
    padding: 12px 16px;
}


/** INNER Page **/
/* Page title Section */
.page-title-section {
    min-height: 10vh;
    padding-bottom: 100px;
    background-color: var(--baby-blue);
}

.page-title-wrap {
    margin-bottom: 30px;
}

.page-title-layout.sub-pages .page-title-wrap {
    padding: 0 10%;
}

.page-title {
    font-size: 160px;
    margin: 0 0 30px 0;
}

.page-title-layout.sub-pages .page-title {
    text-align: center;
    font-size: 90px;
}

.page-title span {
    display: flex;
    align-items: center;
    column-gap: 40px;
    row-gap: 0;
}

.page-title-image-wraper {
    /* Add styles */
}

.page-title-image {
    flex-shrink: 1;
    height: 160px;
    width: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.page-title-subtitle {
    margin: 0 0 30px 0;
}

.page-title-layout.sub-pages .page-subtitle {
    text-align: center;
    font-size: 24px;
}

/* Buttons and Call to Action */
.page-title-btn-wrap {
    justify-content: flex-start;
}


.page-title-layout.sub-pages .page-title-btn-wrap {
    justify-content: center;
}

/** ABOUT US Page **/
/* Layout and Structure */
.about-layout,
.services-detail-layout {
    /* Add styles */
}

.about-content-wrap,
.services-detail-content-wrap {
    display: flex;
    align-items: center;
    gap: 40px;
}

.about-content-left,
.services-detail-content-left {
    flex: 1 1 0px;
    padding-right: 40px;
}

.about-content-right,
.services-detail-content-right {
    flex: 1 1 0px;
}

/* Typography */
.about-content-left h2,
.services-detail-content-left h2 {
    margin-bottom: 30px;
}

.about-content-right p,
.about-stat-title,
.services-detail-content-right p,
.services-detail-stat-title {
    margin-bottom: 30px;
}

/* Statistics Section */
.about-stat-wrap,
.services-detail-stat-wrap {
    padding-top: 60px;
    display: flex;
    gap: 40px;
}

.about-stat-item,
.services-detail-stat-item {
    flex: 1 1 0px;
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    padding: 40px;
    transition: all .3slinear;
}

.about-stat-item:hover,
.services-detail-stat-item:hover {
    box-shadow: 0 64px 56px -12px #0000000f;
}

.about-stat-title,
.services-detail-stat-title {
    font-size: 32px;
}

.about-stat-text,
.services-detail-stat-text {
    /* Add styles */
}

/** SERVICES Page **/
/* FAQs Section */
.faqs-section {
    /* Add styles */
}

.faqs-heading {
    /* Add styles */
}

/* Layout */
.faqs-layout {}

.faq-items-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    width: 100%;
    max-width: 976px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
}

/* FAQ Items */
.faq-item {
    background-color: #0000;
    border: 1px solid #e2e2e2;
    border-radius: 20px;
    padding: 40px;
    transition: box-shadow .3slinear;
}

.faq-title-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.faq-title {
    color: #000;
    letter-spacing: 0;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Inter, sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 112%;
}

/* Icons */
.faq-icon {
    z-index: 1;
    flex: none;
    width: 16px;
    height: 16px;
    position: relative;
}

.faq-icon-plus {
    background-color: #0c0407;
    width: 2px;
    height: 100%;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
}

.faq-icon-minus {
    background-color: #0c0407;
    width: 100%;
    height: 2px;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
}

/* FAQ Text */
.faq-text-wrap {
    width: 100%;
    max-width: 725px;
    padding-bottom: 0;
    overflow: hidden;
}

.faq-text {
    color: var(--text-color);
    margin-top: 12px;
    margin-bottom: 0;
    font-size: 16px;
    line-height: 24px;
}

/** 
 ** CONTACT Page
**/
/* Layout and Structure */
.contact-section {}

.contact-layout {
    margin-bottom: 60px;
}

/* Content */
.contact-content-wrap {
    display: flex;
    /* align-items: center; */
    gap: 40px;
}

.contact-content-left {
    flex: 1 1 0px;
    padding-right: 40px;
}


.contact-content-left h2 {
    margin-bottom: 30px;
}

.contact-content-right {
    flex: 1 1 0px;
}

/* Form Wrapper */
.contact-form-wrap {
    border: 1px solid #e2e2e2;
    border-radius: 36px;
    width: 100%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding: 60px;
    box-shadow: 0 32px 40px #0000000a;
}

.contact-us-wrap {
    /* Add styles */
}

.contact-us {
    /* Add styles */
}

/* Form Elements */
.contact-us-grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    margin-bottom: 24px;
    display: grid;
}

.contact-us-input-wrap,
.contact-us-select-wrap,
.contact-us-textarea-wrap {
    display: flex;
    flex-direction: column;
}

.contact-us-label {
    color: var(--heading-color);
    letter-spacing: -.01px;
    margin-bottom: 12px;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
}

.contact-us-input {
    color: var(--heading-color);
    border: 1px solid #e2e2e2;
    border-radius: 12px;
    margin-bottom: 0;
    padding: 16px 20px;
    vertical-align: middle;
    background-color: #fff;
    font-size: 14px;
    line-height: 1.42857;
    display: block;
}

.contact-us-select-wrap,
.contact-us-textarea-wrap {
    margin-bottom: 24px;
}

.contact-us-dropdown {
    background-color: var(--white);
    color: var(--body-color);
    -webkit-appearance: none;
    appearance: none;
    /* background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 18 18' fill='none' xmlns='http%3A%2F%2Fwww.w3.org/2000/svg'%3E%3Cpath d='M8.99956 9.87876L12.7121 6.16626L13.7726 7.22676L8.99956 11.9998L4.22656 7.22676L5.28706 6.16626L8.99956 9.87876Z' fill='currentColor'/%3E%3C/svg%3E"); */
    background-position: 96%;
    background-repeat: no-repeat;
    background-size: auto;
    border: 1px solid #e2e2e2;
    border-radius: 12px;
    width: 100%;
    height: 53px;
    margin-bottom: 0;
    padding: 16px 20px;
}

.contact-us-textarea-wrap {
    /* Add styles */
}

.contact-us-textarea {
    color: var(--heading-color);
    border: 1px solid #e2e2e2;
    border-radius: 12px;
    height: 153px;
    min-height: 153px;
    margin-bottom: 0;
    padding: 16px 20px;
}

/* Button */
.contact-us-btn-wrap {
    /* Add styles */
}

.contact-us-btn {
    /* Add styles */
}

.btn-wrap {
    /* Add styles */
}

.btn-inner {
    /* Add styles */
}

.btn-icon {
    /* Add styles */
}

/* Form Submission Messages */
.w-form-done,
.w-form-fail {
    text-align: center;
    background-color: #ddd;
    padding: 20px;
    margin-top: 30px;
    /* display: none; */
}

.w-form-fail {
    background-color: #ffdede;
}

/** 
 ** Services Inner Page
**/
/* Layout and Structure */
.offer-section {}

.offer-heading {
    /* Add styles */
}

/* Offer Items */
.offer-layout {
    margin-top: 30px;
}

.offer-item {
    display: flex;
    align-items: center;
    gap: 60px;
    border: 1px solid #e2e2e2;
    border-radius: 28px;
    padding: 40px;
    margin-bottom: 30px;
}

.offer-item:hover {
    box-shadow: 0 64px 56px -12px #0000000f;
}

.offer-title-wrap {
    width: 50%;
    display: flex;
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    align-items: center;
    transition: all .3slinear;
}

.offer-title-index {
    font-size: 32px;
    font-weight: 600;
    background-color: #f7f7f7;
    border-radius: 60px;
    justify-content: center;
    align-items: center;
    width: 88px;
    height: 88px;
    display: flex;
}

.offer-title {
    font-size: 32px;
}

/* Offer Content */
.offer-content-wrap {
    flex: 1 1 0px;
}

.offer-content {
    /* Add styles */
}