@charset "utf-8";

@font-face { font-family: 'Arial'; src: local('Arial Bold'), local('Arial-BoldMT'), url('fonts/Arial-BoldMT.woff2') format('woff2'), url('fonts/Arial-BoldMT.woff') format('woff'), url('fonts/Arial-BoldMT.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; }
@font-face { font-family: 'Arial'; src: local('Arial'), local('ArialMT'), url('fonts/ArialMT.woff2') format('woff2'), url('fonts/ArialMT.woff') format('woff'), url('fonts/ArialMT.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }


:root {
	/* COLOR VARIABLES */
	--white: 255 255 255;
	--black: 0 0 0;
	--primary-color: 255 129 0;
	--dark-gray: 59 59 59;
	--orange: 255 104 0;

	/* TRANSITION SPEED */
	--all-fast: all 0.3s;
	--all-medium: all 0.5s;
	--all-slow: all 0.8s;

	/* GAP */
	--gap-xs: 8px;
	--gap-sm: 16px;
	--gap-md: 24px;
	--gap-lg: 32px;
	--gap-xl: 40px;
	--gap-xxl: 48px;
	--gap-xxxl: 56px;

	/* FONT FAMILY */
	--primary: 'Arial';
}

/* ========================== COMMON CSS ========================== */
*,
ul,
ol,
li,
a { margin: 0; padding: 0; list-style-type: none; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: var(--primary); font-weight: 300; line-height: 150%; color: inherit; color: rgb(var(--black) / 100%); }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: var(--primary); }
input,
input:focus,
textarea,
textarea:focus,
.form-control,
.form-control:focus { -webkit-box-shadow: none; box-shadow: none; outline: none; background: transparent; color: rgb(var(--black) / 70%); }
.btn:focus { box-shadow: none; }
*,
a,
button:hover,
button:focus { text-decoration: none; outline: 0; color: inherit; }
button { background: transparent; outline: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; }
[type=reset], [type=submit], button, html [type=button] { -webkit-appearance: none; outline: none; border: none; }
a { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
a:hover { color: inherit; }

body { width: 100%; font-size: 18px; line-height: 140%; width: 100%; position: relative; font-weight: 300; font-family: var(--primary); color: rgb(var(--black) / 100%); z-index: 1; overflow-x: hidden; -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); opacity: 1; }
/* body.show { opacity: 1; } */
body p { font-size: 18px; line-height: 140%; color: rgb(var(--black) / 80%); margin-bottom: calc(var(--gap-xl) / 2); font-weight: 300; font-family: var(--primary); }

.no-scroll { overflow: hidden; }
section { overflow: hidden; }

hr { border-top: 1px solid rgb(var(--black) / 10%); }

::-moz-selection { color: rgb(var(--white) / 100%); background: rgb(var(--primary-color) / 100%); }
::selection { color: rgb(var(--white) / 100%); background: rgb(var(--primary-color) / 100%); }

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 3px rgb(var(--white) / 80%); box-shadow: inset 0 0 3px rgb(var(--white) / 80%); }
::-webkit-scrollbar-thumb { background-color: rgb(var(--primary-color) / 100%); transition: var(--all-medium); }

/* Chrome Safari Edge Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

@media screen and (min-width: 1200px) {
	.container-fluid { max-width: calc(100% - 120px); margin: 0 auto; position: relative; }
}
@media screen and (min-width: 1500px) {
	.container { max-width: 1320px; position: relative; z-index: 1; }
}
@media screen and (min-width: 1921px) {
	.container { max-width: 1680px; position: relative; z-index: 1; }
}

::-webkit-input-placeholder { color: rgb(var(--black) / 60%); }
::-moz-placeholder { color: rgb(var(--black) / 60%); }
:-ms-input-placeholder { color: rgb(var(--black) / 60%); }
::-ms-input-placeholder { color: rgb(var(--black) / 60%); }
::placeholder { -webkit-transition: var(--all-fast); -o-transition: var(--all-fast); transition: var(--all-fast); color: rgb(var(--black) / 80%); }

.form-group { margin-bottom: 40px; }
.form-group p { margin-bottom: 0; }
.form-control, .form-select { width: 100%; padding: 10px 0px; font-size: 16px; font-weight: 400; color: rgb(var(--black) / 100%); line-height: 150%; border: none; border-bottom: 1px solid rgb(var(--black) / 30%); border-radius: 0; -moz-appearance: none; appearance: none; -webkit-appearance: none; background: transparent; }
.form-control:not(:-moz-placeholder-shown) ~ label { font-size: 14px; transform: translateY(-20px); }
.form-control:not(:-ms-input-placeholder) ~ label { font-size: 14px; -ms-transform: translateY(-20px); transform: translateY(-20px); }
.form-control:focus ~ label, .form-control:not(:placeholder-shown) ~ label { font-size: 14px; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
.form-control:focus, .form-select:focus { color: var(--black, #252324); background: transparent; border-bottom: 1px solid rgb(var(--black) / 100%); outline: none; -webkit-box-shadow: none; box-shadow: none; }

.intl-tel-input.separate-dial-code .selected-flag { background-color: transparent !important; }

select.form-control:not([size]):not([multiple]), textarea.form-control { height: auto; }

.form-select { background: transparent url(../images/icons/dropdown-arrow-black.svg) right center no-repeat; background-size: 13px; color: rgb(var(--black) / 100%); font-size: 16px; font-weight: 400; line-height: 150%; padding: 10px 0; padding-right: 15px; border-bottom: 1px solid rgb(var(--black) / 30%); border-radius: 0; cursor: pointer; }
.form-select:focus { background: transparent url(../images/icons/dropdown-arrow-black.svg) right center no-repeat; background-size: 13px; }

.input-group { border-bottom: 1px solid rgb(var(--black) / 30%); }
.input-group .dropdown-toggle { font-size: 16px; display: flex; flex-flow: row wrap; align-items: center; margin-right: var(--gap-xs); }
.input-group .dropdown-toggle img { width: 24px; object-fit: contain; margin-right: 4px; }
.input-group .form-control { border: none; }

.form--file { display: flex; flex-flow: row wrap; align-items: center; padding: 10px 0px; line-height: 150%; border-bottom: 1px solid rgb(var(--black) / 30%); font-size: 16px; font-weight: 400; color: rgb(var(--black) / 60%); position: relative; }
.form--file .label_filename { flex: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 1; overflow: hidden; }
.form--file:has(span) { margin-bottom: 20px; }
.form--file img { width: 12px; margin-right: 10px; }
.form--file span { position: absolute; top: 100%; left: 0; font-size: 12px; margin-top: 5px; opacity: 0.8; }

/* Firefox */
input[type=number] { -moz-appearance: textfield; }

.img-box, .video--box { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
img, video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: var(--all-medium); }

#smooth-content { position: relative; }

/* STYLE GUIDE */
/* HEADINGS */
.hero-1, .hero-1 span { --font-size: 64px; font-size: var(--font-size); line-height: 100%; font-weight: 700; font-family: var(--primary); text-transform: uppercase; margin-bottom: 0; }
.h1 { --font-size: 60px; font-size: var(--font-size); line-height: 130%; font-weight: 300; font-family: var(--primary); text-transform: capitalize; margin-bottom: var(--gap-xxxl); }
.h2 { --font-size: 20px; font-size: var(--font-size); line-height: 132%; font-weight: 300; text-transform: uppercase; font-family: var(--primary); margin-bottom: var(--gap-sm); }
.h3 { --font-size: 32px; font-size: var(--font-size); line-height: 120%; font-weight: 400; font-family: var(--primary); text-transform: uppercase; margin-bottom: var(--gap-sm); }
.h4 { --font-size: 24px; font-size: var(--font-size); line-height: 132%; font-weight: 200; font-family: var(--primary); text-transform: initial; margin-bottom: var(--gap-sm); }
.h4::first-letter { text-transform: uppercase; }
.h5 { --font-size: 40px; font-size: var(--font-size); line-height: 130%; font-weight: 400; font-family: var(--primary); text-transform: uppercase; margin-bottom: var(--gap-sm); }
.h6 { --font-size: 36px; font-size: var(--font-size); line-height: 130%; font-weight: 400; letter-spacing: calc((var(--font-size) / 100 * 3) * -1); font-family: var(--primary); text-transform: uppercase; margin-bottom: var(--gap-sm); }

.pl-p { --font-size: 20px; font-size: var(--font-size); line-height: 140%; font-weight: 400; font-family: var(--primary); }
.pl-s { --font-size: 20px; font-size: var(--font-size); line-height: 140%; letter-spacing: calc(var(--font-size) / 100 * 2); font-weight: 300; font-family: var(--primary); }
.pn { --font-size: 16px; font-size: var(--font-size); line-height: 140%; letter-spacing: calc(var(--font-size) / 100 * 2); font-weight: 300; font-family: var(--primary); }

.section--title--wrapper { display: flex; flex-flow: column wrap; align-items: center; text-align: center; padding-bottom: var(--gap-xxxl); }
.section--title { --font-size: 20px; font-size: var(--font-size); line-height: 130%; font-weight: 300; font-family: var(--primary); color: rgb(var(--black) / 100%); text-transform: uppercase; margin-bottom: var(--gap-sm); position: relative; }
.section--subtitle { --font-size: 60px; font-size: var(--font-size); line-height: 130%; font-weight: 300; font-family: var(--primary); color: rgb(var(--black) / 100%); margin-bottom: var(--gap-xxxl); text-transform: capitalize; position: relative; }
.section--title + .h2 { margin-bottom: 0; }

.realted--category--title { display: block; color: rgb(var(--primary-color) / 100%); }
.realted--category--title:hover { color: rgb(var(--primary-color) / 100%); }
.realted--category--title img { display: inline; width: 30px; margin-left: 30px; transition: var(--all-medium); }

@media screen and (hover: hover) {
	.realted--category--title:hover { color: rgb(var(--primary-color) / 100%); }
	.realted--category--title:hover img { transform: translate(20px); }
}

/* BUTTONS */
.btn { position: relative; display: inline-flex; align-items: center; padding: calc(var(--gap-md) - 4px) var(--gap-xl); border: 1px solid transparent; cursor: pointer; border-radius: 0; -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); overflow: hidden; z-index: 1; }
.btn span { display: flex; --font-size: 14px; font-size: var(--font-size); font-weight: 400; line-height: 1; text-align: center; letter-spacing: calc(var(--font-size) / 100 * 18); text-transform: uppercase; font-family: var(--primary); -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); }
.btn .svg { width: 32px; margin-right: var(--gap-lg); }
.btn .svg path { fill: rgb(var(--white) / 100%); -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); }
.btn span + .svg { margin-right: 0; margin-left: calc(var(--gap-lg) * 2); }

