/* ==========================================================================
   Hemperium Ulm – 100% Fully Responsive Modern & Authentic Stylesheet
   ========================================================================== */

:root {
  /* Authentic & Warm Hemperium Color System */
  --hemp-bg-black: #121512;
  --hemp-bg-dark: #181c18;
  --hemp-bg-surface: #202620;
  --hemp-bg-card: #272f27;
  --hemp-bg-card-hover: #2f3a2f;
  
  --hemp-green: #2e944b;
  --hemp-green-light: #3dd26b;
  --hemp-green-dark: #1b6330;
  --hemp-green-glow: rgba(61, 210, 107, 0.25);
  
  --hemp-gold: #f5a623;
  --hemp-gold-light: #ffbe42;
  --hemp-gold-glow: rgba(245, 166, 35, 0.3);
  --hemp-red: #e74c3c;
  
  --text-light: #ffffff;
  --text-gray: #e0e4e7;
  --text-muted: #abb1b7;
  
  --border-dark: rgba(255, 255, 255, 0.1);
  --border-green: rgba(61, 210, 107, 0.35);
  --border-gold: rgba(245, 166, 35, 0.4);
  
  /* Fonts */
  --font-title: 'Oswald', 'Impact', sans-serif;
  --font-text: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  width: 100%;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-text);
  background-color: var(--hemp-bg-black);
  background-image: 
    radial-gradient(circle at 10% 20%, rgba(46, 148, 75, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 90% 60%, rgba(245, 166, 35, 0.06) 0%, transparent 45%),
    radial-gradient(circle at 50% 90%, rgba(46, 148, 75, 0.06) 0%, transparent 40%);
  background-attachment: fixed;
  color: var(--text-gray);
  line-height: 1.6;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Container */
.container {
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* ==========================================================================
   Top Status Stripe
   ========================================================================== */
.top-status-stripe {
  background: #080808;
  border-bottom: 1px solid #1f1f1f;
  padding: 0.45rem 0;
  font-size: 0.85rem;
}

.status-stripe-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.live-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  font-weight: 600;
}

.pulse-indicator {
  width: 10px;
  height: 10px;
  background-color: var(--hemp-green-light);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--hemp-green-light);
  animation: pulse 1.8s infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.2); }
}

.direct-phone-link {
  color: var(--hemp-gold-light);
  font-weight: 600;
}

.direct-phone-link a {
  color: #fff;
  text-decoration: underline;
}

/* ==========================================================================
   Classic Hemperium Header
   ========================================================================== */
.hemperium-header {
  background: var(--hemp-bg-dark);
  border-bottom: 3px solid var(--hemp-green);
  padding: 1.5rem 0;
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.hemp-main-logo {
  height: 90px;
  width: auto;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.6));
}

.header-info-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.8rem;
}

.info-text {
  display: flex;
  gap: 1.8rem;
  font-size: 0.95rem;
  color: #eee;
}

.info-item strong {
  color: var(--hemp-gold-light);
  margin-right: 0.3rem;
}

.info-item small {
  color: var(--text-muted);
}

.header-button-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.icon-btn-wrap {
  display: inline-block;
  transition: transform 0.15s ease;
}

.icon-btn-wrap:hover {
  transform: translateY(-2px);
}

.icon-btn-img {
  height: 38px;
  width: auto;
  border-radius: 4px;
}

/* ==========================================================================
   Classic Hemperium Navigation Bar
   ========================================================================== */
.hemperium-nav-bar {
  background: #111111;
  border-bottom: 1px solid var(--border-dark);
  position: sticky;
  top: 0;
  z-index: 999;
  box-shadow: 0 4px 15px rgba(0,0,0,0.5);
}

.nav-menu {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}

.nav-link {
  display: block;
  font-family: var(--font-title);
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  padding: 0.85rem 1.1rem;
  color: #fff;
  border-right: 1px solid #222;
  transition: all 0.2s ease;
}

.nav-link:hover {
  background: var(--hemp-green);
  color: #fff;
}

.nav-link.active {
  background: var(--hemp-green-dark);
  color: #fff;
  font-weight: 700;
  border-bottom: 3px solid var(--hemp-gold);
}

.nav-link.highlight-link {
  background: rgba(46, 148, 75, 0.25);
  color: var(--hemp-green-light);
  font-weight: 600;
}

.nav-link.highlight-link.active {
  background: var(--hemp-green);
  color: #fff;
}

.mobile-toggle {
  display: none;
  background: var(--hemp-green);
  color: #fff;
  border: none;
  font-family: var(--font-title);
  font-size: 1.1rem;
  padding: 0.85rem 1.2rem;
  width: 100%;
  text-align: center;
  cursor: pointer;
}

/* ==========================================================================
   Hero Stage
   ========================================================================== */
.hero-stage {
  position: relative;
  min-height: 560px;
  background: url('../images/dschungel-new.jpg') center bottom / cover no-repeat;
  display: flex;
  align-items: center;
  padding: 4.5rem 0;
  border-bottom: 3px solid var(--hemp-green);
  box-shadow: inset 0 0 80px rgba(0,0,0,0.4);
}

.hero-inner {
  position: relative;
  z-index: 2;
  max-width: 760px;
  background: rgba(14, 18, 14, 0.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-left: 6px solid var(--hemp-gold);
  border-radius: 12px;
  padding: 2.5rem 2.8rem;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.75);
}

.vintage-badge {
  display: inline-block;
  font-family: var(--font-title);
  font-size: 1rem;
  letter-spacing: 1px;
  background: var(--hemp-green);
  color: #fff;
  padding: 0.3rem 0.9rem;
  border-radius: 3px;
  margin-bottom: 1.2rem;
}

.hero-heading {
  font-family: var(--font-title);
  font-size: 3.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  text-shadow: 2px 2px 8px rgba(0,0,0,0.8);
  margin-bottom: 1rem;
  word-break: break-word;
}

.hero-lead {
  font-size: 1.2rem;
  color: #eee;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.8);
  margin-bottom: 2rem;
  line-height: 1.5;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--font-title);
  font-size: 1.1rem;
  padding: 0.75rem 1.4rem;
  border-radius: 4px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: all 0.2s ease;
  border: 1px solid transparent;
  text-align: center;
}

.btn-green {
  background: var(--hemp-green);
  color: #fff;
}
.btn-green:hover {
  background: var(--hemp-green-light);
  transform: translateY(-2px);
}

.btn-gold {
  background: var(--hemp-gold);
  color: #111;
}
.btn-gold:hover {
  background: var(--hemp-gold-light);
  transform: translateY(-2px);
}

.btn-dark {
  background: rgba(0,0,0,0.6);
  color: #fff;
  border-color: #555;
}
.btn-dark:hover {
  background: #333;
  transform: translateY(-2px);
}

/* Feature Bar */
.feature-bar {
  background: linear-gradient(180deg, #181d18 0%, #131613 100%);
  border-bottom: 2px solid var(--border-green);
  padding: 2.25rem 0;
  position: relative;
}

.feature-bar-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.5rem;
}

.feat-box {
  background: rgba(36, 44, 36, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  padding: 1.25rem 1.1rem;
  display: flex;
  gap: 1rem;
  align-items: center;
  min-width: 0;
  transition: all 0.3s ease;
}

.feat-box:hover {
  background: rgba(46, 56, 46, 0.9);
  border-color: var(--hemp-green-light);
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.5), 0 0 15px var(--hemp-green-glow);
}

