/* ==========================================================================
   Page Header Banner
   ========================================================================== */
.page-header {
  padding: 160px 0 80px;
  background-image: url('../images/hero-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.page-header-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(9, 13, 26, 0.95) 0%, rgba(9, 13, 26, 0.85) 100%);
  z-index: 0;
}

.breadcrumb-synapse {
  display: flex;
  justify-content: center;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 15px 0 0 0;
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 500;
}
.breadcrumb-synapse li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.breadcrumb-synapse li:not(:last-child)::after {
  content: '\F285'; /* Bootstrap Icon chevron-right */
  font-family: 'bootstrap-icons';
  font-size: 0.75rem;
  color: var(--synapse-text-muted);
}
.breadcrumb-synapse a {
  color: var(--synapse-text-secondary);
}
.breadcrumb-synapse a:hover {
  color: var(--synapse-text-primary);
}
.breadcrumb-synapse li.active {
  color: var(--synapse-text-primary);
}

/* ==========================================================================
   Contact Details & Info Widgets
   ========================================================================== */
.contact-info-widget {
  border-color: rgba(255, 255, 255, 0.05);
}

.contact-info-icon-box {
  width: 50px;
  height: 50px;
  background: rgba(124, 58, 237, 0.1);
  border: 1px solid rgba(124, 58, 237, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--synapse-primary);
  font-size: 1.3rem;
  flex-shrink: 0;
}

/* ==========================================================================
   Bootstrap Accordion Customizations (FAQ)
   ========================================================================== */
.accordion-synapse {
  background: transparent;
}
.accordion-synapse .accordion-item {
  background: rgba(18, 24, 41, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.05);
  margin-bottom: 12px;
  border-radius: 12px !important;
  overflow: hidden;
  transition: var(--transition-normal);
}
.accordion-synapse .accordion-item:hover {
  border-color: rgba(124, 58, 237, 0.25);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.accordion-synapse .accordion-button {
  background: transparent;
  color: var(--synapse-text-primary);
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.05rem;
  padding: 20px 24px;
  box-shadow: none;
  border: none;
  transition: var(--transition-fast);
}
.accordion-synapse .accordion-button:not(.collapsed) {
  color: var(--synapse-primary);
  background: rgba(255, 255, 255, 0.01);
}

/* Custom expand icon styling using Bootstrap icons */
.accordion-synapse .accordion-button::after {
  content: '\F282'; /* chevron-down */
  font-family: 'bootstrap-icons';
  background-image: none;
  font-size: 0.9rem;
  color: var(--synapse-text-secondary);
  transition: transform 0.2s ease;
  width: auto;
  height: auto;
}
.accordion-synapse .accordion-button:not(.collapsed)::after {
  content: '\F286'; /* chevron-up */
  color: var(--synapse-primary);
  transform: none;
}

.accordion-synapse .accordion-body {
  padding: 10px 24px 24px 24px;
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--synapse-text-secondary);
  border-top: 1px solid rgba(255, 255, 255, 0.03);
}

/* Venue Showcase panel */
.venue-details-card {
  border-color: rgba(255, 255, 255, 0.05);
}
.venue-showcase-img {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.map-wrapper {
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.45);
}