/* Lato lokal ausgeliefert (SIL OFL, Fonts/Lato/OFL.txt): ohne die Webschrift
   faellt der Stack auf Arial/Liberation zurueck, und Gewicht 100 wird plump.
   Gewicht 100 zeigt bewusst den Light-Schnitt: Hairline war zu duenn. */
@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-300-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 100;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-300-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 100;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-300-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-300-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-400-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-400-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-700-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../Fonts/Lato/lato-latin-700-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}

/* ==========================================
   NAVBAR & DROPDOWNS
   ========================================== */

.navbar {
  position: relative;
  z-index: 1030;
  overflow: visible;
}

.navbar .container {
  position: relative;
  z-index: 1031;
  overflow: visible;
}

.navbar .dropdown,
.navbar .dropdown-menu {
  z-index: 1032;
}

.navbar .dropdown-menu {
  position: absolute;
}
.fancy-dropdown-divider {
    width: 100%;
    height: 1px;
    margin: 0.75rem 0;
    background: rgba(255, 255, 255, 0.25);
}
/* ==========================================
   BASE & TYPOGRAPHY
   ========================================== */

section {
  padding-block: 2rem;
}

@media (min-width: 992px) {
  section {
    padding-block: 4rem;
  }
}

.blockquote-content > p {
  margin-bottom: 0;
}



/* ==========================================
   SPLIT MEDIA LAYOUT
   ========================================== */

.split-media-sticky,
.split-media-image,
.split-media-video {
  width: 100%;
}

.split-media-image,
.split-media-video {
  height: auto;
  display: block;
}

@media (min-width: 992px) {
  .shop-item.split-media-sticky.sticky-top {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    z-index: auto;
  }

  .split-media-image,
  .split-media-video,
  .split-media-slider,
  .split-media-slider .swiper-wrapper,
  .split-media-slider .swiper-slide {
    height: 100vh;
  }

  .split-media-image,
  .split-media-slider .split-media-image {
    object-fit: cover;
  }

  .split-media-video {
    object-fit: contain;
    background: #000;
  }
}