.feat-icon {
  font-size: 1.8rem;
  color: var(--hemp-green-light);
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(61, 210, 107, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.feat-content {
  min-width: 0;
}

.feat-content h4 {
  font-family: var(--font-title);
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.2rem;
}

.feat-content p {
  font-size: 0.86rem;
  color: var(--text-gray);
  line-height: 1.4;
}

/* ==========================================================================
   Section Headers & Common
   ========================================================================== */
.main-section {
  padding: 4.5rem 0;
  border-bottom: 1px solid var(--border-dark);
}

.dark-section {
  background: var(--hemp-bg-dark);
}

.section-title-wrap {
  margin-bottom: 2.5rem;
}

.main-heading {
  font-family: var(--font-title);
  font-size: 2.2rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  word-break: break-word;
}

.main-heading i {
  color: var(--hemp-green-light);
  flex-shrink: 0;
}

.section-subtext {
  font-size: 1rem;
  color: var(--hemp-gold-light);
  margin-top: 0.3rem;
}
.section-subtext a {
  color: #fff;
  text-decoration: underline;
}

.heading-line {
  width: 70px;
  height: 4px;
  background: var(--hemp-green);
  margin-top: 0.8rem;
}

/* ==========================================================================
   Tages-Angebote (Daily Deals Grid)
   ========================================================================== */
.daily-deals-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
}

.deal-day-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-top: 4px solid var(--hemp-gold);
  border-radius: 4px;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.deal-day-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 1.2rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid var(--border-dark);
}

.day-badge {
  font-family: var(--font-title);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--hemp-gold-light);
}

.day-subtitle {
  font-size: 0.8rem;
  color: var(--text-muted);
  text-transform: uppercase;
}

.deal-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-grow: 1;
}

.deal-item {
  border-bottom: 1px dashed #333;
  padding-bottom: 0.6rem;
}

.deal-name {
  font-family: var(--font-title);
  font-size: 1.15rem;
  color: #fff;
  word-break: break-word;
}

.deal-sub {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin-top: 0.2rem;
}

.deal-price {
  font-family: var(--font-title);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--hemp-gold-light);
  margin-top: 0.3rem;
}

.deal-drinks-box {
  margin-top: auto;
  background: #191919;
  border: 1px solid #333;
  padding: 0.75rem;
  border-radius: 3px;
  font-size: 0.85rem;
  color: var(--text-gray);
  line-height: 1.4;
}

.deal-drinks-box strong {
  color: var(--hemp-green-light);
}

/* Dietary Badges */
.badge-veggie {
  background: rgba(230, 149, 0, 0.2);
  color: var(--hemp-gold-light);
  border: 1px solid var(--border-gold);
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  border-radius: 2px;
  display: inline-block;
  margin-left: 0.3rem;
}

.badge-vegan {
  background: rgba(46, 148, 75, 0.2);
  color: var(--hemp-green-light);
  border: 1px solid var(--border-green);
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  border-radius: 2px;
  display: inline-block;
  margin-left: 0.3rem;
}

.badge-meat {
  background: rgba(192, 57, 43, 0.2);
  color: #e74c3c;
  border: 1px solid rgba(192, 57, 43, 0.4);
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  border-radius: 2px;
  display: inline-block;
  margin-left: 0.3rem;
}

/* ==========================================================================
   Complete Speisekarte Grid
   ========================================================================== */
.menu-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2.5rem;
}

.filter-btn {
  background: #111;
  border: 1px solid var(--border-dark);
  color: #fff;
  font-family: var(--font-title);
  font-size: 0.95rem;
  padding: 0.6rem 1rem;
  border-radius: 3px;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-grow: 1;
  text-align: center;
}

.filter-btn:hover {
  background: #333;
}

.filter-btn.active {
  background: var(--hemp-green);
  border-color: var(--hemp-green);
  color: #fff;
}

.complete-menu-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}

.menu-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 4px;
  padding: 1.4rem;
  transition: transform 0.2s ease, border-color 0.2s ease;
  min-width: 0; /* Crucial for CSS Grid item containment */
}

.menu-card:hover {
  transform: translateY(-2px);
  border-color: var(--hemp-green);
}

.menu-card-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.8rem;
  margin-bottom: 0.4rem;
  min-width: 0;
}

.menu-card-title {
  font-family: var(--font-title);
  font-size: 1.25rem;
  color: #fff;
  letter-spacing: 0.3px;
  word-break: break-word;
}

.menu-card-price {
  font-family: var(--font-title);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--hemp-gold-light);
  word-break: break-word;
  flex-shrink: 0;
}

.menu-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.6rem;
}

.diet-tag {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0.15rem 0.5rem;
  border-radius: 2px;
  display: inline-block;
}

.tag-vegan {
  background: rgba(46, 148, 75, 0.2);
  color: var(--hemp-green-light);
  border: 1px solid var(--border-green);
}

.tag-veggie {
  background: rgba(230, 149, 0, 0.2);
  color: var(--hemp-gold-light);
  border: 1px solid var(--border-gold);
}

.tag-meat {
  background: rgba(192, 57, 43, 0.2);
  color: #f87171;
  border: 1px solid rgba(192, 57, 43, 0.4);
}

.tag-beef {
  background: rgba(180, 83, 9, 0.25);
  color: #fbbf24;
  border: 1px solid rgba(180, 83, 9, 0.5);
}

.tag-glutenfree {
  background: rgba(14, 165, 233, 0.2);
  color: #38bdf8;
  border: 1px solid rgba(14, 165, 233, 0.4);
}

.tag-hemp {
  background: rgba(34, 197, 94, 0.15);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, 0.3);
}

.menu-card-desc {
  font-size: 0.92rem;
  color: var(--text-gray);
  line-height: 1.45;
  word-break: break-word;
}

.highlight-card {
  background: #1c261e;
  border: 1px solid var(--border-green);
}

.extras-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  font-size: 0.9rem;
  color: var(--text-gray);
}

.extras-list strong {
  color: var(--hemp-gold-light);
}

/* ==========================================================================
   Drinks Columns (Bar Menu)
   ========================================================================== */
.drinks-columns-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}

.drink-category-box {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 4px;
  padding: 1.6rem;
  min-width: 0;
}

.drink-cat-head {
  font-family: var(--font-title);
  font-size: 1.35rem;
  color: #fff;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-bottom: 1px solid #333;
  padding-bottom: 0.5rem;
}

.drink-cat-head i {
  color: var(--hemp-green-light);
  flex-shrink: 0;
}

.drink-items-list {
  list-style: none;
}

.drink-items-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.45rem 0;
  border-bottom: 1px dotted #333;
  font-size: 0.92rem;
  min-width: 0;
}

.drink-items-list li span {
  color: var(--text-gray);
  word-break: break-word;
}

.drink-items-list li strong {
  color: var(--hemp-gold-light);
  font-family: var(--font-title);
  font-size: 1.05rem;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ==========================================================================
   Story & Regionality Section
   ========================================================================== */
.story-dual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
}

.story-box {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  padding: 2.2rem;
  border-radius: 4px;
  min-width: 0;
}

.story-badge {
  display: inline-block;
  font-family: var(--font-title);
  font-size: 0.85rem;
  text-transform: uppercase;
  color: var(--hemp-green-light);
  background: rgba(46, 148, 75, 0.15);
  border: 1px solid var(--border-green);
  padding: 0.2rem 0.6rem;
  border-radius: 2px;
  margin-bottom: 0.8rem;
}

.story-title {
  font-family: var(--font-title);
  font-size: 1.8rem;
  color: #fff;
  margin-bottom: 1rem;
}

.story-box p {
  font-size: 0.95rem;
  color: var(--text-gray);
  margin-bottom: 1rem;
  line-height: 1.6;
}

.catering-hint {
  background: rgba(230, 149, 0, 0.12);
  border: 1px dashed var(--hemp-gold);
  color: var(--hemp-gold-light);
  padding: 0.9rem;
  border-radius: 3px;
  font-size: 0.9rem;
  margin-top: 1.2rem;
}

.supplier-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin-top: 1rem;
}

