/** Shopify CDN: Minification failed

Line 12:5 Expected ":"

**/
/* vedika-css v29 — 15.09.2026 */

/* --- Basis, aus v7 unverändert ----------------------------------------- */
:root{
--color-primary-button-background:#2F4A34;
--color-primary-button-hover-background:#22371F;
--col/*  */or-primary-button-border:#2F4A34;
--border-color:#CDC2AC;
--color-border:#CDC2AC;
--color-input-border:#CDC2AC;
--style-border-drawer:1px solid #CDC2AC;
--style-border-popover:1px solid #CDC2AC;
--style-border-radius-buttons-primary:2px;
--style-border-radius-buttons-secondary:2px;
--style-border-radius-inputs:2px;
--shadow-button:none;
--color-input-text:#2C241C;
--font-paragraph--size:1rem;
--font-h5--size:1rem;
--font-h6--size:.9375rem;
--font-h3--size:1.75rem;
--font-h4--size:1.25rem;
--font-h1--line-height:1.1;
--font-h2--line-height:1.15;
--font-h4--line-height:1.25;
--color-instock:#2F4A34;
--vk-cream:#F6F1E8;
--vk-cream2:#EFE8DA;
--vk-earth:#2C241C;
--vk-soft:#6E6154;
--vk-forest:#2F4A34;
--vk-rule:#CDC2AC;
--vk-sans:Assistant,Work Sans,Karla,sans-serif;
--vk-serif:EB Garamond,Garamond,Georgia,serif;
}
.product-media{background:#F6F1E8}
.product-media-container img.product-media__image{mix-blend-mode:multiply}
product-card .product-card__content,product-card .card-gallery{border:0}
product-card a p[role=heading]{font-weight:500}
product-card product-price .price{color:rgb(44 36 28/.65);font-variant-numeric:tabular-nums}
.vk-qty-deal{font-family:var(--vk-sans);font-size:13px;font-weight:400;color:var(--vk-soft);margin:8px 0 0}

/* Kollektionen mit sehr wenigen Artikeln sollen nicht in ein Fünf-Raster
   fallen und zwei Spalten leer lassen. (v8) */
.product-grid:has(> .product-grid__item:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}

/* --- Hero, Variante B Waldband -----------------------------------------
   Waldgrünes Feld links, das nach links aus dem Bild läuft, Cremeschrift
   darauf, die Ware rechts auf Creme. Das grüne Feld haengt als Pseudo-
   element an der Textspalte und nicht als Verlauf am Abschnitt: so bleiben
   Feldkante und Textspalte in jeder Fensterbreite zusammen. */
.vk-hero{overflow:hidden;background:var(--vk-cream)}
.vk-hero__in{width:min(100% - 80px,1440px);margin-inline:auto;display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);align-items:stretch;min-height:clamp(360px,36vw,480px)}
.vk-hero__word{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:56px 64px 56px 0}
.vk-hero__word::before{content:"";position:absolute;top:0;bottom:0;right:0;left:calc(-1 * (50vw - 50%));background:var(--vk-forest)}
.vk-hero__word>*{position:relative;z-index:1}
.vk-hero h1{font-family:var(--vk-serif);font-weight:400;font-size:clamp(1.9rem,2.9vw,2.8rem);line-height:1.1;letter-spacing:0;color:var(--vk-cream);margin:0;text-wrap:balance}
.vk-hero__sub{margin:16px 0 0;font-family:var(--vk-sans);font-size:15px;line-height:1.5;color:rgb(246 241 232/.78)}
.vk-hero__cta{display:inline-block;padding:13px 26px;background:var(--vk-cream);color:var(--vk-earth);font-family:var(--vk-sans);font-size:15px;line-height:1;text-decoration:none;border-radius:2px}
/* Zweite Zeile der Schlagzeile steht leiser, damit die Aussage zwei Stufen
   bekommt statt drei gleich laute Zeilen. */
