/* ============================================
   bevain.de — Dark Mode Override (v7)
   ============================================ */

/* ── Hintergrund & Text ── */
body { background-color: #1a1814 !important; color: #e8e0d0 !important; margin-top: 88px !important; }
section { background-color: #1a1814 !important; }

/* ── Schrift Domaine Display ── */
@font-face { font-family:'DomaineDisplay'; src:url('https://cdn.shopify.com/s/files/1/0624/6243/0689/files/TestDomaineDisplay-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'DomaineDisplay'; src:url('https://cdn.shopify.com/s/files/1/0624/6243/0689/files/TestDomaineDisplay-RegularItalic.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:'DomaineDisplay'; src:url('https://cdn.shopify.com/s/files/1/0624/6243/0689/files/TestDomaineDisplay-Bold.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
body, p, h1, h2, h3, h4, h5, h6, a, span, div, li, button {
  font-family:'DomaineDisplay','Cormorant Garamond',Georgia,serif !important;
  color:#e8e0d0 !important;
}

/* ── Reviews dunkel ── */
.review { background-color:#1e1c18 !important; border:1px solid #2a2a2a !important; box-shadow:none !important; color:#e8e0d0 !important; }
.review h3, .review p, .review div { color:#e8e0d0 !important; }
#reviews { background-color:#1a1814 !important; }

/* ── Sektionen dunkel ── */
#ring-videos, #trust-badges, #Profil, #Referenzen, #Instagram { background-color:#1a1814 !important; }
#ring-videos video { background-color:#1a1814 !important; }
#Kontakt { background-color:#1a1814 !important; border-bottom:1px solid #2a2a2a !important; }

/* ── Footer ── */
footer { background-color:#111 !important; color:#e8e0d0 !important; }
footer ul li, footer a, footer p { color:#e8e0d0 !important; }

/* ── Links / Insta / Nav / Hero ── */
p a { color:#c9a96e !important; border-bottom:1px solid #c9a96e !important; }
.insta-item { box-shadow:none !important; border:1px solid #2a2a2a !important; }
nav { background-color:#1a1814 !important; }
#trust-badges img { filter:brightness(0.9); }
.cover-bg { background-color:#0a0a0a !important; }

/* ============================================
   FIXES
   ============================================ */

/* ── 1. BINDESTRICHE / Silbentrennung AUS (alle Texte) ── */
body, p, li, a, span, div,
h1, h2, h3, h4, h5, h6,
[class*="type-typ"] {
  -webkit-hyphens: none !important;
  -moz-hyphens: none !important;
  -ms-hyphens: none !important;
  hyphens: none !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* ── 2. Logo: Größe (Farbe kommt aus der Bilddatei) ── */
img[src*="BEVAIN_LOGO"],
a img[src*="BEVAIN_LOGO"],
nav a img[src*="BEVAIN_LOGO"] {
  max-height: 42px !important;
  width: auto !important;
}

/* ── 3. Video nicht hinter Nav ── */
#ring-videos { padding-top: 100px !important; }
section { scroll-margin-top: 88px !important; }

/* ── 4. Buttons golden ── */
.btn, .btn-pri, .btn-ghost-black, button, a.btn, input[type="submit"] {
  background-color:#c9a96e !important; color:#1a1814 !important; border:none !important;
}
.btn:hover, .btn-pri:hover, .btn-ghost-black:hover, button:hover { background-color:#e8d5b0 !important; color:#1a1814 !important; }

/* CTA-Buttons (#Kontakt) zentriert mit Abstand */
#Kontakt .pad-b-60 > a { margin: 0 8px 16px 8px !important; display:inline-block !important; float:none !important; }

/* ── 5. ZENTRIERUNG (Texte + Blöcke mittig) ── */
section, #Profil, #Referenzen, #Kontakt, #reviews, #trust-badges, #Instagram, #ring-videos,
#hero-text-section { text-align:center !important; }
h1, h2, h3, h4, h5, h6, p, li, span, .review, .review h3, .review p { text-align:center !important; }
#hero-text-section p, #Kontakt p, #Referenzen p, #Instagram p, #Profil p {
  margin-left:auto !important; margin-right:auto !important;
}
#Kontakt .col-lg-6, #Referenzen .col-lg-5, #Instagram .col-lg-6 {
  float:none !important; margin-left:auto !important; margin-right:auto !important;
}

/* ── 5b. HERO-Button zentrieren ── */
#hero-text-section .btn,
#hero-text-section a.btn,
#hero-text-section a {
  display:inline-block !important;
  float:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ── 6. FOOTER gleichmäßig mittig ── */
footer { text-align:center !important; }
footer ul { padding:36px 5% !important; margin:0 auto !important; width:100% !important; list-style:none !important; }
footer ul li { float:none !important; display:block !important; width:100% !important; text-align:center !important; list-style:none !important; margin:0 auto 18px auto !important; }
footer ul li:last-child { margin-bottom:0 !important; }
footer a, footer p, footer div, footer span { text-align:center !important; }

/* ── 7. STERNE golden (ID-Spezifität + sauber kodierter SVG) ── */
#reviews ul.rating,
#reviews .rating {
  display:flex !important; justify-content:center !important; gap:6px !important;
  padding:0 !important; margin:0 auto 8px auto !important; list-style:none !important;
}
#reviews ul.rating li.item,
#reviews ul.rating li.item.full,
#reviews .rating .item {
  width:22px !important; height:22px !important;
  float:none !important; margin:0 !important; padding:0 !important;
  display:inline-block !important;
  text-indent:-9999px !important; overflow:hidden !important;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23c9a96e'%20d='M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:contain !important;
}
#reviews ul.rating li.item::before,
#reviews .rating .item::before { content:"" !important; display:none !important; }

/* ── 8. Reviews + Instagram: 4 Boxen in EINER Reihe (Desktop) ── */
@media (min-width: 992px) {
  #reviews .review {
    flex: 0 0 24% !important;
    width: 24% !important;
    max-width: 24% !important;
    margin-left: 0.5% !important;
    margin-right: 0.5% !important;
    box-sizing: border-box !important;
  }
  #Instagram .insta-item {
    flex: 0 0 24% !important;
    width: 24% !important;
    max-width: 24% !important;
    margin-left: 0.5% !important;
    margin-right: 0.5% !important;
    box-sizing: border-box !important;
  }
}