:root {
  --default-font: "Montserrat", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --heading-font: "Inter", sans-serif;
  --nav-font: "Montserrat", sans-serif;
}
/* Global Colors - The following color variables are used throughout the website. Updating them here will change the color scheme of the entire website */ :root {
  --background-color: #ffffff; /* Background color for the entire website, including individual sections */
  --default-color: #444444; /* Default color used for the majority of the text content across the entire website */
  --heading-color: #000; /* Color for headings, subheadings and title throughout the website */
  --accent-color: #1977cc; /* Accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out */
  --surface-color: #ffffff; /* The surface color is used as a background of boxed elements within sections, such as cards, icon boxes, or other elements that require a visual separation from the global background. */
  --contrast-color: #ffffff; /* Contrast color for text, ensuring readability against backgrounds of accent, heading, or default colors. */
}
/* Nav Menu Colors - The following color variables are used specifically for the navigation menu. They are separate from the global colors to allow for more customization options */ :root {
  --nav-color: #2c4964; /* The default color of the main navmenu links */
  --nav-hover-color: #1977cc; /* Applied to main navmenu links when they are hovered over or active */
  --nav-mobile-background-color: #f0f3f8; /* Used as the background color for mobile navigation menu */
  --nav-dropdown-background-color: #f0f3f8; /* Used as the background color for dropdown items that appear when hovering over primary navigation items */
  --nav-dropdown-color: #2c4964; /* Used for navigation links of the dropdown items in the navigation menu. */
  --nav-dropdown-hover-color: #1977cc; /* Similar to --nav-hover-color, this color is applied to dropdown navigation links when they are hovered over. */
}
/* Color Presets - These classes override global colors when applied to any section or element, providing reuse of the sam color scheme. */
.light-background {
  --background-color: #f6f8fb;
  --surface-color: #ffffff;
}
.dark-background {
  --background-color: #060606;
  --default-color: #ffffff;
  --heading-color: #ffffff;
  --surface-color: #252525;
  --contrast-color: #ffffff;
}
/* Smooth scroll */ :root {
  scroll-behavior: smooth;
}
/*--------------------------------------------------------------
# General Styling & Shared Classes
--------------------------------------------------------------*/
body {
  color: var(--default-color);
  background-color: var(--background-color);
  font-family: var(--default-font);
}
a {
  color: var(--accent-color);
  text-decoration: none;
  transition: 0.3s;
}
a:hover {
  color: color-mix(in srgb, var(--accent-color), transparent 25%);
  text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
  color: var(--heading-color);
  font-family: var(--heading-font);
}
/*--------------------------------------------------------------
# Global Header
--------------------------------------------------------------*/
.header {
  color: var(--default-color);
  transition: all 0.5s;
  z-index: 997;
  background-color: #f0f3f8;
}
.header .topbar {
  background-color: var(--accent-color);
  height: 40px;
  padding: 0;
  font-size: 16px;
  transition: all 0.5s;
}
.header .topbar .contact-info i {
  font-style: normal;
  color: var(--contrast-color);
}
.header .topbar .contact-info {
  font-style: normal;
  color: var(--contrast-color);
}
.header .topbar .contact-info a, .header .topbar .contact-info span {
  padding-left: 5px;
  font-size: 12px;
  color: var(--contrast-color);
  text-decoration: none;
}
.header .topbar .contact-info a:hover {
  font-weight: 500;
}
@media (max-width: 575px) {
  .header .topbar .contact-info i a, .header .topbar .contact-info i span {
    font-size: 13px;
  }
}
.header .topbar .contact-info a {
  line-height: 0;
  transition: 0.3s;
}
.header .topbar .contact-info a:hover {
  color: var(--contrast-color);
}
.header .topbar .social-links a {
  color: color-mix(in srgb, var(--contrast-color), transparent 20%);
  line-height: 0;
  transition: 0.3s;
  margin-left: 20px;
}
.header .topbar .social-links a:hover {
  color: var(--contrast-color);
}
.header .branding {
  min-height: 60px;
  padding: 10px 0;
}
.header .logo {
  line-height: 1;
}
.header .logo img {
  max-height: 70px;
  margin-right: 8px;
}
.header .logo h1 {
  font-size: 30px;
  margin: 0;
  font-weight: 700;
  color: var(--heading-color);
}
.header .cta-btn, .header .cta-btn:focus {
  color: var(--contrast-color);
  background: var(--accent-color);
  font-size: 14px;
  padding: 8px 25px;
  margin: 0 0 0 30px;
  border-radius: 50px;
  transition: 0.3s;
}
.header .cta-btn:hover, .header .cta-btn:focus:hover {
  color: var(--contrast-color);
  /*background: color-mix(in srgb, var(--accent-color), transparent 15%);*/
    
    background:#0a2f50;
    
}
@media (max-width: 1200px) {
  .header .logo {
    order: 1;
  }
  .header .cta-btn {
    order: 2;
    margin: 0 15px 0 0;
    padding: 6px 15px;
  }
  .header .navmenu {
    order: 3;
  }
}
.scrolled .header {
  box-shadow: 0px 0 18px rgba(0, 0, 0, 0.1);
}
.scrolled .header .topbar {
  height: 0;
  visibility: hidden;
  overflow: hidden;
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Desktop Navigation */
@media (min-width: 1200px) {
  .navmenu {
    padding: 0;
  }
  .navmenu ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }
  .navmenu li {
    position: relative;
  }
  .navmenu > ul > li {
    white-space: nowrap;
    padding: 15px 14px;
  }
  .navmenu > ul > li:last-child {
    padding-right: 0;
  }
  .navmenu a, .navmenu a:focus {
    color: var(--nav-color);
    font-size: 15px;
    padding: 0 2px;
    font-family: var(--nav-font);
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    transition: 0.3s;
    position: relative;
  }
  .navmenu a i, .navmenu a:focus i {
    font-size: 12px;
    line-height: 0;
    margin-left: 5px;
    transition: 0.3s;
  }
  .navmenu > ul > li > a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: -6px;
    left: 0;
    background-color: var(--nav-hover-color);
    visibility: hidden;
    width: 0px;
    transition: all 0.3s ease-in-out 0s;
  }
 /* .navmenu a:hover:before, .navmenu li:hover > a:before, .navmenu .active:before {
    visibility: visible;
    width: 100%;
  }*/
    
    .navmenu a:hover:before,
.navmenu li:hover > a:before,
.navmenu li.active > a:before {
  visibility: visible;
  width: 100%;
    color:#1977cc;
}
    
    /* Hover + Active text color */
.navmenu li:hover > a,
.navmenu li.active > a {
  color: var(--nav-hover-color) !important;
}