.btn--primary { background: rgb(var(--primary-color) / 100%); border-color: rgb(var(--primary-color) / 100%); }
.btn--primary span { color: rgb(var(--white) / 100%); }

.btn--orange { background: rgb(var(--orange) / 100%); border-color: rgb(var(--orange) / 100%); }
.btn--orange span { color: rgb(var(--white) / 100%); }

.btn--tertiary { background: transparent; border-color: rgb(var(--white) / 100%); }
.btn--tertiary span { color: rgb(var(--white) / 100%); }

.btn--link { --font-size: 16px; font-size: var(--font-size); font-weight: 400; text-transform: uppercase; color: rgb(var(--primary-color) / 100%); font-family: var(--primary); position: relative; padding-bottom: var(--gap-xs); transition: var(--all-medium); }
.btn--link::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 6px; width: 100%; height: 1px; background: rgb(var(--black) / 50%); -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); }

@media screen and (hover: hover) {
.btn--primary:hover { background: transparent; border-color: rgb(var(--primary-color) / 100%); color: rgb(var(--black) / 100%); }
.btn--primary:hover span { color: rgb(var(--primary-color) / 100%); }
.btn--primary:hover .svg path { fill: rgb(var(--primary-color) / 100%); }
.btn--orange:hover { background: transparent; border: 1px solid rgb(var(--orange) / 100%); color: rgb(var(--black) / 100%); }
.btn--orange:hover span { color: rgb(var(--orange) / 100%); }
.btn--orange:hover .svg path { fill: rgb(var(--black) / 100%); }
.btn--tertiary:hover { background: rgb(var(--primary-color) / 100%); border-color: rgb(var(--primary-color) / 100%); color: rgb(var(--white) / 100%); }
.btn--tertiary:hover span { color: rgb(var(--white) / 100%); }
.btn--tertiary:hover .svg path { fill: rgb(var(--white) / 100%); }
.btn--link:hover, .btn--link:focus { color: rgb(var(--primary-color) / 100%); }
.btn--link:hover::after, .btn--link:focus::after { width: 50%; }
}

/* BLT LIST */
.blt--list { padding-left: 0; }
.blt--list li { padding: var(--gap-xs) 0; border-bottom: 1px solid rgb(var(--black) / 20%); }
.blt--list li:first-child { border-top: 1px solid rgb(var(--black) / 20%); }
.blt--list li .pl-i { margin-bottom: 0; }

.section--spacing { padding: calc(var(--gap-xl) * 3) 0; }

canvas { position: fixed; top: 0; left: 0; z-index: 100; pointer-events: none; }

/* LOADER */
.loader { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background: rgb(var(--black) / 100%); z-index: 4; }
.loader video { width: 100%; height: 100%; object-fit: cover; }

@media screen and (hover: hover) {
	[data-fadeInLeft] { transform: translateX(-80%); transition: all 2s; }
	.active[data-fadeInLeft] { transform: translateX(0%); }
	[data-fadeInRight] { transform: translateX(80%); transition: all 2s; }
	.active[data-fadeInRight] { transform: translateX(0%); }
}


/* HEADER */
.header { position: fixed; left: 0; top: 0; width: 100%; padding: calc(var(--gap-xl) / 2) 0; z-index: 3; background: rgb(var(--black) / 17%); -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); }
.header .logo { display: flex; width: 210px; position: relative; transition: var(--all-medium); }
.header .logo img { display: flex; transition: var(--all-medium); }
.header.active .logo { width: 200px; }

.header .navbar--nav.left { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-end; }
.header .navbar--nav.left li a { --font-size: 16px; font-size: var(--font-size); letter-spacing: calc(var(--font-size) / 100 * 3); line-height: 100%; text-transform: uppercase; font-family: var(--primary); color: rgb(var(--white) / 50%); display: flex; flex-wrap: wrap; align-items: center; padding: var(--gap-sm) var(--gap-md); transition: var(--all-medium); }
.header .navbar--nav.left li a.active { color: rgb(var(--white) / 100%); }

.header .navbar--nav.right { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-end; }
.header .navbar--nav.right li { padding: 0 var(--gap-lg); transition: var(--all-medium); }
.header .navbar--nav.right li a { position: relative; --font-size: 14px; font-size: var(--font-size); font-weight: 400; color: rgb(var(--white) / 100%); letter-spacing: calc(var(--font-size) / 100 * 18); display: flex; flex-wrap: wrap; align-items: center; text-transform: uppercase; padding: var(--gap-xs) 0; transition: var(--all-slow); }
.header .navbar--nav.right li a img { width: 20px; margin-right: var(--gap-xs); }
.header .navbar--nav.right > li > a:not(.dropdown-toggle, .btn--tertiary, .desktop--hamburger):before { content: ''; position: absolute; right: 0; bottom: 0; width: 0%; height: 1px; background: rgb(var(--white) / 50%); -webkit-transition: var(--all-medium); -o-transition: var(--all-medium); transition: var(--all-medium); }
.header .navbar--nav.right li a.active::before { right: auto; left: 0; width: 100%; background: rgb(var(--primary-color) / 100%); }
.header .navbar--nav.right li a svg { width: 30px; }
.header .navbar--nav.right .btn--tertiary { padding: var(--gap-sm) var(--gap-lg); }
.header .navbar--nav.right li .desktop--hamburger img { width: 40px; margin-right: 0; }

.header.active { background: rgb(var(--black) / 70%); padding: var(--gap-sm) 0; }
.header.active .navbar--nav.right + .btn--primary { padding: var(--gap-sm) calc(var(--gap-lg) * 2); }
.header.active .navbar--nav.right li { padding: 0 var(--gap-md); }
.header.active .navbar--nav.right .btn--tertiary { padding: calc(var(--gap-xs) / 2 * 3) var(--gap-md); margin: 0 var(--gap-sm); }

.header .navbar--nav.right .dropdown-menu { min-width: 120px; background: rgb(var(--white) / 90%); }
.header .navbar--nav.right .dropdown-menu li { padding: 0 var(--gap-sm); }
.header .navbar--nav.right .dropdown-menu li a { color: rgb(var(--black) / 100%); }

@media screen and (hover: hover) {
	.header .navbar--nav.right li a:hover:before { right: auto; left: 0; width: 100%; background: rgb(var(--primary-color) / 100%); }
	.header .navbar--nav.left li a:hover { color: rgb(var(--white) / 100%); }
	.dropdown-item:focus, .dropdown-item:hover { background: unset; }
}	