.split-page-before,
.split-page-before .frame,
.split-page-before .frame-container,
.split-page-before .hero-25 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.split-page-before,
.split-page-before .frame {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.split-page-before .frame-space-before-extra-small,
.split-page-before .frame-space-before-small,
.split-page-before .frame-space-before-medium,
.split-page-before .frame-space-before-large,
.split-page-before .frame-space-before-extra-large {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.split-page-before .frame-space-after-extra-small,
.split-page-before .frame-space-after-small,
.split-page-before .frame-space-after-medium,
.split-page-before .frame-space-after-large,
.split-page-before .frame-space-after-extra-large {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* ==========================================
   CTA & PARALLAX SECTIONS
   ========================================== */

.bg-holder .ce-bg-holder-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
}

.ce-cta-half-vh {
  min-height: 55vh;
}

.ce-cta-overlay {
  z-index: 1;
}

.ce-cta-content {
  z-index: 2;
}

.ce-overlay-25 {
  background-color: rgba(0, 0, 0, 0.25);
}

.ce-overlay-40 {
  background-color: rgba(0, 0, 0, 0.4);
}

.ce-overlay-50 {
  background-color: rgba(0, 0, 0, 0.5);
}

.ce-overlay-60 {
  background-color: rgba(0, 0, 0, 0.6);
}

.ce-overlay-75 {
  background-color: rgba(0, 0, 0, 0.75);
}

.ce-parallax-cta {
  position: relative;
  overflow: hidden;
}

.ce-parallax-cta .bg-holder {
  position: absolute;
  top: -25%;
  /* Rellax schiebt das Bild beim Scrollen bis ca. 0,3 × Viewport-Höhe nach oben,
     unten daher mehr Überstand – sonst entsteht ein weißer Streifen über dem Folgeelement */
  bottom: calc(-25% - 35vh);
  left: 0;
  width: 100%;
  height: auto;
  z-index: 0;
  overflow: hidden;
}

.ce-parallax-cta .ce-bg-holder-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.ce-logo-img {
  display: block;
  width: 70vw;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* ==========================================
   THEME CARDS & SLIDERS
   ========================================== */

.theme-card-hover {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.theme-card-hover:hover {
  transform: translateY(-0.5rem);
  box-shadow: var(--sparrow-box-shadow) !important;
}

.theme-card-overlay-img {
  bottom: 50%;
  height: 16rem;
  width: auto;
  max-width: 70%;
  object-fit: contain;
}

@media (min-width: 992px) {
  .theme-card-overlay-img {
    bottom: 25%;
    height: 18rem;
    max-width: 75%;
  }
}

.theme-slider-outer {
  position: relative;
}

.theme-slider-outer .theme-slider {
  overflow: visible;
}

.theme-slider-outer .theme-slider.swiper-initialized .swiper-slide {
  visibility: hidden;
  opacity: 0;
}

.theme-slider-outer .theme-slider.swiper-initialized .swiper-slide-visible {
  visibility: visible;
  opacity: 1;
}

.theme-slider-outer .theme-slider .swiper-nav {
  margin-top: 0;
}

.theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev,
.theme-slider-outer .theme-slider .swiper-nav .swiper-button-next {
  opacity: 0.5;
  z-index: 30;
  width: 46px;
  height: 46px;
  border: 0;
  border-radius: 50%;
  background-color: rgba(var(--sparrow-white-rgb), 0.8);
  color: var(--sparrow-gray-400);
  box-shadow: 0.125rem 0.125rem 0.25rem rgba(var(--sparrow-black-rgb), 0.1);
  transition: opacity 0.4s ease-in-out, color 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev:hover,
.theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev:focus,
.theme-slider-outer .theme-slider .swiper-nav .swiper-button-next:hover,
.theme-slider-outer .theme-slider .swiper-nav .swiper-button-next:focus {
  opacity: 1;
  color: var(--sparrow-body-color);
  background-color: var(--sparrow-white);
}

.theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev {
  left: -58px;
}

.theme-slider-outer .theme-slider .swiper-nav .swiper-button-next {
  right: -58px;
}

.theme-slider-outer .theme-slider .swiper-button-prev::after,
.theme-slider-outer .theme-slider .swiper-button-next::after {
  display: none;
  content: "";
}

.theme-slider-outer .theme-slider .swiper-button-prev .nav-icon,
.theme-slider-outer .theme-slider .swiper-button-next .nav-icon {
  width: 0.65rem;
  height: 0.65rem;
  font-size: 0.65rem;
  line-height: 1;
  pointer-events: none;
}

.theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev:focus-visible,
.theme-slider-outer .theme-slider .swiper-nav .swiper-button-next:focus-visible {
  outline: 2px solid var(--sparrow-gray-400);
  outline-offset: 3px;
}

@media (max-width: 1199.98px) {
  .theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev {
    left: -32px;
  }

  .theme-slider-outer .theme-slider .swiper-nav .swiper-button-next {
    right: -32px;
  }
}

@media (max-width: 767.98px) {
  .theme-slider-outer .theme-slider .swiper-nav .swiper-button-prev {
    left: 8px;
  }

  .theme-slider-outer .theme-slider .swiper-nav .swiper-button-next {
    right: 8px;
  }
}
.theme-card-image {
    overflow: hidden;
}

.theme-card-image img {
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
    transform: scale(1);
}

.theme-card-hover:hover .theme-card-image img {
    transform: scale(1.08);
}


/* ==========================================
   PRODUCTS & CARDS
   ========================================== */

.product-image-container {
  position: relative;
  display: inline-block;
  max-width: 100%;
}

.product-image-container .cover-image {
  display: block;
  max-width: 100%;
  height: auto;
}

.product-award-image {
  width: 150px;
  height: 150px;
}

.product-price-box-name-single {
  text-transform: uppercase;
  font-size: 24px;
  font-weight: 700;
}

.product-property {
  padding: 0.75rem 0;
  border-bottom: 1px solid #ccc;
}

/* Weitere Produktbilder: zentriert, gleichmaessige Abstaende */
.product-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1.5rem;
}

.product-gallery .spotlight {
  flex: 0 1 calc(50% - 0.5rem);
  min-width: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 575.98px) {
  .product-gallery .spotlight {
    flex: 0 1 100%;
  }
}

/* News Cards */
.news-list-view .owl-stage {
  display: flex;
}

.news-list-view .owl-item {
  display: flex;
  height: auto;
}

.news-list-view .owl-item > .item {
  display: flex;
  width: 100%;
}

.news-list-view .owl-item .news-card {
  width: 100%;
  height: 100%;
}

.news-card__image,
.news-card__image img {
  object-fit: cover;
}

.news-card__image img {
  width: 100%;
  height: 100%;
}

/* ==========================================
   BUTTONS & FORMS
   ========================================== */

button.btn.add-btn-cart,
input.btn.add-btn-cart {
  color: #000;
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 0;
  min-height: 48px;
  height: 100%;
}

button.btn.add-btn-cart:hover,
button.btn.add-btn-cart:focus,
button.btn.add-btn-cart:focus-visible,
button.btn.add-btn-cart:active,
button.btn.add-btn-cart:not(:disabled):not(.disabled):active,
input.btn.add-btn-cart:hover,
input.btn.add-btn-cart:focus,
input.btn.add-btn-cart:focus-visible,
input.btn.add-btn-cart:active,
input.btn.add-btn-cart:not(:disabled):not(.disabled):active {
  color: #fff;
  background-color: #000;
  border-color: #000;
  text-decoration: none;
}

button.btn.add-btn-cart:focus,
button.btn.add-btn-cart:focus-visible,
input.btn.add-btn-cart:focus,
input.btn.add-btn-cart:focus-visible {
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.2);
}

.add-to-cart-group .product-detail-quantity-input {
  width: 120px;
  min-height: 48px;
  height: 100%;
  border-radius: 0;
}

/* ==========================================
   FIXED ELEMENTS & OVERLAYS
   z-index nach Bootstrap-Skala (1040-1050)
   ========================================== */

/* Mini-Warenkorb: siehe Block „MINI-WARENKORB WIE BISHER“ */

#consentManagerBtn {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 1040;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 30px;
  height: 30px;
  padding: 0 6px;
  color: #fff;
  background-color: #000;
  border: 0;
  border-radius: 0;
  font-family: var(--font-family, inherit);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  overflow: hidden;
  appearance: none;
  -webkit-appearance: none;
  transition: background-color 0.2s ease;
}

#consentManagerBtn svg {
  display: block;
  width: 18px;
  height: 16px;
  min-width: 18px;
  flex-shrink: 0;
  color: currentColor;
}

#consentManagerBtn .addText {
  display: inline-block;
  max-width: 0;
  margin-left: 0;
  color: currentColor;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  overflow: hidden;
  transition: max-width 0.5s ease, margin-left 0.5s ease, opacity 0.2s ease;
}

#consentManagerBtn:hover .addText,
#consentManagerBtn:focus-visible .addText {
  max-width: 100px;
  margin-left: 6px;
  opacity: 1;
}

#consentManagerBtn:hover {
  background-color: #333;
}

#consentManagerBtn:focus-visible {
  outline: 2px solid var(--bs-primary, #fff);
  outline-offset: 3px;
}

#consentManagerBtn:active {
  transform: translateY(1px);
}

@media (prefers-reduced-motion: reduce) {
  #consentManagerBtn,
  #consentManagerBtn .addText {
    transition: none;
  }
}

/* ==========================================
   UTILITIES
   ========================================== */

.ddbw-cursor-pointer,
.ddbw-cursor-pointer * {
  cursor: pointer !important;
}


/* ==========================================
   PRODUKTLISTE – 2 Karten pro Reihe
   ========================================== */

.container.product-overview-container {
  width: calc(100% - 2rem);
  max-width: 1600px !important;
}

.product-overview-card {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.product-overview-card:hover {
  transform: translateY(-0.25rem);
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12) !important;
}

.product-overview-media {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 320px;
}

.product-overview-image-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
}

