/* Additional Custom CSS for Globe Pulse & Animations */
@keyframes pulseGlow {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(168, 192, 16, 0.7); }
  70% { transform: scale(1.3); box-shadow: 0 0 0 10px rgba(168, 192, 16, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(168, 192, 16, 0); }
}

.globe-pin {
  animation: pulseGlow 1.5s infinite;
}

/* Custom Logo Size Control */
.site-logo img, 
.custom-logo {
    max-height: 45px !important;
    width: auto !important;
    display: block;
    object-fit: contain;
}

/* Header Alignment Fix */
header.gnoas-container nav {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 12px 24px !important;
}

/* Glassmorphism Background & Blur Fix */
.gnoas-glass-card {
    background: rgba(20, 25, 10, 0.75) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    border: 1px solid rgba(168, 192, 16, 0.3) !important;
    border-radius: 16px !important;
}

/* Globe Canvas Center Alignment */
#globeViz {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: hidden !important;
    height: 420px !important;
    width: 100% !important;
}

#globeViz canvas {
    display: block !important;
    margin: 0 auto !important;
    outline: none !important;
}

/* Globe Admin Overlay Positioning Fix */
#gnoas-globe-wrapper {
    position: relative !important;
    overflow: hidden !important;
}

#gnoas-globe-wrapper > div:last-child {
    z-index: 9999 !important; /* ক্যানভাস থেকে ওপরে ভাসিয়ে রাখবে */
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    background: rgba(10, 15, 5, 0.92) !important;
    border: 1px solid #a8c010 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}


/* ==========================================================================
   GNOAS Swiper 2x6 Grid Slider CSS Layout & Size Compact Fix
   ========================================================================== */
.gnoas-competitions-slider-area {
  width: 100% !important;
  position: relative !important;
}

/* কার্ড অতিরিক্ত বড় হওয়া বন্ধ করার জন্য কন্টেইনারের হাইট ছোট করে ৪১০px এ লক */
.gnoasGridSwiper {
  width: 100% !important;
  height: 410px !important; /* কার্ডের সাইজ নিখুঁত ছোট ও কম্প্যাক্ট করার জন্য ফাইনাল হাইট */
  position: relative !important;
  overflow: hidden !important; 
  padding: 5px 0 !important;
}

.gnoasGridSwiper .swiper-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  flex-direction: row !important; /* ২টি রোকে নিচে নিচে এবং ডানে স্লাইড লক করার গ্রিড ইঞ্জিন */
  height: 100% !important;
}

/* প্রতিটি স্লাইড কার্ডের ২x২ সাইজ রেশিও নিখুঁত ফিক্স */
.gnoasGridSwiper .swiper-slide {
  width: calc((100% - 20px) / 2) !important; /* ২টি কলাম */
  height: calc((100% - 20px) / 2) !important; /* ২টি সারি স্ক্রিনে নিচে নিচে দৃশ্যমান করবে */
  margin-bottom: 20px !important;
  box-sizing: border-box !important;
}

.gnoas-banner-card-item {
  background: rgba(255, 255, 255, 0.45) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  box-sizing: border-box !important;
}

/* কার্ডের ইমেজের উচ্চতা ছোট করা হলো */
.gnoas-banner-img-container {
  position: relative !important;
  width: 100% !important;
  height: 90px !important; /* ইমেজের উচ্চতা ১৩০px থেকে কমিয়ে ৯০px করা হলো */
  overflow: hidden !important;
  background: #111 !important;
}

.gnoas-banner-img-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.gnoas-placeholder-text {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: rgba(255, 255, 255, 0.25) !important;
  font-size: 11px !important;
}

/* টেক্সটের চারপাশের প্যাডিং ও মার্জিন নিখুঁত ছোট করা হলো */
.gnoas-banner-details {
  padding: 6px 12px !important; /* প্যাডিং স্লিম করা হলো */
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  flex-grow: 1 !important;
}

.gnoas-banner-details h4 {
  margin: 0 0 2px 0 !important;
  font-size: 0.9rem !important; /* টাইটেল সাইজ কমপ্যাক্ট */
  line-height: 1.2 !important;
}

.gnoas-banner-details p {
  font-size: 0.74rem !important; /* প্যারাগ্রাফ সাইজ ছোট করা হলো */
  color: var(--gnoas-text-muted) !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.25 !important;
}

.gnoas-view-details-btn {
  background: linear-gradient(180deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.45) 100%) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  color: #5b6908 !important;
  text-align: center !important;
  padding: 3px 0 !important; /* বাটন স্লিম ফিক্স */
  border-radius: 30px !important;
  font-weight: 700 !important;
  font-size: 0.72rem !important;
  text-decoration: none !important;
  display: block !important;
}

/* 🎯 নেভিগেশন অ্যারো বাটন স্টাইলিং (কার্ডের ওপরে প্রফেশনাল ডার্ক লুকে ভিজিবল) */
.gnoas-swiper-arrow {
  color: #111111 !important;
  width: 36px !important;
  height: 36px !important;
  background: rgba(255, 255, 255, 0.95) !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.18) !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 9999 !important;
  transition: all 0.2s ease !important;
}

.gnoas-swiper-arrow::after {
  font-size: 14px !important;
  font-weight: bold !important;
}

.gnoas-swiper-arrow:hover {
  transform: translateY(-50%) scale(1.1) !important;
  background: #ffffff !important;
}

.swiper-button-next { right: -15px !important; }
.swiper-button-prev { left: -15px !important; }

/* মোবাইল রেসপন্সিভ */
@media (max-width: 768px) {
  .gnoasGridSwiper { height: auto !important; }
  .gnoasGridSwiper .swiper-wrapper { flex-direction: row !important; }
  .gnoasGridSwiper .swiper-slide {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 15px !important;
  }
  .gnoas-swiper-arrow { display: none !important; }
}