.supplier-list li {
  font-size: 0.9rem;
  color: var(--text-gray);
  border-left: 2px solid var(--hemp-green);
  padding-left: 0.6rem;
}

.supplier-list strong {
  color: #fff;
}

/* ==========================================================================
   Media, YouTube & Partner Sidebar Widgets
   ========================================================================== */
.media-widgets-section {
  padding: 4.5rem 0;
  background: #141414;
  border-bottom: 1px solid var(--border-dark);
}

.media-widgets-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}

.media-widget-card {
  background: #1c1c1c;
  border: 1px solid #333;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, border-color 0.2s ease;
  min-width: 0;
}

.media-widget-card:hover {
  transform: translateY(-2px);
  border-color: var(--hemp-green);
}

.widget-red-header {
  background: #e62117;
  padding: 0.65rem 1.2rem;
}

.widget-title {
  font-family: var(--font-title);
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin: 0;
}

.widget-card-body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex-grow: 1;
  gap: 1rem;
}

.channel-icon-wrap {
  width: 90px;
  height: 90px;
  margin: 0 auto;
}

.channel-icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.5));
}

.widget-text {
  font-size: 0.95rem;
  color: var(--text-gray);
  line-height: 1.5;
}

.btn-youtube-link {
  font-family: var(--font-title);
  font-size: 1rem;
  color: var(--hemp-gold-light);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: auto;
  transition: color 0.15s ease;
}
.btn-youtube-link:hover {
  color: #fff;
  text-decoration: underline;
}

/* Responsive YouTube Video */
.video-responsive-wrap {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
  width: 100%;
  background: #000;
}

.video-responsive-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Partner Links List */
.partner-links-box {
  padding: 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.partner-link-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #242424;
  border: 1px solid #383838;
  padding: 0.65rem 1rem;
  border-radius: 3px;
  color: #fff;
  font-weight: 600;
  font-size: 0.92rem;
  transition: all 0.2s ease;
  min-width: 0;
}

.partner-link-item:hover {
  background: var(--hemp-green);
  border-color: var(--hemp-green);
  transform: translateX(4px);
}

.partner-badge-blue {
  background: #0056b3;
  color: #fff;
  padding: 0.15rem 0.4rem;
  border-radius: 2px;
  font-size: 0.75rem;
  font-weight: 700;
}

/* ==========================================================================
   Events & Feed Styles
   ========================================================================== */
.calendar-top-bar {
  background: #191919;
  border-bottom: 1px solid var(--border-dark);
  padding: 1.2rem 0;
}