.product-overview-image {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.product-awards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.product-awards .product-award-image {
  display: block;
  width: 64px;
  height: auto;
  object-fit: contain;
}

.product-overview-price {
  margin-bottom: 0.25rem;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  line-height: 1.2;
}

@media (min-width: 1200px) {
  .product-overview-media {
    height: 100%;
    min-height: 380px;
  }

  .product-awards .product-award-image {
    width: 150px;
  }
}

/* ==========================================
   GLOBAL TYPOGRAPHY OVERRIDE
   ========================================== */

:root {
  --sparrow-body-font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html,
body {
  font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .h1,
body .h2,
body .h3,
body .h4,
body .h5,
body .h6 {
    font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 100 !important;
    text-transform: uppercase !important;
}


a {
    color: #666666;
    transition: color 0.2s ease;
}

a:hover,
a:focus {
    color: #c8ba00;
}

.form-actions .form-navigation .btn-primary {
  color: #fff;
  background: #000;
  border-color: #000;
  transition: all 0.2s ease;
}

.form-actions .form-navigation .btn-primary:hover,
.form-actions .form-navigation .btn-primary:focus,
.form-actions .form-navigation .btn-primary:active {
  color: #000;
  background: #fff;
  border-color: #000;
}

/* ==========================================
   HERO 25 / SPARROW STYLE
   ========================================== */

.hero-25 {
    position: relative;

    height: 25vh;
    min-height: 250px;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}


/* ==========================================
   BACKGROUND IMAGE
   ========================================== */

.hero-25__image {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100% !important;

    object-fit: cover;
    object-position: center;

    z-index: 0;
}


/* leichtes Overlay */

.hero-25::after {
    content: "";

    position: absolute;
    inset: 0;

    background: rgba(0, 0, 0, 0.22);

    z-index: 0;

    pointer-events: none;
}


/* ==========================================
   CONTAINER
   ========================================== */

.hero-25 > .container-fluid {
    position: relative;
    z-index: 1;

    width: 100%;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


.hero-25 .row {
    height: 100%;
    min-height: 0;

    margin: 0 !important;
}


/* ==========================================
   TEXT LAYER
   Inhalt sitzt unten im Bild
   ========================================== */

.hero-25 .hero-text-layer {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-end;

    height: 100%;
    min-height: 0;

    padding: 0 0 1rem;

    color: #fff;

    text-shadow: 1px 1px 1px #000;
}


/* ==========================================
   INNER CONTENT
   ungefähr Bootstrap Containerbreite
   ========================================== */

.hero-25 .hero-inline {
    position: relative;

    display: grid;
    align-items: end;

    width: calc(100% - 3rem);
    max-width: 1320px;

    margin-left: auto;
    margin-right: auto;
}


/* Shadow Font und Copy liegen übereinander */

.hero-25 .hero-shadow-wrap,
.hero-25 .hero-copy-wrap {
    grid-column: 1;
    grid-row: 1;

    width: 100%;

    overflow: visible;
}


/* ==========================================
   SHADOW FONT
   ========================================== */

.hero-25 .hero-shadow-wrap {
    position: relative;
    z-index: 1;

    padding-top: 0.18em;
}


.hero-25 .shadow-font {
    position: relative;

    display: block;

    margin: 0;
    padding: 0;

    color: rgba(255, 255, 255, 0.30);

    font-family:
        Lato,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        "Helvetica Neue",
        Arial,
        sans-serif;

    font-size: clamp(6rem, 14vw, 13rem);
    font-weight: 300;

    /*
     * genug Platz für Ä / Ö / Ü
     */
    line-height: 1;

    letter-spacing: 0.02em;

    text-align: left;
    text-transform: uppercase;

    white-space: nowrap;

    text-shadow: none;

    pointer-events: none;
    user-select: none;
}


/* ==========================================
   NORMALER TEXT ÜBER SHADOW FONT
   ========================================== */

.hero-25 .hero-copy-wrap {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-end;

    padding-bottom: 0.4rem;
}


.hero-25 .hero-copy {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 900px;

    margin: 0;

    padding: 0.85rem 1rem;

    color: #fff;

    font-size: clamp(1rem, 1.2vw, 1.2rem);
    line-height: 1.45;

    text-align: left;

    text-shadow: 1px 1px 1px #000;

    isolation: isolate;
}


/* ==========================================
   WEICHER WASSERZEICHEN / BLUR HINTER TEXT
   ========================================== */

.hero-25 .hero-copy::before {
    content: "";

    position: absolute;

    inset: -0.2rem -0.35rem;

    z-index: -1;

    background: rgba(255, 255, 255, 0.07);

    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);

    border-radius: 1rem;

    pointer-events: none;
}


/* ==========================================
   RTE
   ========================================== */

.hero-25 .hero-copy p {
    margin-top: 0;
    margin-bottom: 0.75rem;
}


.hero-25 .hero-copy p:last-child {
    margin-bottom: 0;
}


/* ==========================================
   TABLET
   ========================================== */

@media (max-width: 1199.98px) {

    .hero-25 .hero-inline {
        width: calc(100% - 3rem);
        max-width: 960px;
    }

    .hero-25 .shadow-font {
        font-size: clamp(5rem, 13vw, 9rem);
    }

    .hero-25 .hero-copy {
        max-width: 600px;
    }
}


/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 767.98px) {

    .hero-25 {
        height: auto;
        min-height: 300px;
    }

    .hero-25 .hero-text-layer {
        min-height: 300px;

        padding-bottom: 1rem;
    }

    .hero-25 .hero-inline {
        width: calc(100% - 2rem);
        max-width: none;
    }

    .hero-25 .shadow-font {
        font-size: clamp(4rem, 18vw, 6.5rem);
        line-height: 1;

        white-space: nowrap;
    }

    .hero-25 .hero-copy-wrap {
        padding-bottom: 0.75rem;
    }

    .hero-25 .hero-copy {
        width: 100%;
        max-width: 100%;

        margin: 0;

        padding: 0.75rem 0.85rem;

        font-size: 1rem;
        line-height: 1.4;
    }

    .hero-25 .hero-copy::before {
        inset: -0.1rem -0.2rem;

        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);

        border-radius: 0.75rem;
    }
}

.product-top-star {
    border: 2px solid #000;
    padding: 0.2rem 0.2rem;
    color: #000;
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
}

.product-top-star::before {
    content: "★";
    margin-right: 0.35rem;
    font-size: 1.25rem;
    line-height: 1;
}

@media (max-width: 991.98px) {
    .fancynavbar-togglerbar {
        position: relative;
    }

    /* Logo links wie bisher; rechts Login, Warenkorb, Menü */
    .fancynavbar-brand {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        margin: 0;
    }

    .fancynavbar-toggler {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
    }
}

/* ==========================================
   AN DIE LIVE-SEITE ANGEGLICHEN
   Werte aus dem bisherigen bootstrap_schuermer
   ========================================== */

b,
strong {
    font-weight: 600;
}

body p a {
    color: #828181;
    text-decoration: underline;
}

body p a:hover {
    color: #c8ba00;
}

::selection {
    color: #fff;
    background-color: #c8ba00;
}

.btn {
    letter-spacing: inherit;
    font-weight: 400;
    font-size: 0.8em;
}

/* Navigation in Versalien, regulärer Schnitt wie auf der alten Seite
   (dort lief die Systemschrift, Light wirkte daneben zu dünn) */

.fancynavbar-collapse {
    opacity: 0.8;
}

.fancynav-link-content {
    font-weight: 400;
    text-transform: uppercase;
}

.fancy-dropdown-item {
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #fff !important;
}

.fancy-dropdown-item:hover,
.fancynav-item:hover .fancynav-link-content,
.fancynav-item:focus .fancynav-link-content {
    color: #6f6f6f !important;
}

/* Bootstrap-4-Klassen aus den übernommenen Templates */

.fs--1 {
    font-size: 0.75rem;
}

.ls {
    letter-spacing: 0.04em;
}

.font-weight-bold {
    font-weight: 700 !important;
}

/* Karten */

.card .card-body.py-4 {
    padding: 2rem 6rem 3rem 2rem !important;
}

.card .card-title {
    margin-bottom: 0.5rem;
    color: #000;
}

div.card .card-title {
    font-size: 1.5rem;
}

article.card .card-title {
    font-size: 1.333rem;
}

div.card .card-subtitle {
    margin-bottom: 0.9rem !important;
    color: #000 !important;
    font-weight: 400 !important;
}

/* Parallax-Teaser: Überschrift so groß wie bisher */

.ce-cta-half-vh h2.fs-5 {
    margin-bottom: 0.5rem !important;
    font-size: 4.199rem;
}

/* Inhaltsbreite und Abstände wie bisher */

@media (min-width: 1280px) {
    .container {
        max-width: 1220px;
    }
}

@media (min-width: 768px) {
    section:has(> .container > .theme-slider-outer) {
        padding-top: 5rem !important;
        padding-bottom: 5rem !important;
    }
}

/* Footer: Social-Icons so klein wie bisher */

.nav.mt-4.fs-6 {
    font-size: 1.333rem !important;
}

/* ==========================================
   UNTERSEITEN WIE LIVE (Split-Seiten, Bildgeschichte, Zitat, Zähler)
   Werte gemessen an www.schuermer.com, 21.10.2026
   ========================================== */

/* Kein horizontales Scrollen: Kartenslider lassen ihre Folgekarten
   absichtlich überstehen (Schatten, Pfeile). clip statt hidden, damit
   sticky-Elemente (Split-Bild, Newsbild) weiter funktionieren. */
main.main {
    overflow-x: clip;
}

/* Split-Seiten: Textspalte wie bisher als zentrierte col-10 in der Hälfte –
   der Einzug wächst mit der Fensterbreite (live: Text bei x73 @1440,
   x93 @1920, x121 @2516). Prozent beziehen sich auf die Zeile (= 2 Hälften),
   100%/24 ist also 1/12 einer Hälfte. Bei 1440 identisch mit dem alten
   festen Wert (2.6rem / 3.65rem). */
@media (min-width: 992px) {
    .split-page .row > .px-md-4 {
        padding-left: calc(100% / 24 - 15px) !important;
        padding-right: calc(100% / 24) !important;
    }

    /* Titel, Unterzeile und Text sitzen 15px eingerückt über den Bildern */
    .split-page .ddbw-image-story .row > .col-12:not([class*="col-6"]) > :not(div.ddbw-image-story__media) {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Zitat auf Split-Seiten: Rahmen bündig mit der Textspalte, nicht mit den
   Bildern (live: Rahmen bei x71 @1373, Bilder bei x56) */
@media (min-width: 992px) {
    .split-page .ddbw-quote .border {
        margin-left: 15px;
        margin-right: 15px;
    }
}

/* Bildgeschichte: vertikaler Rhythmus wie live – Titel → Unterzeile 28px,
   Unterzeile → Text 24px, Text → Bildpaar 47px (gemessen 1280–2516) */
.ddbw-image-story__subheader {
    margin-top: 1.75rem; /* kollabiert mit den 16px des Titels zu 28px */
    margin-bottom: 1.5rem !important; /* .mb-3 ist !important */
}

.ddbw-image-story .row.justify-content-center + .row {
    margin-top: calc(-1 * var(--sparrow-gutter-y) + 0.5rem); /* Theme-Gutter g-4, +8px: Text → Bildpaar 47px wie live */
}

/* Bildgeschichte: Bilder mit leicht gerundeten Ecken wie bisher (.rounded, 3px) */
.ddbw-image-story__media {
    border-radius: 3px;
}

/* Split-Seiten mobil: Text fast randlos wie bisher (15px Rand statt 45px) */
@media (max-width: 991.98px) {
    .split-page .row > .px-md-4 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Bildgeschichte: Titel als Seitentitel, Unterzeile als Lead, Fließtext ruhig */
.split-page .ddbw-image-story__header {
    font-size: clamp(2.2rem, 8vw + 0.5rem, 3.157rem);
    line-height: 1.2;
    margin-top: 0;
}

@media (min-width: 992px) {
    .split-page .ddbw-image-story__header {
        font-size: 3.157rem;
    }
}

.ddbw-image-story__subheader {
    font-size: 1.333rem;
    line-height: 1.45;
    font-weight: 400;
    color: #000;
}

.ddbw-image-story__text {
    font-size: 1rem;
    line-height: 1.45;
    color: #666;
}

.ddbw-image-story__text p:last-child {
    margin-bottom: 0;
}

.ddbw-image-story__media img {
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Zitat: feiner Rahmen, ruhige Schrift */
.ddbw-quote .border {
    border-width: 1px !important;
    border-color: #e1e1e1 !important;
    border-radius: 3px !important;
}

@media (min-width: 992px) {
    .ddbw-quote .border {
        padding: 3rem 5rem !important;
    }
}

.ddbw-quote .blockquote-content,
.ddbw-quote .blockquote-content p {
    font-size: 1.333rem;
    line-height: 1.45;
    color: #666;
}

.ddbw-quote .blockquote-content {
    margin-bottom: 1rem !important;
}

.ddbw-quote .blockquote-content blockquote {
    margin: 0;
}

.ddbw-quote .blockquote-footer {
    margin-top: 0 !important;
    font-size: 1rem;
    font-weight: 700;
    color: #767676; /* live #949494, angehoben auf WCAG AA */
}

.ddbw-quote .blockquote-footer cite {
    font-weight: 400;
}

/* Autor wie live 16px – fs-8 am figcaption macht sonst 21px daraus */
.ddbw-quote .blockquote-footer,
.ddbw-quote .blockquote-footer span,
.ddbw-quote .blockquote-footer cite {
    font-size: 1rem !important;
}

/* Zitat direkt vor einer Bildgeschichte: live 64px Abstand, nicht 176px */
.ddbw-quote + .ddbw-image-story {
    padding-top: 0 !important;
}

.ddbw-quote + .ddbw-image-story > .container.pt-5 {
    padding-top: 0 !important;
}

/* Zähler: dünne, große Ziffern wie die Überschriften, Einheit bleibt in der Zeile */
.ddbw-countup .display-4 {
    font-size: 3.157rem;
    font-weight: 100 !important;
    line-height: 1.2;
    color: #000;
    white-space: nowrap;
}

.ddbw-countup .ddbw-countup-item .mt-2 {
    margin-top: 0.25rem !important;
    font-style: italic;
    color: #767676; /* live #949494, angehoben auf WCAG AA */
}

/* ==========================================
   LOGIN (Pages/Login.html, felogin)
   Maße wie bisher: Formular 407px breit, vertikal zentriert
   ========================================== */

.login-page .row {
    min-height: 100vh;
}

.login-page__media {
    height: 100vh;
}

.login-page__form {
    width: 100%;
    max-width: 437px;
    padding: 6rem 15px;
}

.login-page h3 {
    margin-bottom: 0.5rem;
    font-size: 1.777rem;
    font-weight: 100;
    text-transform: uppercase;
    color: #000;
}

.login-page legend {
    margin-bottom: 0.5rem;
    font-size: 1.5rem;
    color: #666;
}

.login-page fieldset > div {
    margin-bottom: 1rem;
}

.login-page label {
    font-size: 1rem;
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 700;
    color: #666;
}

.login-page input[type="text"],
.login-page input[type="password"],
.login-page input[type="email"] {
    display: block;
    width: 100%;
    padding: 0.8rem;
    border: 1px solid #e1e1e1;
    border-radius: 3px;
    background-color: #fafafa;
    color: #404040;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.login-page input[type="text"]:focus,
.login-page input[type="password"]:focus,
.login-page input[type="email"]:focus {
    border-color: #666;
    background-color: #fff;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
}

.login-page input[type="submit"] {
    display: block;
    width: 100%;
    margin-top: 1rem;
    padding: 0.8rem 2.5rem;
    border: 1px solid #1c1c1c;
    border-radius: 3px;
    background-color: #1c1c1c;
    color: #fff;
    font-size: 0.8rem;
    text-transform: uppercase;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.login-page input[type="submit"]:hover,
.login-page input[type="submit"]:focus-visible {
    background-color: #fff;
    color: #1c1c1c;
}

.login-page form + a,
.login-page a[href*="recovery"] {
    color: #666;
    text-decoration: underline;
}

.login-page a[href*="recovery"]:hover {
    color: #c8ba00;
}

/* ==========================================
   ABSTÄNDE UND EINZÜGE DER INHALTSELEMENTE
   frame-space-* wie bisher: 1 / 2 / 5 / 10 / 15 rem
   (lokal waren medium/large/extra-large nur 3 / 4 / 5 rem)
   ========================================== */

.frame-space-before-extra-small { margin-top: 1rem; }
.frame-space-before-small { margin-top: 2rem; }
.frame-space-before-medium { margin-top: 5rem; }
.frame-space-before-large { margin-top: 10rem; }
.frame-space-before-extra-large { margin-top: 15rem; }
.frame-space-after-extra-small { margin-bottom: 1rem; }
.frame-space-after-small { margin-bottom: 2rem; }
.frame-space-after-medium { margin-bottom: 5rem; }
.frame-space-after-large { margin-bottom: 10rem; }
.frame-space-after-extra-large { margin-bottom: 15rem; }

/* Auf Mobil halbiert, damit kein Element hinter Leerraum verschwindet */
@media (max-width: 767.98px) {
    .frame-space-before-medium { margin-top: 3rem; }
    .frame-space-before-large { margin-top: 5rem; }
    .frame-space-before-extra-large { margin-top: 7.5rem; }
    .frame-space-after-medium { margin-bottom: 3rem; }
    .frame-space-after-large { margin-bottom: 5rem; }
    .frame-space-after-extra-large { margin-bottom: 7.5rem; }
}

.header-indent,
.frame-headerIndent .element-header {
    margin-left: 15px;
}

/* Klassische Inhalte auf Seiten ohne eigenes Layout (Impressum, Versand, 404):
   Überschrift mit Luft wie bisher */
.sparrow-classic-content .frame > header h1,
.sparrow-classic-content > .frame > h1 {
    margin-bottom: 25px;
}

/* Bildmenü-Karten (menu_thumbnail_list) */
.ce-menu-cards__card {
    color: #666;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ce-menu-cards__card:hover,
.ce-menu-cards__card:focus-visible {
    color: #666;
}

.ce-menu-cards__card .card-title {
    font-weight: 100;
    letter-spacing: 0.02em;
}

/* ==========================================
   AKTUELLES – LISTE
   Eine ruhige Spalte wie bisher (753px), Bilder im eigenen Format
   statt auf 4:3 beschnitten
   ========================================== */

.news-list--cards {
    max-width: calc(753px + 2rem);
}

.news-list--cards .news-list__item {
    margin-bottom: 7.5rem !important;
}

.news-list--cards .news-card__image.ratio::before {
    content: none;
}

.news-list--cards .news-card__image.ratio > img {
    position: static;
    height: auto !important;
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
}

.news-list--cards .news-card__image:hover > img {
    transform: scale(1.02);
}

.news-list--cards .news-card__content {
    padding-top: 1.5rem !important;
}

.news-list--cards article.news-card .news-card__title {
    margin-bottom: 1rem !important;
    font-size: 1.777rem;
    font-weight: 100;
    line-height: 1.2;
    text-transform: uppercase;
}

.news-list--cards .news-card__teaser {
    margin-bottom: 1rem !important;
    max-width: 65ch;
    color: #666;
}

.news-list--cards .news-card__more a {
    font-weight: 400 !important;
    letter-spacing: 0.02em;
}

.news-list--cards .news-card__more a::after {
    content: " \00BB";
}

.news-list--cards .news-card__more a:hover,
.news-list--cards .news-card__title a:hover {
    color: #c8ba00 !important;
}

/* ==========================================
   AKTUELLES – ARTIKEL
   ========================================== */

@media (min-width: 992px) {
    .news-detail h1[itemprop="headline"] {
        font-size: 3.157rem;
        line-height: 1.2;
    }
}

.news-detail h1[itemprop="headline"] {
    margin-bottom: 0.5rem !important;
    font-weight: 100 !important;
    text-transform: uppercase;
    hyphens: auto;
}

.news-detail .news-text-wrap {
    max-width: 65ch;
}

.news-detail .backlink {
    text-transform: uppercase;
}

.news-detail .backlink::after {
    content: " \00AB";
    font-size: 0.8em;
}

.news-detail .backlink:hover {
    color: #c8ba00 !important;
}

.news-media-story__item img {
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.news-media-story__item:hover img,
.news-media-story__item:focus-visible img {
    transform: scale(1.03);
}

@media (min-width: 992px) {
    .news-detail > .row > .col-lg-6 + .col-lg-6 {
        padding-left: 1.8rem;
    }
}

/* ==========================================
   SEITENKOPF (hero-25) – Höhen wie bisher
   live: 260px mobil, 356px Tablet, 328px Desktop
   ========================================== */

.hero-25 {
    height: 260px;
    min-height: 260px;
}

@media (min-width: 768px) {
    .hero-25 {
        height: 356px;
        min-height: 356px;
    }
}

@media (min-width: 1200px) {
    .hero-25 {
        height: 328px;
        min-height: 328px;
    }
}

/* ==========================================
   MOBIL: OBERE LEISTE
   Inhalt beginnt unter der 48px-Leiste (wie bisher), der Warenkorb
   sitzt in der Leiste statt über dem Seitenkopf
   ========================================== */

@media (max-width: 991.98px) {
    main.main {
        padding-top: 48px;
    }

    /* Mini-Warenkorb mobil: siehe Block „MINI-WARENKORB WIE BISHER“ */
}

/* ==========================================
   BARRIEREFREIHEIT
   Sichtbarer Tastaturfokus, Sprunglink, reduzierte Bewegung
   ========================================== */

.skip-link {
    position: fixed;
    top: 0.75rem;
    left: 50%;
    z-index: 10002;
    transform: translateX(-50%);
    padding: 0.6rem 1.2rem;
    background: #000;
    color: #fff !important;
    font-size: 0.875rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
}

/* Fokus nur bei Tastaturbedienung: dunkler Ring mit hellem Saum,
   auf hellem wie dunklem Grund erkennbar (Kontrast > 3:1) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #1c1c1c;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px #fff;
}

.fancynavbar a:focus-visible,
.fancynavbar button:focus-visible,
.fancynavbar [role="button"]:focus-visible,
footer a:focus-visible,
footer button:focus-visible,
.bg-dark a:focus-visible,
.t3ware-header-mini-cart .mini-cart__toggle:focus-visible,
#consentManagerBtn:focus-visible {
    outline-color: #fff;
    box-shadow: 0 0 0 4px #000;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    /* Einblend-Animationen (zanim) sofort im Endzustand zeigen */
    [data-zanim-xs],
    [data-zanim-lg],
    [data-zanim-trigger] {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}

/* ==========================================
   KARTENSLIDER – Bilder einheitlich 4:3 wie bisher
   (live verarbeitet auf 358x269); sonst springen Titel je nach
   Bildformat in der Höhe
   ========================================== */

.theme-card-image > img.card-img-top {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: 50% 40%;
}

.swiper-slide div.card .card-title.fs-8 {
    font-size: 1.5rem !important; /* .fs-8 ist eine !important-Hilfsklasse */
    line-height: 1.2;
}

.swiper-slide div.card .card-subtitle.text-muted {
    color: #000 !important;
}

/* ==========================================
   LOGIN-KNOPF (Partials/Navigation.html)
   wie bisher: schwarzes Quadrat rechts neben dem Warenkorb,
   gleiche Größe; mobil als Symbol rechts in der Leiste, links vom Warenkorb
   ========================================== */

.header-login__link {
    position: fixed;
    top: 25px;
    left: 102px; /* Warenkorb 25 + 70, live 7px Luft */
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 50px;
    background: #000;
    color: #fff;
    transition: background-color 0.5s ease, color 0.5s ease;
}

.header-login__link:hover,
.header-login__link:focus-visible {
    background: #fff;
    color: #000;
}

@media (max-width: 991.98px) {
    .header-login__link {
        top: 0;
        right: 126px; /* Menü 70 + Warenkorb 56 */
        left: auto;
        z-index: 10001; /* über der Leiste wie der Warenkorb */
        width: 48px;
        height: 48px;
        background: transparent;
    }

    .header-login__link:hover,
    .header-login__link:focus-visible {
        background: transparent;
        color: #c8ba00;
    }
}

/* ==========================================
   MOBIL: TOUCH-ZIELE MIN. 44PX
   (gemessen 360–1024: Social-Icons 21–32px, Footer-Links 31px hoch)
   ========================================== */

@media (max-width: 991.98px) {
    .fancynavbar-addon-item {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 48px;
    }

    #bicycle-sign-up a.d-inline-block {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
    }

    /* Produkt- und Newstitel, "Weiterlesen", "Passwort vergessen" */
    main h2 > a.text-body,
    main h2 > a.text-dark,
    .news-card__more a,
    .login-page a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    #consentManagerBtn {
        min-width: 44px;
        min-height: 44px;
        justify-content: center;
    }

    #bicycle-sign-up a.text-500.d-block {
        display: flex !important;
        align-items: center;
        min-height: 44px;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* Leiste immer schwarz wie bisher. data-onscroll-fade-in setzt sie nach dem
   Zurückscrollen an den Seitenanfang auf transparent – auf weißen Seiten
   (Aktuelles, Rezepte, Impressum) waren Logo, Menü, Warenkorb und Login dann
   unsichtbar (weiß auf weiß). */
.fancynavbar-togglerbar {
    background-color: #000 !important;
}

/* ==========================================
   MINI-WARENKORB WIE BISHER
   (Layouts/Default.html, JavaScript/mini-cart.js)
   Schwarzer Knopf 70 × 50 oben links, weiße Mengenblase links oben
   über der Ecke; darunter klappt die Vorschau auf (alt: 271 px breit,
   1 px unter dem Knopf, schob sich in 0,5 s von links herein).
   Neu: weiß mit feiner goldener Oberkante, blendet in 0,2 s ein.
   Mobil (< 992 px) sitzt der Knopf wie bisher rechts in der schwarzen
   Leiste neben dem Menü, die Vorschau hängt rechtsbündig darunter.
   ========================================== */

.t3ware-header-mini-cart {
    position: fixed;
    top: 25px;
    left: 25px;
    z-index: 1050;
}

.mini-cart__toggle {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #000;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.5s ease, color 0.5s ease;
}

.mini-cart__toggle svg {
    width: 24px;
    height: 24px;
    transform: translateX(-2px);
}

/* Mengenblase wie bisher (.amount-counter) */
.t3ware-header-mini-cart .number-of-items {
    position: absolute;
    top: -10px;
    left: -10px;
    z-index: 2;
    min-width: 29px;
    padding: 2px 8px;
    border-radius: 14px;
    background: #fff;
    color: #000;
    font-size: 1rem;
    font-weight: 700;
    line-height: 23px;
    text-align: center;
    transition: background-color 0.5s ease, color 0.5s ease;
}

.mini-cart__toggle:hover,
.t3ware-header-mini-cart.is-open .mini-cart__toggle {
    background: #fff;
    color: #000;
}

.mini-cart__toggle:hover .number-of-items,
.t3ware-header-mini-cart.is-open .number-of-items {
    background: #000;
    color: #fff;
}

/* Vorschau */
.mini-cart {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    width: 320px;
    max-width: calc(100vw - 50px);
    max-height: calc(100vh - 104px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 20px 20px 22px;
    background: #fff;
    color: #1c1c1c;
    border: 1px solid #e4e4e4;
    border-top: 2px solid #c8ba00;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16);
    font-size: 0.875rem;
    line-height: 1.45;
    text-align: left;
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.mini-cart.is-visible {
    opacity: 1;
    transform: none;
}

.mini-cart p {
    margin: 0;
}

.mini-cart__intro {
    padding-bottom: 12px;
    border-bottom: 1px solid #e4e4e4;
    color: #555;
    font-size: 0.8125rem;
}

.mini-cart__intro strong {
    color: #000;
    font-weight: 700;
}

.mini-cart__items {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mini-cart__item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid #e4e4e4;
}

.mini-cart__text {
    flex: 1 1 auto;
    min-width: 0;
}

.mini-cart__name {
    color: #000;
    font-size: 1rem;
    line-height: 1.2;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.mini-cart__line {
    display: block;
    font-weight: 300;
}

.mini-cart__title {
    font-weight: 700;
}

.mini-cart__number {
    margin: .15rem 0 0;
    color: #888;
    font-size: .75rem;
}

.mini-cart__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px !important;
    color: #555;
    font-size: 0.8125rem;
}

.mini-cart__line-total {
    color: #000;
    font-weight: 700;
    white-space: nowrap;
}

.mini-cart__image {
    flex: 0 0 24px;
    width: 24px;
    height: 80px;
    object-fit: contain;
}

.mini-cart__totals {
    padding: 14px 0 18px;
}

.mini-cart__sum {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    color: #000;
    font-size: 1.125rem;
}

.mini-cart__sum-label {
    font-weight: 300;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.mini-cart__sum-value {
    font-weight: 700;
    white-space: nowrap;
}

.mini-cart__tax {
    margin-top: 2px !important;
    color: #666;
    font-size: 0.75rem;
}

/* Kostenfreier Versand: feine Goldlinie statt lauter Leiste */
.mini-cart__shipping {
    margin: 1rem 0 1.1rem;
    padding: .85rem 0 0;
    border-top: 1px solid rgba(0, 0, 0, .08);
}

.mini-cart__shipping-text {
    margin: 0 0 .55rem !important;
    color: #444;
    font-size: .8125rem;
    line-height: 1.45;
}

.mini-cart__shipping-text strong {
    color: #111;
    font-weight: 700;
}

.mini-cart__shipping-bar {
    position: relative;
    height: 3px;
    overflow: hidden;
    background: #ece9df;
}

.mini-cart__shipping-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: linear-gradient(90deg, #d9cd4a, #c8ba00 60%, #a89b00);
    transition: width .9s cubic-bezier(.2, .7, .2, 1);
}

.mini-cart__shipping.is-free .mini-cart__shipping-text strong {
    color: #8a7f00;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: .75rem;
}

@media (prefers-reduced-motion: reduce) {
    .mini-cart__shipping-fill {
        transition: none;
    }
}

.mini-cart__button,
.mini-cart__retry {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid #000;
    border-radius: 0;
    background: #000;
    color: #fff !important;
    font-size: 0.8125rem;
    font-weight: 400;
    letter-spacing: 0.08em;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.mini-cart__button:hover,
.mini-cart__button:focus-visible,
.mini-cart__retry:hover,
.mini-cart__retry:focus-visible {
    background: #fff;
    color: #000 !important;
}

.mini-cart__message {
    color: #1c1c1c;
}

.mini-cart__retry {
    margin-top: 14px;
    background: #fff;
    color: #000 !important;
}

.mini-cart__retry:hover,
.mini-cart__retry:focus-visible {
    background: #000;
    color: #fff !important;
}

.mini-cart__stale {
    margin-top: 10px !important;
    color: #666;
    font-size: 0.75rem;
}

@media (max-width: 991.98px) {
    .t3ware-header-mini-cart {
        top: 0;
        right: 70px; /* links neben dem Menü-Knopf (70 px) */
        left: auto;
        z-index: 10001; /* über der Leiste (.fancynavbar: 10000) */
    }

    /* Social-Icons stehen mobil im Menü (.fancynavbar-social-mobile) */
    .fancynavbar-togglerbar .fancynavbar-addon {
        display: none;
    }

    .fancynavbar-collapse {
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
    }

    .fancynavbar-social-mobile {
        display: flex;
        gap: 4px;
        margin-bottom: auto; /* Menü und Symbole gemeinsam mittig */
        padding: 24px 16px 0 20px; /* Symbole bündig mit den Menüeinträgen */
    }

    .fancynavbar-collapse .fancynavbar-nav {
        margin-bottom: 0;
    }

    .fancynavbar-social-mobile a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        color: #fff;
        font-size: 1.5rem;
        transition: color 0.3s ease;
    }

    .fancynavbar-social-mobile a:hover {
        color: #c8ba00;
    }

    .mini-cart__toggle {
        width: 56px;
        height: 48px;
        background: transparent;
    }

    .mini-cart__toggle svg {
        width: 22px;
        height: 22px;
        transform: none;
    }

    .t3ware-header-mini-cart .number-of-items {
        top: 6px;
        left: 30px;
        min-width: 18px;
        padding: 0 5px;
        border-radius: 9px;
        font-size: 11px;
        line-height: 17px;
    }

    .mini-cart__toggle:hover,
    .t3ware-header-mini-cart.is-open .mini-cart__toggle {
        background: transparent;
        color: #c8ba00;
    }

    .mini-cart__toggle:hover .number-of-items,
    .t3ware-header-mini-cart.is-open .number-of-items {
        background: #fff;
        color: #000;
    }

    .mini-cart {
        position: fixed;
        top: 48px;
        right: 8px;
        left: auto;
        width: calc(100vw - 16px);
        max-width: 380px;
        max-height: calc(100vh - 64px);
        max-height: calc(100dvh - 64px);
        border-top: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mini-cart {
        transform: none;
        transition: none;
    }
}

/* ==================================
   FOOTER: Newsletter, Widerruf, Kündigen als dezente Links,
   Cookie-Einstellungen in der Rechtstexte-Zeile (statt schwebendem Knopf)
   ================================== */

.footer-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .55rem;
}

.footer-action-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: 0 0 .2rem;
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, .35);
  transition: border-color .2s ease, color .2s ease;
}

.footer-action-link::after {
  content: "→";
  font-weight: 400;
  letter-spacing: 0;
  transition: transform .2s ease;
}

.footer-action-link:hover,
.footer-action-link:focus-visible {
  color: #fff;
  border-bottom-color: #c8ba00;
}

.footer-action-link:hover::after,
.footer-action-link:focus-visible::after {
  transform: translateX(3px);
}

.footer-consent-link {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  text-decoration: underline;
  cursor: pointer;
}

/* ==========================================
   GOOGLE-BEWERTUNG (Kontaktspalte neben der Karte)
   ========================================== */

.what-we-do-rating__score {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
}

.what-we-do-rating__value {
  font-weight: 700;
}

.what-we-do-rating__stars {
  display: inline-flex;
  gap: 1px;
  font-size: 1.05em;
  line-height: 1;
}

.what-we-do-rating__star {
  color: #d6d3c4;
}

.what-we-do-rating__star.is-full {
  color: #c8ba00;
}

.what-we-do-rating__star.is-half {
  background: linear-gradient(90deg, #c8ba00 50%, #d6d3c4 50%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.what-we-do-rating__links a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: #c8ba00;
}

.what-we-do-rating__links a:hover,
.what-we-do-rating__links a:focus-visible {
  color: #000;
}

/* Weinmenü: Weinlinien und Shop-Seiten als getrennte Gruppen (MenuSplitViewHelper) */

.fancy-dropdown-label {
    margin-bottom: .35rem;
    color: rgba(255, 255, 255, .55);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.fancy-dropdown-group--aside {
    border-left: 1px solid rgba(255, 255, 255, .25);
}

@media (max-width: 991.98px) {
    .fancy-dropdown-group--aside {
        width: 100%;
        margin-top: 1rem;
        padding-top: 1rem;
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .25);
    }

    /* gleiche Einrückung wie die Weinlinien darüber (ps-2 + Spalten-ps-2) */
    .fancy-dropdown-group--aside > * {
        padding-left: .5rem;
    }
}

.fancy-dropdown-group > .row {
    margin-left: 0;
}

.fancy-dropdown-group > .row > .col-auto {
    padding-left: 0;
}

.fancy-dropdown-group:not(.fancy-dropdown-group--aside) > .fancy-dropdown-label {
    padding-left: .5rem;
}