/* Underline fix */
.navmenu li.active > a:before,
.navmenu li:hover > a:before {
  visibility: visible;
  width: 100%;
}
  .navmenu li:hover > a, .navmenu .active, .navmenu .active:focus {
    color: var(--nav-hover-color);
  }
  .navmenu .dropdown ul {
    margin: 0;
    padding: 10px 0;
    background: var(--nav-dropdown-background-color);
    display: block;
    position: absolute;
    visibility: hidden;
    left: 14px;
    top: 130%;
    opacity: 0;
    transition: 0.3s;
    border-radius: 4px;
    z-index: 99;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  }
  .navmenu .dropdown ul li {
    min-width: 200px;
  }
  .navmenu .dropdown ul a {
    padding: 10px 20px;
    font-size: 15px;
    text-transform: none;
    color: var(--nav-dropdown-color);
  }
  .navmenu .dropdown ul a i {
    font-size: 12px;
  }
  .navmenu .dropdown ul a:hover, .navmenu .dropdown ul .active:hover, .navmenu .dropdown ul li:hover > a {
    color: var(--nav-dropdown-hover-color);
    /*background: #eeebeb;*/
	  font-weight:600;
  }
  .navmenu .dropdown:hover > ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }
  .navmenu .dropdown .dropdown ul {
    top: 0;
    left: -90%;
    visibility: hidden;
  }
  .navmenu .dropdown .dropdown:hover > ul {
    opacity: 1;
    top: 0;
    left: -100%;
    visibility: visible;
  }
}
/* Mobile Navigation */
@media (max-width: 1199px) {
  .mobile-nav-toggle {
    color: var(--nav-color);
    font-size: 28px;
    line-height: 0;
    margin-right: 10px;
    cursor: pointer;
    transition: color 0.3s;
  }
  .navmenu {
    padding: 0;
    z-index: 9997;
  }
  .navmenu ul {
    display: none;
    list-style: none;
    position: absolute;
    inset: 60px 20px 20px 20px;
    padding: 10px 0;
    margin: 0;
    border-radius: 6px;
    background-color: var(--nav-mobile-background-color);
    border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    box-shadow: none;
    overflow-y: auto;
    transition: 0.3s;
    z-index: 9998;
  }
  .navmenu a, .navmenu a:focus {
    color: var(--nav-dropdown-color);
    padding: 10px 20px;
    font-family: var(--nav-font);
    font-size: 17px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    transition: 0.3s;
  }
  .navmenu a i, .navmenu a:focus i {
    font-size: 12px;
    line-height: 0;
    margin-left: 5px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: 0.3s;
    background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
  }
  .navmenu a i:hover, .navmenu a:focus i:hover {
    background-color: var(--accent-color);
    color: var(--contrast-color);
  }
  .navmenu a:hover, .navmenu .active, .navmenu .active:focus {
    color: var(--nav-dropdown-hover-color);
  }
  .navmenu .active i, .navmenu .active:focus i {
    background-color: var(--accent-color);
    color: var(--contrast-color);
    transform: rotate(180deg);
  }
  .navmenu .dropdown ul {
    position: static;
    display: none;
    z-index: 99;
    padding: 10px 0;
    margin: 10px 20px;
    background-color: var(--nav-dropdown-background-color);
    transition: all 0.5s ease-in-out;
  }
  .navmenu .dropdown ul ul {
    background-color: rgba(33, 37, 41, 0.1);
  }
  .navmenu .dropdown > .dropdown-active {
    display: block;
    background-color: rgba(33, 37, 41, 0.03);
  }
  .mobile-nav-active {
    overflow: hidden;
  }
  .mobile-nav-active .mobile-nav-toggle {
    color: #fff;
    position: absolute;
    font-size: 32px;
    top: 15px;
    right: 15px;
    margin-right: 0;
    z-index: 9999;
  }
  .mobile-nav-active .navmenu {
    position: fixed;
    overflow: hidden;
    inset: 0;
    background: rgba(33, 37, 41, 0.8);
    transition: 0.3s;
  }
  .mobile-nav-active .navmenu > ul {
    display: block;
  }
}
/* ===============================
HERO BANNER SECTION
=============================== */
.hero-banner {
  position: relative;
  overflow: hidden;
  margin-top: -60px;
    background-color:#001a35;
}



.hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  color: #fff !important;
}

.hero-title {
  font-size: 50px;
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 1.2;
  color: #fff !important;
  animation: fadeUp 1.2s ease;
}

.hero-text {
  font-size: 18px;
  margin-bottom: 30px;
  max-width: 500px;
  color: #fff !important;
  animation: fadeUp 1.2s ease;
}

.hero-btn {
  background: #fff;
  color: #000;
  padding: 14px 32px;
  border-radius: 50px;
  font-weight: 600;
  transition: 0.3s;
  border: none;
  animation: fadeUp 1.2s ease;
}
.hero-btn:hover {
  background: #0d6efd;
  color: #fff;
}
/* swiper arrows */
.swiper-button-next, .swiper-button-prev {
  color: #fff;
}


/* swiper arrows */
.swiper-button-next, .swiper-button-prev {
  color: #fff;
}


/* swiper arrows */
.swiper-button-next, .swiper-button-prev {
  color: #fff;
}






@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ===============================
BANNER BOTTOM STRIP
=============================== */
.banner-bottom {
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  z-index: 20;
}
.banner-strip {
  width: 100%;
  display: block;
}
/* FINAL banner-text (latest kept) */
.banner-text {
  position: absolute;
  left: 20%;
  bottom: 12%;
  font-size: clamp(10px, 3vw, 40px);
  font-weight: 600;
  line-height: 1.2;
  max-width: 60%;
}
/* logo */
.banner-logo {
  position: absolute;
  right: 8%;
  bottom: 30%;
  width: 120px;
}
/* shine text effect */
.shine {
  color: #0084c2;
  background: linear-gradient(90deg, #0084c2 0%, #0084c2 45%, #ffffff 50%, #0084c2 55%, #0084c2 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shine 4s linear infinite;
}
@keyframes shine {
  0% {
    background-position: 200%;
  }
  100% {
    background-position: -200%;
  }
}
/* ===============================
RESPONSIVE
=============================== */
@media (max-width:1200px) {
  .hero-title {
    font-size: 48px;
  }
}
@media (max-width:992px) {
  .hero-slide {
    height: 75vh;
    min-height: 500px;
  }
  .hero-title {
    font-size: 38px;
  }
}
@media (max-width:768px) {
  .hero-slide {
    height: auto;
    min-height: auto;
    text-align: center;
  }
  .hero-content {
    margin: auto;
  }
  .hero-title {
    font-size:14px;
  }
  .hero-text {
    font-size: 12px;
  }
  .banner-text {
    left: 5%;
    bottom: 5%;
    max-width: 90%;
  }
  .banner-logo {
    width: 100px;
    right: 0%;
    bottom: 25%;
  }
}
@media (max-width:480px) {
    
    
    
  .hero-title {
    font-size: 14px;
       margin-bottom: 0px;
  line-height:normal;
      padding-top:5px;
  }
  .hero-text {
    font-size: 12px;
  }
  .hero-btn {
    padding: 5px 10px;
  }
    
    .hero-banner {
  position: relative;
  overflow: hidden;
  margin-top: 0px;
    
}
    
  
    
    
    
    .hero-banner.swiper-button-next,.swiper-button-prev {
       font-size: 14px;
        
    }
}
/* ===============================
VIDEO HERO (FINAL)
=============================== */
.video-hero {
  position: relative;
  height: 90vh;
  min-height: 600px;
  overflow: hidden;
}
/* video */
.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
/* fallback image */
.video-fallback {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
/* overlay */
.video-hero::before {
  content: "";
  position: absolute;
  inset: 0;
 /* background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3));*/
  z-index: 1;
}
/* content */
/* make container full height */
.video-hero .container {
  height: 100%;
  display: flex;
  align-items: center; /* vertical center */
}
/* content */
.video-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  color: #fff;
}
/* title */
.video-title {
  font-size: 50px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #fff;
}
/* text */
.video-text {
  font-size: 18px;
  margin-bottom: 30px;
  max-width: 500px;
  color: #fff;
}
/* ===============================
RESPONSIVE
=============================== */
@media (max-width:992px) {
  .video-hero {
    height: 75vh;
  }
  .video-title {
    font-size: 38px;
  }
}
@media (max-width:768px) {
  /* disable video */
  .video-bg {
    display: none;
  }
  .video-fallback {
    z-index: 0;
  }
  .video-content {
    text-align: center;
    margin: auto;
    transform: none;
    top: auto;
    padding-top: 120px;
  }
  .video-title {
    font-size: 28px;
  }
  .video-text {
    font-size: 16px;
  }
}
@media (max-width:480px) {
  .video-title {
    font-size: 24px;
  }
}
/*--------------------------------------------------------------
# About Section
--------------------------------------------------------------*/
.about {
  margin-top: 40px;
  margin-bottom: 40px;
}
.about .section-title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #111;
}
.about .section-title span {
  color: #058bcb; /* your brand blue */
}
.about .content h3 {
  font-size: 2rem;
  font-weight: 700;
}
.about strong {
  color: #058bcb;
}