.cal-top-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.view-selector-group {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.view-title {
  font-family: var(--font-title);
  font-size: 1.6rem;
  color: #fff;
  letter-spacing: 0.5px;
}
.view-title i {
  color: var(--hemp-green-light);
}

.view-badge {
  background: rgba(46, 148, 75, 0.2);
  color: var(--hemp-green-light);
  border: 1px solid var(--border-green);
  padding: 0.2rem 0.6rem;
  border-radius: 3px;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
}

.cal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.btn-cal-back {
  background: #2a2a2a;
  border: 1px solid #444;
  color: #fff;
  padding: 0.55rem 1rem;
  border-radius: 3px;
  font-size: 0.9rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.btn-cal-back:hover { background: #383838; }

.btn-cal-res {
  background: var(--hemp-green);
  color: #fff;
  padding: 0.55rem 1rem;
  border-radius: 3px;
  font-size: 0.9rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.btn-cal-res:hover { background: var(--hemp-green-light); }

.events-page-container {
  max-width: 980px;
}

.month-divider {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.month-title {
  font-family: var(--font-title);
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

.month-line {
  height: 2px;
  background: #333;
  width: 100%;
}

.events-feed-list {
  display: flex;
  flex-direction: column;
  gap: 3.5rem;
}

.feed-event-card {
  display: flex;
  gap: 2rem;
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 2rem;
  transition: border-color 0.2s ease;
  min-width: 0;
}

.feed-event-card:hover {
  border-color: var(--hemp-green);
}

.feed-date-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 60px;
}

.cal-weekday {
  font-family: var(--font-title);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: 1px;
}

.cal-daynum {
  font-family: var(--font-title);
  font-size: 2.8rem;
  font-weight: 800;
  color: var(--hemp-gold-light);
  line-height: 1;
}

.feed-body-column {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  flex-grow: 1;
  min-width: 0;
}

.feed-poster-wrap {
  width: 100%;
  max-height: 600px;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid #383838;
  background: #0d0d0d;
}

.feed-poster-img {
  width: 100%;
  height: auto;
  max-height: 600px;
  object-fit: contain;
  margin: 0 auto;
}

.feed-meta-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  font-size: 0.9rem;
  color: var(--hemp-gold-light);
  font-weight: 600;
  margin-bottom: 0.4rem;
}

.feed-genre-pill {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 0.2rem 0.6rem;
  border-radius: 3px;
  color: #fff;
}
.genre-rock { background: #b91c1c; }
.genre-club { background: #7c3aed; }
.genre-tour { background: #d97706; }
.genre-live { background: var(--hemp-green); }
.genre-jam  { background: #0284c7; }

.feed-title {
  font-family: var(--font-title);
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  word-break: break-word;
}

.feed-excerpt {
  font-size: 1rem;
  color: var(--text-gray);
  line-height: 1.6;
  word-break: break-word;
}

.feed-details-box {
  background: #181818;
  border: 1px solid #333;
  border-left: 3px solid var(--hemp-green);
  padding: 1rem;
  border-radius: 3px;
  font-size: 0.9rem;
  color: var(--text-muted);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.feed-details-box strong {
  color: #fff;
}

.feed-action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.5rem;
}

.btn-feed-action {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-title);
  font-size: 1rem;
  padding: 0.65rem 1.2rem;
  border-radius: 3px;
  font-weight: 600;
}

.btn-feed-primary {
  background: var(--hemp-green);
  color: #fff;
}
.btn-feed-primary:hover { background: var(--hemp-green-light); }

.btn-feed-secondary {
  background: #333;
  color: #fff;
  border: 1px solid #444;
}
.btn-feed-secondary:hover { background: #444; }

/* ==========================================================================
   Location & Atmosphere Showcase
   ========================================================================== */
.location-showcase-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.5rem;
}

.showcase-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 4px;
  overflow: hidden;
  min-width: 0;
}

.showcase-img-wrap {
  height: 180px;
  overflow: hidden;
}

.showcase-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.showcase-card:hover .showcase-img {
  transform: scale(1.05);
}

.showcase-body {
  padding: 1.2rem;
}

.showcase-body h3 {
  font-family: var(--font-title);
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 0.4rem;
}

.showcase-body p {
  font-size: 0.85rem;
  color: var(--text-gray);
  line-height: 1.4;
}

/* Gallery */
.authentic-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.gal-cell {
  height: 200px;
  overflow: hidden;
  border: 1px solid var(--border-dark);
  border-radius: 4px;
  min-width: 0;
}

.gal-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.gal-cell:hover img {
  transform: scale(1.06);
}

/* ==========================================================================
   Opening Hours & Contact
   ========================================================================== */
.contact-dual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
}

.contact-box {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  padding: 2rem;
  border-radius: 4px;
  min-width: 0;
}

.box-head {
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 1.2rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.box-head i {
  color: var(--hemp-green-light);
}

.hours-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.2rem;
}

.hours-table td {
  padding: 0.6rem 0;
  border-bottom: 1px solid #333;
  font-size: 0.95rem;
  vertical-align: top;
}

.hours-table tr.ruhetag td {
  color: var(--text-muted);
}

.kitchen-alert {
  background: rgba(230, 149, 0, 0.12);
  border: 1px dashed var(--hemp-gold);
  color: var(--hemp-gold-light);
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  border-radius: 3px;
  line-height: 1.5;
}

.address-paragraph {
  font-size: 1rem;
  color: #fff;
  line-height: 1.6;
  margin-bottom: 1.2rem;
}

.contact-quicklinks {
  font-size: 1rem;
  margin-bottom: 1.5rem;
  line-height: 1.8;
}

.contact-quicklinks a {
  color: var(--hemp-gold-light);
}

.action-btn-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.hemperium-footer {
  background: #0d0d0d;
  border-top: 3px solid var(--hemp-green);
  padding: 3.5rem 0 1.5rem 0;
}

.footer-main {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 2.5rem;
  margin-bottom: 2.5rem;
}

.footer-logo-img {
  height: 75px;
  width: auto;
  margin-bottom: 1rem;
}

.footer-text {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.5;
}

.footer-title {
  font-family: var(--font-title);
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 1rem;
  letter-spacing: 0.5px;
}

.footer-links {
  list-style: none;
}

.footer-links li {
  margin-bottom: 0.5rem;
}

.footer-links a {
  font-size: 0.85rem;
  color: var(--text-gray);
  transition: color 0.15s ease;
}

.footer-links a:hover {
  color: var(--hemp-green-light);
}

.footer-bottom-bar {
  border-top: 1px solid #222;
  padding-top: 1.5rem;
  font-size: 0.8rem;
  color: var(--text-muted);
}

.footer-bottom-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.legal-links {
  display: flex;
  gap: 1.2rem;
}
.legal-links a:hover {
  color: #fff;
}

/* ==========================================================================
   Responsive Breakpoints (Mobile Exclusives - Desktop untouched)
   ========================================================================== */
@media (max-width: 1024px) {
  .daily-deals-grid, 
  .drinks-columns-grid, 
  .media-widgets-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .feature-bar-grid, 
  .location-showcase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .footer-main {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 768px) {
  /* Top Live Status Bar - Clean & Compact */
  .top-status-stripe {
    padding: 0.35rem 0.5rem !important;
  }
  
  .status-stripe-inner {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 0.8rem !important;
  }
  
  .direct-phone-link {
    font-size: 0.82rem !important;
    white-space: nowrap !important;
  }
  
  .direct-phone-link a {
    color: var(--hemp-gold-light) !important;
    font-weight: 700 !important;
  }

  /* Header - Compact Brand Area */
  .hemperium-header {
    padding: 0.85rem 0 !important;
  }

  .header-container {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 0.6rem !important;
  }
  
  .hemp-main-logo {
    height: 68px !important;
  }
  
  .header-info-box {
    align-items: center !important;
  }
  
  .info-text {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.3rem 0.8rem !important;
    font-size: 0.82rem !important;
  }
  
  .info-item {
    font-size: 0.82rem !important;
  }
  
  .header-button-row {
    justify-content: center !important;
    gap: 0.5rem !important;
    margin-top: 0.25rem !important;
  }
  
  .icon-btn-img {
    height: 30px !important;
  }

  /* Navigation Bar */
  .mobile-toggle {
    display: block !important;
    padding: 0.75rem 1rem !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
  }
  
  .nav-menu {
    display: none;
    flex-direction: column;
    width: 100%;
  }
  
  .nav-menu.open {
    display: flex;
  }
  
  .nav-link {
    border-right: none;
    border-bottom: 1px solid #222;
    padding: 0.85rem 1rem;
    text-align: center;
  }

  /* Hero Stage - Atmospheric Image Visible with Glassmorphism */
  .hero-stage {
    min-height: 480px !important;
    padding: 2.25rem 0 !important;
    background: linear-gradient(180deg, rgba(13, 16, 13, 0.35) 0%, rgba(13, 16, 13, 0.72) 65%, #121512 100%),
                url('../images/dschungel-new.jpg') center center / cover no-repeat !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .hero-inner {
    max-width: 92% !important;
    margin: 0 auto !important;
    padding: 1.6rem 1.25rem !important;
    background: rgba(16, 20, 16, 0.75) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(230, 149, 0, 0.35) !important;
    border-left: 4px solid var(--hemp-gold) !important;
    border-radius: 12px !important;
    text-align: center !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.85) !important;
  }

  .vintage-badge {
    font-size: 0.78rem !important;
    padding: 0.25rem 0.65rem !important;
    margin-bottom: 0.75rem !important;
    white-space: normal !important;
    display: inline-block !important;
  }

  .hero-heading {
    font-size: 1.75rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.6rem !important;
  }
  
  .hero-lead {
    font-size: 0.92rem !important;
    line-height: 1.45 !important;
    margin-bottom: 1.25rem !important;
    color: #ddd !important;
  }
  
  /* 2x2 App-Style Quick Action Grid */
  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.65rem !important;
    width: 100% !important;
  }
  
  .hero-actions .action-btn {
    width: 100% !important;
    padding: 0.65rem 0.4rem !important;
    font-size: 0.88rem !important;
    font-weight: 700 !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    border-radius: 6px !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
  }

  /* Feature Bar 2x2 Grid */
  .feature-bar {
    padding: 1.5rem 0 !important;
  }
  
  .feature-bar-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.75rem !important;
  }

  .feat-box {
    padding: 0.85rem 0.75rem !important;
    flex-direction: column !important;
    text-align: center !important;
    gap: 0.4rem !important;
  }

  .feat-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.2rem !important;
  }

  .feat-content h4 {
    font-size: 0.95rem !important;
    margin-bottom: 0.15rem !important;
  }

  .feat-content p {
    font-size: 0.78rem !important;
    line-height: 1.3 !important;
  }

  /* Hub Cards & Atmosphere on Mobile */
  .hub-cards-grid,
  .atmosphere-grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  .hub-card-image-wrap {
    height: 190px !important;
  }

  /* Force other mobile grids cleanly */
  .daily-deals-grid, 
  .complete-menu-grid, 
  .drinks-columns-grid, 
  .story-dual-grid, 
  .supplier-list, 
  .contact-dual-grid, 
  .location-showcase-grid, 
  .authentic-gallery,
  .media-widgets-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .menu-card-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }

  .menu-card-price {
    font-size: 1.15rem;
    color: var(--hemp-gold-light);
  }

  .feed-event-card {
    flex-direction: column;
    gap: 1.2rem;
    padding: 1.2rem;
  }

  .feed-date-column {
    flex-direction: row;
    align-items: baseline;
    gap: 0.5rem;
    width: auto;
  }

  .cal-daynum {
    font-size: 2.2rem;
  }

  .feed-title {
    font-size: 1.4rem;
  }

  .extras-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .footer-main {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }
  
  .hours-table td {
    display: block;
    padding: 0.25rem 0;
  }
  .hours-table td:first-child {
    font-weight: 700;
    color: var(--hemp-gold-light);
  }
  .hours-table td:last-child {
    padding-bottom: 0.7rem;
  }
}

@media (max-width: 480px) {
  .container {
    padding: 0 0.85rem;
  }
  
  .hemp-main-logo {
    height: 62px !important;
  }
  
  .hero-heading {
    font-size: 1.6rem !important;
  }
  
  .main-heading {
    font-size: 1.45rem !important;
  }
  
  .filter-btn {
    font-size: 0.82rem;
    padding: 0.45rem 0.65rem;
  }
}

/* ==========================================================================
   Single Event Detail Page Styles
   ========================================================================== */
.event-breadcrumb-stripe {
  background: #191919;
  border-bottom: 1px solid var(--border-dark);
  padding: 0.9rem 0;
}

.breadcrumb-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  font-size: 0.95rem;
}

.back-to-events-link {
  font-family: var(--font-title);
  color: var(--hemp-green-light);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.back-to-events-link:hover {
  color: #fff;
  text-decoration: underline;
}

.event-header-date {
  color: var(--hemp-gold-light);
  font-weight: 600;
}

.single-event-main {
  padding: 3rem 0 5rem 0;
}

.single-event-container {
  max-width: 900px;
}

.single-event-header {
  margin-bottom: 2rem;
}

.single-event-genre-tag {
  display: inline-block;
  font-family: var(--font-title);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 0.25rem 0.75rem;
  border-radius: 3px;
  color: #fff;
  margin-bottom: 0.8rem;
}

.single-event-title {
  font-family: var(--font-title);
  font-size: 2.6rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  margin-bottom: 0.8rem;
  word-break: break-word;
}

.single-event-subtitle {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  font-size: 1.05rem;
  color: var(--hemp-gold-light);
  font-weight: 600;
}

.single-event-poster-frame {
  width: 100%;
  max-height: 680px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid #383838;
  background: #0d0d0d;
  margin-bottom: 2rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.6);
}

.single-event-poster-img {
  width: 100%;
  height: auto;
  max-height: 680px;
  object-fit: contain;
  margin: 0 auto;
}

.event-cta-banner {
  background: linear-gradient(135deg, #1b2e20, #141f17);
  border: 1px solid var(--border-green);
  border-radius: 6px;
  padding: 1.5rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.2rem;
  margin-bottom: 2.5rem;
}

.cta-text {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.cta-text strong {
  font-size: 1.15rem;
  color: #fff;
}
.cta-text span {
  font-size: 0.92rem;
  color: var(--text-gray);
}

.cta-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.single-event-content-body {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 2.2rem;
  margin-bottom: 2.5rem;
}

.single-event-content-body h2 {
  font-family: var(--font-title);
  font-size: 1.8rem;
  color: #fff;
  margin-bottom: 1.2rem;
  border-bottom: 1px solid #333;
  padding-bottom: 0.6rem;
}

.single-event-content-body p {
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--text-gray);
  margin-bottom: 1.2rem;
}

.single-event-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
  margin-bottom: 2.5rem;
}

.meta-info-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 1.8rem;
  min-width: 0;
}

.meta-card-title {
  font-family: var(--font-title);
  font-size: 1.4rem;
  color: #fff;
  margin-bottom: 1.2rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-bottom: 1px solid #333;
  padding-bottom: 0.5rem;
}
.meta-card-title i {
  color: var(--hemp-green-light);
}

.meta-data-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.meta-data-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.8rem;
  font-size: 0.95rem;
  border-bottom: 1px dotted #333;
  padding-bottom: 0.4rem;
}