.overlay { position: absolute; right: 0; top: 0; width: 40%; height: 100%; display: flex; z-index: 0; pointer-events: none; }
.overlay path { fill: #0D0D0D; }

.fullScreen { display: flex; flex-flow: row wrap; align-items: center; position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: flex; z-index: 1000; z-index: 99; pointer-events: none; opacity: 0; }
.fullScreen.show { pointer-events: all; opacity: 1; }

.fullScreen .dark-overlay { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgb(var(--black) / 80%); transition: var(--all-fast); opacity: 0; cursor: pointer; }
.fullScreen.show .dark-overlay { opacity: 1; }

.fullScreen .menu-close { position: absolute; right: calc(40% - 60px); top: 30px; width: 50px; height: 50px; padding: 10px; background: rgb(var(--black) / 100%); z-index: 9; opacity: 0; pointer-events: none; transition: var(--all-medium); }

.navigation { position: fixed; right: 0; width: 40%; height: 100dvh; overflow: auto; display: flex; flex-flow: row wrap; align-items: flex-start; align-content: flex-start; padding: 120px 50px 50px; opacity: 0; transition: var(--all-medium); }
.navigation::-webkit-scrollbar { width: 0; }
.fullScreen.active .navigation { opacity: 1; }
.navigation li { width: 100%; display: flex; flex-flow: row wrap; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.navigation li a { position: relative; display: inline-flex; flex: 1; padding: var(--gap-sm); font-size: 43px; font-family: var(--primary); text-transform: uppercase; font-weight: 200; color: #fff; line-height: 1.2; z-index: 1; transition: var(--all-medium); }
.navigation li a::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; background: url(../images/icons/button-white-arrow.svg) no-repeat center left; background-size: contain; transition: var(--all-medium); }
.navigation li a::before { clip-path: inset(0% 100% 0% 0%); }

@media screen and (hover: hover) {
.navigation li a:hover { padding-left: var(--gap-xxxl); color: rgb(var(--primary-color) / 100%); }
.navigation li a:hover:before { clip-path: inset(0% 0% 0% 0%); }
}

.has-dropdown .dropdown-toggle { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.has-dropdown .dropdown-toggle::after { color: rgb(var(--white) / 100%); font-size: 20px; transition: var(--all-medium); }
.has-dropdown .dropdown-toggle.active::after { transform: rotate(180deg); }
.has-dropdown .dropdown { overflow: hidden; opacity: 0; width: 100%; transition: var(--all-medium); }
.has-dropdown .dropdown a { position: relative; display: inline-flex; flex: 1; padding: var(--gap-sm); font-size: 24px; font-family: var(--primary); text-transform: uppercase; font-weight: 200; color: #fff; line-height: 1.2; z-index: 1; transition: var(--all-medium); }

/* HOME BANNER */
.home--banner--space { width: 100%; }
.home--banner--space .space--1 { height: 100vh; width: 100%; }
.home--banner { position: fixed; top: 0; left: 0; width: 100%; z-index: 1; will-change: transform; }
.home--banner .swiper-creative .swiper-slide { opacity: 0 !important; }
.home--banner .swiper-creative .swiper-slide.swiper-slide-active { opacity: 1 !important; }

.video--wrapper { position: relative; height: 100vh; overflow: hidden; width: 100%; max-width: 100%; z-index: -1; }
.video--wrapper iframe { position: absolute; left: 50%; top: 50%; width: 100vw; height: 62.25vw; min-height: 100vh; min-width: 177.77vh; transform: translate(-50%,-50%); pointer-events: none; }

.home--banner .banner--bg { position: relative; width: 100%; height: 100vh; z-index: 1; }
.home--banner .banner--bg::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 35%; background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 28%,rgba(0,0,0,1) 100%); }
.home--banner .banner--content { width: 100%; position: absolute; left: 0; bottom: var(--gap-md); z-index: 1; }
.home--banner .banner--content .hero-1 { color: rgb(var(--white) / 100%); line-height: 80%; margin-bottom: 0; }
.home--banner .banner--content .hero-1 span { color: transparent; -webkit-text-stroke: 0.5px rgb(var(--white) / 100%); margin-bottom: 0; }
.home--banner .banner--content .h4 { color: rgb(var(--white) / 100%); margin-bottom: 0; }
.home--banner .banner--content .btn--link::after { background: rgb(var(--white) / 100%); }

.mute-toggle { width: 30px; aspect-ratio: 1; position: absolute; left: var(--gap-xxxl); top: 45%; padding: 0; z-index: 111; writing-mode: vertical-lr; transform: translateY(-50%) rotate(180deg); text-transform: uppercase; color: rgb(var(--white) / 100%); font-weight: 100; font-size: 16px; }

.play-toggle { display: flex; width: 60px; height: 60px; border-radius: 50%; background: rgb(var(--white) / 20%); position: absolute; left: 50%; top: 50%; padding: 15px; z-index: 111; writing-mode: vertical-lr; transform: translateX(-50%) translateY(-50%); text-transform: uppercase; color: rgb(var(--white) / 100%); font-weight: 100; font-size: 16px; }
.play-toggle img { opacity: 0.5; transition: var(--all-medium); }
.play-toggle:hover img { opacity: 1; }

.scroll--down { display: flex; flex-flow: column wrap; align-items: center; position: absolute; left: var(--gap-xxxl); bottom: calc(var(--gap-xxl) * 4); z-index: 11; }
.scroll--down span { --font-size: 12px; font-size: var(--font-size); font-weight: 200; letter-spacing: calc(var(--font-size) / 100 * 20); text-transform: uppercase; color: rgb(var(--white) / 100%); writing-mode: vertical-lr; transform: rotate(180deg); margin-bottom: var(--gap-xs); }
.scroll--down img { width: 22px; }

.home--banner .swiper-pagination { position: absolute; left: auto; right: 60px; bottom: 50%; transform: translateY(50%); display: flex; flex-flow: column wrap; width: auto; align-items: flex-end; z-index: 2; }
.home--banner .swiper-pagination .swiper-pagination-bullet { position: relative; width: 20px; height: 15px; border-radius: 0; background: transparent; margin: 5px 0; opacity: 1; transition: var(--all-medium); }
.home--banner .swiper-pagination .swiper-pagination-bullet::before { content: ''; position: absolute; right: 0; top: 50%; width: 100%; height: 2px; background: rgb(var(--white) / 100%); border-radius: 0; transition: var(--all-medium); }
.home--banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 30px; background: transparent; }
.home--banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before { background: rgb(var(--primary-color) / 100%); }

/* ABOUT US */
.home--about { width: 100%; z-index: 1; padding: calc(var(--gap-xxl) * 2) 0; background: rgb(var(--white) / 100%); display: flex; align-items: center; will-change: transform, opacity, clip-path; }
.home--about .section--subtitle + .row { --bs-gutter-x: calc(var(--gap-xl) * 2); }
.home--about .img-box { position: relative; width: 100%; height: 100%; }
.home--about .img-box img { position: absolute; left: 0; top: 0; }
.home--about .h4 { margin-bottom: var(--gap-sm); }
.home--about .features--list { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(100% / 3), 1fr)); gap: var(--gap-xs) calc(var(--gap-xl) * 3); margin-top: var(--gap-xl); }
.home--about .features--list:has( + .btn--link) { margin-bottom: var(--gap-xxl); }
.home--about .features--list li { display: flex; flex-flow: row wrap; border-top: 1px solid rgb(var(--dark-gray) / 50%); padding: var(--gap-sm) 0; }
.home--about .features--list li .number { width: 100%; font-size: 62px; font-weight: 200; line-height: 1; margin-bottom: var(--gap-xs); }
.home--about .features--list li .number span { font-size: 62px; font-weight: 200; line-height: 1; }
.home--about .features--list li .number small { font-size: 20px; font-weight: 200; line-height: 1; }
.home--about .features--list li .pl-s { width: 100%; text-transform: lowercase; }
.home--about .features--list li .pl-s:first-letter { text-transform: capitalize; }

@media screen and (hover: hover) {
	.home--about .img-box { clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
}

/* OUR PROJECTS */
.our--projects { padding: calc(var(--gap-xxl) * 2) 0 0; position: relative; overflow: hidden; background: rgb(var(--black) / 2%); }
.our--projects .section--subtitle { margin-bottom: 0; }
.our--projects .container-fluid { margin-bottom: var(--gap-xxxl); }

.projects--sliders--wrapper { position: relative; display: flex; overflow: hidden; background: rgb(var(--black) / 100%); }

.project--slide { position: relative; }
.project--slide .project--content { position: absolute; left: 0; bottom: 0; z-index: 1; padding: calc(var(--gap-lg) * 2) var(--gap-xxxl); }
.project--slide .project--content .project--title { display: flex; flex-flow: row wrap; align-items: center; --font-size: 40px; font-size: var(--font-size); font-weight: 400; color: rgb(var(--white) / 100%); font-family: var(--primary); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 1; position: relative; max-width: 450px; padding-right: 60px; }
.project--slide .project--content .project--title img { position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 45px; object-fit: contain; margin-left: var(--gap-md); }
.project--slide .project--bg { background: rgb(var(--black) / 100%); width: 100%; height: calc(100vh - 200px); position: relative; }
.project--slide .project--bg::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 28%,rgba(0,0,0,1) 100%); z-index: 1; }

.project--thumbs--wrapper { position: absolute; right: var(--gap-xl); bottom: var(--gap-md); width: 50%; padding: 0 calc(var(--gap-lg) * 2); z-index: 11; }
.project--thumbs--wrapper .swiper-button-prev, .project--thumbs--wrapper .swiper-button-next { color: rgb(var(--white) / 100%); }
.project--thumbs { width: 100%; }
.project--thumbs .swiper-slide { cursor: pointer; }
.project--thumbs .img-box { display: flex; width: 100%; aspect-ratio: 28/16; border: 1px solid rgb(var(--white) / 20%); background: rgb(var(--black) / 100%); margin-bottom: var(--gap-xs); transition: var(--all-medium); }
.project--thumbs .img-box img { opacity: 1; }
.project--thumbs .swiper-slide-thumb-active .img-box { border-color: rgb(var(--primary-color) / 100%); }
.project--thumbs .swiper-slide-thumb-active .img-box img { opacity: 1; }
.project--thumbs .pl-s { width: 100%; --font-size: 18px; font-size: var(--font-size); color: rgb(var(--white) / 100%); margin-bottom: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 1; }

