﻿/*!
Template Name: Eventics - Event & Conference HTML Template
Author: temptics pro
Version: 1.0

-----------------------------------------------------------------------------------
Front End is Developed By Shaikh Abu Amer on bahalf of temptics pro
-----------------------------------------------------------------------------------


CSS INDEX
=================== 
01. CUSTOM PROPERTIES
02. GLOBAL
03. Header
04. About
05. Countdown
06. Schedule
07. Stats
08. Categories
09. Features
10. Artists
11. Upcoming Events
12. Blog

// pages
13. About page
14. Events Page
15. Event Details Page
*/
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");
:root {
  --et-primary: #0B1A72;
  --et-secondary: #0B1A72;
  --et-white: #F8F8F8;
  --et-2-primary: #0B1A72;
  --et-3-primary: #4033ff;
  --et-blue: #1260FE;
  --et-purple: #550ECA;
  --et-purple-rgb: 85, 14, 202;
  --et-pink: #DE0977;
  --et-pink-rgb: 222, 9, 119;
  --et-Lpink: #F929BB;
  --et-gray: #58595B;
  --et-gray2: #5C707E;
  --black: #181818;
  --white: #ffffff;
  --font-jakarta: "Plus Jakarta Sans", sans-serif;
}

body {
  font-family: var(--font-jakarta);
}

p {
  line-height: 1.6;
}

a,
button {
  transition: 0.4s ease;
}

img {
  max-width: 100%;
}

.rev-slide-up {
  opacity: 0;
}

@keyframes updown {
  50% {
    transform: translateY(10px);
  }
}
@keyframes circle360 {
  0% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.et-4-section-sub-title {
  position: relative;
  padding-left: 40px;
  font-family: var(--font-kalam);
  color: var(--et-purple);
  font-size: 16px;
  font-weight: 500;
  display: inline-block;
  margin-bottom: 11px;
}
@media screen and (max-width: 767px) {
  .et-4-section-sub-title {
    margin-bottom: 6px;
  }
}
.et-4-section-sub-title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 30px;
  height: 1px;
  background-color: var(--et-purple);
}
.et-4-section-title {
  font-family: var(--font-kanit);
  font-weight: 500;
  font-size: 55px;
  color: var(--black);
  line-height: 1.05;
}
@media screen and (max-width: 1199px) {
  .et-4-section-title {
    font-size: 48px;
  }
}
@media screen and (max-width: 991px) {
  .et-4-section-title {
    font-size: 45px;
  }
}
@media screen and (max-width: 767px) {
  .et-4-section-title {
    font-size: 40px;
  }
}
@media screen and (max-width: 575px) {
  .et-4-section-title {
    font-size: 35px;
  }
}
@media screen and (max-width: 479px) {
  .et-4-section-title {
    font-size: 32px;
  }
}
.et-4-section-title span.colored {
  font-family: var(--font-kalam);
  font-weight: 700;
  color: var(--et-pink);
}

.et-pagination a.active {
  background-color: var(--et-blue);
  border-color: var(--et-blue);
  color: var(--white);
}

.et-3-pagination a.active {
  background-color: var(--et-pink);
  border-color: var(--et-pink);
  color: var(--white);
}

.video-btn-shadow {
  animation: shadow 2s ease-in infinite;
}

@keyframes shadow {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5), 0 0 0 0 rgba(255, 255, 255, 0.5);
  }
  100% {
    box-shadow: 0 0 0 30px transparent, 0 0 0 15px transparent;
  }
}
.et-banner-slider-dots {
  margin-top: 28px;
  display: flex;
  justify-content: center;
}

.et-banner-slider-dots span {
  width: 20px;
  height: 20px;
  opacity: 1;
  border: 1px solid rgba(0, 0, 0, 0);
  position: relative;
  background-color: rgba(0, 0, 0, 0);
  transition: 0.4s ease;
  vertical-align: top;
}

.et-banner-slider-dots span::before {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 6px;
  height: 6px;
  background-color: var(--white);
  border-radius: 50%;
}

.et-banner-slider-dots span.swiper-pagination-bullet-active {
  border-color: var(--white);
}

@keyframes spin {
  0% {
    transform: rotate(0) scale(1);
  }
  25%, 100% {
    transform: rotate(90deg) scale(1);
  }
  50% {
    transform: rotate(90deg) scale(0.8);
  }
}
@keyframes etSpin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.et-banner-3-clipped {
  animation: clipMove 7s ease forwards infinite;
}