.vk-hero__pick{color:rgb(246 241 232/.62)}
.vk-hero__cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.vk-hero__cta:hover{background:#FFFFFF}
.vk-hero__cta--ghost{background:none;color:var(--vk-cream);border:1px solid rgb(246 241 232/.45)}
.vk-hero__cta--ghost:hover{background:none;border-color:var(--vk-cream)}

/* --- Vertrauenszeile ---------------------------------------------------
   Vier belegbare Angaben direkt unter dem Hero. Beantwortet fuer Erstbe-
   sucher, wer Vedika ist, ohne dem Hero die Zutat wegzunehmen. */
.vk-trust__row{list-style:none;margin:0;padding:20px 0 0;display:flex;flex-wrap:wrap;gap:8px 0;font-family:var(--vk-sans);font-size:13.5px;line-height:1.4;color:var(--vk-soft)}
.vk-trust__row li{padding:0 18px;border-left:1px solid var(--vk-rule)}
.vk-trust__row li:first-child{padding-left:0;border-left:0}

/* --- Herstellernotizen ------------------------------------------------- */
.vk-brands__notes{margin-top:30px;columns:2;column-gap:56px;max-width:62rem;font-family:var(--vk-sans);font-size:14px;line-height:1.55;color:var(--vk-soft)}
.vk-brands__notes p{margin:0 0 12px;break-inside:avoid}
.vk-brands__notes strong{color:var(--vk-earth);font-weight:500}
.vk-brands__notes a{color:var(--vk-forest);text-decoration:underline;text-underline-offset:2px}
.vk-hero__ware{display:flex;align-items:center;justify-content:center;min-width:0;padding-left:40px}
/* Der Packshot hat exakt #F6F1E8 als Grund, also kein multiply: sonst
   multipliziert sich Creme auf Creme und es entsteht eine sichtbare Platte. */
.vk-hero__ware img{width:100%;height:auto;object-fit:contain}

/* --- Startseite, gemeinsame Bausteine ----------------------------------
   Beide vk-Blöcke sitzen in einer section--page-width. Die Seitenränder
   kommen vom Theme, die Blöcke bringen bewusst keine eigenen mit, sonst
   springt die linke Kante gegenüber Hero und Produktraster. */
.vk-start,.vk-brands{font-family:var(--vk-sans);color:var(--vk-earth)}
.vk-head h2{font-family:var(--vk-serif);font-size:28px;line-height:1.15;font-weight:400;margin:0;letter-spacing:0;text-transform:none;color:var(--vk-earth)}
.vk-head p{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--vk-soft);max-width:34rem}

/* --- Wo anfangen -------------------------------------------------------
   Bewusst anders gebaut als das Produktraster darunter: Bild links, Text
   rechts, Haarlinie oben. Sonst liest man drei Produktkacheln über drei
   Produktkacheln und die Seite bekommt keinen Rhythmus. */