.meta-data-list li strong {
  color: var(--text-gray);
}
.meta-data-list li span {
  color: #fff;
  text-align: right;
  word-break: break-word;
}
.meta-data-list li a {
  color: var(--hemp-gold-light);
}

.calendar-export-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1.2rem;
}

.cal-export-btn {
  background: #282828;
  border: 1px solid #444;
  color: #fff;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.5rem 0.8rem;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  transition: all 0.2s ease;
}
.cal-export-btn:hover {
  background: var(--hemp-green);
  border-color: var(--hemp-green);
}

.event-nav-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  border-top: 1px solid var(--border-dark);
  padding-top: 1.5rem;
}

.nav-prev-event, .nav-next-event {
  font-family: var(--font-title);
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--hemp-gold-light);
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.nav-prev-event:hover, .nav-next-event:hover {
  color: #fff;
  text-decoration: underline;
}

@media (max-width: 768px) {
  .single-event-title {
    font-size: 1.85rem;
  }
  .event-cta-banner {
    flex-direction: column;
    align-items: stretch;
    padding: 1.2rem;
  }
  .single-event-meta-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .meta-data-list li {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }
  .meta-data-list li span {
    text-align: left;
  }
}

/* ==========================================================================
   Multi-Page Website Universal Subpage Styles
   ========================================================================== */

.subpage-hero-stage {
  background: 
    linear-gradient(90deg, rgba(12, 12, 12, 0.85) 0%, rgba(16, 16, 16, 0.6) 50%, rgba(12, 12, 12, 0.8) 100%),
    linear-gradient(0deg, #141414 0%, transparent 25%),
    url('../images/dschungel-new.jpg') center 30% / cover no-repeat;
  border-bottom: 2px solid var(--border-green);
  padding: 3.5rem 0 3rem 0;
  position: relative;
  overflow: hidden;
}

.subpage-hero-inner {
  position: relative;
  z-index: 2;
}

.subpage-badge {
  display: inline-block;
  background: rgba(46, 148, 75, 0.2);
  border: 1px solid var(--hemp-green);
  color: var(--hemp-green-light);
  font-family: var(--font-title);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 0.3rem 0.8rem;
  border-radius: 4px;
  margin-bottom: 0.8rem;
}

.subpage-hero-title {
  font-family: var(--font-title);
  font-size: 2.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 0.8rem;
}

.subpage-hero-lead {
  font-size: 1.15rem;
  color: var(--text-gray);
  max-width: 800px;
  line-height: 1.6;
}

/* Breadcrumb Navigation Stripe */
.subpage-breadcrumb-stripe {
  background: #0f0f0f;
  border-bottom: 1px solid #222;
  padding: 0.75rem 0;
  font-size: 0.9rem;
}

.subpage-breadcrumb-inner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  color: var(--text-muted);
}

.subpage-breadcrumb-inner a {
  color: var(--hemp-green-light);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  transition: color 0.2s;
}

.subpage-breadcrumb-inner a:hover {
  color: #fff;
  text-decoration: underline;
}

.subpage-breadcrumb-inner .breadcrumb-sep {
  color: #555;
  font-size: 0.8rem;
}

.subpage-breadcrumb-inner .breadcrumb-current {
  color: #fff;
  font-weight: 600;
}

/* Highlights Teaser Grid */
.highlights-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

@media (max-width: 1100px) {
  .highlights-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .highlights-grid {
    grid-template-columns: 1fr;
  }
}

.highlight-item-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 8px;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease;
}

.highlight-item-card:hover {
  transform: translateY(-4px);
  border-color: var(--hemp-green-light);
  box-shadow: 0 8px 24px rgba(0,0,0,0.5), 0 0 15px var(--hemp-green-glow);
}

.highlight-card-featured {
  background: rgba(46, 148, 75, 0.12);
  border-color: var(--hemp-green-light);
}

.highlight-card-header {
  margin-bottom: 0.75rem;
}

.highlight-card-title {
  font-family: var(--font-title);
  font-size: 1.3rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.25;
  margin-bottom: 0.5rem;
}

.highlight-price-pill {
  display: inline-block;
  background: rgba(245, 166, 35, 0.18);
  color: var(--hemp-gold-light);
  border: 1px solid var(--hemp-gold);
  font-weight: 700;
  font-size: 0.95rem;
  padding: 0.2rem 0.65rem;
  border-radius: 4px;
  white-space: nowrap;
}

.highlight-price-pill.pill-gold {
  background: var(--hemp-gold);
  color: #111111;
  border-color: var(--hemp-gold-light);
}

.highlight-badge-row {
  margin-bottom: 0.75rem;
}

.highlight-card-text {
  font-size: 0.92rem;
  color: var(--text-gray);
  line-height: 1.55;
  margin: 0;
  flex-grow: 1;
}

/* Homepage Quick Navigation & Visual Hub Cards */
.hub-visual-grid,
.homepage-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 2rem;
}

@media (max-width: 992px) {
  .hub-visual-grid,
  .homepage-hub-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}

@media (max-width: 650px) {
  .hub-visual-grid,
  .homepage-hub-grid {
    grid-template-columns: 1fr;
  }
}

.hub-visual-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 6px 20px rgba(0,0,0,0.5);
  position: relative;
  text-decoration: none;
}

.hub-visual-card:hover {
  transform: translateY(-6px);
  border-color: var(--hemp-gold);
  box-shadow: 0 16px 36px rgba(0,0,0,0.7), 0 0 18px var(--hemp-gold-glow);
}

