/** Shopify CDN: Minification failed

Line 237:47 Unexpected "*"

**/
/** Critical CSS for the theme. This file is included on every page. */

/* Reset styles inspired by https://www.joshwcomeau.com/css/custom-css-reset/ */
* {
  box-sizing: border-box;
  margin: 0;
}

html {
  background-color: #ffffff;
  background: #ffffff;
}

body {
  display: block;
  margin: 0;
  min-height: 100svh;
  color-scheme: light only;
  background-color: #ffffff;
  background: #ffffff;
  color: var(--color-foreground);
}

html:has(dialog[scroll-lock][open], details[scroll-lock][open]) {
  overflow: hidden;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

input,
textarea,
select {
  font: inherit;
  border-radius: var(--style-border-radius-inputs);
}

select {
  background-color: var(--color-background);
  color: currentcolor;
}

dialog {
  background-color: var(--color-background);
  color: var(--color-foreground);
}

p {
  text-wrap: pretty;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

p:empty {
  display: none;
}

:is(p, h1, h2, h3, h4, h5, h6):first-child,
:empty:first-child + :where(p, h1, h2, h3, h4, h5, h6) {
  margin-block-start: 0;
}

:is(p, h1, h2, h3, h4, h5, h6):last-child,
:where(p, h1, h2, h3, h4, h5, h6) + :has(+ :empty:last-child) {
  margin-block-end: 0;
}

/** Theme styles below */
html {
  background-color: #ffffff;
  background: #ffffff;
}

body {
  font-family: var(--font-primary--family);
  background-color: #ffffff;
  background: #ffffff;
  color: var(--color-foreground);
}

main {
  background-color: #ffffff;
  background: #ffffff;
}

.shopify-section {
  background-color: #ffffff;
  background: #ffffff;
}

.page-width,
.page-width--full,
.container,
.wrapper {
  background-color: #ffffff;
  background: #ffffff;
}

/* Spezifische Hintergrund-Regeln für alle Template-Typen mit höherer Spezifität */
body.template-product,
body.template-product main,
body.template-product .shopify-section,
body.template-product .page-width,
body.template-product .page-width--full {
  background-color: #ffffff;
  background: #ffffff;
}

body.template-cart,
body.template-cart main,
body.template-cart .shopify-section,
body.template-cart .page-width,
body.template-cart .page-width--full {
  background-color: #ffffff;
  background: #ffffff;
}

body.template-index,
body.template-index main,
body.template-index .shopify-section,
body.template-index .page-width,
body.template-index .page-width--full {
  background-color: #ffffff;
  background: #ffffff;
}

/** Section layout utilities */

/**
 * Setup a grid that enables both full-width and constrained layouts
 * depending on the class of the child elements.
 *
 * By default, a minimum content margin is set on the left and right
 * sides of the section and the content is centered in the viewport to
 * not exceed the maximum page width.
 *
 * When a child element is given the `full-width` class, it will span
 * the entire viewport.
 */
body:not(.template-product) .shopify-section {
  --content-width: min(
    calc(var(--page-width) - var(--page-margin) * 2),
    calc(100% - var(--page-margin) * 2)
  );
  --content-margin: minmax(var(--page-margin), 1fr);
  --content-grid: var(--content-margin) var(--content-width) var(--content-margin);

  /* This is required to make <img> elements work as background images */
  position: relative;
  grid-template-columns: var(--content-grid);
  display: grid;
  width: 100%;
}

/* Startseite: 10% Padding links und rechts - AUSSER HEADER (SAUBERE LÖSUNG) */
body.template-index {
  overflow-x: hidden;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  background-color: #ffffff;
}

/* Main-Wrapper ohne Padding, Padding nur auf Sections */
body.template-index > main {
  padding-left: 0;
  padding-right: 0;
}
body.template-index > main > *:not(.sticky-header-wrapper):not(#cart-drawer):not(#mobile-menu):not(.shopify-section:has(.evelin-hero-section)):not(.shopify-section:has(.site-footer)):not(.shopify-section:has(.section-newsletter)) {
  padding-left: 10%;
  padding-right: 10%;
  box-sizing: border-box;
}
.shopify-section:has(.section-newsletter),
.section-newsletter {
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
}
.section-newsletter.nl-hero {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  display: block;
}
body.template-index .shopify-section:has(.section-newsletter) {
  padding-left: 0;
  padding-right: 0;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
  max-width: 100vw;
  display: block;
  grid-template-columns: none;
}

/* Shopify-Sections mit evelin-hero ausnehmen */
body.template-index > .shopify-section:has(.evelin-hero-section) {
  padding-left: 0;
  padding-right: 0;
}

body.template-index .shopify-section:has(.evelin-hero-section) {
  padding-left: 0;
  padding-right: 0;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
  max-width: 100vw;
  display: block;
  grid-template-columns: none;
}

body.template-index #shopify-section-template--*__evelin_hero,
body.template-index [id*="evelin_hero"],
body.template-index [id*="evelin-hero"] {
  padding-left: 0;
  padding-right: 0;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
  max-width: 100vw;
}

body.template-index .grid:has(.evelin-hero-section) {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
  display: block;
}

/* Header-Wrapper: Volle Breite ohne Padding */
body.template-index .sticky-header-wrapper {
  width: 100vw;
  max-width: 100vw;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 61;
  background: #ffffff;
}

/* Entfernt: Top-Info-Bar Zwangsbreite – wird in theme-main.css gesetzt */

/* Site-Header: Volle Breite */
body.template-index .site-header {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  position: sticky;
  top: 0;
  z-index: 60;
  background: #ffffff;
}

/* Footer full-width enforcement */
.site-footer {
  width: 100%;
  margin: 0 auto;
  background: #0f172a;
}
.site-footer .footer-new {
  max-width: 1440px;
  margin: 0 auto;
  padding-left: clamp(1.5rem, 6vw, 5rem);
  padding-right: clamp(1.5rem, 6vw, 5rem);
  width: 100%;
  box-sizing: border-box;
}

/* Evelin-Hero-Section: Volle Breite ohne Padding */
body.template-index .evelin-hero-section {
  width: 100vw;
  max-width: 100vw;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  position: relative;
  left: 0;
  right: 0;
  background: transparent;
  min-height: 0;
  display: block;
  overflow: visible;
}

/* Evelin-Hero-Container: Gleiche Breite wie max-w-7xl (80rem = 1280px) */
body.template-index .evelin-hero-container {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

@media (min-width: 640px) {
  body.template-index .evelin-hero-container {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  body.template-index .evelin-hero-container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}


body.template-index .top-info-bar__inner {
  max-width: 1200px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
}

body.template-index .site-header {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  position: sticky;
  top: 0;
  z-index: 60;
  background: #ffffff;
}

/* Entfernt Zwangsbreite auf der Startseite (wird in theme-main.css gesteuert) */

body.template-index .header-content {
  max-width: 80rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

@media (min-width: 640px) {
  body.template-index .header-content {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  body.template-index .header-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

body.template-index .header-navigation {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

body.template-index .header-navigation .nav-container {
  max-width: 80rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

body.template-index .header-navigation .nav-menu {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  gap: 0.8rem;
  flex-wrap: nowrap;
}

@media (max-width: 420px) {
  body .site-header .header-logo-wrapper .logo-link {
    gap: 0.05rem;
  }

  body .site-header .brand-title {
    font-size: 1.25rem;
    line-height: 1.05;
  }

  body .site-header .brand-subtitle {
    font-size: 0.8rem;
  }
}

@media (max-width: 360px) {
  body .site-header .brand-title {
    font-size: 1.15rem;
  }

  body .site-header .brand-subtitle {
    font-size: 0.72rem;
  }
}

@media (max-width: 320px) {
  body .site-header .brand-title {
    font-size: 1rem;
    letter-spacing: -0.01em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.65rem;
  }
}

@media (max-width: 297px) {
  body .site-header .brand-title {
    font-size: 0.93rem;
    letter-spacing: -0.0125em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.62rem;
  }
}

@media (max-width: 291px) {
  body .site-header .brand-title {
    font-size: 0.9rem;
    letter-spacing: -0.013em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.6rem;
  }
}

@media (max-width: 288px) {
  body .site-header .brand-title {
    font-size: 0.86rem;
    letter-spacing: -0.014em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.58rem;
  }
}

@media (max-width: 280px) {
  body .site-header .brand-title {
    font-size: 0.82rem;
    letter-spacing: -0.015em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.55rem;
  }
}

@media (max-width: 273px) {
  body .site-header .brand-title {
    font-size: 0.78rem;
    letter-spacing: -0.016em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.52rem;
  }
}

@media (max-width: 269px) {
  body .site-header .brand-title {
    font-size: 0.74rem;
    letter-spacing: -0.017em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.5rem;
  }
}

@media (max-width: 259px) {
  body .site-header .brand-title {
    font-size: 0.7rem;
    letter-spacing: -0.018em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.48rem;
  }
}

@media (max-width: 257px) {
  body .site-header .brand-title {
    font-size: 0.66rem;
    letter-spacing: -0.019em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.46rem;
  }
}

@media (max-width: 252px) {
  body .site-header .brand-title {
    font-size: 0.62rem;
    letter-spacing: -0.02em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.44rem;
  }
}

@media (max-width: 245px) {
  body .site-header .brand-title {
    font-size: 0.58rem;
    letter-spacing: -0.021em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.42rem;
  }
}

@media (max-width: 241px) {
  body .site-header .brand-title {
    font-size: 0.54rem;
    letter-spacing: -0.022em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.4rem;
  }
}

@media (max-width: 235px) {
  body .site-header .brand-title {
    font-size: 0.5rem;
    letter-spacing: -0.023em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.38rem;
  }
}

@media (max-width: 230px) {
  body .site-header .brand-title {
    font-size: 0.46rem;
    letter-spacing: -0.024em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.36rem;
  }
}

@media (max-width: 226px) {
  body .site-header .brand-title {
    font-size: 0.43rem;
    letter-spacing: -0.025em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.34rem;
  }
}

@media (max-width: 222px) {
  body .site-header .brand-title {
    font-size: 0.4rem;
    letter-spacing: -0.026em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.32rem;
  }
}

@media (max-width: 218px) {
  body .site-header .brand-title {
    font-size: 0.37rem;
    letter-spacing: -0.027em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.3rem;
  }
}

@media (max-width: 214px) {
  body .site-header .brand-title {
    font-size: 0.34rem;
    letter-spacing: -0.028em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.28rem;
  }
}

@media (max-width: 210px) {
  body .site-header .brand-title {
    font-size: 0.31rem;
    letter-spacing: -0.029em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.26rem;
  }
}

@media (max-width: 206px) {
  body .site-header .brand-title {
    font-size: 0.29rem;
    letter-spacing: -0.03em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.24rem;
  }
}

@media (max-width: 202px) {
  body .site-header .brand-title {
    font-size: 0.27rem;
    letter-spacing: -0.031em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.22rem;
  }
}

@media (max-width: 199px) {
  body .site-header .brand-title {
    font-size: 0.240rem;
    letter-spacing: -0.032em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.190rem;
  }
}

@media (max-width: 196px) {
  body .site-header .brand-title {
    font-size: 0.228rem;
    letter-spacing: -0.033em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.180rem;
  }
}

@media (max-width: 193px) {
  body .site-header .brand-title {
    font-size: 0.216rem;
    letter-spacing: -0.034em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.170rem;
  }
}

@media (max-width: 190px) {
  body .site-header .brand-title {
    font-size: 0.204rem;
    letter-spacing: -0.034em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.160rem;
  }
}

@media (max-width: 187px) {
  body .site-header .brand-title {
    font-size: 0.192rem;
    letter-spacing: -0.035em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.150rem;
  }
}

@media (max-width: 184px) {
  body .site-header .brand-title {
    font-size: 0.180rem;
    letter-spacing: -0.036em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.140rem;
  }
}

@media (max-width: 181px) {
  body .site-header .brand-title {
    font-size: 0.168rem;
    letter-spacing: -0.037em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.130rem;
  }
}

@media (max-width: 178px) {
  body .site-header .brand-title {
    font-size: 0.156rem;
    letter-spacing: -0.038em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.120rem;
  }
}

@media (max-width: 175px) {
  body .site-header .brand-title {
    font-size: 0.144rem;
    letter-spacing: -0.038em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.110rem;
  }
}

@media (max-width: 172px) {
  body .site-header .brand-title {
    font-size: 0.132rem;
    letter-spacing: -0.039em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.100rem;
  }
}

@media (max-width: 169px) {
  body .site-header .brand-title {
    font-size: 0.120rem;
    letter-spacing: -0.040em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.090rem;
  }
}

@media (max-width: 166px) {
  body .site-header .brand-title {
    font-size: 0.108rem;
    letter-spacing: -0.041em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.080rem;
  }
}

@media (max-width: 163px) {
  body .site-header .brand-title {
    font-size: 0.096rem;
    letter-spacing: -0.042em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.070rem;
  }
}

@media (max-width: 160px) {
  body .site-header .brand-title {
    font-size: 0.084rem;
    letter-spacing: -0.042em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.060rem;
  }
}

@media (max-width: 157px) {
  body .site-header .brand-title {
    font-size: 0.072rem;
    letter-spacing: -0.043em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 154px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.044em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 151px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.045em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 148px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.046em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 145px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.046em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 142px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.047em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 139px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.048em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 136px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.049em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 133px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.050em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 130px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.050em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 127px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.051em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 124px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.052em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 121px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.053em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 118px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.054em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 115px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.054em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 112px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.055em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 109px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.056em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 106px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.057em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 103px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.058em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 100px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.058em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 97px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.059em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 94px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.060em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 91px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.061em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 88px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.062em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 85px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.062em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 82px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.063em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 79px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.064em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 76px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.065em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 73px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.066em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}

@media (max-width: 70px) {
  body .site-header .brand-title {
    font-size: 0.070rem;
    letter-spacing: -0.066em;
  }

  body .site-header .brand-subtitle {
    font-size: 0.050rem;
  }
}


body .mobile-menu-trigger {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #ffffff;
  color: #374151;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body #cart-drawer .cart-drawer__content {
  background-color: #ffffff;
  opacity: 1;
  box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
  border-left: 1px solid rgba(229, 231, 235, 0.9);
}

body #cart-drawer .cart-drawer__item {
  border: 1px solid #e5e7eb;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
  padding: clamp(1rem, 2vw, 1.35rem);
  gap: clamp(1rem, 2vw, 1.35rem);
  position: relative;
}

body .cart-count {
  color: #ffffff;
  font-weight: 700;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
}

body #mobile-menu .mobile-menu__panel {
  background-color: #ffffff;
  opacity: 1;
  box-shadow: 6px 0 24px rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(229, 231, 235, 1);
}

body #mobile-menu .mobile-menu__panel::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background: rgba(209, 213, 219, 1);
}

body #mobile-menu,
body #mobile-menu .mobile-menu__panel,
body #mobile-menu .mobile-menu__panel * {
  color: #1f2937;
}

body #mobile-menu .mobile-menu__brand-title,
body #mobile-menu .mobile-menu__brand-subtitle,
body #mobile-menu .mobile-menu__brand-tagline {
  background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #60a5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

body .shopify-section:has(.section-newsletter) {
  padding-left: 0;
  padding-right: 0;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

body.template-index #shopify-section-newsletter {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

body.template-index #shopify-section-newsletter > .section-newsletter {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  display: block;
}

body #mobile-menu .mobile-menu__panel {
  background-color: #ffffff;
  box-shadow: none;
  opacity: 1;
}

body #mobile-menu .mobile-menu__overlay {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}


@media (min-width: 640px) {
  body.template-index .header-navigation .nav-container {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  body.template-index .header-navigation .nav-container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

/* Startseite: Sections nutzen volle verfügbare Breite (80% nach Padding) */
body.template-index .shopify-section {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}
body.template-index .shopify-section:has(.section-newsletter) {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
}
body.template-index .shopify-section:has(.section-newsletter) > * {
  grid-column: 1 / -1;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
}

/* Full-bleed: entferne Seitenränder global */
body:not(.template-product) .shopify-section { --content-margin: 0; }

/* Child elements, by default, are constrained to the central column of the grid. */
body:not(.template-product) .shopify-section > * {
  grid-column: 2;
}

/* Startseite: Child-Elemente nutzen volle Breite */
body.template-index .shopify-section > * {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 100%;
}

/* Startseite: Alle Container nutzen volle verfügbare Breite (80% nach Body-Padding) */
body.template-index .shopify-section .container,
body.template-index .shopify-section .max-w-7xl,
body.template-index .shopify-section [class*="container"],
body.template-index .shopify-section [class*="max-w"],
body.template-index .featured-products .container,
body.template-index .featured-products [class*="container"],
body.template-index .product-categories .container,
body.template-index .product-categories .max-w-7xl,
body.template-index .product-grid .container,
body.template-index .product-grid [class*="container"],
body.template-index .rot-hero-container,
body.template-index .hero-container,
body.template-index .evelin-hero-container,
body.template-index .max-w-7xl,
body.template-index section .max-w-7xl,
body.template-index section .container,
body.template-index section [class*="container"] {
  max-width: 100%;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* Kategorie-Produkte: Flex-Row Layout */
.category-products-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  width: 100%;
}

.category-products-row > * {
  flex: 1 1 100%;
  min-width: 0;
  width: 100%;
}

@media (min-width: 640px) {
  .category-products-row > * {
    flex: 1 1 calc(50% - 1.5rem);
    max-width: calc(50% - 1.5rem);
  }
}

@media (min-width: 1024px) {
  .category-products-row > * {
    flex: 1 1 calc(33.333% - 1.5rem);
    max-width: calc(33.333% - 1.5rem);
  }
}

@media (min-width: 1280px) {
  .category-products-row > * {
    flex: 1 1 calc(25% - 1.5rem);
    max-width: calc(25% - 1.5rem);
  }
}

/* Child elements that use the full-width utility class span the entire viewport. */
body:not(.template-product) .shopify-section > .full-width {
  grid-column: 1 / -1;
}
/* Allow hero to bleed edge-to-edge visually */
.hero.full-width, .full-width .hero { padding-left: 0; padding-right: 0; }
/* Exact hero split like screenshot */
.hero-row { align-items: flex-start; }
@media (min-width: 768px) {
  .hero-row { flex-direction: row; justify-content: flex-start; gap: 1.5rem; }
  .hero-left { flex: 0 0 56%; max-width: 56%; }
  .hero-kpis { flex: 0 0 28%; max-width: 28%; align-items: flex-start; }
}

/* Global seam killer: fixed white cap under sticky header (always on) */
body::before { content: none; }