.stats h3 {
  font-size: 2rem;
  font-weight: 700;
}
.about .content ul {
  list-style: none;
  padding: 0;
}
.about .content ul li {
  display: flex;
  align-items: flex-start;
  margin-top: 40px;
}
.about .content ul i {
  flex-shrink: 0;
  font-size: 48px;
  color: var(--accent-color);
  margin-right: 20px;
}
.about .content ul h5 {
  font-size: 18px;
  font-weight: 700;
}
.about .content ul p {
  font-size: 15px;
}
.about .content p:last-child {
  margin-bottom: 0;
}
.about .pulsating-play-btn {
  position: absolute;
  left: calc(50% - 47px);
  top: calc(50% - 47px);
}
.learn-more {
  position: relative;
  text-decoration: none;
  color: #0786c5;
  font-weight: normal;
  transition: font-weight 0.3s ease;
}
.learn-more::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0;
  height: 1px;
  background: #0786c5;
  transition: width 0.4s ease;
}
.learn-more:hover {
  font-weight: normal;
}
.learn-more:hover::after {
  width: 100%;
}
.hp-what-we-do-sec {
  background: #f1f4fa url("https://www.mmactiv.in/mma-25/assets/img/stakeholders-across-India-and -world.jpg");
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding: 40px 8px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-blend-mode: lighten;
  background-attachment: fixed;
}
.hp-what-we-do-sec:after {
  content: "";
  position: absolute;
  top: 10%;
  background-image: url("../img/bg-clip-path.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: 0.3;
  height: 100%;
  width: 100%;
  z-index: -1;
}
/* CARD SECTION */
.hp-what-we-do-sec .card-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 0 auto;
  position: relative;
}
.hp-what-we-do-sec .card {
  padding: 14px;
  border: none;
  border-radius: 6px;
  margin-bottom: 20px;
  background-color: var(--white);
  box-shadow: 0px 4px 29px 0px #0000000A;
  transition: all 0.3s;
  overflow: hidden;
}
.hp-what-we-do-sec .card:hover {
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
}
.hp-what-we-do-sec .card img {
  transition: 0.5s;
}
.hp-what-we-do-sec .card:hover img {
  transform: scale(1.1);
}
.hp-what-we-do-sec .card .content {
  padding: 20px 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: 0.5s;
}
.hp-what-we-do-sec .card .content h4, .hp-what-we-do-sec .card .content p {
  color: var(--white);
  transition: 0.5s;
}
.hp-what-we-do-sec .card .content p {
  opacity: 0;
}
.hp-what-we-do-sec .card:hover .content {
  background: linear-gradient(0deg, rgba(4, 62, 118, 1) 0%, rgba(4, 62, 118, 0) 100%);
}
.hp-what-we-do-sec .card:hover .content p {
  opacity: 1;
}
/* TEXT */
.hp-what-we-do-sec .title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #058bcb;
}
.hp-what-we-do-sec .text-wrap {
  color: var(--paragraph-text-color);
  font-size: 20px;
  max-width: 690px;
  margin: 0 auto;
}
/* GRID */
.hp-what-we-do-sec .grid-row {
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}
/* COLUMN LAYOUT */
.col-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 0 auto;
  position: relative;
}
.col-wrapper .left-col, .col-wrapper .right-col {
  width: 40%;
}
.col-wrapper .mid-col {
  /*width: 20%;*/
 /* border: 2px solid #ddd;*/
  border-radius: 50%;
  padding: 22px;
  position: relative;
}
.col-wrapper .mid-col img {
  background-color: var(--white);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  padding: 16px;
}
/* OPTION STEP */
.option-step {
  display: flex;
}
.left-col .option-step {
  flex-direction: row-reverse;
}
.left-col .option-step .content {
  text-align: right;
  margin-right: 25px;
  margin-top: 25px;
}
.right-col .option-step .content {
  text-align: left;
  margin-right: 25px;
  margin-top: 25px;
}
/* ZIG-ZAG ALIGNMENT */
.left-col .option-step:nth-child(1), .left-col .option-step:nth-child(3) {
  margin-right: -40px;
  margin-left: 40px;
}
.right-col .option-step:nth-child(1), .right-col .option-step:nth-child(3) {
  margin-left: -40px;
  margin-right: 40px;
}
/* ICON */
.option-step .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 26px;
  padding: 16px;
  border-radius: 50px;
  min-width: 80px;
  height: 80px;
  border: 2px solid var(--black);
}
.option-step .icon i {
  font-size: 34px;
  color: var(--black);
}
/* TEXT */
.option-step h4 {
  color: #058bcb;
  font-size: 20px;
  font-weight: 600;
}
.option-step p {
  color: var(--paragraph-text-color);
}
/* RESPONSIVE */
@media (max-width: 991.98px) {
  .col-wrapper {
    flex-direction: column;
  }
  .col-wrapper .left-col, .col-wrapper .right-col {
    width: 100%;
  }
  .col-wrapper .mid-col {
    width: 50%;
  }
}
@media (max-width: 767.98px) {
  .international-events-logoes .col-md-3, .hp-proud-associated-sec .col-md-3 {
    width: 50%;
  }
}
.mid-col {
  perspective: 1000px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* CONTAINER */
.logo-spin {
  width: 180px;
  height: 180px;
  position: relative;
  transform-style: preserve-3d;
}
/* IMAGES */
.logo-spin img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: contain;
  backface-visibility: hidden;
  border-radius: 50%;
  background: #fff;
  padding: 10px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}
/* FRONT → ROTATE RIGHT */
.logo-spin .front {
  transform: rotateY(0deg);
  animation: spinRight 6s linear infinite;
}
/* BACK → ROTATE LEFT */
.logo-spin .back {
  transform: rotateY(180deg);
  animation: spinLeft 6s linear infinite;
}
/* RIGHT ROTATION */
@keyframes spinRight {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}
/* LEFT ROTATION */
@keyframes spinLeft {
  0% {
    transform: rotateY(180deg);
  }
  100% {
    transform: rotateY(-180deg);
  }
}

/* LOGO CONTAINER */
.logo1 {
  width: 180px;
  height: 180px;

  display: flex;
  align-items: center;
  justify-content: center;

  /* ?? HEARTBEAT */
  animation: heartbeat 1.5s ease-in-out infinite;
}

/* IMAGE */
.logo1 img {
  width: 100%;
  height: 100%;
  object-fit: contain;

  border-radius: 50%;
  background: #fff;
  padding: 10px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* ?? HEARTBEAT ANIMATION */
@keyframes heartbeat {
  0%, 100% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.08);
  }
  40% {
    transform: scale(1);
  }
  60% {
    transform: scale(1.12);
  }
  80% {
    transform: scale(1);
  }
}
/* MOBILE FIX */
@media (max-width: 767.98px) {

  .option-step {
    flex-direction: column !important;
    align-items: center;
    text-align: center;
  }

  /* remove reverse layout on left side */
  .left-col .option-step {
    flex-direction: column !important;
  }

  .option-step .icon {
    margin: 0 0 12px 0; /* space below icon */
  }

  .option-step .content {
    margin: 0 !important;
    text-align: center !important;
  }

  /* remove zig-zag spacing */
  .left-col .option-step,
  .right-col .option-step {
    margin: 0 !important;
  }

  /* spacing between cards */
  .option-step {
    margin-bottom: 25px;
  }
}