.hub-card-image-wrap,
.hub-visual-img-wrap {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
  background: #0d0d0d;
}

.hub-card-img,
.hub-visual-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.hub-visual-card:hover .hub-card-img,
.hub-visual-card:hover .hub-visual-img {
  transform: scale(1.06);
}

.hub-card-badge,
.hub-visual-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: rgba(14, 18, 14, 0.88);
  border: 1px solid var(--border-green);
  backdrop-filter: blur(8px);
  color: var(--hemp-green-light);
  font-family: var(--font-title);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 0.35rem 0.8rem;
  border-radius: 4px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.6);
  z-index: 2;
}

.badge-gold {
  background: var(--hemp-gold) !important;
  color: #111 !important;
  border-color: var(--hemp-gold-light) !important;
}

.hub-card-content,
.hub-visual-body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  background: linear-gradient(180deg, var(--hemp-bg-surface) 0%, var(--hemp-bg-dark) 100%);
}

.hub-card-title,
.hub-visual-title {
  font-family: var(--font-title);
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  margin-top: 0;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.hub-card-title i,
.hub-visual-title i {
  color: var(--hemp-gold-light);
  font-size: 1.2rem;
}

.hub-card-text,
.hub-visual-desc {
  font-size: 0.92rem;
  color: var(--text-gray);
  line-height: 1.55;
  margin-bottom: 1.25rem;
  flex-grow: 1;
}

.hub-card-link-text,
.hub-visual-btn {
  font-family: var(--font-title);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--hemp-green-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  transition: color 0.2s ease;
}

.hub-visual-card:hover .hub-card-link-text,
.hub-visual-card:hover .hub-visual-btn {
  color: var(--hemp-gold-light);
}

/* Atmosphere Strip */
.atmosphere-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  width: 100%;
  margin: 3.5rem 0 0 0;
  overflow: hidden;
  border-top: 2px solid var(--border-green);
  border-bottom: 2px solid var(--border-green);
}

@media (max-width: 768px) {
  .atmosphere-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.atmo-item {
  position: relative;
  height: 240px;
  overflow: hidden;
}

.atmo-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.atmo-item:hover img {
  transform: scale(1.08);
}

.atmo-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem 1rem 0.75rem 1rem;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.85) 100%);
  color: #ffffff;
  font-family: var(--font-title);
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-align: center;
  pointer-events: none;
}
}

.hub-visual-btn:hover {
  background: var(--hemp-green);
  color: #fff;
  border-color: var(--hemp-green);
  gap: 0.8rem;
}

.hub-visual-card.hub-featured .hub-visual-btn {
  background: rgba(230, 149, 0, 0.2);
  border-color: var(--border-gold);
  color: var(--hemp-gold-light);
}

.hub-visual-card.hub-featured .hub-visual-btn:hover {
  background: var(--hemp-gold);
  color: #111;
  border-color: var(--hemp-gold);
}

/* Atmospheric 4-Image Strip */
.atmosphere-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  width: 100%;
  margin: 3.5rem 0 1.5rem 0;
  overflow: hidden;
  border-top: 2px solid var(--border-green);
  border-bottom: 2px solid var(--border-green);
}

.atmosphere-item {
  position: relative;
  height: 220px;
  overflow: hidden;
  display: block;
}

.atmosphere-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease, filter 0.5s ease;
  filter: brightness(0.85);
}

.atmosphere-item:hover img {
  transform: scale(1.1);
  filter: brightness(1.05);
}

.atmosphere-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem 1rem 0.75rem 1rem;
  background: linear-gradient(0deg, rgba(0,0,0,0.85) 0%, transparent 100%);
  color: #fff;
  font-family: var(--font-title);
  font-size: 1.15rem;
  text-align: center;
}

@media (max-width: 900px) {
  .atmosphere-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .atmosphere-strip {
    grid-template-columns: 1fr;
  }
}

/* Subpage Content Section Callout */
.subpage-callout-banner {
  background: linear-gradient(135deg, #1b2e20, #141f17);
  border: 1px solid var(--border-green);
  border-radius: 6px;
  padding: 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 3rem 0 1.5rem 0;
}

.callout-text h3 {
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 0.3rem;
}

.callout-text p {
  color: var(--text-gray);
  font-size: 0.95rem;
  margin: 0;
}

/* Jam Sessions Specific Styles */
.backline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.backline-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 1.5rem;
  border-left: 4px solid var(--hemp-green);
}

.backline-card h4 {
  font-family: var(--font-title);
  font-size: 1.25rem;
  color: #fff;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.backline-card h4 i {
  color: var(--hemp-green-light);
}

.backline-card p {
  font-size: 0.92rem;
  color: var(--text-gray);
  line-height: 1.5;
  margin: 0;
}

/* Interactive Gallery Filter & Lightbox Grid */
.gallery-interactive-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}

.gallery-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  overflow: hidden;
  transition: transform 0.3s ease, border-color 0.3s ease;
}

.gallery-card:hover {
  transform: translateY(-4px);
  border-color: var(--hemp-gold);
}

.gallery-img-wrap {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
  background: #000;
}

.gallery-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.gallery-card:hover .gallery-img-wrap img {
  transform: scale(1.06);
}

.gallery-card-body {
  padding: 1.2rem;
}

.gallery-card-tag {
  display: inline-block;
  font-family: var(--font-title);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--hemp-green-light);
  margin-bottom: 0.4rem;
}

.gallery-card-title {
  font-family: var(--font-title);
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 0.3rem;
}

.gallery-card-desc {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.4;
  margin: 0;
}

/* Contact & Booking Form */
.contact-form-card {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 2.2rem;
}

.contact-form-card h3 {
  font-family: var(--font-title);
  font-size: 1.6rem;
  color: #fff;
  margin-bottom: 0.5rem;
}

.contact-form-card p {
  font-size: 0.95rem;
  color: var(--text-gray);
  margin-bottom: 1.5rem;
}

.form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}

.form-group {
  margin-bottom: 1.2rem;
}

.form-group label {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 0.4rem;
}

.form-control {
  width: 100%;
  background: #191919;
  border: 1px solid #383838;
  border-radius: 4px;
  padding: 0.75rem 1rem;
  color: #fff;
  font-family: var(--font-text);
  font-size: 0.95rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus {
  outline: none;
  border-color: var(--hemp-green-light);
  box-shadow: 0 0 0 3px rgba(46, 148, 75, 0.25);
}

.form-submit-btn {
  background: var(--hemp-green);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-family: var(--font-title);
  font-size: 1.1rem;
  font-weight: 600;
  padding: 0.85rem 2rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: background 0.2s ease;
}

.form-submit-btn:hover {
  background: var(--hemp-green-light);
}

/* FAQ Accordion */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 1.5rem;
}

.faq-item {
  background: var(--hemp-bg-surface);
  border: 1px solid var(--border-dark);
  border-radius: 6px;
  padding: 1.25rem 1.5rem;
}

