main {
    overflow-x: hidden;
}

/* .tp-header-area {
  background: linear-gradient(45deg, #CF2027, #CF2027, #020202, #020202, #020202);
  backdrop-filter: blur(10px);
} */

/* Default → Desktop */
.bg-hero {
    position: relative;
    background: #020202;
    z-index: 1;
}

.bg-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: url('../images/bg/hero-banner.webp') center no-repeat;
    background-size: cover;
    opacity: 0.75;
}

/* Tablet + Mobile */
@media (max-width: 991px) {
    .bg-hero::before {
        background: url('../images/bg/mobile/hero-banner.webp') right no-repeat;
        background-size: cover;
    }
}

/* Default → Desktop & Tablet */
.bg-gdp-section {
    min-height: 100vh;
    background: url('../images/bg/bg-gdp.webp') center no-repeat;
    background-size: cover;
    padding-top: 180px;
    padding-bottom: 200px;
}

/* Mobile */
@media (max-width: 767px) {
    .bg-gdp-section {
        background: url('../images/bg/mobile/bg-gdp.webp') left no-repeat;
        background-size: cover;
    }
}

/* Desktop & Tablet */
.bg-possibility-section {
    background: url('../images/bg/bg-possibility.webp') top center no-repeat;
    background-size: cover;
}

/* Mobile */
@media (max-width: 767px) {
    .bg-possibility-section {
        background: url('../images/bg/mobile/bg-possibility.webp') top center no-repeat;
        background-size: cover;
    }
}

.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }

.text-green {
    color: #5FB646 !important;
} .text-emt {
    color: #CF212A !important;
} .bg-emt {
    background-color: #CF212A !important;
}

.bg-black-card {
    border: 1px solid rgba(255,255,255,0.75);
    padding: 40px;
    border-radius: 15px;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(10px);
}

.bg-gradiant {
    position: relative;
    z-index: 0;
} .bg-gradiant::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: url('../images/bg/bg-gradient.webp') center no-repeat;
    background-size: cover;
    z-index: -1;
} .bg-gradiant.gradiant-opacity-25::before {
  opacity: 0.20 !important
}

.bg-mini-gradiant {
    position: relative;
    z-index: 0;
} .bg-mini-gradiant::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: url('../images/bg/mini-gradient.webp') center no-repeat;
    background-size: cover;
    z-index: -1;
} .bg-mini-gradiant.gradiant-opacity-25::before {
  opacity: 0.20 !important
}

.bg-mini-light-gradiant {
    position: relative;
    z-index: 0;
} .bg-mini-light-gradiant::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: url('../images/bg/mini-light-gradient.webp') center no-repeat;
    background-size: cover;
    z-index: -1;
} .bg-mini-light-gradiant.gradiant-opacity-25::before {
  opacity: 0.20 !important
}

.huge-title {
  font-size: 130px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .huge-title {
    font-size: 150px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .huge-title {
    font-size: 130px;
  }
}
@media (max-width: 767px) {
  .huge-title {
    font-size: 100px;
  }
}

.nav-pills.emt-pills .nav-link.active, .nav-pills.emt-pills .show>.nav-link {
  background-color: #CF212A;
  color: #fff;
} .nav-pills.emt-pills .nav-link {
  color: #CF212A;
}

.btn-outline-danger {
    --bs-btn-color: #CF212A;
    --bs-btn-border-color: #CF212A;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #CF212A;
    --bs-btn-hover-border-color: #CF212A;
    --bs-btn-focus-shadow-rgb: 220, 53, 69;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #CF212A;
    --bs-btn-active-border-color: #CF212A;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #CF212A;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #CF212A;
    --bs-gradient: none;
}

.bg-transblack {
  background: rgba(0,0,0,0.75);
}

.header-sticky .tp-header-menu > nav > ul > li > a:hover {
  letter-spacing: 0.25px;
} .tp-header-menu > nav > ul > li > a:hover {
  letter-spacing: 0.25px;
}

.creative-brand-wrapper {
    position: relative;
    overflow: hidden;
}

/* LEFT FADE */
.creative-brand-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 25%; /* adjust fade strength */
    height: 100%;
    z-index: 10;
    pointer-events: none;
    background: linear-gradient(to right, #F8F9FA, rgba(255,255,255,0));
}

/* RIGHT FADE */
.creative-brand-wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
    height: 100%;
    z-index: 10;
    pointer-events: none;
    background: linear-gradient(to left, #F8F9FA, rgba(255,255,255,0));
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
  background-color: #CF212A !important;
}

/* Mobile first (default) */
.header-gradient {
  background: linear-gradient(90deg, #CF212A, #CF212A, #000000) !important;
}

/* Tablet & up */
@media (min-width: 768px) {
  .header-gradient {
    background: linear-gradient(90deg, #cf212a, #CF212A, #000000, #000000, #000000, #000000) !important;
  }
}

.header-sticky.sticky-white-bg .tp-header-menu > nav > ul > li > a {
  color: #ffffff !important;
} .header-sticky.sticky-white-bg .tp-header-dropdown nav ul li.has-dropdown::after {
  color: #ffffff !important;
} .tp-header-menu > nav > ul > li > a {
  color: #ffffff !important;
} .tp-header-bar button i {
  background-color: #ffffff !important;
}