/** style.css
 *
 * Theme Name:   The Bootstrap
 * Theme URI:    http://en.wp.obenland.it/the-bootstrap/
 * Description:  A WordPress Theme based on Bootstrap, from Twitter. It features a 100% responsive layout, a superb gallery and image handling with a custom image meta widget and carousel for gallery post-formats, the Glyphicon Icon set, a clean and simple design and a lot more! The Bootstrap runs on HTML5 and CSS3, a 12-column grid and comes with custom jQuery plugins. See the Bootstrap documentation on GitHub for reference.
 * Author:       Konstantin Obenland
 * Author URI:   http://en.wp.obenland.it/
 * Version:      2.0.3
 * Tested up to: 6.8
 * Requires PHP: 5.3
 * Tags:         black, blue, white, light, custom-background, custom-header, custom-menu, featured-images, flexible-header, flexible-width, full-width-template, left-sidebar, microformats, post-formats, right-sidebar, sticky-post, theme-options, threaded-comments, translation-ready, two-columns
 * Text Domain:  the-bootstrap
 * Domain Path:  /lang
 *
 * License:     GNU General Public License v3.0
 * License URI: http://www.gnu.org/licenses/gpl-3.0.html
 *
 *
 *	Copyright (C) 2012 Konstantin Obenland <konstantin@obenland.it>
 *
 *	This program is free software: you can redistribute it and/or modify
 *	it under the terms of the GNU General Public License as published by
 *	the Free Software Foundation, either version 3 of the License, or
 *	(at your option) any later version.
 *
 *	This program is distributed in the hope that it will be useful,
 *	but WITHOUT ANY WARRANTY; without even the implied warranty of
 *	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *	GNU General Public License for more details.
 *
 *	You should have received a copy of the GNU General Public License
 *	along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */

@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";
@import"https://db.onlinewebfonts.com/c/58dac32d63e934bab07542927c7e9941?family=Andalus+V4";
.gap_26 {
    gap: 2.6rem
}

.gutter_x_40 {
    --bs-gutter-x: 4rem
}

.gutter_y_40 {
    --bs-gutter-y: 4rem
}

.gutter_lg_24 {
    --bs-gutter-x: 2.4rem
}

.gutter_lg_25 {
    --bs-gutter-x: 2.5rem
}

.gutter_lg_26 {
    --bs-gutter-x: 2.6rem
}

.gutter_x_32 {
    --bs-gutter-x: 3.2rem
}

@media screen and (min-width: 1600px) {
    html {
        font-size: 10px !important
    }
}

.py_section {
    padding: 9.6rem 0 13.6rem
}

@font-face {
    font-family: "Andalus V4";
    src: url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.eot");
    src: url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.eot?#iefix") format("embedded-opentype"), url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.woff2") format("woff2"), url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.woff") format("woff"), url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.ttf") format("truetype"), url("https://db.onlinewebfonts.com/t/58dac32d63e934bab07542927c7e9941.svg#Andalus V4") format("svg")
}

html {
    scroll-behavior: smooth;
    font-size: 10px
}