/* SECTION */
.group-of-companies {
  background: #f6f8fb;
  padding: 40px 0;
  font-family: 'Inter', sans-serif;
}
.group-of-companies .section-title1 {
  color: #058bcb;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
}
/* TITLE */
/* LEFT LOGOS */
.group-of-companies .company-logo {
  background: #fff;
  border-radius: 10px;
  padding: 18px;
  margin-bottom: 18px;
  cursor: pointer;
  border: 1px solid #e6e9ef;
  transition: all .35s ease;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.group-of-companies .company-logo img {
  max-width: 150px;
  margin: 0 auto;
  filter: grayscale(100%);
  transition: .3s;
}
.group-of-companies .company-logo:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}
.group-of-companies .company-logo.active {
  border-left: 4px solid #15619b;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}
.group-of-companies .company-logo.active img {
  filter: none;
}
/* TEXT SIDE */
.group-of-companies .company-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 15px;
  color: #1465a0;
}
.group-of-companies .company-desc {
  color: #6c757d;
  line-height: 1.9;
  font-size: 16px;
  max-width: 520px;
}
/* BUTTON */
.group-of-companies .know-more {
  display: inline-block;
  margin-top: 12px;
  font-weight: 600;
  color: #0786c5;
  text-decoration: none;
  position: relative;
}
.group-of-companies .know-more::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: #0786c5;
  transition: .3s;
}
.group-of-companies .know-more:hover::after {
  width: 100%;
}
/* IMAGE */
.group-of-companies .company-image img {
  width: 100%;
  border-radius: 14px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);
  transition: .4s ease;
}
.group-of-companies .company-image img:hover {
  transform: translateY(-6px);
}
/* FADE ANIMATION */
.fade-effect {
  animation: fade .5s ease;
}
@keyframes fade {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.stats-responsive {
  padding: 40px 0;
}
.stats-overlay h3 {
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
}
/* GRID */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 20px;
}
/* CARD */
.stat-card {
  background: #fff;
  padding: 22px 12px;
  text-align: center;
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
  transition: all 0.35s ease;
  position: relative;
  overflow: hidden;
}
/* 🔥 ICON STYLE (BIG IMPROVEMENT) */
.stat-card i {
  font-size: 20px;
  color: #00AEEF;
  background: rgba(0, 174, 239, 0.1);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;
  transition: 0.3s;
}
/* NUMBER */
.stat-card h4 {
  font-size: 15px;
  font-weight: 800;
  color: #1465a0;
  margin-bottom: 5px;
}
/* TEXT */
.stat-card p {
  font-size: 11px;
  font-weight: 600;
  color: #444;
  letter-spacing: 0.5px;
}
/* 🔥 HOVER EFFECT (PREMIUM) */
.stat-card:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}
/* ICON HOVER */
.stat-card:hover i {
  background: #1465a0;
  color: #fff;
}
/* 🔥 TOP GLOW LINE */
.stat-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 4px;
  width: 100%;
  background: linear-gradient(90deg, #1465a0, #007bb5);
  opacity: 0;
  transition: 0.3s;
}
.stat-card:hover::before {
  opacity: 1;
}
/* 🔥 FEATURE CARD (optional highlight) */
.stat-card.active {
  background: linear-gradient(135deg, #1465a0, #007bb5);
  color: #fff;
}
.stat-card.active h4, .stat-card.active p {
  color: #fff;
}
.stat-card.active i {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}
/* RESPONSIVE */
@media (max-width: 1200px) {
  .stats-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media (max-width: 992px) {
  .stats-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 576px) {
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 400px) {
  .stats-grid {
    grid-template-columns: 1fr;
  }
}
/* 🔥 PARALLAX BACKGROUND */
.stats-parallax {
  position: relative;
  background-image: url('https://images.unsplash.com/photo-1557683316-973673baf926?q=80&w=1600');
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* 🔥 KEY PARALLAX */
  padding: 40px 0;
}

/* SECTION */
.stats-parallax {
  background: linear-gradient(rgba(10,20,40,0.8), rgba(10,20,40,0.8)),
              url('https://images.unsplash.com/photo-1557683316-973673baf926?q=80&w=1600');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  padding: 60px 0;
  color:#fff;
}

/* TITLE */
.stats-parallax h3{
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
}

/* GRID */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 20px;
}

/* CARD */
.stat-card {
  background: #fff;
  padding: 20px 10px;
  text-align: center;
  border-radius: 14px;
  transition: 0.3s;
}

.stat-card:hover {
  transform: translateY(-6px);
}

/* ICON */
.stat-card i {
  font-size: 20px;
  color: #00AEEF;
  background: rgba(0,174,239,0.1);
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 10px;
}

/* NUMBER */
.stat-card h4 {
  font-size: 16px;
  color:#1465a0;
  margin:5px 0;
  font-weight:700;
}

/* TEXT */
.stat-card p {
  font-size: 12px;
  color:#444;
  margin:0;
}

/* RESPONSIVE */
@media (max-width:1200px){
  .stats-grid{ grid-template-columns: repeat(5,1fr); }
}
@media (max-width:992px){
  .stats-grid{ grid-template-columns: repeat(3,1fr); }
}
@media (max-width:576px){
  .stats-grid{ grid-template-columns: repeat(2,1fr); }
}














.upcoming_event_section {
 /* background: #07142a;*/
  padding: 40px 0;
}
.upcoming_event_title {
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 50px;
  color: #058bcb;
}
/* CARD */
.upcoming_event_card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  transition: .4s;
  height: 100%;
    border:#ccc thin solid;
}
.upcoming_event_card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}
.upcoming_event_logo {
  padding: 10px;
  text-align: center;
  background: #f6f7fb;
}
.upcoming_event_logo img {
  max-height:;
}
.upcoming_event_body {
  padding: 20px;
  text-align: center;
}
.upcoming_event_name {
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 10px;
  color: #14649f;
}
.upcoming_event_date {
  font-size: 14px;
  margin-bottom: 6px;
  color: #000;
}
.upcoming_event_location {
  font-size: 13px;
  color: #777;
}
/* BUTTON */
/*.btn-more-events {
  display: inline-block;
  padding: 12px 28px;
  border: 2px solid #fff;
   background: #084298;
  color: #fff;

  text-decoration: none;
  border-radius: 30px;
  font-weight: 500;
  transition: .3s;
}
.btn-more-events:hover {
  background: #fff;
  color: #07142a;
}
*/

.news-view-btn1 {
  text-align: center;
  margin-top: 40px;
}
.news-view-btn1 a {
  padding: 12px 32px;
  background: #084298;
  color: #fff;
  border-radius: 30px;
  text-decoration: none;
  font-weight: 600;
}
.news-view-btn1 a:hover {
  background: #048fcf;
}


.btn-more-events1 {
  display: inline-block;
  padding: 12px 28px;
  border: 2px solid #fff;
  background: #084298;
  color: #fff;
  text-decoration: none;
  border-radius: 30px;
  font-weight: 500;
  transition: 0.3s ease;
}

.btn-more-events1:hover {
  background: #fff;
  color: #07142a;
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}



.btn-more-events2 {
  display: inline-block;
  padding: 12px 28px;
  border: 2px solid #fff;

    
     background: #fff;
  color: #0b1e3a;
    
    
  text-decoration: none;
  border-radius: 30px;
  font-weight: 500;
  transition: 0.3s ease;
}

.btn-more-events2:hover {
   background: #0b1e3a;
    
    
    
    
  color: #fff;
    font-weight: 500;
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}










/* LEARN MORE LINK */
.learn-more {
  position: relative;
  text-decoration: none;
  color: #0786c5;
  font-weight: normal;
}
/* LEARN MORE LINK */
.learn-more {
  position: relative;
  text-decoration: none;
  color: #0786c5;
  font-weight: normal;
}







/* SECTION */
.latest-issues-section {
  padding: 80px 0;
  background: #f5f7fb;
}
.latest-issues-title {
  text-align: center;
  font-size: 2rem;
  color: #008DD2;
  font-weight: 700;
  margin-bottom: 40px;
}
/* CARD */
.latest-issues-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  transition: 0.4s;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  height: 100%;
}
.latest-issues-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}
/* IMAGE */
.latest-issues-img {
  position: relative;
  overflow: hidden;
}
.latest-issues-img img {
  width: 100%;
  display: block;
  transition: .5s;
}
.latest-issues-card:hover img {
  transform: scale(1.05);
}
/* DATE BADGE */
.latest-issues-date {
  position: absolute;
  top: 12px;
  left: 12px;
  background: linear-gradient(45deg, #0d6efd, #2ea6ff);
  color: #fff;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.5px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
/* BODY */
.latest-issues-body {
  padding: 20px;
}
.latest-issues-title-card {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
}
.latest-issues-desc {
  font-size: 14px;
  color: #666;
  margin-bottom: 15px;
}
.latest-issues-btn {
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  color: #084298;
}
.latest-issues-btn:hover {
  color: #07142a;
}
/* SECTION SPACING */
.partner-section {
  padding: 40px 0;
}
/* SECTION BACKGROUNDS */
.bg-partner {
  background: #0b1e3a;
  color: #fff;
}
.bg-associated {
  background: #f4f6fb;
}
.bg-member {
  background: #ffffff;
}
/* HEADINGS */
.section-title1 {
  color: #058bcb;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
}


.section-title2 {
  color: #444;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
}



.section-title p {
  font-size: 14px;
  margin-bottom: 10px;
  font-weight: normal;
  text-align: center;
}
/* LEFT TITLE */
.partner-title {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}
/* LOGO CARD */
.logo-box {
 /* height: auto;

  background: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;*/
  justify-content: center;*/
  padding: 10px;
    background: #fff;
  border-radius: 10px;

 /* box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08);*/
  transition: all .3s;

  height: 180px;/* control card height instead */
}
.logo-box img {
  /*max-height: 100px;*/
  max-width: 100%;
    
    
  transition: all .3s;
}
.logo-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}
/* GRID GAP */
.logo-row {
  row-gap: 30px;
}
/* DESCRIPTION TEXT */
.partner-desc {
  font-size: 15px;
  line-height: 1.7;
  color: #d1d9e6;
  margin: 20px 0 25px;
  max-width: 350px;
}
/* BUTTON STYLE */
.btn-know {
  display: inline-block;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  position: relative;
  padding-bottom: 5px;
  transition: all .3s;
}
/* underline animation */
.btn-know::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 1px;
  background: #fff;
  transition: width .3s ease;
}
.btn-know:hover::after {
  width: 100%;
}
.btn-know:hover {
  letter-spacing: 0.5px;
}
/* ================= NEWS SECTION ================= */
.news-section {
  padding: 40px 0;
  font-family: 'Segoe UI', sans-serif;
  background: #f5f7fa;
}
.news-title {
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 20px;
  color: #008DD2;
}
/* CARD */
.news-card {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
  transition: 0.4s;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.news-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}