@keyframes clipMove {
  0% {
    clip-path: polygon(100% 0, 149% 0, 192% 100%, 144% 100%);
  }
  30% {
    clip-path: polygon(0 0, 49% 0, 92% 100%, 44% 100%);
  }
  60% {
    clip-path: polygon(0 0, 49% 0, 92% 100%, 44% 100%);
  }
  100% {
    clip-path: polygon(0 0, 49% 0, 92% 100%, 44% 100%);
  }
}
.et-3-banner-vector {
  animation: moveX 7s ease forwards infinite;
}

@keyframes moveX {
  0% {
    left: 50%;
    opacity: 0;
  }
  30% {
    left: 68%;
    opacity: 25%;
  }
  60% {
    left: 68%;
    opacity: 25%;
  }
  100% {
    left: 68%;
    opacity: 25%;
  }
}
.et-3-package-accordion .et-single-accordion-item.open .et-single-accordion-item__header i {
  transform: rotate(180deg);
  color: var(--et-blue);
}

.et-outlined-text {
  color: transparent;
  -webkit-text-stroke: 1px rgb(142, 142, 147);
}

.et-3-event-tab-navs button.active {
  color: var(--white);
  border-color: transparent;
}
.et-3-event-tab-navs button.active::before {
  opacity: 1;
}

.et-vertical-txt {
  writing-mode: vertical-lr;
}

.et-4-new-events-slider-dots span::before {
  background-color: var(--black);
}
.et-4-new-events-slider-dots span.swiper-pagination-bullet-active {
  border-color: var(--et-blue);
}
.et-4-new-events-slider-dots span.swiper-pagination-bullet-active::before {
  background-color: var(--et-blue);
}

.et-auction-tab-navs button.active, .et-auction-tab-navs button:hover {
  color: var(--white);
  background-color: var(--et-blue);
}

.et-4-banner-slider-dots .swiper-pagination-bullet {
  color: rgba(255, 255, 255, 0.3);
  font-size: clamp(13px, 0.84vw, 16px);
  width: auto;
  height: auto;
  opacity: 1;
  background: transparent;
  padding-bottom: 5px;
  display: inline-block;
  position: relative;
}
.et-4-banner-slider-dots .swiper-pagination-bullet::before {
  content: "";
  position: absolute;
  width: 5px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: var(--white);
  opacity: 0;
  top: 44%;
  transform: translateY(-50%);
  left: -9px;
}
.et-4-banner-slider-dots .swiper-pagination-bullet-active {
  color: var(--et-blue);
}
.et-4-banner-slider-dots .swiper-pagination-bullet-active::before {
  opacity: 1;
}

@media screen and (max-width: 991px) {
  .et-4-testimonial-slider .swiper-slide {
    opacity: 1;
    pointer-events: all;
  }
}
.et-4-testimonial-slider .swiper-slide:first-child:not(.swiper-slide-active), .et-4-testimonial-slider .swiper-slide-prev {
  opacity: 0;
  pointer-events: none;
}

.et-auctions-event-tab {
  height: 0;
  opacity: 0;
  transition: 0.2s ease;
  pointer-events: none;
}
.et-auctions-event-tab.active {
  height: auto;
  opacity: 1;
  pointer-events: all;
}

@keyframes rotate-90-top-ccw {
  0% {
    transform: rotate(0);
    transform-origin: 0 130px;
  }
  100% {
    transform: rotate(100deg);
    transform-origin: 0 130px;
  }
}
@keyframes rotate-90-top-ccw2 {
  0% {
    transform: rotate(0);
    transform-origin: 90% 72%;
  }
  100% {
    transform: rotate(100deg);
    transform-origin: 90% 72%;
  }
}
.et-2-banner-container {
  max-width: clamp(1920px, 100.89vw, 1920px);
  margin: auto;
}

:root {
  --body: #f8f8f8;
  --black: #2d2d2d;
  --white: #fff;
  --theme: #0B1A72;
  --theme2: #2ecc71;
  --theme3: #4033ff;
  --theme4: #0B1A72;
  --header: #161616;
  --text: #0B1A72;
  --border: rgba(44, 47, 88, 0.11);
  --bg: #f8f8f8;
  --bg-2: #000;
  --box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.06);
}