body {
    background: #121212;
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body::-webkit-scrollbar {
    width: .5rem
}

body::-webkit-scrollbar-track {
    background-color: #121212;
    border-radius: .5rem
}

body::-webkit-scrollbar-thumb {
    background: #ffc000;
    border-radius: 8rem;
    cursor: pointer;
    -webkit-transition: .5s ease;
    transition: .5s ease
}

a,
button {
    text-decoration: none;
    transition: .3s ease;
    font-family: "Andalus V4"
}

a:hover,
button:hover {
    transition: .3s ease
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
div {
    font-family: "Andalus V4";
    font-style: normal
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    display: flex;
    padding: 3.3rem 0;
    transition: all .3s ease
}

header .logo {
    height: 8.5rem;
    aspect-ratio: 112/85;
    flex-shrink: 0;
    transition: .5s ease
}

header .nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3.5rem
}

header nav .menu-item {
    font-size: 1.6rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal
}
nav.subnav.clearfix {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
header nav .menu-item a{
	color:#FFF
}
header nav .menu-item:hover {
    color: #ffc000
}

header nav .menu-item.active {
    color: #ffc000
}

header .inquire_cta {
    display: flex;
    flex-direction: column
}

header .inquire_cta .sub_text {
    font-size: 1.2rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: 81.5%;
    text-transform: uppercase;
    display: flex;
    letter-spacing: .14rem;
    gap: 1rem;
    margin-bottom: 1rem
}

header .inquire_cta .text_link {
    font-size: 1.6rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #ffc000;
    line-height: 143.5%
}

header.fixed {
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    background: rgba(0, 0, 0, .4666666667);
    padding: 2rem 0
}

header.fixed .logo {
    height: 5rem
}

.banner {
    width: 100%;
    height: 100vh;
    position: relative
}

.banner video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.banner .--content {
    position: absolute;
    inset: 0;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .6);
    opacity: .7
}

.banner .--content .heading {
    font-size: 5.4rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    letter-spacing: -0.027rem;
    line-height: 114%;
    text-transform: capitalize
}

.banner .--content .text {
    font-size: 1.8rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    text-align: center;
    margin: 1rem 0 0
}

.our_projects {
    padding: 6rem 0
}

.our_projects .--item {
    border-radius: 1.2rem;
    overflow: hidden;
    margin: 1.6rem 0
}

.our_projects .--item iframe {
    width: 100%;
    height: 100%
}

.our_projects .--item .player-container {
    position: relative;
    overflow: hidden
}

.our_projects .--item .player-container button {
    box-shadow: none;
    border: 0;
    background: none;
    font-family: "Andalus V4";
    font-size: 1.8rem;
    width: 4rem;
    padding: 1rem 1rem;
    z-index: 1;
    text-transform: capitalize;
    position: absolute;
    right: .5rem;
    bottom: .2rem;
    margin: auto;
    filter: drop-shadow(0 0 1rem #000)
}

.our_projects .--item .player-container::after {
    background: linear-gradient(0deg, transparent, rgba(0, 0, 0, 0.6705882353));
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "";
    position: absolute
}

.our_projects .--item .player-container .heading {
    position: absolute;
    color: #fff;
    font-family: "Andalus V4";
    font-size: 1.8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    width: 100%;
    padding: 1rem 1rem;
    z-index: 1;
    text-transform: capitalize
}

.our_projects .--item video {
    width: 100%;
    height: 100%;
    -o-object-fit: fill;
    object-fit: fill
}

.about_section {
    background: url("https://www.cwe.ae/wp-content/uploads/2025/09/bg-scaled.jpg") #d3d3d3 50%/cover no-repeat;
    padding: 6rem 0
}

.about_section .--content {
    border-radius: 1.6rem;
    background: rgba(18, 18, 18, .85);
    box-shadow: 0 .4rem .4rem 0 rgba(0, 0, 0, .25);
    -webkit-backdrop-filter: blur(5.4px);
    backdrop-filter: blur(5.4px);
    padding: 2rem
}

.about_section .sub_text {
    font-size: 1.8rem;
    font-weight: 600;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    text-align: center;
    letter-spacing: .252rem;
    color: #ffc000
}

.about_section .heading {
    font-size: 4rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    margin-bottom: 2.1rem;
    text-transform: capitalize
}

.about_section p.text,.about_section p {
    font-size: 1.6rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: hsla(0, 0%, 100%, .7);
    line-height: 2rem;
    margin-bottom: 3rem
}

.counter-container {
    display: flex;
    align-items: center;
    gap: 4rem;
    padding: 11.5rem 0;
    background: url("https://www.cwe.ae/wp-content/uploads/2025/09/bg-scaled.jpg") rgba(17, 17, 17, .5) 50%/cover no-repeat
}

.counter-container .--title .heading {
    font-size: 4rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    margin-bottom: 2.3rem;
    text-transform: capitalize
}

.counter-container .--title .heading span {
    color: #ffc000
}

.counter-container .--title .text {
    font-size: 2rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal
}

.counter-container .--item {
    margin: 3rem 0
}

.counter-container .--item .heading {
    font-size: 5.6rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    margin-bottom: .6rem;
    text-transform: capitalize
}

.counter-container .--item .label {
    font-size: 2rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: hsla(0, 0%, 100%, .7);
    line-height: normal
}

.marquee {
    overflow-x: clip;
    white-space: nowrap;
    position: relative;
    width: 100%;
    padding: 6rem 0
}

.marquee .marquee-inner {
    display: flex;
    align-items: center;
    gap: 3vw;
    will-change: transform
}

.marquee .marquee-inner img {
    height: 4rem;
    opacity: .7;
    transition: transform .5s
}

.marquee .marquee-inner img:hover {
    transform: scale(1.03)
}

.btn_primary {
    border-radius: 1rem;
    display: inline-flex;
    padding: 0 2.6rem;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    color: #000;
    text-shadow: 0 0 1.6rem rgba(0, 0, 0, .25);
    position: relative;
    overflow: hidden;
    transition: .3s ease;
    height: 4rem;
    border: .1rem solid #ffd102
}

.btn_primary span {
    z-index: 0;
    display: flex;
    align-items: center;
    height: 100%;
    gap: .8rem
}

.btn_primary::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: #ffd102;
    z-index: -1;
    transition: .3s ease
}

.btn_primary svg {
    width: 2.4rem;
    height: auto
}

.btn_primary:hover {
    color: #ffd102;
    transition: .3s ease;
    border: .1rem solid #ffd102;
    background: #000
}
.btn_primary img{
filter: invert(0%) sepia(100%) saturate(7460%) hue-rotate(159deg) brightness(103%) contrast(111%);
    transition: .3s ease
}
.btn_primary:hover img{
	filter: invert(86%) sepia(15%) saturate(3475%) hue-rotate(353deg) brightness(100%) contrast(106%);
    transition: .3s ease
}
.btn_primary:hover svg path {
    fill: #ffd102
}

.btn_primary:hover::after {
    position: absolute;
    content: "";
    left: 0;
    top: -100%;
    height: 100%;
    width: 100%;
    background: #ffd102;
    z-index: -1;
    transition: .3s ease
}

.title .heading {
    font-size: 4rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    margin-bottom: 3.6rem;
    line-height: 125.5%;
    text-transform: capitalize
}

.title .heading span {
    color: #ffc000
}

.title .sub_text {
    font-size: 1.8rem;
    font-weight: 600;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    color: #ffc000;
    letter-spacing: .252rem
}

.title .text {
    font-size: 1.6rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: hsla(0, 0%, 100%, .7);
    line-height: normal
}

.contact_section {
    padding: 6rem 0
}

.contact_section .--item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 3rem 4.5rem;
    border-radius: 1.2rem;
    background: linear-gradient(130deg, #191918 3.05%, rgba(56, 56, 56, 0.5) 97.74%);
    height: 100%
}

.contact_section .--item img {
    width: 4.96rem
}

.contact_section .--item .heading {
    font-size: 2.4rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    text-align: center;
    margin: 2.53rem 0 2.26rem;
    text-transform: capitalize
}

.contact_section .--item .text,
.contact_section .--item a.text {
    font-size: 2rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: hsla(0, 0%, 100%, .7);
    line-height: normal;
    text-align: center;
    margin-bottom: 0
}

.contact_section .--item .text:hover,
.contact_section .--item a.text:hover {
    color: #fdc500;
    transition: .3s ease
}

footer {
    background: url("https://www.cwe.ae/wp-content/uploads/2025/09/bg-scaled.jpg") #d3d3d3 50%/cover no-repeat;
    padding: 6rem 0
}

footer .wp-block-image img {
    margin-bottom: 1.2rem;
    height: 8.5rem;
	width:auto;
}

footer .text {
    font-size: 1.6rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: hsla(0, 0%, 100%, .7);
    line-height: normal;
    width: 70%
}

footer .heading {
    font-size: 2rem;
    font-weight: 500;
    font-family: "Andalus V4";
    font-style: normal;
    color: #fff;
    line-height: normal;
    margin-bottom: 2rem;
    text-transform: capitalize
}

footer .links {
    font-family: "Andalus V4";
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 190%;
    list-style: none;
    padding: 0
}

footer .links a {
    color: #fff;
    transition: .3s ease
}

footer .links a:hover {
    color: #fdc500
}

footer .social_links {
    display: flex;
    gap: 1.4rem;
    list-style: none;
    padding: 0
}

footer .social_links .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 10rem;
    border: 1px solid #fdc500;
    transition: .3s ease
}