.vk-start{padding-block:64px 60px}
.vk-start .vk-head{margin-bottom:36px}
.vk-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.vk-tile{display:flex;gap:18px;align-items:flex-start;text-decoration:none;color:inherit;border-top:1px solid var(--vk-rule);padding-top:20px}
.vk-tile__media{flex:0 0 132px;height:132px;display:flex;align-items:center;justify-content:center;background:var(--vk-cream2)}
.vk-tile__media img{max-width:82%;max-height:82%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}
.vk-tile__body{display:flex;flex-direction:column;align-items:flex-start}
.vk-tile__title{font-family:var(--vk-serif);font-size:20px;line-height:1.2;color:var(--vk-earth)}
.vk-tile__text{margin-top:6px;font-size:14px;line-height:1.45;color:var(--vk-soft)}
.vk-tile__more{margin-top:12px;font-size:13px;color:var(--vk-forest);border-bottom:1px solid rgb(47 74 52/.3);padding-bottom:2px}
.vk-tile:hover .vk-tile__more{border-bottom-color:var(--vk-forest)}
.vk-tile:hover .vk-tile__media{background:#E8DFCD}

/* --- Unsere Marken -----------------------------------------------------
   Steht neu am Seitenende, als Beleg nach dem Blick ins Sortiment.
   Keine weißen Kästen mehr, nur Schrift auf Creme mit Trennstrichen. */
.vk-brands{padding-block:8px 76px}
.vk-brands__in{border-top:1px solid var(--vk-rule);padding-top:28px}
.vk-brands .vk-head{margin-bottom:30px}
.vk-brands__row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}
.vk-brands__row li{display:flex;align-items:center;justify-content:center;min-height:48px;padding:2px 24px;border-left:1px solid var(--vk-rule);font-family:var(--vk-serif);font-size:17px;color:var(--vk-earth)}
.vk-brands__row li:first-child{justify-content:flex-start;padding-left:0;border-left:0}
/* Alle vier Logodateien sind 800 px breit, also nicht auf gleiche Schrift-
   groesse gebracht, sondern auf gleiche Breite. Gleiche Bildhoehe wuerde
   deshalb taeuschen: bei somamed traegt das x-Band 55 % der Datei, bei
   Maharishi Ayurveda nur 43 %. Die Hoehen unten sind so gewaehlt, dass das
   x-Band jedes Logos rund 12 px misst, damit die Zeile ruhig liegt. */
.vk-brands__row img{max-width:100%;width:auto;height:auto;opacity:.85}
.vk-brands__row li:nth-child(1) img{max-height:28px}
.vk-brands__row li:nth-child(2) img{max-height:28px}
.vk-brands__row li:nth-child(3) img{max-height:19px}
.vk-brands__row li:nth-child(4) img{max-height:20px}

/* --- Nutzenliste in Kollektionstexten ----------------------------------
   Das Theme deckelt Absaetze in Kollektionsbeschreibungen auf 520 px. Bei
   Care fuellt die Liste damit einen ganzen Bildschirm, bevor das erste
   Produkt kommt. Die Liste laeuft deshalb breiter und zweispaltig. */
.vk-map{max-width:62rem;list-style:none;margin:0 0 26px;padding:0;padding-inline-start:0;text-indent:0;columns:2;column-gap:48px;font-family:var(--vk-sans);font-size:15px;line-height:1.5;color:var(--vk-soft)}
.vk-map li{break-inside:avoid;margin:0 0 9px}
.rte ul.vk-map{padding-inline:0;margin-inline:0}

/* --- Produktbeschreibung ----------------------------------------------
   Zielt auf den Beschreibungsblock der Produktseite (Block text_aEtTtq im
   product-Template). Engere Absaetze, Zwischentitel als kleine Versalzeile,
   damit Zutaten, Einnahme und Hinweise scanbar werden statt als Fliesstext
   zu verlaufen. */
.rte[class*="text_aEtTtq"]{font-size:15px}
.rte[class*="text_aEtTtq"] p{margin:0 0 10px;line-height:1.55}
.rte[class*="text_aEtTtq"] h4{font-family:var(--vk-sans);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--vk-soft);margin:24px 0 7px}
.rte[class*="text_aEtTtq"] a{color:var(--vk-forest);text-decoration:underline;text-underline-offset:2px}
.rte[class*="text_aEtTtq"] .vk-deal{background:var(--vk-cream2);padding:12px 14px;margin:2px 0 14px;font-size:14px;line-height:1.5;color:var(--vk-earth)}

/* --- Kurzorientierung auf der Produktkachel -----------------------------
   Der Hersteller unter dem Titel. Ohne ihn sehen die drei
   Kurkuma-Artikel, die zwei Ashwagandha-Tabletten und die drei Zungen-
   reiniger auf der Kachel gleich aus. Die Darreichungsform liesse sich nicht
   erganzen: das Theme laesst closest.product.type als Quelle nicht zu. */
