/** Shopify CDN: Minification failed

Line 168:0 All "@import" rules must come first

**/
/* ================================================
   NEMENEAN MASTER MENU + LOGO CSS – Luxus-Edition
   ================================================ */

/* 1. Basis-Transitions für alle Menü-Elemente */
.header__menu-item,
summary.header__menu-item,
.mega-menu__link,
.mega-menu__link--level-2,
.mobile-nav__link,
.menu-drawer__menu-item,
.drawer__menu-item {
  transition: color 0.4s ease, transform 0.4s ease, text-shadow 0.4s ease, filter 0.4s ease !important;
  transform-origin: center center;
}

/* 2. Normalzustand: Immer Gold (Desktop + Mobile) */
.header__menu-item,
summary.header__menu-item,
.header__menu-item span,
.mega-menu__link,
.mega-menu__link--level-2,
.mega-menu__list a,
.mobile-nav__link,
.menu-drawer__menu-item,
.drawer__menu-item,
.menu-drawer a,
.menu-drawer span,
.menu-drawer li,
.menu-drawer div {
  color: #d4af37 !important;
  opacity: 1 !important;
}

/* 3. Hover / Active Zustand: Helleres Gold + Glow + Scale */
.header__menu-item:hover,
summary.header__menu-item:hover,
summary.header__menu-item[aria-expanded="true"],
.mega-menu__link:hover,
.mega-menu__link--level-2:hover,
.mobile-nav__link:hover,
.menu-drawer__menu-item:hover,
.drawer__menu-item:active,
.menu-drawer a:hover,
.menu-drawer__submenu a:hover {
  color: #ffd700 !important;
  text-shadow: 0 0 6px rgba(255, 215, 0, 0.5) !important;
  filter: brightness(1.12) drop-shadow(0 2px 6px rgba(212, 175, 55, 0.35)) !important;
  transform: scale(1.03) translateY(-1px) !important;
}

/* 4. Eleganter Gradient-Unterstrich (einheitlich für alle Ebenen) */
.header__menu-item:hover::after,
.mega-menu__link:hover::after,
.mobile-nav__link:hover::after,
.menu-drawer__menu-item:hover::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #d4af37, #ffd700, #d4af37);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.header__menu-item:hover::after,
.mega-menu__link:hover::after,
.mobile-nav__link:hover::after,
.menu-drawer__menu-item:hover::after {
  transform: scaleX(1);
}

/* 5. Altes ::after entfernen (kein Doppel-Unterstrich mehr) */
.header__menu-item::after,
.mega-menu__link::after,
.mobile-nav__link::after,
.menu-drawer__menu-item::after {
  content: none !important;
}

/* 6. Logo: Dezenter Puls + Hover-Glanz (kein Kippen mehr) */
.header__heading-logo,
.site-header__logo img,
.header__logo-wrapper img {
  animation: lionElegantPulse 10s ease-in-out infinite alternate;
  transition: transform 0.6s ease, filter 0.6s ease;
}

@keyframes lionElegantPulse {
  0%   { transform: scale(1); filter: brightness(1); }
  100% { transform: scale(1.008); filter: brightness(1.05) drop-shadow(0 0 8px rgba(212, 175, 55, 0.25)); }
}

.header__heading-logo:hover,
.site-header__logo:hover img,
.header__logo-wrapper:hover img {
  transform: scale(1.06) translateY(-3px) !important;
  filter: brightness(1.15) drop-shadow(0 8px 16px rgba(212, 175, 55, 0.45)) !important;
  animation: none; /* Puls pausiert beim Hover */
}

/* Klick/Tap auf Logo: Kein Kippen oder Verschieben */
.header__heading-logo:active,
.site-header__logo img:active,
.header__logo-wrapper img:active,
.header__heading-logo:focus,
.site-header__logo img:focus {
  transform: none !important;
  filter: none !important;
}