/* IMAGE */
.news-img {
  position: relative;
  overflow: hidden;
}
.news-img img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  transition: .5s;
}
.news-card:hover img {
  transform: scale(1.1);
}
/* DATE */
.news-date {
  position: absolute;
  top: 15px;
  left: 15px;
  background: #0d6efd;
  color: #fff;
  padding: 6px 10px;
  font-size: 13px;
  border-radius: 5px;
}
/* CONTENT */
.news-content {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.news-content h5 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
}
.news-content p {
  font-size: 14px;
  color: #666;
}
/* READ MORE */
.news-read-btn {
  margin-top: auto;
}
.news-read-btn a {
  font-size: 14px;
  font-weight: 600;
  color: #0d6efd;
  text-decoration: none;
}
.news-read-btn a:hover {
  text-decoration: underline;
}
/* VIEW MORE */
.news-view-btn {
  text-align: center;
  margin-top: 40px;
}
.news-view-btn a {
  padding: 12px 32px;
  background: #084298;
  color: #fff;
  border-radius: 30px;
  text-decoration: none;
  font-weight: 600;
}
.news-view-btn a:hover {
  background: #048fcf;
}
/* LEARN MORE LINK */
.learn-more {
  position: relative;
  text-decoration: none;
  color: #0786c5;
  font-weight: normal;
}
.learn-more::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0;
  height: 1px;
  background: #0786c5;
  transition: width 0.4s ease;
}
.learn-more:hover::after {
  width: 100%;
}
/*--------------------------------------------------------------
# Global Footer
--------------------------------------------------------------*/
.footer {
  color: #fff;
  background-color: #091e3e;
  border-top: 1px solid color-mix(in srgb, var(--accent-color), transparent 75%);
  font-size: 14px;
  position: relative;
}
.footer .footer-top {
  padding-top: 50px;
}
.footer .footer-about .logo {
  line-height: 1;
  margin-bottom: 20px;
}
.footer .footer-about .logo img {
  max-height: 40px;
  margin-right: 6px;
}
.footer .footer-about .logo span {
  color: #fff;
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 1px;
}
.footer .footer-about p {
  font-size: 14px;
  font-family: var(--heading-font);
  /*color: #fff;*/
}






.footer .social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, #ffffff, transparent 50%);
  font-size: 16px;
  color: color-mix(in srgb, #ffffff, transparent 20%);
  margin-right: 10px;
  transition: 0.3s;
}
.footer .social-links a:hover {
  color: var(--accent-color);
  border-color: var(--accent-color);
}
.footer h4 {
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding-bottom: 12px;
  color: #fff;
}
.footer .footer-links {
  margin-bottom: 30px;
}
.footer .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer .footer-links ul i {
  padding-right: 2px;
  font-size: 12px;
  line-height: 0;
}
.footer .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}
.footer .footer-links ul li:first-child {
  padding-top: 0;
}
.footer .footer-links ul a {
  color: color-mix(in srgb, #ffffff, transparent 30%);
  display: inline-block;
  line-height: 1;
}

.footer .footer-desc{
    
      color: color-mix(in srgb, #ffffff, transparent 30%);
  
}


.footer .footer-links ul a:hover {
  color: var(--accent-color);
}
.footer .footer-contact p {
  margin-bottom: 5px;
}
.footer .copyright {
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: 1px solid color-mix(in srgb, #ffffff, transparent 90%);
    color: color-mix(in srgb, #ffffff, transparent 30%) !important;
  font-size: 12px;
}
.footer .copyright p {
  margin-bottom: 0;
    color: color-mix(in srgb, #ffffff, transparent 30%) !important;
}
.footer .credits {
  margin-top: 8px;
  font-size: 13px;
}
/* DESKTOP → ONE SINGLE ROW */
.location-tags {
  display: flex;
  flex-wrap: nowrap; /* 🔥 force one row */
  gap: 10px;
  overflow-x: auto; /* scroll if needed */
  padding-bottom: 5px;
}
/* HIDE SCROLLBAR */
.location-tags::-webkit-scrollbar {
  display: none;
}
.location-tags {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
/* TAG STYLE */
.loc-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  flex: 0 0 auto; /* important for desktop scroll */
}
/* MOBILE → 3 ITEMS PER ROW */
@media (max-width: 576px) {
  .location-tags {
    display: grid; /* switch to grid */
    grid-template-columns: repeat(3, 1fr); /* 3 per row */
    gap: 10px;
    overflow: visible; /* remove scroll */
  }
  .loc-tag {
    width: 100%;
    font-size: 11px;
    padding: 6px 6px;
    white-space: normal;
  }
}
.loc-tag {
  text-align: center;
  line-height: 1.2;
}
/* ASSOCIATED SWIPER */
.ASSOCIATED {
  margin-top: 20px;
}
.ASSOCIATED .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* keep your existing logo-box */
/* KEY RELATIONSHIPS SLIDER */
.KEY-RELATIONSHIPS {
  margin-top: 0px;
}
/* SLIDE ALIGN */
.KEY-RELATIONSHIPS .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all .3s ease;
}
/* LOGO EFFECT */
.KEY-RELATIONSHIPS .logo-box {
  transition: all .4s ease;
}
/* HOVER EFFECT */
.KEY-RELATIONSHIPS .logo-box:hover {
  opacity: 1;
/*  transform: scale(1.08);*/
}
.KEY-RELATIONSHIPS .swiper-slide {
/*  width: calc(100% / 6) !important;*/
  display: flex;
  justify-content: center;
  align-items: center;
}
/* optional spacing */
.KEY-RELATIONSHIPS {
  padding: 20px 0;
}





/*--------------------------------------------------------------
# Scroll Top Button
--------------------------------------------------------------*/
.scroll-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 99999;
  background-color: var(--accent-color);
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}
.scroll-top i {
  font-size: 24px;
  color: var(--contrast-color);
  line-height: 0;
}
.scroll-top:hover {
  background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
  color: var(--contrast-color);
}
.scroll-top.active {
  visibility: visible;
  opacity: 1;
}
/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/* ========== Internal page header design ========== */
.internal-page-header {
	/* background: url("../img/page-header-bg1.jpg"); */
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
	display: flex;
	align-items: end;
	justify-content: center;
	position: relative;
	z-index: 1;
}
.internal-page-header:after {
	content: "";
	background-image: linear-gradient(to left, rgba(255,255,255,0.5), rgba(3, 9, 30));
	background: linear-gradient(0deg,rgb(0,0,0) 3%,rgba(0,0,0,0.2) 69%);
	position: absolute;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}
.internal-page-header .container {
	position: relative;
	z-index: 2;
}
.about-page-header {
	background: url("../../assets/img/page-header-about-us.jpg");
}

.internal-page-header h2 {
	font-size: 44px;
}
.internal-page-header .breadcrumb .breadcrumb-item {
	font-size: 16px;
}
.internal-page-header .breadcrumb .breadcrumb-item a {
	color:#fff;
	text-decoration: none;
	font-size: 16px;
}
.internal-page-header .breadcrumb .breadcrumb-item.active {
	color: #D2D7E2;
}
.internal-page-header .breadcrumb-item+.breadcrumb-item::before {
	color: #D2D7E2;
}

.inner-section{
	
	padding-top:60px;
	padding-bottom:60px;
    
    text-align: justify;
	
}


.inner-section1{
	
	padding-top:40px;
	padding-bottom:40px;
     text-align: justify;
	
}
/* ================================
   OUR TEAM SECTION
================================ */
.our_team {
  padding: 25px 0;
  background: #f5f7fa;
  text-align: center;
}

/* TITLE */
.team-title {
  font-size: 32px;          
  margin-bottom: 30px;
  color: #0b3c6d;
}

/* ================================
   TABS
================================ */
.team-tabs {
  display: flex;
  gap: 12px;
  margin-bottom: 50px;
}

/* TAB BUTTON */
.tab-btn {
  flex: 1; /* equal width desktop */
  text-align: center;
  padding: 12px 10px;
  border-radius: 30px;
  border: none;
  background: #0b3c6d;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  position: relative;
  transition: all 0.3s ease;
}

/* HOVER */
.tab-btn:hover {
  background: #084298;
}

/* ACTIVE TAB */
.tab-btn.active {
  background: #2fa4dc;
}

/* ?? ARROW POINTER (DESKTOP) */
.tab-btn.active::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 10px solid #2fa4dc;
}

/* ================================
   SCROLLBAR (THIN BLUE)
================================ */
.team-tabs {
  scrollbar-width: thin;
  scrollbar-color: #0b3c6d #e6ecf5;
}

.team-tabs::-webkit-scrollbar {
  height: 4px;
}

.team-tabs::-webkit-scrollbar-track {
  background: #e6ecf5;
  border-radius: 10px;
}

.team-tabs::-webkit-scrollbar-thumb {
  background: #0b3c6d;
  border-radius: 10px;
}

.team-tabs::-webkit-scrollbar-thumb:hover {
  background: #084298;
}

/* ================================
   TAB CONTENT
================================ */
.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

/* ================================
   TEAM GRID
================================ */
.team-grid {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px;
}

/* ================================
   TEAM CARD
================================ */
.team-card {
  background: #fff;
  padding: 20px;
  width: 220px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
}

.team-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.team-card img {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 12px;
}

.team-card h4 {
  font-size: 16px;
  margin-bottom: 5px;
  color: #222;
}

.team-card p {
  font-size: 13px;
  color: #666;
  margin-bottom: 0;
}

/* ================================
   TABLET VIEW
================================ */
@media (max-width: 992px) {
  .team-card {
    width: 45%;
  }
}

/* ================================
   MOBILE VIEW
================================ */
@media (max-width: 768px) {

  /* SCROLLABLE TABS */
  .team-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 10px;
    scroll-behavior: smooth;
  }

  .tab-btn {
    flex: 0 0 auto;
    min-width: 140px;
    white-space: nowrap;
  }

  /* REMOVE ARROW IN MOBILE */
  .tab-btn.active::after {
    display: none;
  }

  /* GRID */
  .team-grid {
    justify-content: center;
  }

  .team-card {
    width: 48%;
  }
}

/* ================================
   SMALL MOBILE
================================ */
@media (max-width: 480px) {
  .team-card {
    width: 100%;
  }

  .team-title {
    font-size: 26px;
  }
}


.corp-team-sec{
background:#f4f6fa;
}

.corp-team-title{
font-size:1.5rem;
font-weight:700;
    margin-bottom: 20px;
color:#000!important;
}

/* Card */

.corp-team-card{
background:#ffffff;
border-radius:8px;
overflow:hidden;
text-align:center;
transition:0.3s;
border:1px solid #e6e8ec;
height:100%;
}

.corp-team-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

/* Image */

.corp-team-img{
width:100%;
/*height:240px;*/
overflow:hidden;
}

.corp-team-img img{
width:100%;
height:100%;
object-fit:cover;
}

/* Info */

.corp-team-info{
padding:20px;
}

.corp-team-info h4{
font-size:18px;
font-weight:600;
color:#1c2b39;
margin-bottom:6px;
}

.corp-team-info p{
font-size:14px;
color:#6c757d;
margin-bottom:15px;
text-align:center !important;
}

/* Social */

.corp-team-social a{
display:inline-flex;
align-items:center;
justify-content:center;
width:36px;
height:36px;
border-radius:6px;
background:#0a66c2;
color:#fff;
font-size:16px;
transition:0.3s;
}

.corp-team-social a:hover{
background:#004182;
}



.about p{
    text-align: justify;
}



/* Card Style - GREY */
.event-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: #eef1f5; /* ?? grey background */
  border-radius: 12px;
  border: 1px solid #e0e4ea;
  transition: all 0.25s ease;
  height: 100%;
}