.faq-question {
  font-family: var(--font-title);
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.faq-question i {
  color: var(--hemp-gold-light);
}

.faq-answer {
  font-size: 0.95rem;
  color: var(--text-gray);
  line-height: 1.55;
  margin: 0;
}

@media (max-width: 768px) {
  .subpage-hero-title {
    font-size: 2.1rem;
  }
  .form-grid-2 {
    grid-template-columns: 1fr;
  }
  .subpage-callout-banner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ==========================================================================
   The Events Calendar Plugin Dark-Mode Overrides (Complete & Clean)
   ========================================================================== */
#tribe-events,
#tribe-events-content,
.tribe-events-view,
.tribe-common {
  color: var(--text-gray) !important;
  background-color: transparent !important;
}

/* Container Width & Clean Centering */
.tribe-events,
.tribe-events-view,
.tribe-common,
.tribe-events-calendar-list,
.events-page-container {
  max-width: 1100px !important;
  width: 100% !important;
  margin: 0 auto !important;
  background: transparent !important;
}

/* Event List Card */
.tribe-events-calendar-list__event {
  margin-bottom: 2rem !important;
}

.tribe-events-calendar-list__event-row {
  background: #191e19 !important;
  border: 1px solid var(--border-dark) !important;
  border-radius: 8px !important;
  padding: 1.75rem !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 1.5rem !important;
  transition: all 0.3s ease !important;
}

.tribe-events-calendar-list__event-row:hover {
  border-color: var(--hemp-green-light) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.6), 0 0 15px var(--hemp-green-glow) !important;
}

/* Compact Date Badge on the left */
.tribe-events-calendar-list__event-date-tag {
  align-self: flex-start !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  height: auto !important;
}

.tribe-events-calendar-list__event-date-tag-datetime {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 68px !important;
  min-width: 68px !important;
  height: auto !important;
  min-height: 68px !important;
  padding: 0.6rem 0.3rem !important;
  background: #101410 !important;
  border: 2px solid var(--hemp-gold) !important;
  border-radius: 6px !important;
  text-align: center !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5) !important;
}

.tribe-events-calendar-list__event-date-tag-weekday {
  color: var(--hemp-gold) !important;
  font-family: var(--font-title) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  margin-bottom: 0.25rem !important;
}