/* 7. Mobile Drawer: Dunkel, aber lesbar + Gold-Akzent */
.menu-drawer,
.drawer,
.drawer__inner,
.drawer__scrollable {
  background: linear-gradient(to bottom, #121212, #1e1e1e) !important;
  border-left: 3px solid rgba(212, 175, 55, 0.18) !important;
  box-shadow: -20px 0 50px rgba(0,0,0,0.8) !important;
}

/* Sub-Menü im Drawer: Sanftes Einblenden */
.menu-drawer__submenu,
.drawer details[open] .sub-menu {
  animation: fadeSlideIn 0.4s ease forwards;
}

@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateX(-15px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* 8. Sticky Header: Premium-Look beim Scrollen */
.header--sticky.is-sticky,
header.is-sticky {
  background: rgba(10, 10, 10, 0.92) !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: 0 6px 25px rgba(212, 175, 55, 0.08) !important;
  transition: all 0.4s ease;
}

/* 9. Mobile-Spezifische Tap-Verstärkung */
@media (max-width: 989px) {
  .mobile-nav__link:active,
  .menu-drawer__menu-item:active,
  .drawer__menu-item:active {
    color: #ffd700 !important;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.6) !important;
    transform: scale(1.04) !important;
  }
}



/* ================================================
   NEMEAN MOBILE MENÜ – Playfair Luxus-Edition
   ================================================ */

/* Google Fonts: Playfair Display laden */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Cormorant+Garamond:wght@300;400;500&display=swap');

@media (max-width: 989px) {

  /* Drawer: Tiefes Schwarz mit Vignette-Effekt */
  .menu-drawer {
    background: #0a0a0a !important;
    border-top: 1px solid rgba(212, 175, 55, 0.5) !important;
    border-left: none !important;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.95) !important;
  }

  .menu-drawer__inner-container,
  .menu-drawer__navigation-container {
    background: transparent !important;
  }

  /* Navigation Padding */
  .menu-drawer__navigation {
    padding: 2rem 0 !important;
  }

  /* ── HAUPTMENÜPUNKTE (Shop, Wissen, Marke) ── */
  .menu-drawer__menu > li > .menu-drawer__menu-item,
  .menu-drawer__menu > li > summary.menu-drawer__menu-item {
    font-family: 'Playfair Display', 'Georgia', serif !important;
    font-size: 2.2rem !important;
    font-weight: 600 !important;
    color: #f5f0e8 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding: 1.6rem 3.2rem !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.15) !important;
    position: relative !important;
    transition: color 0.3s ease, padding-left 0.3s ease !important;
  }

  /* Goldener linker Akzent-Strich beim Hover */
  .menu-drawer__menu > li > .menu-drawer__menu-item:hover,
  .menu-drawer__menu > li > summary.menu-drawer__menu-item:hover {
    color: #d4af37 !important;
    padding-left: 4rem !important;
    background: rgba(212, 175, 55, 0.04) !important;
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.2) !important;
  }

  /* Pfeil-Icons: Gold */
  .menu-drawer__menu-item .icon,
  .menu-drawer__menu-item svg {
    color: #d4af37 !important;
    fill: #d4af37 !important;
    opacity: 0.8 !important;
  }

  /* ── UNTERMENÜ-CONTAINER ── */
  .menu-drawer__submenu {
    background: #0e0e0e !important;
    border-top: 1px solid rgba(212, 175, 55, 0.2) !important;
  }

  /* Zurück-Zeile (← Shop) */
  .menu-drawer__close-button {
    font-family: 'Cormorant Garamond', 'Georgia', serif !important;
    font-size: 1.3rem !important;
    color: #d4af37 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    opacity: 0.9 !important;
    padding: 1.2rem 3.2rem !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.25) !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.8rem !important;
  }

  /* Zurück-Pfeil */
  .menu-drawer__close-button svg {
    color: #d4af37 !important;
    fill: #d4af37 !important;
  }

  /* ── UNTERMENÜPUNKTE (Säulen der Kraft etc.) ── */
  .menu-drawer__submenu a.menu-drawer__menu-item,
  .menu-drawer__submenu li a {
    font-family: 'Cormorant Garamond', 'Georgia', serif !important;
    font-size: 1.8rem !important;
    font-weight: 400 !important;
    color: #c8c0b0 !important;
    letter-spacing: 0.06em !important;
    text-transform: none !important;
    padding: 1.3rem 3.2rem !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    transition: color 0.25s ease, padding-left 0.25s ease !important;
    opacity: 1 !important;
  }

  .menu-drawer__submenu a.menu-drawer__menu-item:hover {
    color: #d4af37 !important;
    padding-left: 4rem !important;
    background: rgba(212, 175, 55, 0.04) !important;
  }

  /* ── UNTERER BEREICH (Konto, Währung) ── */
  .menu-drawer__utility-links {
    border-top: 1px solid rgba(212, 175, 55, 0.1) !important;
    padding: 1.5rem 3.2rem !important;
  }

  .menu-drawer__utility-links a,
  .menu-drawer__utility-links span,
  .menu-drawer__utility-links button,
  .localization-form__select,
  .disclosure__button {
    font-family: 'Cormorant Garamond', 'Georgia', serif !important;
    color: #666666 !important;
    font-size: 1.3rem !important;
    letter-spacing: 0.08em !important;
    opacity: 0.8 !important;
  }

  .menu-drawer__utility-links svg,
  .menu-drawer__utility-links .icon {
    color: #666666 !important;
    fill: #666666 !important;
  }

  /* Alle anderen Elemente im Drawer: nicht gold überschreiben */
  .menu-drawer div:not(.menu-drawer__menu-item):not(.menu-drawer__close-button),
  .menu-drawer li:not(.menu-drawer__menu-item),
  .menu-drawer span:not(.menu-drawer__menu-item) {
    color: inherit !important;
  }
}



