/* ========================================
   CATALOG SECTION - Minimal
   ======================================== */

/* Katalog Kartı */
.catalog-card.service-item.style-2 {
  overflow: visible !important; /* 3D elementi dışarı taşırabilsin */
}

/* Sol - Buton */
.catalog-btn-wrap {
  margin-top: 25px;
}

/* Sağ - 3D Katalog Alanı */
.catalog-3d-area {
  position: relative;
  width: 100%;
  height: 450px; /* Sabit yükseklik - popup için gerekli */
  min-height: 350px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden; /* Popup container içinde kalsın */
  z-index: 10; /* Arka plan şekillerinin üstünde */
}

/* Catalog Section Arka Plan Şekillerini Gizle */
#catalog .bg-shape-1,
#catalog .bg-shape-2,
#catalog .bg-shape-3 {
  z-index: -1 !important;
  pointer-events: none;
}

.catalog-3d-area > div {
  overflow: visible !important;
}

/* Loading States */
.book3d-loading {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  min-height: 400px;
}

.loading-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(233, 86, 45, 0.2);
  border-top-color: #e9562d;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-text {
  color: rgba(26, 26, 26, 0.7);
  font-size: 0.95rem;
  font-weight: 500;
}

/* ========================================
   RESPONSIVE
   ======================================== */

/* Tablet - 992px ve altı */
@media (max-width: 991px) {
  .catalog-3d-area {
    height: 400px;
    min-height: 320px;
    margin-top: 20px;
  }
}

/* Mobile - 768px ve altı */
@media (max-width: 767px) {
  .catalog-3d-area {
    height: 350px;
    min-height: 280px;
  }
}

/* Small Mobile - 575px ve altı */
@media (max-width: 575px) {
  .catalog-3d-area {
    height: 320px;
    min-height: 260px;
  }
  
  .book3d-loading {
    min-height: 240px;
  }
}