/* Der Textblock im Theme laesst keine class-Attribute zu, deshalb haengt
   die Regel an der Block-ID, die das Theme in die Klasse schreibt. */
.rte[class*="vk_form_line"] p{margin:3px 0 0;font-family:var(--vk-sans);font-size:12px;line-height:1.35;letter-spacing:.01em;color:var(--vk-soft)}

@media (max-width:989px){
.vk-map{columns:1}
.vk-brands__notes{columns:1}
.vk-trio{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:749px){
/* Die Umbrueche in der Schlagzeile bleiben auch klein sinnvoll, die Zeile
   wird dafuer etwas kleiner, damit "Klassiker des Ayurveda." nicht anstoesst. */
.vk-hero h1{font-size:1.72rem}
.vk-trust__row{gap:6px 0}
.vk-trust__row li{padding:0 12px}
.vk-hero__in{grid-template-columns:1fr;min-height:0;width:100%}
.vk-hero__word{padding:40px 20px 44px}
.vk-hero__word::before{left:0;right:0}
.vk-hero__ware{padding:4px 20px 12px}
.vk-start{padding-block:40px 44px}
.vk-start .vk-head{margin-bottom:24px}
.vk-trio{grid-template-columns:1fr;gap:0}
.vk-tile{padding-block:18px}
.vk-tile__media{flex-basis:88px;height:88px}
.vk-brands{padding-block:0 48px}
.vk-brands__row{gap:6px 0}
.vk-brands__row{grid-template-columns:1fr 1fr;gap:18px 0}
.vk-brands__row li{padding:2px 14px;min-height:36px}
.vk-brands__row li:nth-child(3){justify-content:flex-start;padding-left:0;border-left:0}
.vk-brands .vk-head{margin-bottom:22px}
}


/* --- v24: Footer-Spalten ------------------------------------------- */
/* Menü sitzt jetzt in einer Gruppe mit eigener Überschrift.
   Die leere Theme-Überschrift des Menüblocks darf keinen Platz mehr belegen. */
.footer-content .menu__details > summary.menu__heading{display:none}
.footer-content .menu__details > .details-content{margin-block-start:0}

/* --- v24: Lange deutsche Wörter trennen statt abschneiden ----------- */
/* "Datenschutzerklärung" brach als "Datenschutzerklärun / g". */
h1,h2,h3,h4{hyphens:auto;-webkit-hyphens:auto;word-break:normal}
.shopify-policy__title h1{overflow-wrap:normal}
/* 56px war zu gross für die schmale Lesespalte der Richtlinien-Seiten. */
.shopify-policy__title h1{font-size:clamp(2rem,5vw,2.75rem);line-height:1.15}


/* --- v26: Kollektionstexte nutzen die Seitenbreite --------------------- */
/* Horizon kappt Absätze bei 520 px. Auf breiten Schirmen stand der Text
   deshalb als schmales Band links, rechts daneben 900 px Leere.
   Lösung: Führungssatz über die volle Breite, der Rest in zwei Spalten
   von je rund 520 px — Lesbarkeit bleibt, die Fläche wird genutzt. */
@media (min-width: 1100px){
  .custom-section-content .text-block.rte{
    display: block;          /* Horizon setzt hier flex — darauf wirkt columns nicht */
    max-width: 1120px;
    columns: 2;
    column-gap: 72px;
  }
  .custom-section-content .text-block.rte > *{
    max-width: 100%;
    break-inside: avoid;
  }
  .custom-section-content .text-block.rte > h2,
  .custom-section-content .text-block.rte > h3,
  .custom-section-content .text-block.rte > h4{
    break-after: avoid;
    margin-top: 0;
  }
  .custom-section-content .text-block.rte > *:first-child{
    column-span: all;
    max-width: 640px;
    margin-bottom: 30px;
  }
  /* Der zweite Zwischentitel beginnt die rechte Spalte, damit ein Abschnitt
     nicht mitten zwischen Überschrift und Liste auseinanderfällt. */
  .custom-section-content .text-block.rte > h2:nth-of-type(2),
  .custom-section-content .text-block.rte > h3:nth-of-type(2),
  .custom-section-content .text-block.rte > h4:nth-of-type(2){
    break-before: column;
  }
}

/* --- v28: Funnel — Mobile ATC sichtbar -------------------------------
   Mobile: Horizon rendert Quick-Add als absolutes Bild-Overlay; die
   Formularbreite fällt dabei auf 0. Das Raster holt die Elemente in den
   normalen Kartenfluss und stellt den Button nach dem Preis dar.
   Sichtbarer Textbutton «In den Warenkorb legen» (Warenkorb). */
@media (max-width: 749px) {
  .product-card__content {
    --quick-add-mobile-display: flex !important;
    --quick-add-mobile-opacity: 1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "image"
      "title"
      "vendor"
      "notes"
      "price"
      "quick";
    gap: 4px !important;
    align-items: start;
  }
  /* Card gallery bleibt Bildquelle, Quick-Add wird Grid-Kind der Karte. */
  product-card .product-card__content .card-gallery,
  product-card .product-card__content .card-gallery > .contents {
    display: contents !important;
  }
  product-card .product-card__content .product-media-container { grid-area: image; }
  product-card .product-card__content [class*="product_title"] { grid-area: title; }
  product-card .product-card__content > rte-formatter { grid-area: vendor; }
  product-card .product-card__content > .vk-sw { grid-area: notes; }
  product-card .product-card__content > product-price { grid-area: price; }

  product-card .quick-add {
    grid-area: quick;
    display: flex !important;
    position: static !important;
    inset: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    transform: none !important;
  }
  product-card .quick-add__product-form-component,
  product-card .quick-add form,
  product-card .quick-add add-to-cart-component {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
  }
  product-card .quick-add__button--add {
    display: flex !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    min-height: 40px;
    margin: 10px 0 0 !important;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    font-family: var(--vk-sans);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;
    color: var(--vk-cream);
    background: var(--vk-forest);
    border: 1px solid var(--vk-forest);
    border-radius: 2px;
    box-shadow: none;
    /* Theme-Text «Hinzufügen» ausblenden, Funnel-Label setzen */
    font-size: 0 !important;
  }
  product-card .quick-add__button--add:hover,
  product-card .quick-add__button--add:focus-visible {
    background: #22371F;
    border-color: #22371F;
  }
  product-card .quick-add__button--add svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
  }
  product-card .quick-add__button--add::after {
    content: "In den Warenkorb legen";
    font-family: var(--vk-sans);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
    text-align: center;
    text-transform: none;
    white-space: normal;
    color: var(--vk-cream);
  }
}

/* «Zu den Produkten» — erste Zeile der Collection-Beschreibung */
.custom-section-content .text-block.rte > p:first-child a[href="#ResultsList"] {
  display: inline-flex;
  align-items: center;
  margin: 0 0 8px;
  padding: 10px 14px;
  font-family: var(--vk-sans);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--vk-cream);
  background: var(--vk-forest);
  border-radius: 2px;
  text-decoration: none;
}
.custom-section-content .text-block.rte > p:first-child a[href="#ResultsList"]:hover {
  background: #22371F;
}
/* v29 — Gratisversand-Hinweis im Warenkorb (vk-shipping-progress.js) */
.vk-ship{margin:10px 0 0;font-size:.9rem;line-height:1.45;color:#2C241C;opacity:.82}
.vk-ship--frei{color:#2F4A34;opacity:1}

/* v29 — Mehrpack-Kasten auch ausserhalb der Produktseiten */
.rte .vk-deal, .text-block .vk-deal{background:var(--vk-cream2,#EFE8DA);padding:12px 14px;border-radius:2px}