/* ═══════════════════════════════════════════════════
   NEMEAN – Goldene Luxus Pagination Dots
   Für alle Swiper/Slider auf der Seite
   ═══════════════════════════════════════════════════ */

/* CSS-Variablen für Gold-Farben */
:root {
  --nemean-gold: #c9a84c;
  --nemean-gold-light: #e8d5a3;
  --nemean-gold-dark: #8a6d2f;
  --nemean-gold-glow: rgba(201, 168, 76, 0.35);
}

/* Basis-Dot: klein, rund, elegant */
.swiper-pagination-bullet {
  width: 6px !important;
  height: 6px !important;
  background: transparent !important;
  border: 1px solid var(--nemean-gold) !important;
  border-radius: 50% !important;
  opacity: 0.5 !important;
  margin: 0 4px !important;
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  box-shadow: none !important;
}

/* Aktiver Dot: ausgefüllt, leuchtend, minimal größer */
.swiper-pagination-bullet-active {
  background: var(--nemean-gold) !important;
  border-color: var(--nemean-gold) !important;
  opacity: 1 !important;
  width: 7px !important;
  height: 7px !important;
  box-shadow: 0 0 6px var(--nemean-gold-glow) !important;
}

/* Hover-Effekt */
.swiper-pagination-bullet:hover {
  opacity: 0.8 !important;
  background: rgba(201, 168, 76, 0.3) !important;
  border-color: var(--nemean-gold-light) !important;
}

/* Pagination-Container: etwas mehr Abstand nach unten */
.swiper-pagination {
  bottom: 12px !important;
}

/* Slideshow-spezifisch: Dots über dem Bild */
.slideshow .swiper-pagination-bullet {
  border-color: var(--nemean-gold-light) !important;
  opacity: 0.6 !important;
}

.slideshow .swiper-pagination-bullet-active {
  background: var(--nemean-gold) !important;
  border-color: var(--nemean-gold) !important;
  opacity: 1 !important;
  box-shadow: 0 0 8px var(--nemean-gold-glow) !important;
}