@media screen and (hover: hover) {
	.projects--sliders--wrapper { transform: translateY(200px) scale(0.8); will-change: transform; }
	.project--thumbs--wrapper { transform: translateY(-200px); opacity: 0; }
	.project--slide .project--content:hover .project--title img { margin-left: var(--gap-lg); }
}

/* PRODUCTS SERVICES */
.products--services { padding: calc(var(--gap-xxl) * 2) 0; }
.products--services .section--subtitle { margin-bottom: var(--gap-xxxl); }
.product--card { display: flex; flex-flow: row wrap; }
.product--card .card--img { width: 100%; aspect-ratio: 42/24; overflow: hidden; background: rgb(var(--black) / 100%); }
.product--card .card--body { width: 100%; padding: var(--gap-md) 0 0px 0px; }
.product--card .card--body p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin-bottom: 0px; }
.product--card .card--title { width: 100%; display: flex; flex-flow: row wrap; align-items: center; font-size: 32px; font-weight: 300; color: rgb(var(--black) / 100%); margin-bottom: var(--gap-xs); }
.product--card .card--text { margin-bottom: 0; }

@media screen and (hover: hover) {
	.product--card .card--title img { width: 45px; object-fit: contain; margin-left: var(--gap-md); transition: var(--all-medium); }
	.product--card:hover .card--img img { transform: translate3d(-20px, 0, 0) scale(1.18) rotate(1deg); opacity: 0.4; }
	.product--card .card--img img { transform: translate3d(0, 0, 0) scale(1.2); transition: var(--all-medium); }
	.product--card:hover .card--title img { margin-left: var(--gap-lg); }

	.services--list li { flex: 1 1 calc((100% - (var(--gap-xl) * 2)) / 3); clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
}

.services--list { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap-xl); }
.services--list li { flex: 1 1 calc((100% - (var(--gap-xl) * 2)) / 3); }


/* OUR CLIENTS */
.our--clients { padding: var(--gap-xxl) 0 calc(var(--gap-xxl) * 2); overflow-x: hidden; }
.our--clients.home--clients { padding: var(--gap-xxl) 0; }
.our--clients .section--subtitle { margin-bottom: 0; }
.our--clients .container-fluid { margin-bottom: var(--gap-xxxl); }
.our--clients .swiper-wrapper { transition-timing-function: linear; }
.our--clients .swiper-slide { border-top: 1px solid rgb(var(--black) / 20%); border-right: 1px solid rgb(var(--black) / 20%); margin: 0px!important; }
.our--clients .client--slider-bottom .swiper-slide { border-bottom: 1px solid rgb(var(--black) / 20%); }
.our--clients .client--logo { width: 100%; height: 120px; display: flex; padding: 20px 0; }
.our--clients .client--logo img { object-fit: contain; }


.insights { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.insights .nav-pills { margin-bottom: calc(var(--gap-md) * 2); }
.insight--slider--wrapper { display: flex; flex-direction: row; white-space: nowrap; }
.insight--slider { display: flex; flex-flow: row nowrap; column-gap: var(--gap-lg); will-change: transform; white-space: normal; animation: slide-left 60s linear infinite forwards; margin-right: var(--gap-lg); }
.insight--slider .insight--card { width: 25vw; }
.insight--card { display: flex; flex-flow: column wrap; }
.insight--card .card--img { display: flex; width: 100%; aspect-ratio: 433/267; position: relative; overflow: hidden; background: rgb(var(--black) / 100%); }
.insight--card .card--img .event--details { display: flex; flex-flow: row wrap; align-items: center; gap: var(--gap-sm); width: 100%; position: absolute; bottom: 0; z-index: 1; padding: calc(var(--gap-sm) / 4 * 5); }
.insight--card .card--img .event--details div { --font-size: 12px; font-size: var(--font-size); letter-spacing: calc(var(--font-size) / 100 * 2); font-weight: 400; color: rgb(var(--white) / 80%); text-transform: capitalize; padding: var(--gap-xs) var(--gap-sm); border: 1px solid rgb(var(--white) / 80%); line-height: 1; }
.insight--card .card--body { display: flex; flex-flow: row wrap; width: 100%; padding: var(--gap-md); border: 1px solid rgb(var(--black) / 20%); }
.insight--card .card--body .h3 { width: 100%; text-transform: initial; font-weight: 300; margin-bottom: var(--gap-xs); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; }
.insight--card .card--body .pl-s { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin-bottom: 0; }

@media screen and (hover: hover) {
	.insight--card .card--img img { transform: translate3d(0, 0, 0) scale(1.2); -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 54.54%, rgba(0, 0, 0, 0) 100%); transition: var(--all-medium); }
	.insight--card:hover .card--img img { transform: translate3d(-20px, 0, 0) scale(1.18) rotate(1deg); opacity: 0.4; }
}


.swiper-button-prev, .swiper-button-next { --swiper-navigation-size: 40px; }
.insights .swiper-button-prev, .insights .swiper-button-next { color: rgb(var(--primary-color) / 100%); top: calc(50% - 80px); }

