/** Shopify CDN: Minification failed

Line 327:60 Expected "}" to go with "{"

**/
/* ——— Etheryx: Rundungen entfernen, Slideshow nicht stören ——— */

/* 1) Nur die Bilder selbst glatt ziehen */
.hero-banner__media img,
.image-banner__media img,
.slideshow__slide img,
.slideshow__media img,
[class*="hero"] img,
[class*="banner"] img {
  border-radius: 0 !important;
  clip-path: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* 2) Falls der Container selbst einen Radius setzt, nur Radius neutralisieren */
.hero-banner,
.image-banner,
.slideshow,
.hero,
.banner {
  border-radius: 0 !important;
}

/* 3) Sicherstellen, dass Slideshow-Bilder wirklich gerendert werden */
.slideshow__slide picture,
.slideshow__slide img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* 4) Utility-Klassen, die Radius vergeben, entschärfen – ohne Overflow zu ändern */
[class*="radius"],
[class*="rounded"],
[class*="br-"] {
  border-radius: 0 !important;
}
/* === Custom Font: Bodoni 72 Smallcaps Book === */
@font-face {
  font-family: "Bodoni72Smallcaps";
  src: url("/cdn/shop/files/Bodoni_72_Smallcaps_Book.woff2?v=1760464986")
       format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* === Hero Banner Styling (Etheryx) === */
.hero-banner .content *,
.hero-banner__content *,
.slideshow__slide .content *,
.slideshow__content *,
[id^="shopify-section-"][id*="hero"] .content *,
[id^="shopify-section-"][id*="hero"] .text,
[id^="shopify-section-"][id*="hero"] .heading,
[id^="shopify-section-"][id*="hero"] h1,
[id^="shopify-section-"][id*="hero"] h2,
[id^="shopify-section-"][id*="hero"] h3 {
  font-family: "Bodoni72Smallcaps", serif !important;
  color: #ffffff !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
}

/* === Schriftgröße & Zeilenhöhe (38px Desktop / 22px Mobile) === */
.hero-banner h1,
.hero-banner [class*="heading"],
.slideshow__slide h1,
.slideshow__slide [class*="heading"] {
  font-size: clamp(22px, 4.5vw, 38px) !important;
  line-height: 1.1 !important;
}

/* === Untertitel / Subheading etwas kleiner === */
.hero-banner .subheading,
.slideshow__slide .subheading {
  font-size: clamp(16px, 2.5vw, 22px) !important;
  line-height: 1.3 !important;
  opacity: 0.95 !important;
}

/* === Buttons anpassen === */
.hero-banner .button,
.hero-banner [class*="btn"],
.slideshow__slide .button,
.slideshow__slide [class*="btn"],
[id^="shopify-section-"][id*="hero"] .button,
[id^="shopify-section-"][id*="hero"] [class*="btn"] {
  font-family: "Bodoni72Smallcaps", serif !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
}

/* === Button-Hover-Effekt === */
.hero-banner .button:hover,
.slideshow__slide .button:hover,
[id^="shopify-section-"][id*="hero"] .button:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}
/* === Hero-Text mittig zentrieren (horizontal + vertikal) === */
.hero-banner .hero-title,
.slideshow__slide .hero-title {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  text-align: center !important;
  width: 100%;
  max-width: 90%; /* verhindert, dass Text an den Rand stößt */
  z-index: 5;
}
/* ===== HERO CTA: reiner Text (Bodoni, weiß), MIT Unterstrich, OHNE Kasten, zentriert ===== */

/* Der Hero dient als Bezugspunkt */
.hero-banner { position: relative !important; }

/* 1) Exakt den CTA im Hero treffen (alle typischen Varianten) */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
  /* alles Theme-Styling abschalten */
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  border-radius: 0 !important;
  filter: none !important;
  opacity: 1 !important;
  clip-path: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;

  /* Typo wie gewünscht */
  font-family: "Bodoni72Smallcaps", serif !important;
  font-weight: 400 !important;
  color: #ffffff !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
  line-height: 1.2 !important;
  font-size: clamp(16px, 2.6vw, 20px) !important;

  /* Layout als Text-Link */
  display: inline-block !important;
  padding: 0 !important;
  text-decoration: none !important;
  text-align: center !important;
  cursor: pointer !important;

  /* Position: mittig unter der Headline */
  position: absolute !important;
  left: 50% !important;
  top: calc(50% + 100px) !important; /* Abstand zum Titel – bei Bedarf 80–120px */
  transform: translateX(-50%) !important;
  z-index: 6 !important;
}

/* 2) Pseudo-Flächen des Themes rigoros abschalten */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button)::before,
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 3) Unterstrich sicher erzwingen (2 Wege kombiniert) */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
  text-decoration-line: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 6px !important;

  /* Fallback gegen aggressive Themes: „gemalter“ Strich */
  background-image: linear-gradient(currentColor, currentColor) !important;
  background-size: 100% 1px !important;
  background-position: 0 100% !important;
  background-repeat: no-repeat !important;
}