/* Produkt-Slider (featured-collection): Dots unter den Karten */
.slider-component-full-width .swiper-pagination,
.slider-component-desktop .swiper-pagination,
.lumin-slider .swiper-pagination {
  position: relative !important;
  bottom: auto !important;
  margin-top: 16px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Nur auf Mobil sichtbar (Desktop hat Pfeile) */
@media screen and (min-width: 750px) {
  .slider-component-full-width .swiper-pagination,
  .slider-component-desktop .swiper-pagination {
    display: none !important;
  }
}



/* ═══════════════════════════════════════════════════
   NEMEAN – Goldene Dots für Shopify Slider
   (slider-counter__link--dots)
   ═══════════════════════════════════════════════════ */

/* Inaktiver Dot: kleiner, goldener Rahmen */
.slider-counter__link--dots .dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  border: 1px solid #c9a84c !important;
  background: transparent !important;
  opacity: 0.5;
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  box-shadow: none !important;
}

/* Aktiver Dot: ausgefüllt, gold, minimaler Glow */
.slider-counter__link--active.slider-counter__link--dots .dot {
  background-color: #c9a84c !important;
  border-color: #c9a84c !important;
  opacity: 1 !important;
  width: 7px !important;
  height: 7px !important;
  box-shadow: 0 0 6px rgba(201, 168, 76, 0.35) !important;
}

/* Hover */
.slider-counter__link--dots:hover .dot {
  opacity: 0.8 !important;
  background: rgba(201, 168, 76, 0.25) !important;
  border-color: #e8d5a3 !important;
}

/* Button-Reset: kein weißer Hintergrund */
.slider-counter__link {
  background: transparent !important;
  border: none !important;
  padding: 8px !important;
}

/* Dots-Container zentriert */
.slider-counter--dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
}

/* Slideshow-Dots (Hero) */
.slideshow__control-wrapper .slider-counter__link--dots .dot {
  border-color: rgba(201, 168, 76, 0.7) !important;
}

.slideshow__control-wrapper .slider-counter__link--active.slider-counter__link--dots .dot {
  background-color: #c9a84c !important;
  border-color: #c9a84c !important;
  box-shadow: 0 0 8px rgba(201, 168, 76, 0.4) !important;
}



/* ============================================
   HERO TOP GRADIENT - Logo Sichtbarkeit
   Permanenter dunkler Gradient oben auf dem
   Hero-Bild, damit das goldene NEMEAN-Logo
   im transparenten Header immer sichtbar ist.
   ============================================ */
.slideshow__slide {
  position: relative;
}

.slideshow__slide::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 35%;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0.3) 45%,
    rgba(0, 0, 0, 0) 100%
  );
  z-index: 2;
  pointer-events: none;
}

/* Seitliche Vignette fuer extra Premium-Feeling */
.slideshow__slide::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0) 50%,
    rgba(0, 0, 0, 0.25) 100%
  );
  z-index: 1;
  pointer-events: none;
}


/* ============================================
   Header Scroll Animation Fix
   Beim Runterscrollen verschwindet der Header,
   beim Hochscrollen erscheint er wieder.
   ============================================ */
.header-wrapper {
  transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.shopify-section-header-hidden .header-wrapper {
  transform: translateY(-100%) !important;
}

.shopify-section-header-sticky:not(.shopify-section-header-hidden) .header-wrapper {
  transform: translateY(0) !important;
}


/* ===== Laborbericht-Links in Gold ===== */
.product__accordion .accordion__content .rte a {
  color: #C8A45D !important;
  text-decoration: underline;
  text-decoration-color: rgba(200, 164, 93, 0.5);
  text-underline-offset: 3px;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: all 0.3s ease;
}

.product__accordion .accordion__content .rte a:hover {
  color: #D4AF37 !important;
  text-decoration-color: #D4AF37;
}