footer .social_links .icon:hover {
    background: #fdc500
}

footer .social_links .icon:hover img {
    filter: contrast(0%) brightness(-300%)
}

.copyright {
    background: #171717;
    text-align: center;
    padding: 2.2rem 0;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: "Andalus V4";
    font-style: normal;
    color: #cacbcc;
    line-height: normal
}

@media screen and (max-width: 768px) {
    .contact_section .row-gutter-35 {
        --bs-gutter-y: 3.5rem;
        --bs-gutter-x: 3.5rem
    }
    .our_projects .--item video {
        -o-object-fit: contain !important;
        object-fit: contain !important
    }
    footer {
        background: url(https://www.cwe.ae/wp-content/uploads/2025/09/bg-scaled.jpg) #000 50%/cover no-repeat
    }
    footer .heading {
        margin-top: 5rem
    }
    .d_none_xs {
        display: none
    }
    .banner {
        height: 40rem
    }
    .banner .--content {
        padding: 0 5rem;
        opacity: 0
    }
    .banner .--content .heading {
        font-size: 3rem
    }
    .banner .--content .text {
        font-size: 1.4rem
    }
    .counter-container {
        padding: 3rem 0
    }
    .about_section .--content {
        padding: 5rem 2rem
    }
    header {
        position: relative;
        padding: 2rem 0
    }
    header .logo {
        height: 6.5rem
    }
    header.fixed {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
}

.whatsapp_btn {
    position: fixed;
    right: 2%;
    bottom: 10%;
    width: 7rem;
    height: 7rem;
    background-color: rgba(34, 34, 34, .5254901961);
    box-shadow: 0 1rem 2rem -1rem #ffc000;
    color: #fff;
    z-index: 9;
    text-align: center;
    border-radius: 10rem;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-backdrop-filter: blur(0.2rem);
    backdrop-filter: blur(0.2rem)
}

.whatsapp_btn img {
    width: 4rem
}

.swiper-slide {
    opacity: 0 !important;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center
}

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

.swiper-slide img {
    display: block;
    width: 50%;
    margin: 0 auto
}