@media (min-width: 1400px) {
  .header-section .container {
    max-width: 1765px;
    margin: 0 auto;
  }
}
.header-section.style1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background-color: transparent;
  border-bottom: 1px solid rgba(28, 75, 66, 0.14);
  padding: 22px 0;
}
.header-section.style1 .header-hamburger-inner {
  gap: 39px;
}
@media (max-width: 1600px) {
  .header-section.style1 .header-hamburger-inner {
    gap: 14px;
  }
}
.header-section.header-white {
  margin-top: 11px;
}
@media (min-width: 1200px) {
  .header-section.header-white .main-menu ul li a {
    color: var(--white);
  }
  .header-section.header-white .main-menu ul li a:hover {
    background: rgba(255, 255, 255, 0.2);
    color: var(--white) !important;
  }
}
.header-section.header-white.sticky {
  margin-top: 0 !important;
  background: var(--theme2) !important;
}
@media (min-width: 1200px) {
  .header-section.style3 .main-menu ul li a {
    color: #000;
  }
  .header-section.style3 .main-menu ul li a:hover {
    background: var(--white);
    color: var(--theme3) !important;
  }
}

.header-sections {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background-color: transparent;
}

.header-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-main .header-logo {
  width: 30px;
}
.header-main .header-logo img {
  width: 170px;
  height: auto;
}
.header-main .main-menu ul {
  margin-bottom: 0;
}
.header-main .main-menu ul li {
  position: relative;
  list-style: none;
  display: inline-block;
}
.header-main .main-menu ul li a {
  display: inline-block;
  font-size: 15px;
  line-height: 120%;
  font-weight: 600;
  color: var(--text);
  padding: 10px 20px 12px;
  border-radius: 30px;
  text-align: left;
  font-family: "Plus Jakarta Sans", sans-serif;
  position: relative;
  text-transform: capitalize;
  transition: all 0.4s ease-in-out;
}
.header-main .main-menu ul li a i {
  font-size: 16px;
}
.header-main .main-menu ul li a:hover {
  background-color: var(--white);
  color: var(--text) !important;
}
@media (max-width: 1600px) {
  .header-main .main-menu ul li a {
    padding: 8px 16px 10px !important;
  }
}
.header-main .main-menu ul li .submenu {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  width: 200px;
  background: var(--white);
  z-index: 99999;
  visibility: hidden;
  opacity: 0;
  transform-origin: top center;
  color: var(--text);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  transform: translateY(10px);
  transition: all 0.4s ease-in-out;
}
.header-main .main-menu ul li .submenu li {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}
.header-main .main-menu ul li .submenu li a {
  position: relative;
  z-index: 11;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  padding: 0 18px;
  padding-bottom: 11px;
  padding-top: 9px;
  width: 100%;
  border-bottom: 1px solid #eeeeee;
  border-radius: 0 !important;
}
.header-main .main-menu ul li .submenu li:last-child a {
  border: none;
}
.header-main .main-menu ul li .submenu li .submenu {
  inset-inline-start: 100%;
  top: 0;
  visibility: hidden;
  opacity: 0;
}
.header-main .main-menu ul li .submenu li:hover > a {
  background: var(--text);
  color: var(--white) !important;
}
.header-main .main-menu ul li .submenu li:hover > a::after {
  color: var(--theme);
}
.header-main .main-menu ul li .submenu li:hover > .submenu {
  -webkit-transform: translateY(1);
  -moz-transform: translateY(1);
  -ms-transform: translateY(1);
  -o-transform: translateY(1);
  transform: translateY(1);
  visibility: visible;
  opacity: 1;
}
.header-main .main-menu ul li .submenu li.has-dropdown > a::after {
  position: absolute;
  top: 50%;
  inset-inline-end: 25px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  color: var(--theme);
}
.header-main .main-menu ul li .has-homemenu {
  width: 900px;
  padding: 30px 30px 10px 30px;
  opacity: 0;
  left: calc(100% - 300px);
  visibility: hidden;
  padding: 20px 20px 20px 20px;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}