/* COUNTRIES OPERATE */
.countries--operate { padding: calc(var(--gap-xxl) * 2) 0 0; background: #F5F5F7; }
.countries--operate .section--subtitle { margin-bottom: var(--gap-xxxl); }

@media screen and (hover: hover) {
	.countries--operate { clip-path: inset(0% 100% 0% 0%); }
}

.countries--operate .map--box { display: flex; width: 100%; position: relative; }
.countries--operate .map--box img { object-fit: contain; }
.countries--operate .map--box .map--list { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-flow: row wrap; }
.countries--operate .map--box .map--list li { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-flow: row wrap; opacity: 0; transition: var(--all-medium); }
.countries--operate .map--box .map--list li.active { opacity: 1; }
.countries--operate .map--box .map--list li img { object-fit: contain; }

.map-setting { position: relative; }
.map-setting .default--map { display: none; position: relative; z-index: 1; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; width: 100%; height: 100%; position: absolute; transition: var(--all-medium); }
.map-setting .default--map:after { content: ''; width: 100%; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url(../images/country/map.webp) no-repeat center center; background-size: contain; }
.map-setting .open-user-map { opacity: 1; pointer-events: all; transform: scale(1); transition: var(--all-medium); }

.country--list li a { font-size: 16px; text-transform: uppercase; font-family: var(--primary); color: rgb(var(--black) / 100%); display: flex; flex-flow: row wrap; justify-content: center; padding: var(--gap-sm) 0; position: relative; transition: var(--all-medium); }
.country--list li.active a { color: rgb(var(--primary-color) / 100%); }
.country--list li:first-child a::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 1px; background: linear-gradient(90deg, #F5F5F7 0%, rgba(123, 122, 122, 0.52) 51.9%, #F5F5F7 100%), rgba(255, 255, 255, 0.20); }
.country--list li a::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: linear-gradient(90deg, #F5F5F7 0%, rgba(123, 122, 122, 0.52) 51.9%, #F5F5F7 100%), rgba(255, 255, 255, 0.20); }

@media screen and (hover: hover) {
	.country--list li:hover a { color: rgb(var(--primary-color) / 100%); }
	.map-setting .default--map .btn--orange:hover { border: 1px solid rgb(var(--black) / 100%); }
	.map-setting .default--map .btn--orange:hover span { color: rgb(var(--black) / 100%); }
}

/* INSTA FEEDS */
.insta--feeds { padding: calc(var(--gap-xxl) * 2) 0 var(--gap-xl); }
.insta--feeds .section--title { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; margin-bottom: var(--gap-md); }
.insta--feeds .d-flex { margin-bottom: var(--gap-xxl); }
.insta--feeds .social-icon img { display: flex; height: 20px; object-fit: contain; margin: 0 var(--gap-sm); }

.feeds--list { display: flex; flex-flow: row wrap; align-items: center; }
.feeds--list li { flex: 1; }
.feeds--list li a { display: flex; overflow: hidden; }

@media screen and (hover: hover) {
	.feeds--list li a:hover img { transform: scale(1.05); }
}


/* FOOTER */
.footer { padding: calc(var(--gap-xxl) * 2) 0 0; }
.footer--logo { width: 280px; margin-bottom: 0px; }
.footer .pn { font-size: 18px; font-weight: 300; color: rgb(var(--black) / 80%); margin-bottom: var(--gap-sm); }
.footer .contact--link { font-size: 18px; line-height: 1; font-weight: 300; color: rgb(var(--black) / 80%); margin-bottom: var(--gap-sm); position: relative; padding-bottom: var(--gap-xs); transition: var(--all-medium); }
.footer .contact--link::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; width: 0%; height: 1px; background: linear-gradient(90deg, #F5F5F7 0%, rgb(var(--primary-color) / 100%) 51.9%, #F5F5F7 100%), rgba(255, 255, 255, 0.20); transition: var(--all-medium); }
.footer .address--wrapper { width: 100%; display: flex; flex-flow: row wrap; }
.footer .address--box { width: 100%; margin-top: var(--gap-xl); }
.footer .address--box .contact--link { margin-bottom: 0; }

.footer--title { width: 100%; font-size: 20px; font-weight: 300; text-transform: uppercase; font-family: var(--primary); margin-bottom: var(--gap-sm); }

.footer--list { display: flex; flex-flow: row wrap; column-gap: var(--gap-sm); }
.footer--list li { flex: 100%; }
.footer--list li a { position: relative; font-size: 18px; font-weight: 400; color: rgb(var(--black) / 80%); padding: calc(var(--gap-xs) / 2) 0; transition: var(--all-medium); }
.footer--list li a::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 4px; width: 0%; height: 1px; background: linear-gradient(90deg, #F5F5F7 0%, rgb(var(--primary-color) / 100%) 51.9%, #F5F5F7 100%), rgba(255, 255, 255, 0.20); transition: var(--all-medium); }

.footer--list.w-100 li { flex: 100%; }

.footer--social { display: flex; flex-flow: row wrap; column-gap: var(--gap-sm); }
.footer--social a { height: 16px; padding-right: var(--gap-sm); transition: var(--all-medium); }
.footer--social a img { width: auto; object-fit: contain; }

@media screen and (hover: hover) {
	.footer .contact--link:hover { color: rgb(var(--primary-color) / 100%); }
	.footer .contact--link:hover::after { width: 100%; }
	.footer--list li a:hover { color: rgb(var(--primary-color) / 100%); }
	.footer--list li a:hover::after { width: 100%; }
	.footer--social a:hover { transform: scale(1.1); }
}


.copyright { margin-top: calc(var(--gap-xxxl) * 2); padding: calc(var(--gap-sm) * 2) 0; border-top: 1px solid rgb(var(--black) / 20%); }
.copyright .pn { font-size: 14px; font-weight: 300; color: rgb(var(--black) / 40%); margin-bottom: 0; }

.footer--scroll--text { display: flex; flex-direction: row; white-space: nowrap; column-gap: var(--gap-xxl); overflow-y: hidden; overflow-x: hidden; }
.footer--scroll--text * { font-size: 150px; line-height: 100%; font-weight: 700; text-transform: uppercase; color: rgb(var(--dark-gray) / 10%); font-family: var(--primary); }
.footer--scroll--text .text-1 { animation: slide-left 60s linear infinite forwards; }
.footer--scroll--text .text-2 { animation: slide-left 60s linear infinite forwards; }

@keyframes slide-left {
	0% { transform: translateY(0); }
	100% { transform: translateX(-100%); }

}

.breadcrumb { margin-bottom: 0; }
.breadcrumb--nav { width: 100%; padding: var(--gap-xl) 0 0; margin-bottom: 0; }
.breadcrumb--nav .breadcrumb-item { font-size: 13px; text-transform: uppercase; color: rgb(var(--primary-color) / 100%); }
.breadcrumb--nav .breadcrumb-item a { font-size: 13px; text-transform: uppercase; color: rgb(var(--black) / 100%); }

.breadcrumb--nav.mobile { display: none; }


/* ABOUT PAGE */
.inner--banner--space { display: flex; width: 100%; aspect-ratio: 1920/550; }
.inner--banner { position: fixed; width: 100%; left: 0; top: 0; z-index: 1; }
.inner--banner .banner--bg { width: 100%; aspect-ratio: 1920/550; position: relative; }
.inner--banner .banner--bg::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 75%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.52) 27.87%, #000 100%); }
.inner--banner .banner--bg img { object-fit: cover; }
.inner--banner .banner--bg .banner--content { position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; padding: calc(var(--gap-xxxl) * 3) 0 var(--gap-xxxl); }
.inner--banner .banner--bg .banner--content .container { height: 100%; }
.inner--banner .banner--bg .banner--content .d-flex { display: flex; flex-flow: row wrap; align-items: flex-end; }
.inner--banner .banner--bg .banner--content .hero-1 { flex: 1; color: rgb(var(--white) / 100%); font-size: 84px; font-style: normal; font-weight: 400; line-height: normal; text-transform: uppercase; margin-bottom: 0; }
.inner--banner .banner--bg .banner--content .bottom--text { color: rgb(var(--white) / 100%); font-size: 23px; font-style: normal; font-weight: 400; line-height: normal; text-transform: uppercase; }
.inner--banner .banner--bg .banner--content .bottom--text span { -webkit-text-stroke-width: 0.5px; color: transparent; -webkit-text-stroke-color: rgb(var(--white) / 100%); font-size: 23px; font-style: normal; font-weight: 400; line-height: normal; text-transform: uppercase; }


/* COMPANY HISTORY */
.company--history { padding: var(--gap-xxl) 0 calc(var(--gap-xxl) * 2); position: relative; overflow: hidden; }
.company-history-slider { width: 100%; height: 600px; -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 20%,rgba(0,0,0,1) 50%,rgba(0,0,0,0.5) 80%,rgba(0,0,0,0) 100%); }
.company-history-slider .media { width: 100%; display: flex; flex-flow: row wrap; align-items: center; }
.company-history-slider .media .media-img { width: 40px; height: 40px; border-radius: 50%; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; background: rgb(var(--black) / 100%); margin-right: var(--gap-lg); transition: var(--all-medium); }
.company-history-slider .media .media-img img { width: 20px; filter: invert(1); object-fit: contain; transition: var(--all-medium); }
.company-history-slider .swiper-slide-active .media-img { background: rgb(var(--primary-color) / 100%); }
.company-history-slider .swiper-slide-active .media-img img { filter: invert(0); }
.company-history-slider .media .media-year { min-width: 500px; color: rgb(var(--black) / 100%); font-size: 130px; font-style: normal; font-weight: 400; line-height: 130%; margin-right: 30px; transition: var(--all-medium); }
.company-history-slider .swiper-slide-active .media-year { color: rgb(var(--primary-color) / 100%); }
.company-history-slider .media .media-body { flex: 1; }
.company-history-slider .media .media-body .h3 { text-transform: initial; }
.company-history-slider .media .media-body .h4 { margin-bottom: 0; }

.swiper-pagination-vertical.swiper-pagination-bullets { position: static; display: flex; flex-flow: column wrap; align-items: flex-end; justify-content: center; top: 50%; transform: translate3d(-50%, 0%, 0); }
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet { display: flex; align-items: center; justify-content: flex-end; background: transparent; width: 15px; height: 20px; position: relative; border-radius: 0; opacity: 1; margin: 0; }
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 24px; }
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet::before { content: ''; display: flex; background: rgb(var(--black) / 100%); width: 100%; height: 1px; opacity: 1; }
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before { background: rgb(var(--primary-color) / 100%); }


/* MISSION VISION */
.mission--vision { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.mission--vision .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; }
.mission--vision .bg::after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgb(var(--black) / 40%); z-index: 1; }
.mission--vision .section--title, .mission--vision .section--subtitle { color: rgb(var(--white) / 100%); }
.info--box { display: flex; flex-flow: row wrap; width: 100%; }
.info--box .mission--vision--box { display: flex; flex-flow: row wrap; align-items: center; width: 50%; }
.info--box .mission--vision--box .info { width: 55%; margin-right: -15%; padding: var(--gap-xxl); z-index: 1; }
.info--box .mission--vision--box .info .pl-p { color: rgb(var(--primary-color) / 100%); margin-bottom: var(--gap-lg); text-transform: uppercase; }
.info--box .mission--vision--box .info .h3 { color: rgb(var(--white) / 100%); text-transform: initial; font-weight: 300; }
.info--box .mission--vision--box .img-box { width: 60%; }

.mission--vision .mobile { display: none; }


/* THE TEAM */
.the--team { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.the--team .team--list { display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: var(--gap-lg); }
.the--team .team--list .card { display: flex; flex-flow: row wrap; border: none; border-radius: 0; }
.the--team .team--list .card .card-img { width: 100%; aspect-ratio: 34/37; overflow: hidden; border-radius: 0; position: relative; }
.the--team .team--list .card .card-img img { transition: var(--all-medium); }
.the--team .team--list .card .card-body { padding: var(--gap-sm) var(--gap-xs) 0 var(--gap-xs); }
.the--team .team--list .card .card-body .h3 { text-transform: initial; margin-bottom: 0; }
.the--team .team--list .card .card-body .pn { color: rgb(var(--black) / 80%); text-transform: capitalize; margin-bottom: 0; }

@media screen and (hover: hover) {
	.the--team .team--list li { clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
	.the--team .team--list .card:hover .card-img img { filter: grayscale(100%); }
	.the--team .team--list .card .view--bio { position: absolute; transform: scale(0.9); background: rgb(var(--black) / 20%); opacity: 0; left: 0; top: 0; width: 100%; height: 100%; display: flex; text-decoration: underline; text-decoration-color: rgb(var(--black) / 100%); text-underline-offset:8px ; align-items: center; justify-content: center; font-size: 16px; color: rgb(var(--orange) / 100%); transition: var(--all-medium); }
	.the--team .team--list .card:hover .view--bio { opacity: 1; transform: scale(1); }
}

/* team bio popup */
.modal-content { border-radius: 0; border: none; }
.team--bio--modal.modal { background: rgba(0, 0, 0, 0.80);}
.team--bio--modal .bio--detail--bx { display: flex; flex-flow: row wrap; }
.team--bio--modal .modal-body { padding: 0; }
.team--bio--modal .bio--detail--bx .img--bx { width: 35%; flex: 0 0 auto; position: relative; }
.team--bio--modal .bio--detail--bx .img--bx img { position: absolute; object-fit: cover; }
.team--bio--modal .btn-close { position: absolute; right: 15px; top: 15px; z-index: 11; width: 25px; padding: 3px; height: 25px; border: 1px solid #000; background-size: 12px; border-radius: 50%; }
.team--bio--modal .bio--detail--bx .pn { font-size: 16px; font-weight: 400; margin-bottom: 22px; color: rgb(var(--black) / 50%); }
.team--bio--modal .bio--detail--bx .h3 { margin-bottom: 5px; --font-size: 32px; text-transform: capitalize; font-weight: 600; }
.team--bio--modal .btn-close:focus { box-shadow: none; outline: none; }
.team--bio--modal .bio--detail--bx p { font-size: 14px; color: rgb(var(--black) / 60%); }

.team--bio--modal .modal-body .bio--detail--text { flex: 1; padding: calc(var(--gap-xl) * 2) var(--gap-xxl); }
.team--bio--modal .modal-body .bio--detail--text .bio--links { display: flex; flex-flow: row wrap; align-items: center; gap: var(--gap-md); margin-top: var(--gap-sm); }

/* GROUP COMPANIES */
.group--companies { padding: calc(var(--gap-xxl) * 2) 0; background: rgb(var(--dark-gray) / 5%); }
.company--lists { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--gap-lg) calc(var(--gap-xxl) * 3); }
.company--lists .media { display: flex; flex-flow: row wrap; align-items: center; border: 1px solid rgb(var(--dark-gray) / 10%); background: rgb(var(--white) / 100%); border-radius: 14px; cursor: pointer; transition: var(--all-medium); }
.company--lists .media .media-img { width: 35%; margin-right: 20px; }
.company--lists .media .media-body { flex: 1; }
.company--lists .media .media-body img { width: 70%; }
.company--lists .media .media-body p { font-size: 20px; color: rgb(var(--black) / 80%); width: 100%; margin-bottom: 0; }

@media screen and (hover: hover) {
	.company--lists .media:hover { border-color: rgb(var(--primary-color) / 100%); }
	.company--lists li { clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
}

/* CATEGORY PAGE */
.enquire--now { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; background: rgb(var(--black) / 3%); }
.enquire--now .section--subtitle { margin-bottom: var(--gap-xl); }


/* CATEGORY PROJECT */
.category--projects { padding: calc(var(--gap-xxl) * 2) 0; }
.more--category--projects .project--list {  margin-bottom: 0; }


.nav-pills { justify-content: center; margin-bottom: calc(var(--gap-md) * 2); gap: var(--gap-sm); }
.nav-pills .nav-link { color: var(--Black, #000); font-size: 13px; font-style: normal; font-weight: 400; line-height: 140%; text-transform: uppercase; border: 1px solid rgb(var(--black) / 20%); border-radius: 0; background: transparent; padding: calc(var(--gap-xs) / 2 * 3) var(--gap-sm); }
.nav-pills .nav-link.active { color: rgb(var(--black) / 100%); background: rgb(var(--black) / 10%); border-color: transparent; }


.project--list { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap-xl); margin-bottom: calc(var(--gap-lg) * 2); }
.project--list li { display: flex; width: 100%; }
.project--list li .project--card { display: flex; flex-flow: column wrap; width: 100%; }
.project--list li .project--card .project--img { display: flex; width: 100%; position: relative; aspect-ratio: 715/475; overflow: hidden; margin-bottom: var(--gap-sm); background: rgb(var(--black) / 100%); }
.project--list li .project--card .project--img img { -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 54.54%, rgba(0, 0, 0, 0) 100%); transition: var(--all-slow); }
.project--list li .project--card .project--img .event--details { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-end; gap: var(--gap-sm); width: 100%; position: absolute; bottom: 0; z-index: 1; padding: calc(var(--gap-sm) / 4 * 5); }
.project--list li .project--card .project--img .event--details div { --font-size: 16px; font-size: var(--font-size); letter-spacing: calc(var(--font-size) / 100 * 2); font-weight: 400; color: rgb(var(--white) / 80%); text-transform: capitalize; padding: var(--gap-xs) var(--gap-sm); border: 1px solid rgb(var(--white) / 80%); line-height: 1; }
.project--list li .project--card .project--body { display: flex; flex-flow: row wrap; width: 100%; }
.project--list li .project--card .project--body .h4 { width: 100%; --font-size: 30px; font-size: var(--font-size); letter-spacing: calc(var(--font-size) / 100 * 2); line-height: 130%; text-transform: capitalize; margin-bottom: var(--gap-xs); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; transition: var(--all-medium); }
.project--list li .project--card .project--body .pl-p { width: 100%; letter-spacing: calc(var(--font-size) / 100 * 2); line-height: 132%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin-bottom: 0; }

@media screen and (hover: hover) {
	.project--list li { clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
	.project--list li .project--card:hover .project--body .h4 { color: rgb(var(--primary-color) / 100%); }
}

.view--all--projects { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; align-content: center; position: fixed; right: var(--gap-lg); bottom: var(--gap-lg); width: 100px; aspect-ratio: 1; border-radius: 50%; background: rgb(var(--white) / 100%); box-shadow: 0 0 10px 0 rgb(var(--black) / 15%); padding: var(--gap-xs) var(--gap-sm); overflow: hidden; transition: var(--all-fast); z-index: 1; }
.view--all--projects .img-box { width: 80%; margin: auto; display: flex; margin-bottom: calc(var(--gap-xs) / 2); }
.view--all--projects span { width: 100%; font-size: 10px; line-height: 1.2; text-transform: uppercase; text-align: center; }

@media screen and (hover: hover) {
	.view--all--projects:hover { transform: scale(1.05); }
	.project--list li .project--card:hover .project--img img { transform: scale(1.05); }
}

/* PROJECT DETAIL BANNER */
.project--details--banner--space { display: flex; width: 100%; aspect-ratio: 1920/880; }
.project--details--banner { position: fixed; width: 100%; left: 0; top: 0; z-index: 1; background: rgb(var(--black) / 100%); }
.project--details--banner .banner--bg { width: 100%; aspect-ratio: 1920/880; position: relative; }
.project--details--banner .banner--bg::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 75%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.52) 27.87%, #000 100%); }
.project--details--banner .banner--bg img { object-fit: cover; }
.project--details--banner .banner--bg .banner--content { position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; display: flex; flex-flow: row wrap; align-items: center; padding: calc(var(--gap-xxxl) * 3) 0 var(--gap-xxxl); }
.project--details--banner .banner--bg .banner--content .d-flex { display: flex; flex-flow: column wrap; justify-content: space-between; height: 100%; }
.project--details--banner .banner--bg .banner--content .hero-1 { width: 100%; color: rgb(var(--white) / 100%); font-size: 84px; font-style: normal; font-weight: 400; line-height: normal; text-transform: uppercase; margin-bottom: var(--gap-sm); }
.project--details--banner .event--details { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: var(--gap-sm); width: 100%; z-index: 1; }
.project--details--banner .event--details div { --font-size: 16px; font-size: var(--font-size); letter-spacing: calc(var(--font-size) / 100 * 2); font-weight: 400; color: rgb(var(--white) / 80%); text-transform: capitalize; padding: var(--gap-xs) var(--gap-sm); border: 1px solid rgb(var(--white) / 80%); line-height: 1; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 1;  }

.project--details--banner .video-embed-wrapper { position: relative; width: 100%; height: 100%; }
.project--details--banner .video-embed-wrapper iframe { transform: scale(1.3); }

/* PROJECT OVERVIEW */
.project--overview { padding: calc(var(--gap-xxl) * 2) 0 0; }
.project--overview .titles--list { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: var(--gap-lg); margin-bottom: var(--gap-md); }
.project--overview .titles--list li .titles--box { display: flex; flex-flow: row wrap; }
.project--overview .titles--list li .titles--box .pl-p { width: 100%; text-transform: uppercase; color: rgb(var(--black) / 50%); margin-bottom: calc(var(--gap-xl) / 4) }
.project--overview .titles--list li .titles--box p.h4 { color: rgb(var(--black) / 80%); }
.project--overview .project--info { margin-top: calc(var(--gap-xxxl)); }
.project--overview .video-box { display: flex; }
.project--overview .video-box { position: relative; }
.project--overview .video-box iframe { position: static; width: 100%; aspect-ratio: 16/9; background: rgb(var(--black) / 100%); }
.project--overview .section--subtitle { text-transform: initial; }

/* PROJECT GALLERY */
.project--gallery { padding: calc(var(--gap-xxl) * 2) 0 0; }
.project--gallery .section--title { margin-bottom: var(--gap-xxxl); }
.light--gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: var(--gap-xs); }
.light--gallery li { display: flex; width: 100%; aspect-ratio: 445/265; cursor: pointer; display: flex; position: relative; }
.light--gallery li:nth-child(n + 9) { display: none; }
.light--gallery li .view--all { position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; z-index: 1; background: rgb(var(--black) / 90%); color: rgb(var(--white) / 100%); font-size: 24px; text-transform: capitalize; line-height: 1; }
.light--gallery li .view--all .number { font-size: 60px; font-weight: 100; line-height: 1; }

@media screen and (hover: hover) {
	.light--gallery li { clip-path: inset(0% 100% 0% 0%); will-change: clip-path; }
}

/* CONTACT PAGE */
.contact--form { padding: calc(var(--gap-xxl) * 2) 0 0; }
.contact--offices { padding-top: calc(var(--gap-xxl) * 2); }
.row.office--list { --bs-gutter-x: 60px; margin-bottom: calc(var(--gap-xl) * 2); }
.office--list li .office--bx { display: flex; align-items: flex-start; position: relative; height: 100%; border-top: 1px solid rgb(var(--black) / 20%); padding: 40px 0px; }
.office--list li .office--bx .office--name { max-width: 200px; width: 200px;  line-height: 1.3; flex: 0 0 auto; font-size: 32px; color: rgb(var(--black) / 100%); }
.office--list li .office--bx .office--img { width: 260px; height: auto; flex: 0 0 auto; overflow: hidden; margin-left: 20px; }
.office--list li .office--bx .office--details { flex: 1; }
.office--list li .office--bx .office--details p, .office--list li .office--bx .office--details div { font-size: 18px; color: rgb(var(--black) / 80%); margin-bottom: var(--gap-sm); }
.office--list li .office--bx .office--details p:empty { display: none; }
.office--list li .office--bx .office--details ul { margin-bottom: 30px; }
.office--list li .office--bx .office--details ul li a { font-size: 18px; color: rgb(var(--black) / 80%); display: inline-flex; transition: var(--all-medium); position: relative; }
.office--list li .office--bx .office--details ul li a:before { content: ""; position: absolute; left: 0px; bottom: 0px; width: 0px; height: 1px; background: rgb(var(--black) / 100%); transition: var(--all-medium); }
.office--list li .office--bx .office--details ul li { margin-bottom: 0px; }
.office--list li .office--bx .office--details .map--link { font-size: 16px; text-transform: uppercase; color: rgb(var(--orange) / 100%); text-decoration: underline; text-underline-offset: 8px; text-decoration-color: rgb(var(--black) / 100%); }

@media screen and (hover: hover) {
	.office--list li .office--bx .office--details ul li a:hover:before { width: 100%; }
.office--list li .office--bx .office--details .map--link:hover { text-decoration-color: rgb(var(--orange) / 100%); }
}

/* SERVICES PAGE */
.services--section { padding: calc(var(--gap-xxl) * 2) 0; }
.services--section .product--card .card--img { aspect-ratio: 59 / 24; }


/* CAREERS PAGE */
.careers { padding: calc(var(--gap-xxl) * 2) 0; }
.careers .section--subtitle { margin-bottom: calc(var(--gap-md) * 2); }

.accordion--list { display: flex; flex-flow: row wrap; }
.accordion--list li { width: 100%; border-top: 1px solid rgb(var(--black) / 10%); transition: var(--all-medium); }
.accordion--list li:last-child { border-bottom: 1px solid rgb(var(--black) / 10%); }
.accordion--list li .accordion--header { display: flex; flex-flow: row wrap; align-items: center; cursor: pointer; padding: var(--gap-sm) var(--gap-lg); transition: var(--all-medium); }
.accordion--list li .accordion--header .icon { width: 52px; aspect-ratio: 1; margin-right: var(--gap-xxxl); }
.accordion--list li .accordion--header .h4 { width: calc(100% / 12 * 4); margin-bottom: 0; }
.accordion--list li .accordion--header .plus { width: 18px; aspect-ratio: 1; position: relative; background: url(../images/icons/accordion-arrow.svg) no-repeat center center; background-size: contain; transform: rotateX(180deg); transition: var(--all-medium); }
.accordion--list li:has( .accordion--header + .accordion--body.active) { border-top-color: rgb(var(--orange) / 100%); }
.accordion--list li .accordion--header:has( + .accordion--body.active) .plus { transform: rotateX(0deg); }
.accordion--list li .accordion--body { padding: 0 0 0 140px; max-height: 0; overflow: hidden; transition: var(--all-medium) ease-in-out; }
.accordion--list li .accordion--body .d-flex { column-gap: var(--gap-sm); }
.accordion--list li .accordion--body .d-flex .button--secondary { border-color: #0077B5; background: #0077B5; }
.accordion--list li .accordion--body .d-flex .button--secondary .icon { margin-right: var(--gap-xs); }
.accordion--list li .accordion--body .d-flex .button--secondary span { margin-top: 2px; }

@media screen and (hover: hover) {
	.accordion--list li .accordion--header:hover { background: rgb(var(--gray) / 100%); }
}

.table--header { display: flex; flex-flow: row wrap; align-items: center; padding: var(--gap-sm) 170px; }
.table--header .p2 { font-size: 20px; font-weight: 400; width: calc(100% / 12 * 4); color: rgb(var(--black) / 50%); margin-bottom: 0; }
.table--header .p2:first-child { width: calc(100% / 12 * 4); }
.table--header .p2:nth-child(2) { width: calc(100% / 12 * 6); }
.table--header .p2:last-child { width: calc(100% / 12 * 2 - 20px); margin-right: 20px; }

.join--team--accordion { margin-bottom: var(--gap-xxl); }
.join--team--accordion li .h4 { font-size: 20px; }
.join--team--accordion li .accordion--header { padding: var(--gap-sm) 170px; }
.join--team--accordion li .accordion--header .p2 { margin-bottom: 0; }
.join--team--accordion li .accordion--header .p2 { width: calc(100% / 12 * 6); }
.join--team--accordion li .accordion--header .p2:nth-child(3) { width: calc(100% / 12 * 2 - 18px); }
.join--team--accordion li .accordion--body { padding: 0 170px; margin-top: 0px; }
.join--team--accordion li .accordion--body.active { margin: var(--gap-md) 0 var(--gap-lg); }

.join--team--accordion li .accordion--body .accordion--data { width: calc(100% / 12 * 6 - 20px); margin-left: calc(100% / 12 * 4); }
.join--team--accordion li .accordion--body .accordion--data p { font-size: 20px; font-weight: 400; text-transform: capitalize; margin-bottom: var(--gap-sm); }
.join--team--accordion li .accordion--body .accordion--data p strong { font-size: 20px; font-weight: 700; }
.join--team--accordion li .accordion--body .accordion--data ul { margin-bottom: var(--gap-lg); list-style-type: disc; list-style-position: inside; padding-left: 20px; }
.join--team--accordion li .accordion--body .accordion--data ul li { font-size: 20px; font-weight: 400; line-height: 1.2; border: none; list-style-type: disc; list-style-position: outside; margin-bottom: var(--gap-xs); }
.join--team--accordion li .accordion--body .accordion--data .btn--tertiary { border: 1px solid rgb(var(--black) / 100%); }
.join--team--accordion li .accordion--body .accordion--data .btn--tertiary span { color: rgb(var(--black) / 100%); }

@media screen and (hover: hover) {
	.join--team--accordion li .accordion--body .accordion--data .btn--tertiary:hover { border: 1px solid rgb(var(--white) / 100%); }
	.join--team--accordion li .accordion--body .accordion--data .btn--tertiary:hover span { color: rgb(var(--white) / 100%); }
}

.swiper-fade .swiper-slide { opacity: 0 !important; }
.swiper-fade .swiper-slide.swiper-slide-active { opacity: 1 !important; }

/* CLIENT TESTIMONIAL */
.clients--testimonials { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.clients--testimonials hr { border-top: 1px solid rgb(var(--black) / 20%); margin-top: 0; margin-bottom: var(--gap-lg); }
.clients--testimonials-slider .pl-s { --font-size: 30px; font-size: var(--font-size); font-weight: 400; line-height: 130%; letter-spacing: calc(var(--font-size) / 100 * 2); margin-bottom: var(--gap-lg); }
.clients--testimonials-slider .client--info { display: flex; flex-flow: row wrap; align-items: center; }
.clients--testimonials-slider .client--info .client--img { width: 75px; aspect-ratio: 1; border-radius: 75px; overflow: hidden; margin-right: var(--gap-sm); }
.clients--testimonials-slider .client--info .client--details { flex: 1; }
.clients--testimonials-slider .client--info .client--details .client--name { font-size: 20px; text-transform: uppercase; }
.clients--testimonials-slider .client--info .client--details .client--designation { font-size: 16px; color: rgb(var(--black) / 60%); margin-bottom: 0; }

.swiper-pagination { position: static; width: 100%; text-align: center; }
.swiper-pagination .swiper-pagination-total { font-size: 16px; color: rgb(var(--black) / 100%); }
.swiper-pagination .swiper-pagination-current { font-size: 25px; color: rgb(var(--black) / 100%); }

.slider--arrow--wrapper { position: relative; display: flex; flex-flow: column wrap; row-gap: var(--gap-lg); height: 100%; justify-content: flex-end; align-items: flex-end; }
.slider--arrow--wrapper .swiper-button-next, .slider--arrow--wrapper .swiper-button-prev { position: static; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0; }
.slider--arrow--wrapper .swiper-button-next::after, .slider--arrow--wrapper .swiper-button-prev::after { color: rgb(var(--primary-color) / 100%); --swiper-navigation-size: 30px; }


/* INSIGHTS */
.insights { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.insights.home--insights .container-fluid { margin-bottom: var(--gap-xxxl); }
.insights.home--insights .section--subtitle { margin-bottom: 0; }
.insights--list { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: var(--gap-lg); }

.insight--modal.modal { background: rgba(0, 0, 0, 0.80);}
.insight--modal .bio--detail--bx { display: flex; flex-flow: row wrap; }
.insight--modal .modal-body { padding: 0; }
.insight--modal .bio--detail--bx .img--bx { width: 40%; position: relative; }
.insight--modal .bio--detail--bx .img--bx img { position: absolute; object-fit: cover; }
.insight--modal .btn-close { position: absolute; right: 15px; top: 15px; z-index: 11; width: 25px; padding: 3px; height: 25px; border: 1px solid #000; background-size: 12px; border-radius: 50%; }
.insight--modal .bio--detail--bx .pn { font-size: 16px; font-weight: 400; margin-bottom: 22px; color: rgb(var(--black) / 50%); }
.insight--modal .bio--detail--bx .h3 { margin-bottom: var(--gap-lg); --font-size: 32px; text-transform: capitalize; font-weight: 600; }
.insight--modal .btn-close:focus { box-shadow: none; outline: none; }

.insight--modal .modal-body .bio--detail--text { flex: 1; padding: calc(var(--gap-lg) * 2) var(--gap-xxl); }
.insight--modal .modal-body .bio--detail--text .bio--links { display: flex; flex-flow: row wrap; align-items: center; gap: var(--gap-md); margin-top: var(--gap-sm); }
.insight--modal .modal-body .bio--detail--text .bio--links li a { display: flex; align-items: center; overflow: hidden; padding: calc(var(--gap-xs) / 2 * 3) 0; }
.insight--modal .modal-body .bio--detail--text .bio--links li a img { width: 32px; object-fit: contain; margin-left: 10px; }

.bio--detail--text h1, .bio--detail--text h2, .bio--detail--text h3, .bio--detail--text h4, .bio--detail--text h5, .bio--detail--text h6 { margin-bottom: var(--gap-sm); }
.bio--detail--text p { font-size: 16px; color: rgb(var(--black) / 70%); margin-bottom: var(--gap-sm); }
.bio--detail--text ul { list-style-type: disc; list-style-position: inside; margin-bottom: var(--gap-md); }
.bio--detail--text ul li { list-style-type: disc; list-style-position: inside; font-size: 16px; color: rgb(var(--black) / 80%); margin-bottom: var(--gap-xs); }
.bio--detail--text a:not(.btn, .btn--link) { text-decoration: underline; color: rgb(var(--primary-color) / 100%); }
.bio--detail--text a.btn--link { display: flex; align-items: center; overflow: hidden; padding: calc(var(--gap-xs) / 2 * 3) 0; }
.bio--detail--text a.btn--link img { width: 32px; object-fit: contain; margin-left: 10px; }



/* MODAL */
.career--modal .modal-backdrop.show { opacity: 0.8; }
.career--modal .modal-header { flex-flow: row wrap; border: none; }
.career--modal .modal-body { padding: 0 var(--gap-xxxl) var(--gap-xxxl); }
.career--modal .modal-body .h1 { margin-bottom: var(--gap-lg); }


/* SERVICES DETAILS */
.services--details { padding: calc(var(--gap-xxl) * 2) 0 0; position: relative; overflow: hidden; }
.services--details .section--subtitle { margin-bottom: var(--gap-md); }
.services--details .h4 { margin-bottom: var(--gap-lg); }

.our--brands { padding: calc(var(--gap-xxl) * 2) 0 0; position: relative; overflow: hidden; }
.our--brands:empty { padding: 0px; }

.brand--products--lists { width: 100%; }
.brand--products--lists .brand--products--box { width: 100%; max-height: 0; overflow: hidden; margin: 0; transition: var(--all-medium); }
.brand--products--lists .brand--products--box.active { margin: 0 0 var(--gap-xl); }
.brand--products--box .brand--products--wrapper { border: 1px solid rgb(var(--black) / 20%); padding: calc(var(--gap-lg) * 2); position: relative; margin: 0; }

.brand--products--box .close--products--box { position: absolute; right: var(--gap-sm); top: var(--gap-sm); width: 24px; height: 24px; display: flex; }
.brand--products--box .close--products--box img { object-fit: contain; }

.brand--products--box .products--list { display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: var(--gap-xl) var(--gap-lg); margin-bottom: var(--gap-md); }

.juicer-feed.slider li.feed-item .j-image img { height: 100% !important; }
.brand--products--box .products--list li .card { border: none; border-radius: 0; }
.brand--products--box .products--list li .card .card-img { display: flex; width: 100%; aspect-ratio: 318/285; overflow: hidden; margin-bottom: var(--gap-sm); }
.brand--products--box .products--list li .card .card-body { width: 100%; padding: 0; }
.brand--products--box .products--list li .card .card-body .title-wrapper { width: 100%; display: flex; flex-flow: row wrap; margin-bottom: var(--gap-sm); }
.brand--products--box .products--list li .card .card-body .title-wrapper .h4 { flex: 1; margin-bottom: 0; }
.brand--products--box .products--list li .card .card-body .title-wrapper .info--icon { width: 24px; aspect-ratio: 1; }
.brand--products--box .products--list li .card .card-body .title-wrapper .info--icon img { object-fit: contain; }
.brand--products--box .products--list li .card .card-body .pn { color: rgb(var(--black) / 80%); margin-bottom: 0; }

.pagination--wrapper { display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; margin-top: var(--gap-xxxl); }
.pagination--wrapper .page--count { color: rgb(var(--black) / 60%); margin-bottom: 0; }

.pagination--wrapper .pagination { gap: var(--gap-xs); }
.pagination--wrapper .pagination a { display: flex; align-items: center; font-size: 16px; font-weight: 400; line-height: 1; border: none; color: rgb(var(--black) / 100%); border-radius: 2px; margin: 0; padding: 10px 14px; transition: var(--all-medium); }
.pagination--wrapper .pagination a span { font-size: 16px; font-weight: 400; line-height: 1; color: rgb(var(--black) / 100%); transition: var(--all-medium); }
.pagination--wrapper .pagination a img { width: 7px; }
.pagination--wrapper .pagination a > img { margin-right: var(--gap-sm); }
.pagination--wrapper .pagination a span + img { margin-right: 0; margin-left: var(--gap-sm); }
.pagination--wrapper .pagination a.active { background: rgb(var(--black) / 100%); color: rgb(var(--white) / 100%); }

@media screen and (hover: hover) {
	.pagination--wrapper .pagination a:hover { background: rgb(var(--black) / 100%); color: rgb(var(--white) / 100%); }
	.pagination--wrapper .pagination a:hover span { color: rgb(var(--white) / 100%); }
}

.brand--list { display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: var(--gap-md); margin-bottom: var(--gap-md); }
.brand--list .brand--item { border: 1px solid rgb(var(--black) / 20%); padding: var(--gap-md); position: relative; cursor: pointer; transition: var(--all-medium); }
.brand--list .brand--item.disabled { filter: opacity(0.5); pointer-events: none; }
.brand--list .brand--item::after { content: ''; position: absolute; left: 50%; top: calc(100% + 1px); width: 30px; height: 30px; transform: translateX(-50%) translateY(-50%) rotate(-45deg); background: rgb(var(--white) / 100%); border-left: 1px solid rgb(var(--primary-color) / 100%); border-bottom: 1px solid rgb(var(--primary-color) / 100%); opacity: 0; transition: var(--all-medium); }
.brand--list .brand--item.active { border-color: rgb(var(--primary-color) / 100%); }
.brand--list .brand--item.active::after { opacity: 1; }

.explore--other--services { padding: calc(var(--gap-xxl) * 2) 0; position: relative; overflow: hidden; }
.explore--other--services .section--subtitle { color: rgb(var(--primary-color) / 100%); }

.juicer-feed h1.referral { display: none; margin-right: -100%; margin-bottom: 0 !important; height: 0; }

.newsletter--signup { padding: calc(var(--gap-xxl) * 2) 0 0; }
.newsletter--signup .border--box { padding: calc(var(--gap-xl) * 2); border: 1px solid rgb(var(--black) / 10%); background: rgb(var(--black) / 1%); }

/* 404 PAGE */
.not-found { width: 100%; min-height: 100vh; display: flex; flex-flow: row wrap; align-items: center; padding: 80px 0; text-align: center; background: #fff url(../images/404-bg.webp) no-repeat center center; background-size: cover; background-attachment: fixed; }
.not-found .title { font-size: 36px; font-weight: 600; margin-bottom: 20px; color: rgb(var(--black) / 100%); }
.not-found p { text-align: center; font-size: 18px; font-weight: 400; margin-bottom: 20px; color: rgb(var(--black) / 60%); }
.not-found .subtitle { font-size: 140px; font-weight: 900; line-height: 1; margin-bottom: 30px; color: rgb(var(--primary-color) / 100%); }