.tribe-events-calendar-list__event-date-tag-daynum {
  color: #ffffff !important;
  font-family: var(--font-title) !important;
  font-size: 1.9rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Event Content Details */
.tribe-events-calendar-list__event-details {
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

.tribe-events-calendar-list__event-datetime-wrapper {
  margin-bottom: 0.4rem !important;
}

.tribe-events-calendar-list__event-datetime,
.tribe-events-calendar-list__event-datetime time,
.tribe-event-schedule-details {
  color: var(--hemp-gold-light) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
}

/* Titles */
.tribe-events-calendar-list__event-title,
.tribe-events-calendar-list__event-title a,
.tribe-events-list-event-title a,
.tribe-events-single-event-title,
.tribe-common-h1, .tribe-common-h2, .tribe-common-h3, .tribe-common-h4, .tribe-common-h5, .tribe-common-h6 {
  color: #ffffff !important;
  font-family: var(--font-title) !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  line-height: 1.25 !important;
  margin-bottom: 0.75rem !important;
}

.tribe-events-calendar-list__event-title a:hover,
.tribe-events-list-event-title a:hover {
  color: var(--hemp-gold) !important;
}

/* Descriptions */
.tribe-events-calendar-list__event-description,
.tribe-events-calendar-list__event-description p,
.tribe-events-list-event-description {
  color: var(--text-gray) !important;
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
}

/* Action buttons row inside Tribe list cards */
.tribe-event-actions-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.75rem !important;
  margin-top: 1.25rem !important;
  flex-wrap: wrap !important;
}

.tribe-event-actions-row .btn-feed-primary {
  background: var(--hemp-green) !important;
  color: #ffffff !important;
  padding: 0.5rem 1rem !important;
  border-radius: 4px !important;
  font-family: var(--font-title) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: all 0.2s ease !important;
}

.tribe-event-actions-row .btn-feed-primary:hover {
  background: var(--hemp-green-light) !important;
  box-shadow: 0 4px 14px var(--hemp-green-glow) !important;
}

.tribe-event-actions-row .btn-feed-secondary {
  background: var(--hemp-gold) !important;
  color: #111111 !important;
  padding: 0.5rem 1rem !important;
  border-radius: 4px !important;
  font-family: var(--font-title) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: all 0.2s ease !important;
}

.tribe-event-actions-row .btn-feed-secondary:hover {
  background: var(--hemp-gold-light) !important;
  box-shadow: 0 4px 14px var(--hemp-gold-glow) !important;
}

/* Featured Images */
.tribe-events-calendar-list__event-featured-image-wrapper {
  max-width: 180px !important;
  width: 180px !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}

.tribe-events-calendar-list__event-featured-image-link {
  display: block !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.tribe-events-calendar-list__event-featured-image {
  width: 100% !important;
  height: 130px !important;
  object-fit: cover !important;
  border-radius: 6px !important;
  border: 1px solid var(--border-dark) !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}

.tribe-events-calendar-list__event-featured-image:hover {
  transform: scale(1.05) !important;
}

/* Top bar controls */
.tribe-events-c-top-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 1.5rem !important;
  margin-bottom: 2rem !important;
  padding-bottom: 1rem !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}

.tribe-events-c-top-bar__today-button {
  background: #1b201b !important;
  color: #ffffff !important;
  border: 1px solid var(--border-gold) !important;
  border-radius: 4px !important;
  padding: 0.4rem 1rem !important;
  font-family: var(--font-title) !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  transition: all 0.2s ease !important;
}

.tribe-events-c-top-bar__today-button:hover {
  background: var(--hemp-gold) !important;
  color: #111111 !important;
}

.tribe-events-c-top-bar__nav-link {
  color: var(--hemp-gold) !important;
  font-size: 1.2rem !important;
  padding: 0.3rem 0.6rem !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.tribe-events-c-top-bar__nav-link:hover {
  color: var(--hemp-gold-light) !important;
}

/* Hide Redundant View Selector Icon (removes the single 'Liste' popup button) */
.tribe-events-c-view-selector,
.tribe-events-c-top-bar__view-selector,
.tribe-events-c-view-selector__list-container {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Month Divider Header */
.tribe-events-calendar-list__month-separator-text {
  color: var(--hemp-gold) !important;
  font-family: var(--font-title) !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

.tribe-events-calendar-list__month-separator-line {
  border-color: rgba(230, 149, 0, 0.4) !important;
}

/* Navigation & Pagination Bar */
.tribe-events-c-nav {
  margin-top: 3rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}

.tribe-events-c-nav__list {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.tribe-events-c-nav__list-item {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.tribe-events-c-nav__prev,
.tribe-events-c-nav__next {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  background: var(--hemp-green) !important;
  color: #ffffff !important;
  padding: 0.8rem 1.6rem !important;
  border-radius: 4px !important;
  font-family: var(--font-title) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.tribe-events-c-nav__prev:hover,
.tribe-events-c-nav__next:hover {
  background: var(--hemp-green-light) !important;
  box-shadow: 0 4px 15px var(--hemp-green-glow) !important;
  color: #ffffff !important;
}

.tribe-events-c-nav__prev--disabled,
.tribe-events-c-nav__next--disabled {
  display: none !important;
}

/* Subscribe Dropdown */
.tribe-events-c-subscribe-dropdown {
  margin-top: 2rem !important;
}

.tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button,
.tribe-events-c-subscribe-dropdown__button {
  background: #1e221e !important;
  color: var(--hemp-gold-light) !important;
  border: 1px solid var(--border-gold) !important;
  border-radius: 4px !important;
  font-family: var(--font-title) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  padding: 0.65rem 1.2rem !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.tribe-events-c-subscribe-dropdown__button:hover {
  background: var(--hemp-gold) !important;
  color: #111111 !important;
}

.tribe-events-c-subscribe-dropdown__list {
  background: #181c18 !important;
  border: 1px solid var(--border-gold) !important;
  border-radius: 4px !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.8) !important;
}

.tribe-events-c-subscribe-dropdown__list-item a {
  color: #ffffff !important;
  font-size: 0.9rem !important;
  padding: 0.5rem 1rem !important;
}

/* ==========================================================================
   Single Event Detail Page Styling (High Contrast Dark Mode)
   ========================================================================== */
.event-breadcrumb-stripe,
.tribe-events-back {
  background: #111411 !important;
  border-bottom: 1px solid var(--border-dark) !important;
  padding: 0.85rem 0 !important;
  margin-bottom: 2.5rem !important;
}

.breadcrumb-inner {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
}

.back-to-events-link,
.tribe-events-back a {
  color: var(--hemp-green-light) !important;
  font-family: var(--font-title) !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  transition: color 0.2s ease !important;
}

.back-to-events-link:hover,
.tribe-events-back a:hover {
  color: var(--hemp-gold) !important;
  text-decoration: underline !important;
}

.event-header-date {
  color: var(--hemp-gold-light) !important;
  font-family: var(--font-title) !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
}

.single-event-main,
.tribe-events-single {
  color: var(--text-gray) !important;
  padding-bottom: 4rem !important;
}

.single-event-container {
  max-width: 960px !important;
  margin: 0 auto !important;
}

.single-event-header {
  margin-bottom: 2rem !important;
}

.single-event-genre-tag {
  display: inline-block !important;
  background: rgba(46, 148, 75, 0.2) !important;
  border: 1px solid var(--border-green) !important;
  color: var(--hemp-green-light) !important;
  font-family: var(--font-title) !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 0.35rem 0.85rem !important;
  border-radius: 4px !important;
  margin-bottom: 0.75rem !important;
}

.single-event-title,
.tribe-events-single-event-title {
  font-family: var(--font-title) !important;
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.15 !important;
  margin: 0.5rem 0 1rem 0 !important;
}

.single-event-subtitle,
.tribe-events-schedule,
.tribe-events-schedule h2 {
  color: var(--hemp-gold-light) !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  margin-bottom: 1.5rem !important;
}

.single-event-subtitle span,
.tribe-events-schedule span {
  color: var(--hemp-gold-light) !important;
}

.single-event-poster-frame,
.tribe-events-event-image {
  background: #0d0f0d !important;
  border: 1px solid var(--border-dark) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  margin-bottom: 2.5rem !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.8) !important;
  text-align: center !important;
}

.single-event-poster-img,
.tribe-events-event-image img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

.event-cta-banner {
  background: linear-gradient(135deg, rgba(46, 148, 75, 0.25) 0%, rgba(18, 22, 18, 0.9) 100%) !important;
  border: 1px solid var(--border-green) !important;
  border-radius: 8px !important;
  padding: 1.75rem 2rem !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 1.5rem !important;
  margin-bottom: 2.5rem !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.5) !important;
}

.event-cta-banner .cta-text strong {
  display: block !important;
  color: #ffffff !important;
  font-family: var(--font-title) !important;
  font-size: 1.3rem !important;
  margin-bottom: 0.25rem !important;
}

.event-cta-banner .cta-text span {
  color: var(--text-gray) !important;
  font-size: 0.95rem !important;
}

.event-cta-banner .cta-buttons {
  display: flex !important;
  gap: 1rem !important;
  flex-wrap: wrap !important;
}

.single-event-content-body,
.tribe-events-single-event-description {
  background: var(--hemp-bg-surface) !important;
  border: 1px solid var(--border-dark) !important;
  border-radius: 8px !important;
  padding: 2.5rem !important;
  margin-bottom: 2.5rem !important;
  color: var(--text-gray) !important;
  font-size: 1.05rem !important;
  line-height: 1.8 !important;
}

/* Hide Tribe's duplicate raw meta box and duplicate sub-nav inside content */
.single-event-main .tribe-events-single-section,
.single-event-main .tribe-events-event-meta,
.single-event-main .tribe-events-meta-group,
.single-event-main .tribe-events-c-subscribe-dropdown,
.single-event-main #tribe-events-footer,
.single-event-main .tribe-events-sub-nav,
.single-event-content-body .tribe-events-single-section,
.single-event-content-body .tribe-events-event-meta {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-event-content-body h2,
.single-event-content-body h3,
.tribe-events-single-event-description h2,
.tribe-events-single-event-description h3 {
  color: #ffffff !important;
  font-family: var(--font-title) !important;
  font-size: 1.6rem !important;
  margin-top: 0 !important;
  margin-bottom: 1.25rem !important;
  border-bottom: 1px solid var(--border-dark) !important;
  padding-bottom: 0.5rem !important;
}

.single-event-content-body p,
.tribe-events-single-event-description p {
  color: var(--text-gray) !important;
  margin-bottom: 1.25rem !important;
}

.single-event-meta-grid,
.tribe-events-single-section {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 2rem !important;
  margin-bottom: 2.5rem !important;
}

.meta-info-card,
.tribe-events-meta-group {
  background: var(--hemp-bg-surface) !important;
  border: 1px solid var(--border-dark) !important;
  border-radius: 8px !important;
  padding: 2rem !important;
}

.meta-card-title,
.tribe-events-single-section-title {
  font-family: var(--font-title) !important;
  font-size: 1.35rem !important;
  color: #ffffff !important;
  margin-top: 0 !important;
  margin-bottom: 1.25rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  border-bottom: 1px solid var(--border-dark) !important;
  padding-bottom: 0.5rem !important;
}

.meta-card-title i {
  color: var(--hemp-gold) !important;
}

.meta-data-list,
.tribe-events-meta-group dl {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.meta-data-list li,
.tribe-events-meta-group dt,
.tribe-events-meta-group dd {
  display: flex !important;
  justify-content: space-between !important;
  padding: 0.65rem 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  font-size: 0.95rem !important;
}

.meta-data-list strong,
.tribe-events-meta-group dt {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.meta-data-list span,
.meta-data-list a,
.tribe-events-meta-group dd,
.tribe-events-meta-group a {
  color: var(--hemp-gold-light) !important;
  text-decoration: none !important;
}

.meta-data-list a:hover,
.tribe-events-meta-group a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

.cal-export-btn,
.tribe-events-cal-links a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  background: rgba(245, 166, 35, 0.15) !important;
  border: 1px solid var(--border-gold) !important;
  color: var(--hemp-gold-light) !important;
  padding: 0.6rem 1.2rem !important;
  border-radius: 4px !important;
  font-family: var(--font-title) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  margin-top: 1rem !important;
  transition: all 0.2s ease !important;
}

.cal-export-btn:hover,
.tribe-events-cal-links a:hover {
  background: var(--hemp-gold) !important;
  color: #111111 !important;
}

/* ==========================================================================
   Event Adjacent Navigation & Action Footer (2 Rows)
   ========================================================================== */
.event-nav-section {
  border-top: 1px solid var(--border-dark) !important;
  margin-top: 3rem !important;
  padding-top: 2.5rem !important;
}

.event-adjacent-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1.5rem !important;
  margin-bottom: 2rem !important;
}

@media (max-width: 768px) {
  .event-adjacent-row {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }
}

.event-adj-card {
  display: flex !important;
  flex-direction: column !important;
  background: var(--hemp-bg-surface) !important;
  border: 1px solid var(--border-dark) !important;
  border-radius: 8px !important;
  padding: 1.1rem 1.5rem !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.event-adj-card:hover:not(.disabled-card) {
  background: #182018 !important;
  border-color: var(--border-gold) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.7) !important;
  transform: translateY(-2px);
}

.event-adj-card.next-card {
  text-align: right !important;
  align-items: flex-end !important;
}

.event-adj-card.prev-card {
  text-align: left !important;
  align-items: flex-start !important;
}

.event-adj-card.disabled-card {
  opacity: 0.35 !important;
  cursor: not-allowed !important;
}

.event-adj-card .adj-badge {
  color: var(--hemp-gold) !important;
  font-family: var(--font-title) !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 0.35rem !important;
}

.event-adj-card .adj-name {
  color: #ffffff !important;
  font-family: var(--font-title) !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.event-adj-card:hover:not(.disabled-card) .adj-name {
  color: var(--hemp-gold-light) !important;
}

.event-actions-center-row {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 1.25rem !important;
  flex-wrap: wrap !important;
}