/* 4) Keine Hover-Transparenz, kein Kasten */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button):hover {
  opacity: 1 !important;
  background: transparent !important;
  color: #ffffff !important;
}

/* 5) Mobile: etwas näher an den Titel */
@media (max-width: 768px) {
  [id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
    top: calc(50% + 80px) !important;
  }
}
/* === Feinanpassung: Button weiter unten positionieren === */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
  top: calc(50% + 140px) !important; /* ↑ Abstand: von 100px auf 140px erhöht */
}

/* Optional: auf Mobile etwas näher rücken */
@media (max-width: 768px) {
  [id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
    top: calc(50% + 130px) !important;
  }
}
/* === FINALER OUT NOW BUTTON – 5px höher, feiner Strich, clean === */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
  all: unset !important;
  font-family: "Bodoni72Smallcaps", serif !important;
  font-size: clamp(12px, 1.6vw, 13.5px) !important;
  font-weight: 400 !important;
  color: #ffffff !important;
  letter-spacing: 0.05em !important;
  line-height: 1.1 !important;
  text-transform: none !important;

  position: absolute !important;
  top: calc(50% + 98px) !important; /* minimal höher (vorher 103px) */
  left: 50% !important;
  transform: translateX(-50%) !important;
  text-align: center !important;

  background: none !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  padding: 0 !important;
  display: inline-block !important;

  /* ultrafeiner Unterstrich */
  background-image: linear-gradient(currentColor, currentColor) !important;
  background-size: 100% 0.5px !important;
  background-position: 0 100% !important;
  background-repeat: no-repeat !important;
  padding-bottom: 3px !important;
}

/* doppelte Linien/Pseudo-Elemente entfernen */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button)::before,
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button)::after {
  content: none !important;
  display: none !important;
}

/* Hover – dezente Transparenz */
[id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button):hover {
  opacity: 0.9 !important;
}

/* Mobile leicht tiefer, für visuelles Gleichgewicht */
@media (max-width: 768px) {
  [id^="shopify-section-"][id*="hero"] :is(a.button, button.button, .button, [class*="btn"], .buttons a, .buttons button) {
    top: calc(50% + 150px) !important;
  }
}
/* === FINAL: Hero-Title leicht nach unten (The Body Electric) === */
:root { --hero-title-shift: 90px; } /* Zahl größer = weiter nach unten */

[id^="shopify-section-"][id*="hero"] .texts .content.rte {
  transform: translateY(var(--hero-title-shift)) !important;
  margin-top: var(--hero-title-shift) !important;
}
/* === Helvetica Neue Custom einbinden === */
@font-face {
  font-family: "HelveticaNeueCustom";
  src: url("https://cdn.shopify.com/...HelveticaNeue-01.woff2...");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* === Produktseite: Titel-Schrift auf Helvetica setzen === */
body.template-product h1.h5.title,
body.template-product .title.noMargin h1,
body.template-product h1.title,
body.template-product .product__title h1,
body.template-product [class*="product"] h1.title {
  font-family: "HelveticaNeueCustom", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 400 !important; /* Wenn du eine Bold-Datei nutzt → 700 */
  color: #000 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Optional – Abstände justieren */
body.template-product .title.noMargin { 
  margin-top: 0 !important; 
  margin-bottom: 10px !important; 
  /* === Produkt-Titel in Großbuchstaben (nur Produktseite) === */
body.template-product h1.h5.title,
body.template-product .title.noMargin h1,
body.template-product h1.title,
body.template-product .product__title h1,
body.template-product [class*="product"] h1.title {
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important; /* leicht mehr Abstand zwischen Buchstaben */
  font-size: clamp(16px, 2vw, 20px) !important; /* responsive Größe */
  font-weight: 500 !important; /* mittlere Stärke */
}
/* === Mini-Image-Swatches === */
.mm-swatches{display:flex;flex-wrap:wrap;gap:8px;margin:.25rem 0 0;}
.mm-swatch{
  width:36px;height:36px;border-radius:9999px;
  background-size:cover;background-position:center;
  border:1px solid #ddd; cursor:pointer; display:inline-block;
}
.mm-swatch:is(:hover,.is-active){ outline:2px solid #000; outline-offset:2px; }
.mm-swatches + [aria-label="Color"], /* falls Textlabel danach kommt */ 
.mm-swatches + .form__label { display:none; }
/* === Mini-Image-Swatches === */
.mm-swatches{display:flex;flex-wrap:wrap;gap:8px;margin:.5rem 0;}
.mm-swatch{
  width:36px;height:36px;border-radius:9999px;
  background-size:cover;background-position:center;
  border:1px solid #ddd;cursor:pointer;display:inline-block;
}
.mm-swatch:is(:hover,.is-active){ outline:2px solid #000; outline-offset:1px; }
.mm-swatches + [aria-label="Color"], /* falls Label daneben steht */ 
.mm-swatches + .form__label { display:none; } /* optional */