/* Icon - BLUE */
.event-card i {
  color: #0d6efd; /* ?? bootstrap blue */
  font-size: 16px;
  background: #e7f1ff;
  padding: 8px;
  border-radius: 50%;
}

/* Text */
.event-card span {
  font-size: 15px;
  font-weight: 500;
  color: #1c1c1c;
}

/* Hover (subtle) */
.event-card:hover {
  background: #e3e7ed;
  transform: translateY(-2px);
}




/* SECTION */
.office_networks { padding: 0px 0; }

/* MAP */
#map { height: 500px; border-radius: 12px; }

/* LIST */
.office-item {
  padding: 10px;
  border-radius: 8px;
  cursor: pointer;
  margin-bottom: 8px;
  background: #fff;
  border: 1px solid #eee;
  transition: 0.3s;
}
.office-item:hover,
.office-item.active {
  background: #007cc2;
  color: #fff;
}

/* DETAILS */
.office-details {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  margin-top: 15px;
  border: 1px solid #eee;
}

.office-details h5 {
  color: #007cc2;
}

@media(max-width:768px){
  #map { height: 250px; }
}


html {
  scroll-behavior: smooth;
}

section {
  scroll-margin-top: 150px; /* adjust based on your header height */
}


/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  overflow: hidden;
  background-color: var(--background-color);
  transition: all 0.6s ease-out;
  width: 100%;
  height: 100vh;
}

#preloader:before,
#preloader:after {
  content: "";
  position: absolute;
  border: 4px solid var(--accent-color);
  border-radius: 50%;
  animation: animate-preloader 2s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

#preloader:after {
  animation-delay: -0.5s;
}

@keyframes animate-preloader {
  0% {
    width: 10px;
    height: 10px;
    top: calc(50% - 5px);
    left: calc(50% - 5px);
    opacity: 1;
  }

  100% {
    width: 72px;
    height: 72px;
    top: calc(50% - 36px);
    left: calc(50% - 36px);
    opacity: 0;
  }
}


/* ===============================
HERO FINAL CLEAN CSS
=============================== */

.hero-banner {
  position: relative;
  overflow: hidden;
  margin-top: -60px;
}

/* HERO SWIPER ONLY */
.hero-swiper {
  width: 100%;
}

.hero-swiper .swiper-slide {
  overflow: hidden;
}

/* HERO SLIDE */
.hero-swiper .hero-slide {
  position: relative;
  height: 90vh;
  min-height: 600px;
}

/* IMAGE */
.hero-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* IMAGE */
.hero-bg {
  position: absolute;
  width: 110%;     /* extra safe space */
  height: 110%;
  top: -5%;
  left: -5%;
  object-fit: cover;
  display: block;

  animation: zoomEffect 18s ease-in-out infinite;
}

/* SAFE ZOOM */
@keyframes zoomEffect {
  0% { transform: scale(1); }
  50% { transform: scale(1.04); } /* VERY SAFE */
  100% { transform: scale(1); }
}

/* OVERLAY */
.hero-slide::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.3);
  z-index: 1;
}

/* CONTENT */
.hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  color: #fff;
}

/* TEXT */
.hero-title {
  font-size: 50px;
  font-weight: 700;
}

.hero-text {
  font-size: 18px;
  margin-bottom: 20px;
}

/* BUTTON */
.hero-btn {
  background: #fff;
  color: #000;
  padding: 12px 30px;
  border-radius: 50px;
  font-weight: 600;
  border: none;
}

/* ARROWS */
.swiper-button-next,
.swiper-button-prev {
  color: #fff;
}

/* MOBILE */
@media (max-width:768px) {
  .hero-slide {
    height: 75vh;
  }

  .hero-title {
    font-size: 28px;
  }

  .hero-text {
    font-size: 14px;
  }

  /* disable zoom on mobile */
  .hero-bg {
    animation: none;
    transform: scale(1);
  }
}

/* STOP SCROLL BUG */


.hero-slide {
  height: 90vh;
  min-height: 600px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  position: relative;
  animation: zoomEffect 18s ease infinite;
}

.hero-slide::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
   
  background: transparent!important; /* ? no dim */
  z-index: 1;
}
.hero-bg {
 

}


/* TABLET */
@media (max-width: 992px) {
  .hero-slide {
    height: 55vh;
    min-height: 350px;
  }
}

/* MOBILE */
@media (max-width:768px) {
  .hero-slide {
    height: 45vh;   /* ?? much smaller */
    min-height: 280px;
  }

  .hero-title {
    font-size: 22px;
  }

  .hero-text {
    font-size: 13px;
  }

  /* disable zoom on mobile */
  .hero-bg {
    animation: none;
    transform: scale(1);
  }
}

/* instead of scale ? move background */
@keyframes zoomSafe {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.02); /* VERY LOW */
  }
  100% {
    transform: scale(1);
  }
}


/* CARD STYLE */
.mission-box {
  position: relative;
  background: #ffffff;
  padding: 25px 25px 25px 70px;
  border-radius: 14px;
  border-left: 4px solid #0d76b4;
  transition: 0.3s ease;
  box-shadow: 0 8px 25px rgba(0,0,0,0.05);
}

/* HOVER */
.mission-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.08);
}

/* NUMBER */
.mission-number {
  position: absolute;
  left: 20px;
  top: 25px;
  width: 38px;
  height: 38px;
  background:#0d76b4;
  color: #fff;
  font-weight: 600;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* TEXT */
.mission-box p {
  margin: 0;
    text-align:left;
}

/* TITLE SPACING FIX */
.mission-section h2 {
  letter-spacing: 0.5px;
}

/* Section background */
#careers {
  background: linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);
}



/* Career Box */
.career-box {
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid #e6f0ff;
  position: relative;
  overflow: hidden;
  transition: all 0.35s ease;
}

/* Top gradient line */
.career-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #4da3ff, #0d6efd);
}

/* Hover effect */
.career-box:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 20px 40px rgba(0,0,0,0.08);
  border-color: #d0e5ff;
}

/* Job title */
.career-box h5 {
  font-weight: 600;
  font-size: 18px;
}

/* Location styling */
.career-box .location {
  display: ;
  font-size: 14px;
  color: #4da3ff;
  margin-top: 4px;
  font-weight: 500;
}

/* Paragraph */
.career-box p {
  color: #555;

}

/* Key Focus */
.career-box h6 {
  font-weight: 600;
  margin-top: 15px;
  margin-bottom: 8px;
}

/* Bullet styling */
.career-box ul {
  padding-left: 10px;
}

.career-box ul li {

  position: relative;
    
    margin-top: 0px !important;
}