@media (max-width: 991px) {
  .header-main .main-menu ul li .has-homemenu .homemenu-items {
    flex-wrap: wrap;
  }
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu {
  position: relative;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb {
  position: relative;
  width: 100%;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
  gap: 10px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease-in-out;
  margin-top: 20px;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn {
  padding: 8px 14px 8px;
  background: var(--theme);
  color: var(--white) !important;
  width: initial;
  font-size: 12px !important;
  text-align: center;
  border-radius: 4px;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn span {
  font-size: 14px;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn:hover {
  color: var(--white) !important;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover::before {
  visibility: visible;
  opacity: 1;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover .demo-button {
  opacity: 1;
  visibility: visible;
  margin-top: 0;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover.homemenu-btn {
  opacity: 1;
  visibility: visible;
  bottom: 50%;
  transform: translateY(50%);
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb img {
  width: 100%;
}
.header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-title {
  text-align: center;
  margin: 15px auto;
  display: inline-block;
  font-size: 16px;
}
@media (max-width: 1199px) {
  .header-main .main-menu ul li .has-homemenu {
    width: 1000px;
  }
}
.header-main .main-menu ul li:hover > a {
  color: var(--theme);
}
.header-main .main-menu ul li:hover > a::after {
  color: var(--theme);
}
.header-main .main-menu ul li:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0px);
}
.header-main .sidebar__toggle {
  cursor: pointer;
  width: 30px;
  font-size: 20px;
}
.header-main .sidebar__toggle img {
  width: 30px;
}
.header-main .sidebar__toggle.bars-white img {
  filter: contrast(0) brightness(2);
}
@media (max-width: 991px) {
  .header-main .header-logo {
    width: 170px;
    display: block;
  }
  .header-main .header-logo img {
    width: 100%;
    height: 100%;
  }
}

.sidebar__toggle {
  cursor: pointer;
}

.sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.9s;
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  background-color: var(--white) !important;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.offcanvas__info {
  background: var(--bg) none repeat scroll 0 0;
  border-left: 2px solid var(--theme);
  position: fixed;
  right: 0;
  top: 0;
  width: 400px;
  height: 100%;
  -webkit-transform: translateX(calc(100% + 80px));
  -moz-transform: translateX(calc(100% + 80px));
  -ms-transform: translateX(calc(100% + 80px));
  -o-transform: translateX(calc(100% + 80px));
  transform: translateX(calc(100% + 80px));
  -webkit-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -moz-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  z-index: 99999;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}
.offcanvas__info::-webkit-scrollbar {
  display: none;
}
.offcanvas__info .social-icon a i {
  color: var(--black) !important;
}

.offcanvas__info.info-open {
  opacity: 1;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}

.offcanvas__wrapper {
  position: relative;
  height: 100%;
  padding: 30px 30px;
}
.offcanvas__wrapper .offcanvas__content .text {
  color: var(--text);
}
.offcanvas__wrapper .offcanvas__content .offcanvas__close {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 4px;
  background-color: var(--theme);
  position: relative;
  z-index: 9;
  cursor: pointer;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__close i {
  color: var(--white);
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact {
  margin-top: 20px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul {
  margin-top: 20px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li {
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 22px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li a {
  color: var(--text);
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li:not(:last-child) {
  margin-bottom: 8px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li .offcanvas__contact-icon {
  margin-right: 10px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li .offcanvas__contact-icon i {
  color: var(--theme);
  font-size: 18px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact span {
  text-transform: initial;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .header-button {
  margin-top: 20px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .header-button .theme-btn {
  width: 100%;
  padding: 16px 40px;
  text-transform: capitalize !important;
  background: var(--theme) !important;
  border-radius: 100px;
  overflow: hidden;
  padding: 9px 16px 10px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .header-button .theme-btn span,
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .header-button .theme-btn i {
  color: var(--white) !important;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon {
  margin-top: 30px;
  gap: 10px;
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon a {
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  font-size: 16px;
  display: block;
  background: var(--white);
  color: var(--text);
  border-radius: 50%;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  text-align: center;
  border: 1px solid var(--border);
}
.offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon a:hover {
  border-color: var(--theme);
  background-color: var(--theme);
  color: var(--white);
}

.offcanvas__overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #151515;
  z-index: 900;
  top: 0;
  opacity: 0;
  visibility: hidden;
  right: 0;
}

.offcanvas__overlay.overlay-open {
  opacity: 0.8;
  visibility: visible;
}

@media (max-width: 450px) {
  .offcanvas__info {
    width: 300px;
  }
}
@media (max-width: 575px) {
  .offcanvas__wrapper {
    padding: 20px;
  }
}
.search-wrap {
  width: 100%;
  height: 50%;
  overflow: hidden;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999;
  background-color: rgba(54, 52, 52, 0.9);
}
.search-wrap .search-inner {
  position: relative;
  width: 100%;
  height: 100%;
}
.search-wrap .search-cell {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
}
.search-wrap .search-field-holder {
  width: 50%;
  margin: auto;
  position: relative;
  animation: slideInUp 0.3s;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search-wrap .search-field-holder {
    width: 70%;
  }
}
@media (max-width: 575px) {
  .search-wrap .search-field-holder {
    width: 80%;
  }
}
.search-wrap .main-search-input {
  width: 100%;
  height: 70px;
  border: 0;
  padding: 0 50px;
  text-transform: capitalize;
  background: transparent;
  font-size: 25px;
  color: var(--theme);
  border-bottom: 2px solid var(--theme);
  text-align: center;
  letter-spacing: 2px;
  outline: none;
}

@media (max-width: 575px) {
  .search-wrap .main-search-input {
    height: 50px;
    padding: 0 0;
    line-height: 50px;
    font-size: 18px;
  }
}
.search-wrap input.form-control,
.search-wrap input.form-control:focus {
  background-color: var(--theme);
}

input.main-search-input::placeholder {
  color: var(--theme);
  opacity: 1;
  font-size: 25px;
}

@media (max-width: 575px) {
  input.main-search-input::placeholder {
    font-size: 18px;
  }
}
.search-close {
  position: absolute;
  top: 50px;
  right: 50px;
  font-size: 30px;
  color: var(--theme);
  cursor: pointer;
}

.mean-container a.meanmenu-reveal {
  display: none;
}

.mean-container .mean-nav {
  background: none;
  margin-top: 0;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
}

.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}
.mean-container .mean-nav > ul .homemenu-items {
  display: flex;
  align-items: center;
  gap: 30px;
  justify-content: space-between;
}
@media (max-width: 1199px) {
  .mean-container .mean-nav > ul .homemenu-items {
    flex-wrap: wrap;
  }
}
.mean-container .mean-nav > ul .homemenu-items .homemenu {
  position: relative;
}
@media (max-width: 1199px) {
  .mean-container .mean-nav > ul .homemenu-items .homemenu {
    max-width: 300px;
    text-align: center;
    margin: 0 auto;
    border: 1px solid var(--border);
    padding: 10px;
  }
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb {
  position: relative;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
  gap: 10px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease-in-out;
  margin-top: 20px;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn {
  padding: 12px 20px;
  color: var(--white) !important;
  width: initial;
  font-size: 16px;
  text-align: center;
  border-radius: 0;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn:hover {
  color: var(--white) !important;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb::before {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 19, 19, 0)), to(#5e5ef6));
  background: linear-gradient(to bottom, rgba(99, 92, 92, 0) 0%, #252527 100%);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  content: "";
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover::before {
  visibility: visible;
  opacity: 1;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover .demo-button {
  opacity: 1;
  visibility: visible;
  margin-top: 0;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover .homemenu-btn {
  opacity: 1;
  visibility: visible;
  bottom: 50%;
  transform: translateY(50%);
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb img {
  width: 100%;
}
.mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-title {
  text-align: center;
  margin: 15px auto;
  display: inline-block;
  font-size: 16px;
}

.mean-container a.meanmenu-reveal {
  display: none !important;
}

.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: var(--header);
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
  text-transform: capitalize;
  border-bottom: 1px solid var(--border) !important;
  border: none;
}
.mean-container .mean-nav ul li a:hover {
  color: var(--theme);
}

.mean-container .mean-nav ul li a:last-child {
  border-bottom: 0;
}

.mean-container .mean-nav ul li a:hover {
  color: var(--theme);
}

.mean-container .mean-nav ul li a.mean-expand {
  margin-top: 5px;
  padding: 0 !important;
}

.mean-container .mean-nav ul li > a > i {
  display: none;
}

.mean-container .mean-nav ul li > a.mean-expand i {
  display: inline-block;
  font-size: 18px;
}

.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transition: all 0.4s ease-in-out;
}

.mean-container .mean-nav ul li .mega-menu li a {
  height: 200px;
  width: 100%;
  padding: 0;
  border-top: 0;
  margin-bottom: 20px;
}

@media screen and ((max-width: 1399px)) {
  .breadcrumb-cont {
    background-color: var(--white);
    width: 320px;
    border-radius: 0px;
    height: 52px;
    padding: 5px 8px 5px 20px;
  }
}/*# sourceMappingURL=style.css.map */

/* COPILOT: Force Rudra primary/icon colors */
.bg-primary { background-color: #fff !important; }
.text-secondary { color: #0B1A72 !important; }
.fa, .fas, .fa-solid { color: #0B1A72 !important; }
.bg-primary .fa, .bg-primary .fas, .bg-primary .fa-solid { color: #0B1A72 !important; }

/* The search overlay sits on a near-black scrim, but the theme colours the
   input text, placeholder, underline and close button with var(--theme) -
   the dark brand blue - which is effectively unreadable against it. Make the
   whole overlay white. Declared here, after the theme block, so it wins. */
.search-wrap .main-search-input,
input.main-search-input::placeholder,
.search-wrap .search-close,
.search-wrap .search-close.fas { color: #fff !important; }
.search-wrap .main-search-input { border-bottom-color: rgba(255, 255, 255, 0.75) !important; }
.search-wrap .main-search-input:focus { border-bottom-color: #fff !important; }
.search-wrap .search-close { cursor: pointer; }

/* The blanket !important rule above also caught the header search icon, so
   its hover:text-white utility could never take effect and the glyph stayed
   brand blue on the darkened circle. Re-assert white on hover/focus only. */
.search-trigger:hover .fa,
.search-trigger:hover .fas,
.search-trigger:hover .fa-solid,
.search-trigger:focus .fa,
.search-trigger:focus .fas,
.search-trigger:focus .fa-solid { color: #fff !important; }

/* Breadcrumb trail ("Home > Page Name") sizing.
   The theme only styles .breadcrumb-cont below 1399px, so on desktop the
   trail was unstyled: it inherited the body font size and, with the
   flex-wrap + 16px gap the markup carries, wrapped onto two lines inside
   the narrow notch at the bottom-right of the banner instead of sitting
   on one line like the reference design.
   These selectors are deliberately two classes deep (0,2,0) so they beat
   the element's own single-class Tailwind utilities (flex-wrap, gap-[16px],
   max-w-[...]), which would otherwise win on source order - Tailwind's
   stylesheet is loaded after this one. Applied here rather than in the ~19
   templates that repeat this markup, so every page stays consistent. */
.breadcrumb-banner .breadcrumb-cont {
  flex-wrap: nowrap;
  white-space: nowrap;
  gap: 10px;
  /* Sized off the reference design, where the trail reads at roughly 20px on
     a ~1900px viewport. The ceiling is held at 20px because the longest trail
     on the site - "Home > Corporate Insurance" - measures about 280px there,
     and the notch it sits in (.boxes) is capped at 320px. */
  font-size: clamp(15px, 1.05vw, 20px);
  line-height: 1.4;
  /* The markup pins the trail to left:0 of its box, which left it hanging
     off toward the left of the notch. Centre it in the box instead so it
     sits within the notch the way the reference design does. */
  left: 50%;
  transform: translateX(-50%);
  justify-content: center;
}
.breadcrumb-banner .breadcrumb-cont i {
  font-size: 0.85em;
}
/* Wider than the theme's 270px so longer page names ("Corporate Insurance")
   and the three-level trails on post/news detail pages still fit on one
   line. The trail is absolutely positioned at left:0 inside this box, which
   is itself ml-auto, so extra width grows leftward and the right edge stays
   pinned to the banner corner. */
.breadcrumb-banner .boxes {
  max-width: clamp(250px, 17vw, 320px);
}

/* Cards that swap to the brand colour on hover (and the financial-card
   hover overlay, which is brand-coloured whenever it is visible) carry
   dark Tailwind text utilities like text-primary, which leaves the copy
   nearly unreadable against that background. Force everything inside them
   to white for the duration of the hover.
   Two classes deep so these beat the single-class Tailwind utilities, and
   unlayered so they also sit above Tailwind's @layer utilities. */
.service-item:hover,
.service-item:hover *,
.team-item:hover,
.team-item:hover *,
.financial-items.bg-secondary,
.financial-items.bg-secondary * {
  color: #fff;
}

/* The global ".fa { color: #0B1A72 !important }" rule below would otherwise
   keep the arrow glyphs dark on those hovered cards, so they need matching
   !important to follow the text. */
.service-item:hover .fa,
.service-item:hover .fas,
.service-item:hover .fa-solid,
.team-item:hover .fa,
.team-item:hover .fas,
.team-item:hover .fa-solid,
.financial-items.bg-secondary .fa,
.financial-items.bg-secondary .fas,
.financial-items.bg-secondary .fa-solid {
  color: #fff !important;
}

