:root { --primary-color: #bfc13e; --primary-rgb: 191, 193, 62; --secondary-color: #000000; --secondary-light: #F5F6E2; --text-color: #151515; --text-light: #b9b9bb; --footer-bg: #222;  --primary-font: 'Riviera Nights'; --title-font: 'Riviera Nights'; --bs-box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.1); }

/* Fonts */
@font-face {
  font-family: 'Riviera Nights';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(../webfonts/Riviera-Nights/Riviera-Nights-ultra.woff2) format('woff2'), url(../webfonts/Riviera-Nights/Riviera-Nights-ultra.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Riviera Nights';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../webfonts/Riviera-Nights/Riviera-Nights-light.woff2) format('woff2'), url(../webfonts/Riviera-Nights/Riviera-Nights-light.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Riviera Nights';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../webfonts/Riviera-Nights/Riviera-Nights.woff2) format('woff2'), url(../webfonts/Riviera-Nights/Riviera-Nights.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Riviera Nights';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../webfonts/Riviera-Nights/Riviera-Nights-medium.woff2) format('woff2'), url(../webfonts/Riviera-Nights/Riviera-Nights-medium.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Riviera Nights';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../webfonts/Riviera-Nights/Riviera-Nights-bold.woff2) format('woff2'), url(../webfonts/Riviera-Nights/Riviera-Nights-bold.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


html { font-size: 62.5%; -webkit-text-size-adjust: none; -webkit-font-smoothing: antialiased; scroll-padding-top: 0; text-rendering: optimizeLegibility;}
body { overflow-x: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: var(--primary-font); font-size: 1.4rem;  font-weight: 300;  letter-spacing: .03125em;  line-height: 1.5; color: var(--text-color);  }
::selection {background: var(--secondary-color); color: var(--bs-white);}
.light { font-weight: 300 !important; }
.normal { font-weight: 400 !important; }
.medium { font-weight: 500 !important; }
.semi { font-weight: 600 !important; }
.bold { font-weight: 700 !important; }
.ebold { font-weight: 800 !important; }
.f-black { font-weight: 900 !important; }
.fs-10 { font-size: 10px !important; }
.fs-12 { font-size: 12px !important; }
.fs-14 { font-size: 14px !important; }
.fs-18 { font-size: 18px !important; }
.title-font { font-family: var(--title-font) !important; }
.primary-font { font-family: var(--primary-font) !important; }
h1, h2, h3, h4, h5, h6 { margin-top: 0; font-style: normal; font-weight: inherit; text-transform: normal; }
.clear { clear: both; }
a, button { color: var(--secondary-color); outline: medium none; text-decoration: none; }
a:focus, .button:focus { text-decoration: none; outline: none; }
a:hover { color: var(--primary-color);  }
button:focus, input:focus, input:focus, textarea, textarea:focus { outline: 0; }
input:focus::-moz-placeholder { opacity: 0; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }
.primary-color { color: var(--primary-color) !important; }
.bg-primary-color { background-color: var(--primary-color) !important; }
.border-primary-color { border-color: var(--primary-color) !important; }
.secondary-color { color: var(--secondary-color) !important; }
.bg-secondary-color { background-color: var(--secondary-color) !important; }
.border-secondary-color { border-color: var(--secondary-color) !important; }
.secondary-light { color: var(--secondary-light) !important; }
.bg-secondary-light { background-color: var(--secondary-light) !important; }
.border-secondary-light { border-color: var(--secondary-light) !important; }
.text-dark { color: #333 !important; }
.bg-f0 { background: #f0f0f0 !important; }
.bg-f4 { background: #f4f4f4 !important; }
.bg-f5 { background: #f5f5f5 !important; }
.bg-f9 { background: #f9f9f9 !important; }
.bg-none { background: none !important; }
.btn { background: var(--bs-black); color: var(--bs-white); -moz-user-select: none; cursor: pointer; display: inline-flex; align-items: center;  justify-content: center;font-weight: 500;  position: relative; font-size: 1.2rem;   letter-spacing: .1666666667em;    line-height: 2; padding: 0rem 2rem; border-radius: 0px; border: 0; outline: 2px solid var(--bs-black); font-family: var(--title-font); outline-offset: -1.5px; height: 48px; text-align: center; overflow: hidden; text-transform: uppercase; transition: opacity .4s}
.btn:hover { border-color: transparent; background-color: var(--primary-color); color: var(--primary-color); outline-color: transparent;  transition: border-color 0s, box-shadow .6s ease;}

.rrmc-button-arrow { opacity: 0; transition: opacity .4s, transform .4s; will-change: opacity; background-size: 16px 16px; display: inline-block; }
.rrmc-button-arrow svg { width: 12px; height: 12px; }
.rrmc-button-text {right: -8px;position: relative; transition: right .4s, transform .4s; width: auto; will-change: right, padding; height: auto; transform: translate3d(0px, 1px, 0);}
.btn:hover .rrmc-button-arrow { opacity: 1; transform: translate3d(4px, 0, 0); }
.btn:hover .rrmc-button-text { right: 0; transform: translate3d(-4px, 0px, 0); }

.btn-outline { color: var(--bs-black); background: transparent; border-color: var(--bs-black); }
.btn-outline:hover { color: var(--bs-black); background: transparent;  }

.btn-outline:after, .btn-outline:before {content: "";  position: absolute; width: 99.5%;  height: 2px; border-radius: 0px; }
.btn-outline:before {bottom: 0;  left: 0; transform: translateX(100%);  border-bottom: 2px solid transparent;  border-left: 2px solid transparent;}
.btn-outline:after {top: 0;  left: 0; transform: translateX(-100%); border-top: 2px solid transparent;  border-right: 2px solid transparent;}
.btn-outline:hover:after, .btn-outline:hover:before { transition: 0.1s transform linear, 0.1s height linear 0.1s;  transform: translateX(0);  height: 100%;  border-color: var(--bs-black);}
.btn-outline:hover:after {transition: 0.1s transform linear 0.2s, 0.1s height linear 0.3s}
.btn-outline-white {background: transparent; color: var(--bs-white); outline-color: var(--bs-white)}
.btn-outline-white:hover {color: var(--bs-white);}
.btn-outline-white:hover:after, .btn-outline-white:hover:before {border-color: var(--bs-white);}

.btn1 { color: #fff; background: var(--primary-color); border-color: var(--primary-color); }
.btn1e:hover { color: #fff; background: var(--secondary-color);  }
.btn-outline-secondary { color: var(--secondary-color); background: transparent; border-color: var(--secondary-color); }
.btn-outline-secondary:hover { color: #fff; background: var(--secondary-color); }
.btn-white { color: var(--bs-black); outline: 0; background: var(--bs-white); border-color: var(--bs-white); transition: border-color 0.6s, box-shadow .6s ease;  }
.btn-white:hover { background: #fff; border-color: var(--bs-white); color: var(--bs-black); opacity: 0.8; transition: border-color 0.6s, opacity .6s ease;}
.btn.focus, .btn:focus {  box-shadow: none; outline: 2px solid }
button:focus:not(:focus-visible) {outline: 2px solid}
.btn-sm { padding: .25rem .5rem; font-size: .875rem; }
.btn.min-width { min-width: 180px; }
.link { color: var(--text-color); font-family: var(--title-font); text-transform: uppercase;  font-weight: 500; position: relative; display: inline-block;}
.link:after {content: "";  height: 2px;  background: var(--primary-color);  position: absolute; width: 100%;  left: 0px;  bottom: -3px;  will-change: width;  transform-origin: left bottom;  transition: width .1s ease-out;}
.link:hover:after {width: 0}
.link:hover { color: var(--secondary-color); text-decoration:none; }

/* Scrollbars */
.theme-scrollbar { overflow-x: hidden; overflow-y: auto; scrollbar-color: #D1D5DB #fff; scrollbar-width: thin; }
.theme-x-scrollbar { overflow-x: auto; overflow-y: hidden; padding-right: 0; margin-right: 0; }
.theme-scrollbar::-webkit-scrollbar-track { -webkit-box-shadow: none; background-color: transparent; }
.theme-scrollbar::-webkit-scrollbar { width: 4px; background-color: transparent; }
.theme-scrollbar::-webkit-scrollbar-thumb { background-color: #D1D5DB; border-radius: 3px; }
.br-0 { border-radius: 0px !important; }
.br-5 { border-radius: 5px !important; }
.br-8 { border-radius: 8px !important; }
.br-10 { border-radius: 10px !important; }
.br-15 { border-radius: 15px !important; }
.br-20 { border-radius: 20px !important; }
.ls-1 {letter-spacing: 1px;}
.ls-2 {letter-spacing: 2px;}
.ls-3 {letter-spacing: 3px;}
.ls-4 {letter-spacing: 4px;}
.ls-5 {letter-spacing: 5px;}
.alert { padding: 8px 0; font-size: 14px; }
.alert-dismissible .btn-close { padding: 0 1rem; height: 100%; color: #fff; background: none !important; opacity: 1; }
.fancybox__container {--fancybox-opacity: 0.9}

/* BACK TO TOP */
#scrollUp { background: var(--primary-color); height: 40px; width: 40px; right: 30px; bottom: 0px; color: var(--secondary-color); font-size: 20px; text-align: center; border-radius: 0%; display: flex; align-items: center; justify-content: center; border: 2px solid transparent; position: fixed; visibility: hidden; opacity: 0; cursor: pointer; z-index: 999; } 
#scrollUp.active { bottom: 30px; visibility: visible; opacity: 1; }
@media (max-width:767px) {
    #scrollUp { right: 16px; }
    #scrollUp { width: 40px; height: 40px; line-height: 38px; }
}
#scrollUp:hover { color: var(--secondary-color); }
.g-2rem { --bs-gutter-x: 2rem; --bs-gutter-y: 2rem; }
.gx-2rem { --bs-gutter-x: 2rem; }
.gy-2rem { --bs-gutter-y: 2rem; }
.g-2-5rem { --bs-gutter-x: 2.5rem; --bs-gutter-y: 2.5rem; }
.br-0 { border-radius: 0 !important; }
.img-thumbnail { padding: .5rem; }
.form-group p {margin: 0}
.form-control { border-color: #e0dfdf; border-radius: 3px; height: 48px; font-size: 14px;padding: 10px 20px; }
.form-control:focus { box-shadow: none; outline: none; border-color: var(--primary-color); }
.form-control::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.5); }
.form-control::-moz-placeholder { color: rgba(0, 0, 0, 0.5); }
.form-control:-ms-input-placeholder { color: rgba(0, 0, 0, 0.5); }
.form-control:-moz-placeholder { color: rgba(0, 0, 0, 0.5); }
textarea.form-control {height: 120px;}
.input-group .wpcf7-form-control-wrap .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .btn.input-group-text { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; height: 46px; }
.wpcf7-spinner { position: absolute }
.swiper-button-next, .swiper-button-prev { font-size: 22px; color: #fff; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .3); }
.swiper-button-next::after, .swiper-button-prev::after { display: none; }
.swiper-button-prev, .swiper-rtl .swiper-button-next { left: 0 }
.swiper-button-next, .swiper-rtl .swiper-button-prev { right: 0; }
.swiper-button-next:hover, .swiper-button-prev:hover {background: var(--secondary-color);}
.arrow-bottom {display: flex; align-items: center; justify-content: center; margin: 0 auto; gap: 15px}
.arrow-bottom .swiper-button-next, .arrow-bottom .swiper-button-prev {position: unset;  background: var(--secondary-color); }
.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal { position: relative; margin-top: 1rem; }
.swiper-pagination-bullet { background: #d8d8d8; opacity: 1; width: 12px; height: 12px; }
.swiper-pagination-bullet-active { background: var(--primary-color); }
.modal-backdrop {--bs-backdrop-opacity: 0.7;}
.modal-content { background: rgba(0, 0, 0, 0.05);  backdrop-filter: blur(150px) saturate(1.8);  -webkit-backdrop-filter: blur(150px) saturate(1.8);}
.modal .form-control {background: rgba(255, 255, 255, 0.15); color: var(--bs-white);}
.modal .form-control::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.8); opacity:1; }
.modal .form-control::-moz-placeholder { color: rgba(255, 255, 255, 0.8);  opacity:1;}
.modal .form-control:-ms-input-placeholder { color: rgba(255, 255, 255, 0.8);  opacity:1;}
.modal .form-control:-moz-placeholder { color: rgba(255, 255, 255, 0.8);  opacity:1;}


/* Header
------------------- */
header { position: fixed; left: 0; right: 0; padding: 10px 0; z-index: 999;  font-family: var(--title-font); background: rgba(0, 0, 0, 0);  transition: transform .5s ease; }
.sticky-bar { left: 0; background: rgba(255, 255, 255, .9); margin: auto; position: fixed; top: 0; width: 100%; -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown; animation: 400ms ease-in-out 0s normal none 1 running fadeInDown; box-shadow: 0 8px 20px rgba(0, 0, 0, .1); }
.header-down { transform: translateY(-100%);}
.header-up { transform: translateY(0); background: rgba(255, 255, 255, .2);  backdrop-filter: blur(5px);}
.header-up .social-links .social-links__item, .sticky-bar .social-links .social-links__item {color: var(--bs-black);}

header .logo-dark, header.sticky-bar .logo-light{display: none;}
header.sticky-bar .logo-dark {display: block;}



.menushow { overflow: hidden !important; }
.navbar-toggler { display: flex; border-radius: 0; }
.mobile-toggle { font-size: 12px;  font-weight: 500; margin: 0; cursor: pointer; z-index: 999; display: inline-block; align-items: center;   padding: 0; border: 0; position:relative; color: var(--bs-white); }
.sticky-bar .mobile-toggle {color: var(--bs-black);}
.mobile-toggle.show { background: transparent; }
.mobile-toggle svg { fill: var(--primary-color); width: 35px; height: 35px; }
.line { fill: none; stroke: var(--bs-white); stroke-width: 4; transition: stroke-dasharray .6s cubic-bezier(.4, 0, .2, 1), stroke-dashoffset .6s cubic-bezier(.4, 0, .2, 1); }
.sticky-bar .mobile-toggle .line {stroke: var(--bs-black);}
.menushow .mobile-toggle {color: var(--bs-white);}
.menushow .mobile-toggle .line {stroke: var(--bs-white);}
.line1 { stroke-dasharray: 60 207; }
.show .line1 { stroke-dasharray: 90 207; stroke-dashoffset: -134; }
.line2 { stroke-dasharray: 60 60; }
.show .line2 { stroke-dasharray: 1 60; stroke-dashoffset: -30; }
.line3 { stroke-dasharray: 60 207; }
.show .line3 { stroke-dasharray: 90 207; stroke-dashoffset: -134; }
.mobile-toggle .close, .mobile-toggle.show .menu {display: none;}
.mobile-toggle.show .close {display: inline-block;}


.main-menu { position: fixed; top: 0; left: 0; bottom: 0;  z-index: 99;  background: rgba(0, 0, 0, 0.4);; padding: 0rem; width: 100%; overflow-y: auto;  transform: translateX(-120%); transition: transform 0.4s; }
.main-menu.show { transform: translateY(-0%); transition: transform 0.4s; }

header .navbar { position: unset; border-bottom: 1px solid #ddd; padding: 30px 0}
header.sticky-bar .navbar {border-color: transparent; padding: 10px 0;}
header .main-menu ul.navbar-nav {background: rgba(0,0,0,.002); backdrop-filter: blur(150px) saturate(1.8); -webkit-backdrop-filter: blur(150px) saturate(1.8);     margin: 0; height: 100%; flex-direction: column; align-items: flex-end; justify-content: center; width: 40%; padding: 3rem; position:relative; }
header .main-menu ul.navbar-nav > li { padding: 0px; padding-right: calc(16px + 6.5vw); transition: transform 0.1s, opacity 0.1s, visibility 0.1s; transition-duration: 0.1s, 0.1s; transition-timing-function: ease, ease; transition-delay: 0s, 0s; transform: translateX(-100%); transition-timing-function: ease-out; visibility: hidden; opacity: 0; }
.menushow header .main-menu ul.navbar-nav li { opacity: 1; visibility: visible; transform: translateY(0) rotate(0); transition-duration: 0.3s; transition-timing-function: ease; }
header .main-menu ul.navbar-nav > li > a { color: var(--bs-white); font-size: 1em; letter-spacing: .1175em;    line-height: 1.875; padding: 25px 0 5px; opacity: 0.5; position: relative; font-weight: 500; text-transform: uppercase; display: inline-block;}
.navbar-nav .nav-link:hover {color: var(--bs-white); opacity: 1}
header .dropdown-menu { border: 0; border-radius: 10px; padding: 20px; background: var(--secondary-light); box-shadow: 0px 3px 15px rgba(255, 255, 255, 0.1); }
header .dropdown-menu li { padding: 0px 0 10px; display: block; }
header .dropdown-menu li:last-child { padding: 0; }
header .dropdown-menu li a { font-size: 14px; color: #fff; padding: 0px; display: block; text-transform: uppercase; }
header .dropdown-menu li a:hover { color: var(--primary-color); }
.dropdown-toggle::after { content: "\f078"; font-family: "Font Awesome 6 Pro"; font-weight: 700; margin-left: 5px; border: 0 !important; vertical-align: middle; font-size: 10px; color: #fff; transform: rotate(0deg); transition: transform 0.4s; }
.dropdown:hover .dropdown-toggle::after { color: #fff; transform: rotate(180deg); transition: transform 0.4s; }

.social-links { display: flex; gap: 10px; }
.social-links .social-links__item { position: relative; color: var(--bs-white); font-size: 16px; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.social-links .social-links__item:hover { opacity:0.6 }


/* Footer
------------------- */
footer { color: var(--bs-white); position: relative; background: var(--footer-bg); font-weight: 300;}
.footer-title {color: var(--text-light); margin: 0 0 20px; font-weight: 500; text-transform: uppercase; ine-height: 1.3;  letter-spacing: .15625em;}
.footer-links { list-style:none; padding: 0; margin: 0;}
.footer-links li { line-height: 1.2em; padding: 1rem 0; }
.footer-links a { color: #fff; }
footer a:hover {text-decoration-line: underline;  text-decoration-style: dashed;  text-underline-offset: 5px;}
footer .social-links .social-links__item {border: 1px solid var(--bs-white);}
.contact-details li { display: flex; padding: 10px 0; font-size: 110%;}
.contact-details li .icon { margin: 0 1rem 0 0;}
.contact-wrap .contact-details li a {color: var(--bs-black);}
.contact-wrap .contact-details li a:hover {color: var(--primary-color);}
.contact-wrap .social-links .social-links__item {color: var(--bs-black); border:1px solid var(--bs-black)}
.copyright { color: var(--text-light); font-size: 85% }
.copyright a {color: var(--text-light);}
.copyright a:hover { color: #fff; }


/* Home
------------------ */
section { padding-top: 8rem; padding-bottom: 8rem;}
.section-title :is(h1, h2, h3, h4, h5, h6) { line-height: 1.3; letter-spacing: .15625em; color: var(--bs-black); font-weight: inherit; font-family: var(--title-font); text-transform: uppercase; margin-bottom: 12px;}
.section-title h1 { font-size: 50px;}
.section-title h2 { font-size: 3.4rem; letter-spacing: .0735294118em; }
.section-title h3 { font-size: 2rem;}
.section-title h4 { font-size: 1.6rem;}
.section-title h5 { font-size: 20px;}
.section-title p {font-size: 1.4rem; letter-spacing: .0357142857em; text-transform: uppercase;  line-height: 2;}
.banner-title h1, .big-text h2 {font-size: 7rem; }
.section-title span {font-weight: 600; color: var(--primary-color);}
.section-title .bnr-ttl {border-bottom: 1px solid var(--bs-white); padding-bottom: 0.8rem; display: inline-block; line-height: 1;}
.sub-title {color: var(--secondary-color); text-transform: uppercase;}
.desc-md {font-size: 18px;}
.desc-lg {font-size: 20px;}
.desc-xl {font-size: 22px;}
.bg-black  .section-title :is(h1, h2, h3, h4, h5, h6) {color: var(--bs-white); }

.overlay {position: relative; z-index: 1;}
.banner-sect {height: 100vh; position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.inner-banner {height: 60vh; justify-content: flex-end;}
.banner-sect::after, .overlay::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: repeating-linear-gradient(rgba(0, 0, 0, 0.39), rgba(0, 0, 0, 0.39)); z-index: -1; }
.overlay-dark::after {background: rgba(0, 0, 0, .6);}
.bg-video {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -2; height: 100%;}
.bg-video iframe, .bg-video video, .bg-video img {width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 9; transform-origin: center; }
.pd-img { position: relative; padding-bottom: 70%; display: block; }
.pd-img img, .pd-img iframe, .pd-img video { position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover; width: 100%; height: 100%; }
.vd-box {padding-bottom: 50%}
.img-box {padding-bottom: 100%}
.top-margin {margin-top: 15rem}
.project-box {display: block; position: relative; color: var(--bs-white);}
.project-box:hover {color: inherit;}
.project-box:hover {opacity: 0.7;}
.project-box-desc {padding: 24px; padding-bottom: 50px; border-color: #7c7c7c !important}
.project-sect .section-title {font-weight: 400;}
.project-img {padding-bottom: 100%; overflow: hidden; background: var(--bs-black);}
.project-img img, .project-img iframe, .project-img video{ transition: opacity .4s,transform .4s;}
.project-box:hover .project-img img, .project-box:hover .project-img iframe, .project-box:hover .project-img video  { transform: scale(1.05); transition: opacity .4s,transform .4s;}
.parallex {background-size: cover; min-height: 700px; display: flex; align-items: center; justify-content: center;}

.interested-content { border-right: 1px solid #eee;}
.interested-content:last-child { border: 0;}
.decade-img {padding-bottom: 60%}
.underline-from-right {  display: block;  border-bottom: 1px solid #eee;  padding: 20px 0;}

/* ABOUT */
.mission-box ul, .text-sect ul, .icon-ul {padding: 0; list-style: none;}
.mission-box ul li, .text-sect ul li, .icon-ul li { display: flex;  padding: 5px 0;}
.mission-box ul li::before, .text-sect ul li::before, .icon-ul li::before { content: "\f058"; font-family: "Font Awesome 6 Pro";  font-weight: 900;  display: block;  color: var(--primary-color);  margin-right: 10px;}
.mission-box {position: relative; height: auto;}
.mission-box-desc {position: absolute; top: 0; right:8%; bottom: 0; width: 30%; background: var(--bs-white); padding: 50px;}
.mission-box .pd-img {padding-bottom: 30%}

/* PROJECT */
.filter {  padding: 15px 0px; letter-spacing: .16em;  font-weight: 500; display: flex; align-items: center; justify-content: space-between;}
.nav-tabs .nav-item {padding: 0 15px;}
.nav-tabs .nav-link {letter-spacing: .1666666667em;  font-weight: 400; text-transform: uppercase; padding: 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--text-color);}
.nav-tabs .nav-link.active {border-color: currentColor;}
.cta-sect {background-size: cover; background-position: bottom center;}
.cta-card {background-color: var(--primary-color); padding: 50px; background-size: 30%;  background-repeat: no-repeat;  background-position: right bottom;}
.feature-sect {height: 100vh; background-size: cover; background-position: left center;}
.about-part .section-title :is(h1, h2, h3, h4, h5, h6) {color: var(--bs-white); opacity: .8}
.about-project-sect .nav-tabs .nav-link { font-size: 16px;  padding: 12px 20px 9px;   width: 100%;  text-align: left;}
.about-project-sect .nav-tabs .nav-link.active {  background: var(--primary-color);   color: var(--bs-white);}

.line-ul { list-style: none;  padding: 0;  font-size: 110%;}
.line-ul li {border-bottom: 1px solid #ccc; padding: 10px 0}


/* MEDIA
------------------------ */
@media (min-width:768px) {
    .top-menu-bar a span { display: none; }
}
@media (min-width:1200px) {
    .text-desc { font-size: 18px; }
    .parallex { background-attachment: fixed; }
    .btn.min-width { min-width: 250px;}
}
@media (min-width:1400px) {
    .container { max-width: 1350px; }
    .container-fluid {padding-left: 3rem; padding-right: 3rem}
    p { margin-top: 0; margin-bottom: 1.5rem;}
    .event-img {min-height: 800px;}
    section { padding-top: 10rem; padding-bottom: 10rem;}
}

@media (min-width:1900px) {
    .container-fluid { max-width: 1600px; }
    header .container-fluid {max-width: 100%}
}
@media (max-width:1200px) {
    .container { max-width: 100%; }
    .banner-title .section-title br { display: none; }
    .banner-title p { padding: 0 }
}
@media (max-width:1024px) {
    html, body { overflow-x: hidden;  }
    .section-title h1 { font-size: 30px; }
    .banner-title h1 {font-size: 30px;}
    .section-title h2 { font-size: 24px; }
    .section-title h3 { font-size: 20px; }
    .section-title h4 { font-size: 18px; }
    .section-title h5 { font-size: 16px; }
    .desc-md {font-size: 14px;}
    .desc-lg {font-size: 16px;}
    .desc-xl {font-size: 18px;}
    .main-menu ul.navbar-nav {padding: 30px;}
    .inner-banner { height: 70vh;}
}

@media (max-width:992px) {
    .navbar-brand img {height: 60px;}
    .service-icon {font-size: 40px;}
    .border-style .col {padding: 10px;}
}
@media (max-width:767px) {
    html, body { overflow-x: hidden; }
    .mobile-hide { display: none; }
    header .navbar {padding: 15px 0}
    footer { padding: 60px 0; font-size: 13px; }
    header .main-menu ul.navbar-nav {width: 100%}
    .top-margin { margin-top: 0;}
    .interested-content {border: 0; border-bottom: 1px solid var(--bs-black); padding-bottom: 10px;}
    .parallex {min-height: 350px;}
}
@media (max-width:480px) {
    .post-meta { display: flex; flex-direction: column; gap: 5px;}
    .post-meta .separator {display: none;}
    .mission-box .pd-img { padding-bottom: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; }
    .mission-box-desc { top: 0; right: 0; bottom: 0; width: auto; padding: 25px; left: 0; position: relative; z-index: 9; margin: 1rem; }
    .filter {justify-content: center; flex-wrap: wrap; gap: 20px;}
}