/* Custom bullet color */
.career-box ul li::marker {
  color: #4da3ff;
}

/* Offer Box */
.career-offer {
  background: linear-gradient(135deg, #eef6ff, #ffffff);
  border-radius: 14px;
  border: 1px solid #dbeafe;
  box-shadow: 0 10px 25px rgba(0,0,0,0.04);
}

.career-offer h5 {
  font-weight: 600;
}

/* Add subtle animation */
[data-aos="fade-up"] {
  transition: all 0.6s ease;
}

/* Mobile polish */
@media (max-width: 768px) {
  .career-box {
    padding: 20px !important;
  }
}


/* MAIN WRAPPER */
.logo-wrapper {
  position: relative;
  width: 180px;
  height: 180px;
}

/* STATIC LOGO */
.logo-wrapper img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  padding: 10px;
  position: relative;
  z-index: 2;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* OUTER PULSE RING */
.logo-wrapper::before,
.logo-wrapper::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

/* LIGHT BLUE PULSE */
.logo-wrapper::before {
  background: rgba(0, 102, 204, 0.2);
  animation: pulseLight 2s infinite;
}

/* DARK BLUE PULSE */
.logo-wrapper::after {
  background: rgba(0, 102, 204, 0.4);
  animation: pulseDark 2s infinite;
}

/* ANIMATION */
@keyframes pulseLight {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
}

@keyframes pulseDark {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.4;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.8);
    opacity: 0;
  }
}

.swiper-wrapper {
  transition-timing-function: linear !important;
}



.new_ASSOCIATED {
  width: 100%;
}

.new_ASSOCIATED .swiper-wrapper {
  align-items: center;
}

.new_ASSOCIATED .swiper-slide {
  width: auto !important;   /* ?? VERY IMPORTANT */
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo-box {
  /*width: 150px; */  /* control logo size */
}

.logo-box img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.new_ASSOCIATED .swiper-wrapper {
  transition-timing-function: linear !important;
}


/* Mobile */
@media (max-width: 768px) {
 .logo-wrapper {
  position: relative;
  width: 100px;
  height: 100px;
}
  }
}



.new_KEY-RELATIONSHIPS {
  width: 100%;
}

.new_KEY-RELATIONSHIPS .swiper-wrapper {
  align-items: center;
}

.new_KEY-RELATIONSHIPS .swiper-slide {
  width: auto !important;   /* ?? VERY IMPORTANT */
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo-box {
 /* width: 150px;*/   /* control logo size */
}

.logo-box img {
  width: 100%;
  height: auto;
  object-fit: contain;
}


.new_KEY-RELATIONSHIPS .logo-box {

border:#e5e6e9 thin solid !important;;
}

.new_KEY-RELATIONSHIPS .swiper-wrapper {
  transition-timing-function: linear !important;
}


.new-prev-1,
.new-next-1,
.new-prev-2,
.new-next-2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 40px;
  height: 40px;
  cursor: pointer;
  background: rgba(0,0,0,0.6);
  border-radius: 50%;
}

/* arrow common */
.new-prev-1::after,
.new-next-1::after,
.new-prev-2::after,
.new-next-2::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform-origin: center;
}

/* RIGHT arrow */
.new-next-1::after,
.new-next-2::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* LEFT arrow */
.new-prev-1::after,
.new-prev-2::after {
  transform: translate(-50%, -50%) rotate(135deg);
}

/* positioning */
.new-next-1,
.new-next-2 {
  right: -25px;
}

.new-prev-1,
.new-prev-2 {
  left: -25px;
}

/* hover effect ?? */
.new-prev-1:hover,
.new-next-1:hover,
.new-prev-2:hover,
.new-next-2:hover {
  background: #000;
}



.new_ASSOCIATED,
.new_KEY-RELATIONSHIPS {
  position: relative;
}

/* common arrow style */
.new-prev-1,
.new-next-1,
.new-prev-2,
.new-next-2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  width: 45px;
  height: 45px;
  background: rgba(0,0,0,0.6);
  border-radius: 50%;
  cursor: pointer;
}

/* arrow shape */
.new-prev-1::after,
.new-next-1::after,
.new-prev-2::after,
.new-next-2::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
}

/* directions */
.new-next-1::after,
.new-next-2::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.new-prev-1::after,
.new-prev-2::after {
  transform: translate(-50%, -50%) rotate(135deg);
}

/* positioning INSIDE slider */
/* move arrows OUTSIDE */
/* positioning */
.new-next-1,
.new-next-2 {
  right: 5px;
}

.new-prev-1,
.new-prev-2 {
  left: 5px;
}

/* hover */
.new-prev-1:hover,
.new-next-1:hover,
.new-prev-2:hover,
.new-next-2:hover {
  background: rgba(0,0,0,0.9);
}

.new-prev-1,
.new-next-1,
.new-prev-2,
.new-next-2 {
  backdrop-filter: blur(6px);
}


/* LOGO CARD */
.logo-box {
  /*background: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;*/
  padding: 10px;
    background: #fff;
  border-radius: 10px;

 /* box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08);*/
  transition: all .3s;

  height: 140px;/* control card height instead */
}

/* IMAGE */
.logo-box img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;

  transition: all .3s;
}

/* HOVER EFFECT */
.logo-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}


.footer .footer-desc p{
    
      color: color-mix(in srgb, #ffffff, transparent 30%) !important;
    text-align: justify;
  
}
/* FILTER BUTTON */
.filter-btn {
  border: none;
  padding: 10px 22px;
  margin: 5px;
  border-radius: 50px;
  background: #fff;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 5px 12px rgba(0,0,0,0.06);
  transition: 0.3s;
}

.filter-btn.active,
.filter-btn:hover {
  background: linear-gradient(135deg, #0d6efd, #4f9bff);
  color: #fff;
  transform: translateY(-2px);
}

/* ================= CARD ================= */
.new_office-card {
  padding: 25px;
  border-radius: 16px;
  background: rgba(255,255,255,0.65);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.3);
  transition: 0.4s;
  height: 100%;
    border:#e5e6e9 thin solid !important;;
}

.new_office-card:hover {
  transform: translateY(-12px) scale(1.02);
  box-shadow: 0 20px 40px rgba(0,0,0,0.12);
}

/* TEXT */
.new_office-card h5 {
  font-size: 20px;
  font-weight: 600;
}

.new_office-card p {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}

/* ================= CONTACT ================= */
.new_contact {
  margin-top: 15px;
  font-size: 14px;
}

.new_contact a {
  color: #0d6efd;
  text-decoration: none;
  font-weight: 500;
}

.new_contact a:hover {
  text-decoration: underline;
}

/* ================= ANIMATION ================= */
.new_office-item {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeUp 0.6s forwards;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* HIDE */
.hide {
  display: none;
}

.registered-label {
  font-size: 14px;
  font-weight: 400;
  margin-left: 0px;
  color: #2745a4;
}



.about1 {
  padding-top: 40px;
  padding-bottom: 40px;
  background-color:#f8f9fa !important;
}
.about1 .section-title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #111;
}
.about1 .section-title span {
  color: #058bcb; /* your brand blue */
}
.about1 .content h3 {
  font-size: 2rem;
  font-weight: 700;
}
.about1 strong {
  color: #058bcb;
}

.about1 p{
    text-align: justify;
}

/* Card Style - GREY */
#recognitions .event-card {
  display:block;
  gap: 12px;
  padding: 14px 18px;
  background: #eef1f5; /* ?? grey background */
  border-radius: 12px;
  border: 1px solid #e0e4ea;
  transition: all 0.25s ease;
  height: 100%;
    text-align: left;
}

/* Icon - BLUE */
#recognitions .event-card i {
  color: #0d6efd; /* ?? bootstrap blue */
  font-size: 16px;
  background: #e7f1ff;
  padding: 8px;
  border-radius: 50%;
}

/* Text */
#recognitions .event-card span {
  font-size: 15px;
  font-weight: 500;
  color: #1c1c1c;
}

/* Hover (subtle) */
#recognitions .event-card:hover {
  background: #e3e7ed;
  transform: translateY(-2px);
}


#event-row .logo-box{
    text-align: center;
    
}


.new_logo_box {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 160px;
  padding: 15px;
  background: #fff;
  border-radius: 10px;
  transition: all 0.3s ease;
    
    
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    
}

.new_logo_box img {
  max-width: 100%;
  max-height: 145px;
  object-fit: contain;
  display: block;
  margin: auto;
}

/* Optional hover */
.new_logo_box:hover {
  transform: translateY(-5px);
}



.mindmesh-logo img {
  max-height: 80px;
  width: auto;
}


.logo-box_new {
    justify-content: center;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08);
    transition: all .3s;
    height: auto;
    padding:10px;
    
}


.logo-box_new img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: all .3s;
}


.logo-box_new {
    padding: 10px;
    background: #fff;
    border-radius: 10px;
    /* box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08); */
    transition: all .3s;
}


/* Desktop: float right + wrap */
.ipo-img {
  float: right;
  width: 40%;
  margin-left: 20px;
  margin-bottom: 0px;
  border-radius: 10px;
}

/* Mobile: remove float, full width, image bottom */
@media (max-width: 991px) {
  .ipo-img {
    float: none;
    width: 100%;
    display: block;
    margin: 20px 0 0 0; /* pushes image to bottom */
  }
}


/* Desktop: float left + wrap */
.ipo-img1 {
  float: left;
  width: 40%;
  margin-right: 20px;
  margin-bottom: 0px;
  border-radius: 10px;
}

/* Mobile: remove float, full width, image bottom */
@media (max-width: 991px) {
  .ipo-img1 {
    float: none;
    width: 100%;
    display: block;
    margin: 20px 0 0 0; /* pushes image to bottom */
  }
}



.new_ipo {
  background: linear-gradient(135deg, #f5f9ff, #eef3ff);
}

.new_ipo_title {
  font-size: 28px;
  max-width: 900px;
  margin: auto;
  line-height: 1.4;
}

/* Box */
.new_ipo_box {
  background: #fff;
  padding: 30px 20px;
  border-radius: 18px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);

  transform: translateY(40px);
  opacity: 0;
  animation: new_ipo_fadeUp 0.8s ease forwards;
}

/* Stagger Animation */
.new_ipo .col-lg-3:nth-child(1) .new_ipo_box { animation-delay: 0.2s; }
.new_ipo .col-lg-3:nth-child(2) .new_ipo_box { animation-delay: 0.4s; }
.new_ipo .col-lg-3:nth-child(3) .new_ipo_box { animation-delay: 0.6s; }
.new_ipo .col-lg-3:nth-child(4) .new_ipo_box { animation-delay: 0.8s; }

/* Hover */
.new_ipo_box:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

/* Number */
.new_ipo_number {
  font-size: 40px;
  font-weight: 700;
  color: #0d6efd;
  display: block;
  margin-bottom: 15px;
  opacity: 0.2;
}

/* Animation */
@keyframes new_ipo_fadeUp {
  to {
    transform: translateY(0);
    opacity: 1;
  }
}



.new_approach {
  
}

.new_approach_wrapper {
  position: relative;
  padding-left: 60px;
}

/* Vertical line */
.new_approach_wrapper::before {
  content: "";
  position: absolute;
  left: 25px;
  top: 0;
  width: 2px;
  height: 100%;
  background: #dbe5ff;
}

/* Each item */
.new_approach_item {
  position: relative;
  margin-bottom: 40px;
  display: flex;
  align-items: flex-start;
}

/* Number circle */
.new_approach_number {
  position: absolute;
  left: -60px;
  top: 0;
  width: 50px;
  height: 50px;
  background: #0d6efd;
  color: #fff;
  font-weight: 600;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  box-shadow: 0 5px 15px rgba(13,110,253,0.3);
}

/* Content */
.new_approach_content {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.05);
  width: 100%;
}

.new_approach_content h5 {
  font-weight: 600;
  margin-bottom: 10px;
}

.new_approach_content p {
  margin: 0;
  color: #555;
  line-height: 1.6;
}

/* Responsive */
@media (max-width: 768px) {
  .new_approach_wrapper {
    padding-left: 0;
  }

  .new_approach_wrapper::before {
    display: none;
  }

  .new_approach_item {
    flex-direction: column;
  }

  .new_approach_number {
    position: relative;
    left: 0;
    margin-bottom: 10px;
  }
}







.new_brand_tabs .tabs-nav {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
    
      color: #333;
  margin-bottom: 30px;
}

.new_brand_tabs .tab-btn {
  border: none;
  padding: 10px 22px;
  border-radius: 50px;
  background: #eee;
  cursor: pointer;
      color: #333;
  transition: 0.3s;
  font-weight: 500;
}

.new_brand_tabs .tab-btn.active {
  background: linear-gradient(135deg, #0d6efd, #00c6ff);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.new_brand_tabs .tab-btn:hover {
  background: #0d6efd;
  color: #fff;
}

/* Content */
.new_brand_tabs .tab-content {
  display: none;
  animation: fadeIn 0.4s ease;
}

.new_brand_tabs .tab-content.active {
  display: block;
}

@keyframes fadeIn {
  from {opacity: 0; transform: translateY(10px);}
  to {opacity: 1; transform: translateY(0);}
}

/* Your logo box stays same */
.new_logo_box {
  background: #fff;
  padding: 15px;
  border-radius: 12px;
  margin: 10px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08);
  transition: 0.3s;
  text-align: center;
}

.new_logo_box:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.15);
}






.new_hop {
  background: linear-gradient(180deg, #f4f7fb, #eef3f9);
  padding: 40px 0;
}

/* CARD */
.hop-card {
  position: relative;
  background: rgba(255, 255, 255, 0.9);
  padding: 22px;
  border-radius: 16px;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.4);
  box-shadow: 0 8px 25px rgba(0,0,0,0.05);
  transition: all 0.35s ease;
  height: 100%;
  overflow: hidden;
}

/* Gradient border effect */
.hop-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
  padding: 1px;
  background: linear-gradient(120deg, #0d6efd, #00c6ff);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

/* Hover */
.hop-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 15px 40px rgba(13,110,253,0.15);
}

/* YEAR BADGE */
.hop-card .year {
  float: right;
  background: linear-gradient(135deg, #0d6efd, #3a8bff);
  color: #fff;
  font-size: 12px;
  padding: 5px 12px;
  border-radius: 50px;
  font-weight: 600;
}

/* TITLE */
.hop-card h5 {
  font-weight: 700;
  margin-top: 5px;
  font-size: 18px;
  color: #1b2a4e;
}

/* CITY */
.hop-card .city {
  color: #6c757d;
  margin-bottom: 8px;
  font-size: 14px;
}

/* LABEL */
.hop-card .sqm {
  font-size: 12px;
  color: #0d6efd;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}

/* THEME TEXT */
.hop-card .theme {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
}

/* subtle glow on hover */
.hop-card:hover::before {
  background: linear-gradient(120deg, #0d6efd, #00c6ff, #6f42c1);
}


/* arrows base */
.glide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #ffffff;
  border: none;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.3s;
  z-index: 10;
}

/* left arrow */
.glide__arrow--left {
  left: 10px;
}

/* right arrow */
.glide__arrow--right {
  right: 10px;
}

/* hover effect */
.glide__arrow:hover {
  background: #1d4f91;
  color: #fff;
}


.gallery-img {
  cursor: pointer;
  transition: 0.3s;
}
.gallery-img:hover {
  transform: scale(1.03);
}

.modal-content img {
  max-height: 80vh;
  object-fit: contain;
}



















body {

}

/* Language UI */
.lang-wrapper {
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
    z-index: 9999;
}

.lang-btn {
  background:#2b1a12;
  color:#fff;
  padding:8px 12px;
  border:none;
  cursor:pointer;
}

.custom-lang {
  display:none;
  position:absolute;
  background:#fff;
  list-style:none;
  padding:0;
  margin:0;
  width:150px;
}

.custom-lang li {
  padding:10px;
  cursor:pointer;
}

.custom-lang li:hover {
  background:#eee;
}

.lang-wrapper:hover .custom-lang {
  display:block;
}

/* Hide Google UI */
#google_translate_element {
  display:none;
}

.goog-logo-link,
.goog-te-gadget span {
  display:none !important;
}

/* Try hide top bar */
.goog-te-banner-frame,
iframe.goog-te-banner-frame {
  display:none !important;
}

body {
  top:0 !important;
}



/*body > .skiptranslate,
.goog-te-banner-frame,
iframe.goog-te-banner-frame {
  display: none !important;
}

body {
  top: 0 !important;
  position: static !important;
}

.goog-te-gadget span {
  display: none !important;
}


.goog-te-gadget {
  color: transparent !important;
  font-size: 0px;
}


#google_translate_element select {
  background: #2b1a12;
  color: #fff4e4;
  border: none;
  font-weight: bold;
  border-radius: 4px;
  padding: 8px 12px;
}


.goog-text-highlight {
  background: transparent !important;
  box-shadow: none !important;
}*/




    
        .hero-pagination {
  bottom:240px !important;
             position: absolute;
  z-index:9999999999!important;
}
        
         .swiper-pagination {
    position: absolute !important;;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
            z-index: 999999999 !important;}

@media (max-width: 768px) {

  .hero-pagination {
  bottom:60px !important;
             position: absolute;
  z-index:9999999999!important;
}

}