/*
 * Shop-Design – im Stil der Seminarseite (Akzent #ae6f7b)
 * Produktübersichten, Footer und Kontakt-Buttons am Rand.
 * Überschriften h1–h3 bekommen hier bewusst KEIN font-weight.
 */

.mini-shop--products {
  --sem-ink: #1f1517;
  --sem-ink-2: #3f3537;
  --sem-muted: #76696b;
  --sem-hair: #eee3e4;
  --sem-panel: #f8f3f3;
  --sem-accent: #ae6f7b;
  --sem-accent-hover: #7e3a4b;
  --sem-accent-soft: #f7e6e9;
  --sem-accent-line: #ecc9d0;
  --sem-radius: 20px;
  --sem-shadow: 0 0 0 1px #3a1e2612, 0 2px 2px -1px #3a1e260d, 0 16px 32px -16px #3a1e2629;

  color: var(--sem-ink-2);
}

/* Kopfzeile: "Übersicht" + Anzahl */
.mini-shop--products .mini-shop__list-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: clamp(20px, 3vw, 32px);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--sem-hair);
}

.mini-shop--products .mini-shop__list-intro p {
  margin: 0;
  color: var(--sem-ink);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  letter-spacing: -0.02em;
}

.mini-shop--products .mini-shop__count {
  margin: 0;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--sem-accent-soft);
  color: var(--sem-accent-hover);
  font-size: 0.875rem;
}

/* Raster */
.mini-shop--products .mini-shop__products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap: clamp(16px, 2.5vw, 28px);
}

/* Karte */
.mini-shop--products .mini-shop__product {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-radius: var(--sem-radius);
  background: #fff;
  box-shadow: var(--sem-shadow);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mini-shop--products .mini-shop__product:hover,
.mini-shop--products .mini-shop__product:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 0 0 1px #3a1e2614, 0 4px 6px -2px #3a1e2612, 0 24px 40px -18px #3a1e2640;
}

.mini-shop--products .mini-shop__media {
  position: relative;
  margin: 0;
  aspect-ratio: 1 / 1;
  background: var(--sem-panel);
}

.mini-shop--products .mini-shop__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}

.mini-shop--products .mini-shop__badge {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--sem-accent);
  color: #fff;
  font-size: 0.8125rem;
}

.mini-shop--products .mini-shop__card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  padding: 20px 22px 22px;
}

.mini-shop--products .mini-shop__kind {
  margin: 0;
  color: var(--sem-accent);
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mini-shop--products .mini-shop__name {
  margin: 0;
  color: var(--sem-ink);
  font-size: 1.25rem;
  letter-spacing: -0.01em;
  line-height: 1.25;
}

/* ganze Karte klickbar */
.mini-shop--products .mini-shop__name a {
  color: inherit;
  text-decoration: none;
}

.mini-shop--products .mini-shop__name a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.mini-shop--products .mini-shop__name a:focus-visible {
  outline: none;
}

.mini-shop--products .mini-shop__product:has(.mini-shop__name a:focus-visible) {
  outline: 3px solid var(--sem-accent-line);
  outline-offset: 3px;
}

.mini-shop--products :is(.mini-shop__description, .mini-shop__card-description) {
  margin: 0;
  color: var(--sem-muted);
  font-size: 0.9375rem;
  line-height: 1.55;
}

.mini-shop--products .mini-shop__price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin: auto 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--sem-hair);
}

.mini-shop--products .mini-shop__price strong {
  color: var(--sem-ink);
  font-size: 1.25rem;
  font-weight: 400;
}

.mini-shop--products .mini-shop__unit-price {
  color: var(--sem-muted);
  font-size: 0.8125rem;
}

/* "Ansehen"-Pille unten rechts, wie die Seminar-Buttons */
.mini-shop--products .mini-shop__price::after {
  content: "Ansehen →";
  margin-left: auto;
  padding: 7px 16px;
  border-radius: 999px;
  background: var(--sem-accent);
  color: #fff;
  font-size: 0.875rem;
  transition: background 0.2s ease;
}

.mini-shop--products .mini-shop__product:hover .mini-shop__price::after {
  background: var(--sem-accent-hover);
}

.mini-shop--products .mini-shop__footnote {
  margin-top: clamp(20px, 3vw, 32px);
  color: var(--sem-muted);
  font-size: 0.8125rem;
}


/* =========================================================================
   Footer: kompakt und hell in zartem Rosé, Logo in dunkler Fassung
   ========================================================================= */

body #footer {
  --ft-ink: #270019;
  --ft-text: #5a4a4e;
  --ft-accent: #ae6f7b;
  --ft-hair: #e9d3d8;

  padding: clamp(32px, 4vw, 48px) 24px 28px;
  background: #f8eff1;
  border-top: 1px solid var(--ft-hair);
  color: var(--ft-text);
}

/* Logo, Textspalten, Claim und Links immer untereinander –
   sonst rutschen sie bei sehr breiten Bildschirmen in eine Reihe */
body #footer .inside {
  flex-direction: column;
  align-items: center;
}

body #footer .footer-content {
  width: 100%;
}

/* Logo kleiner, dunkle Fassung */
body #footer .logo--footer {
  display: block;
  width: fit-content;
  margin: 0 auto 28px;
}

body #footer .logo--footer img {
  height: 56px;
  width: auto;
}

/* Textspalten: kleiner, ohne Trennlinie oben */
body #footer .footer-content {
  row-gap: 1.5rem;
}

body #footer .footer-content .content-text {
  padding-top: 0;
  border-top: 0;
}

body #footer h6 {
  margin-bottom: 0.5rem;
  color: var(--ft-ink);
  font-size: 1.0625rem;
  font-weight: 400;
}

body #footer .rte p {
  margin: 0 0 0.5rem;
  color: var(--ft-text);
  font-size: 0.875rem;
  line-height: 1.55;
}

body #footer a {
  color: var(--ft-ink);
  text-decoration-color: var(--ft-accent);
}

body #footer .rte a {
  border-bottom-color: var(--ft-accent);
}

body #footer a:hover,
body #footer a:focus-visible {
  color: var(--ft-accent);
}

/* Unterste Zeile: Links als schlichte Textreihe, Claim klein darunter */
body #footer .nav-meta--footer {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--ft-hair);
}

body #footer .nav-meta--footer ul {
  gap: 4px 18px;
}

body #footer .nav-meta--footer a {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--ft-ink);
  font-size: 0.8125rem;
}

body #footer .nav-meta--footer a:hover,
body #footer .nav-meta--footer a:focus-visible {
  background: none;
  color: var(--ft-accent);
}

body #footer .footer-claim {
  display: block;
  margin-top: 12px;
  color: var(--ft-text);
  font-size: 0.8125rem;
  text-align: center;
}

body #footer .footer-claim a {
  color: var(--ft-text);
}


/* =========================================================================
   Kontakt-Buttons am Rand (Mail/Telefon) in dunklem Rosa
   ========================================================================= */

body .mod_quickmenu.style-blue a {
  border-color: #7e3a4b;
  background: #7e3a4b;
  color: #fff;
}

body .mod_quickmenu.style-blue a i,
body .mod_quickmenu.style-blue a span {
  color: #fff;
}

body .mod_quickmenu.style-blue a:hover,
body .mod_quickmenu.style-blue a:focus-visible {
  border-color: #ae6f7b;
  background: #ae6f7b;
}


/* =========================================================================
   Header: Metanavigation und Hauptnavigation in #270019
   ========================================================================= */

body #header .nav-meta a,
body #header .nav-meta strong,
body #header .nav-main a,
body #header .nav-main strong {
  color: #270019;
}

/* Aktive Seite (und ihr Hauptmenüpunkt) in Rosé hervorheben */
body #header .nav-meta strong.active,
body #header .nav-main strong.active,
body #header .nav-main a.trail {
  color: #ae6f7b;
}

/* Handy: "Menu"-Knopf in #270019 */
body .nav-toggle {
  color: #270019;
}

body .nav-toggle .icon-line,
body .nav-toggle .icon-line::before,
body .nav-toggle .icon-line::after {
  background-color: #270019;
}


/* =========================================================================
   Linke Navigation (Seitenleiste): #270019, aktive Seite in Rosé
   ========================================================================= */

body #left .nav-sidebar a {
  color: #270019;
}

body #left .nav-sidebar a:hover,
body #left .nav-sidebar a:focus-visible {
  background: #f7e6e9;
  color: #7e3a4b;
}

body #left .nav-sidebar a.trail {
  color: #ae6f7b;
}

body #left .nav-sidebar strong.active {
  background: #ae6f7b;
  color: #fff;
}


/* =========================================================================
   Brotkrümel-Navigation: Links #270019, aktuelle Seite in Rosé
   ========================================================================= */

body .mod_breadcrumb a {
  color: #270019;
}

body .mod_breadcrumb a:hover,
body .mod_breadcrumb a:focus-visible {
  color: #7e3a4b;
}

body .mod_breadcrumb li.active {
  color: #ae6f7b;
}


/* =========================================================================
   Seitenhintergrund: zartes Rosé-Weiß (heller als bei deinweginsweb #f6f2f3)
   ========================================================================= */

html body {
  background: #faf7f7;
}

/* Handy-Menü (aufgeklappt) im gleichen Ton statt kühlem Grau */
@media only screen and (max-width: 63.999rem) {
  body .nav-main {
    background: #faf7f7;
  }
}


/* =========================================================================
   Produktdetailseite: Symbole "frei von" bei Seifen (eigenes Template)
   ========================================================================= */

.mini-shop__badges {
  margin: 1.25rem 0 1.5rem;
  max-width: 290px;
}

.mini-shop__badges img {
  display: block;
  width: 100%;
  height: auto;
}


/* =========================================================================
   Gestaltung wie heikewiese.de (14.10.2026)
   Ruhiger heller Kopf, dünne Überschriften in Beere mit kursiver zweiter
   Zeile in Rosé (im Text-Editor: <em> in der Überschrift), Überzeile in
   Rosé (Absatz mit Klasse "kicker"), Kacheln mit Titel unter dem Bild.
   ========================================================================= */

/* Kopf: heller Grund statt Schaum-Bild, feine Linie unten */
body #header {
  background: #faf7f7;
  border-bottom: 1px solid #eee3e4;
}

/* Hauptmenü am Computer: feine Unterstreichung in Rosé für aktive Seite und beim Drüberfahren */
@media only screen and (min-width: 64rem) {
  body #header .nav-main .level_1 > li > :is(a, strong) {
    position: relative;
  }

  body #header .nav-main .level_1 > li > :is(a, strong)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 2px;
    border-radius: 2px;
    background: #ae6f7b;
    transform: scaleX(0);
    transition: transform 0.25s;
  }

  body #header .nav-main .level_1 > li > :is(a:hover, strong.active, a.trail)::after {
    transform: scaleX(1);
  }

  body #header .nav-main .level_1 > li > a:hover {
    color: #ae6f7b;
  }
}

/* Überschriften: dünn, in Beere; kursive zweite Zeile in Rosé */
body #main :is(h1, h2),
body #header-image-wrapper h2 {
  color: #270019;
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.05;
}

body :is(h1, h2, h3) em {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 400;
  color: #ae6f7b;
}

/* Überzeile über Überschriften: <p class="kicker"> */
body .kicker,
body #main .rte p.kicker {
  margin: 0 0 1.1rem;
  color: #ae6f7b;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
}

body .kicker + :is(h1, h2, h3) {
  margin-top: 0;
}

/* Startseite: große Überschriften wie auf heikewiese.de */
body #article-1 h2,
body #produktkacheln h2 {
  font-size: clamp(2rem, 3vw, 2.6rem);
}

body #header-image-wrapper h2 {
  font-size: clamp(2.2rem, 3.6vw, 3.2rem);
}

body #article-1 .rte p {
  color: #3f3537;
}

body #article-1 .rte p.text--lg {
  color: #3f3537;
}

/* Slider: weiße Textkarte mit sanftem Schatten */
body #header-image-wrapper .text-wrapper {
  background: #fff;
  box-shadow: 0 0 0 1px #3a1e2612, 0 2px 2px -1px #3a1e260d, 0 16px 32px -16px #3a1e2629;
}

/* Produktkacheln: Bild mit Schatten, Titel darunter */
body #produktkacheln .mod_article__inner {
  row-gap: 2.2rem;
}

body #produktkacheln .kachel {
  display: flex;
  flex-direction: column-reverse;
  overflow: visible;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

body #produktkacheln .kachel h3 {
  position: static;
  inset: auto;
  transform: none;
  margin: 0;
  padding: 14px 0 0;
  background: none;
  color: #270019;
  font-size: 1.05rem;
  font-weight: 500;
  text-shadow: none;
}

body #produktkacheln .kachel figure {
  margin: 0;
}

body #produktkacheln .kachel figure::after,
body #produktkacheln .kachel figure a::after {
  display: none;
}

body #produktkacheln .kachel img {
  border-radius: 20px;
  box-shadow: 0 0 0 1px #3a1e2612, 0 2px 2px -1px #3a1e260d, 0 16px 32px -16px #3a1e2629;
  transition: transform 0.3s;
}

body #produktkacheln .kachel:hover img {
  transform: translateY(-4px);
}

@media (prefers-reduced-motion: reduce) {
  body #produktkacheln .kachel img {
    transition: none;
  }
}

/* "Meine Produkte" (Textelement mit Überzeile) über die volle Breite des Kachelrasters */
body #produktkacheln .content-text {
  grid-column: 1 / -1;
}

body #produktkacheln .content-text .rte > :last-child {
  margin-bottom: 0;
}

/* Handy und Tablet: Logo sichtbar machen (die SVG-Datei hat keine feste Breite und fiel auf 0 zusammen) */
@media only screen and (max-width: 63.999rem) {
  body #header a.logo img {
    width: auto;
    height: 48px;
    max-width: none;
  }
}

/* Kategorieseiten und Seminar: Überschriften im neuen Stil (Überzeile + Zweizeiler im Text) */
body .mini-shop__list-intro h2:empty {
  display: none;
}

body #main .kicker + :is(h1, h2) {
  font-size: clamp(2rem, 3vw, 2.6rem);
}

/* Startseite: gleiche Größe wie alle Seitenüberschriften */
body #main :is(#article-1, #produktkacheln) h2 {
  font-size: clamp(2rem, 3vw, 2.6rem);
}

/* Überzeile in der Produktliste (die Regel für den alten "Übersicht"-Titel hat sonst Vorrang) */
body .mini-shop--products .mini-shop__list-intro p.kicker {
  margin: 0 0 0.8rem;
  color: #ae6f7b;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
}

/* Abstand zwischen Zweizeiler und Text darunter */
body #main .content-text .kicker + :is(h1, h2) {
  margin-bottom: 1.25rem;
}

/* Überschriften h3 (z. B. "Kontaktformular") ebenfalls in Beere statt im alten Blau */
body #main h3 {
  color: #270019;
}

/* Seminar-Detailseite: "Zurück zu den Seminaren" über den rechten Kasten setzen,
   damit Bild und Buchungskasten oben auf einer Linie beginnen (nur zweispaltig) */
@media only screen and (min-width: 64rem) {
  body .seminar-booking--detail {
    position: relative;
  }

  body .seminar-booking--detail > .seminar-detail__back {
    position: absolute;
    bottom: 100%;
    left: 0;
    margin: 0 0 0.5rem;
  }
}

/* =========================================================================
   Typografie vereinheitlicht (14.10.2026)
   Eine warme Textfarbe, drei Überschriftengrößen, ruhigeres Hauptmenü,
   Dropdown als weiße Box.
   ========================================================================= */

/* Textfarbe: warmes Dunkelgrau statt kühlem Blaugrau (#48535b aus neu.css) */
html body {
  color: #3f3537;
}

body .mini-shop {
  --mini-shop-muted: #76696b;
}

body .breadcrumb li {
  color: #76696b;
  font-weight: 400;
}

body #main .rte :is(p, li) {
  line-height: 1.65;
}

body #main .rte p.text--lg {
  color: #270019;
  font-size: 1.2rem;
  line-height: 1.55;
}

/* Überschriften: eine Größe für alle Seitenüberschriften, eine für h3 */
body #main :is(h1, h2) {
  font-size: clamp(2rem, 3vw, 2.6rem);
}

body #main h3:not(.mini-shop__name) {
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.01em;
}

/* Hauptmenü am Computer: kleiner und mittelstark; Dropdown als weiße Box */
@media only screen and (min-width: 64rem) {
  body #header .nav-main .level_1 > li > :is(a, strong) {
    font-size: 1.0625rem;
    font-weight: 500;
  }

  body #header .nav-main .level_1 > li {
    position: relative;
  }

  /* geöffneter Menüpunkt über der zweiten Menüzeile (Theme setzt z-index 10000) */
  body #header .nav-main .level_1 > li:is(:hover, :focus-within) {
    z-index: 10001;
  }

  body #header .nav-main li .level_2 {
    width: max-content;
    min-width: 12rem;
    padding: 0.5rem 0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 0 0 1px #3a1e2612, 0 16px 32px -16px #3a1e2640;
  }

  /* Menüpunkte rechts (ab dem 5.) öffnen nach links, damit nichts über den Rand ragt */
  body #header .nav-main .level_1 > li:nth-child(n+5) > .level_2 {
    left: auto;
    right: 0;
  }

  body #header .nav-main li .level_2 :is(a, strong) {
    display: block;
    padding: 0.45rem 1.15rem;
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.4;
    white-space: nowrap;
  }

  body #header .nav-main li .level_2 a:hover {
    background: #f7e6e9;
    color: #7e3a4b;
  }

  body #header .nav-main li .level_2 :is(a, strong)::after {
    display: none;
  }
}

/* =========================================================================
   Symbole im Schnellmenü (E-Mail, Telefon, Telegram) als eigene SVG-Masken
   statt Font Awesome von kit.fontawesome.com (Datenschutz: keine Verbindung
   zu einem US-Anbieter). 15.10.2026
   ========================================================================= */

body .fa{display:inline-block;width:1em;height:1em;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;vertical-align:-.125em}

body .fa::before{content:none!important}

body .fa-envelope{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linejoin%3D'round'%20d%3D'M3%205.5h18v13H3z'%2F%3E%3Cpath%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linejoin%3D'round'%20d%3D'm3.5%206%208.5%207%208.5-7'%2F%3E%3C%2Fsvg%3E")}

body .fa-phone{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M6.6%2010.8a15.1%2015.1%200%200%200%206.6%206.6l2.2-2.2c.3-.3.7-.4%201-.2%201.1.4%202.3.6%203.6.6.6%200%201%20.4%201%201V20c0%20.6-.4%201-1%201A17%2017%200%200%201%203%204c0-.6.4-1%201-1h3.5c.6%200%201%20.4%201%201%200%201.3.2%202.5.6%203.6.1.3%200%20.7-.2%201z'%2F%3E%3C%2Fsvg%3E")}

body .fa-telegram{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M21.4%203.6%202.9%2010.7c-1.1.4-1%201.9.1%202.2l4.6%201.4%201.8%205.5c.3.9%201.4%201.1%202%20.4l2.6-2.6%204.8%203.5c.8.6%201.9.1%202.1-.8L23.1%205c.2-1-.8-1.8-1.7-1.4zm-11.8%2011%208.6-7.6-10.2%206.4z'%2F%3E%3C%2Fsvg%3E")}

/* Kein Kilopreis bei Objekten, die pro Stück verkauft werden (Übergang bis Mini-Shop das kann,
   siehe Issue #15). Erkennung über den Alias: Seifenschalen beginnen mit "seifenschale-".
   Bei Seifen bleibt der Grundpreis sichtbar, dort ist er Pflicht. */
body .mini-shop__product:has(a[href*="/produkt/seifenschale-"]) :is(.unit-price, .mini-shop__unit-price),
body .mini-shop__buy-box:has(input[name="alias"][value^="seifenschale-"]) :is(.unit-price, .mini-shop__unit-price) {
  display: none;
}

/* Produktnamen in den Karten: seit Mini-Shop 0.4.5 h2, dürfen nicht die große Seitenüberschrift erben */
body #main .mini-shop__product :is(h2, h3).mini-shop__name {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

/* Einleitungstext unter der Überschrift einer Produktliste in normaler Textgröße
   (die ältere Regel für den früheren Titel "Übersicht" macht Absätze dort groß) */
body .mini-shop--products .mini-shop__list-intro p:not(.kicker) {
  max-width: 62ch;
  margin: 0.9rem 0 0;
  color: #3f3537;
  font-size: 1.0625rem;
  line-height: 1.65;
  letter-spacing: 0;
}

/* Textelement mit Bild links oder rechts (z. B. Porträt auf "Über mich"), nicht im Startseiten-Slider:
   ab Tablet fließt der Text um das Bild, darunter steht das Bild über dem Text */
body #main .mod_article:not(.startslider) .content-text.media :is(figure) img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
  box-shadow: 0 0 0 1px #3a1e2612, 0 2px 2px -1px #3a1e260d, 0 16px 32px -16px #3a1e2629;
}

body #main .mod_article:not(.startslider) .content-text.media--right > figure,
body #main .mod_article:not(.startslider) .content-text.media--left > figure {
  max-width: 300px;
  margin: 0 0 1.5rem;
}

@media only screen and (min-width: 48rem) {
  body #main .mod_article:not(.startslider) .content-text.media--right > figure {
    float: right;
    width: min(300px, 40%);
    margin: 0.4rem 0 1.5rem 2.5rem;
  }

  body #main .mod_article:not(.startslider) .content-text.media--left > figure {
    float: left;
    width: min(300px, 40%);
    margin: 0.4rem 2.5rem 1.5rem 0;
  }

  /* nur bei Bild links/rechts: bei Raster-Layouts (z. B. Seminarseite) würde ::after eine Rasterzelle belegen */
  body #main .mod_article:not(.startslider) .content-text:is(.media--left, .media--right)::after {
    content: "";
    display: table;
    clear: both;
  }
}

/* =========================================================================
   Mini-Warenkorb: Taschen-Symbol in der oberen Leiste (Modul 75, eingebunden
   in "Header - Included Top Bar"), Seitenleiste in den Shop-Farben.
   Auf dem Handy blendet neu.css die obere Leiste aus – dort bleibt nur die
   Tasche sichtbar, links neben "Menu".
   ========================================================================= */
body .mini-shop-cart-module {
  --nw-accent: #ae6f7b;
  --nw-accent-contrast: #fff;
  margin-left: 0.5rem;
  color: #270019;
}

body .mini-shop-cart-sheet h2 {
  color: #270019;
  font-weight: 400;
}

/* Hauptknöpfe im ganzen Shop rosé statt schwarz: In den Warenkorb, Zur Kasse,
   Zahlungspflichtig bestellen (Mini-Shop: --mini-shop-primary-*) */
body .mini-shop {
  --mini-shop-primary-background: #ae6f7b;
  --mini-shop-primary-color: #fff;
}

body .mini-shop :is(button, a):is(.mini-shop__button--primary, .mini-shop__button--order) {
  border-color: #ae6f7b;
}

@media only screen and (max-width: 29.999rem) {
  body #header .inside {
    position: relative;
  }

  body .header-top-bar {
    display: block;
    position: absolute;
    top: 26px;
    right: 6.75rem;
    z-index: 10;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    background: none;
  }

  body .header-top-bar .inner {
    width: auto;
    margin: 0;
    padding: 0;
    background: none;
  }

  body .header-top-bar .inner > :not(.mini-shop-cart-module) {
    display: none !important;
  }
}

/* Hauptmenü zwischen 1024 und 1279 px in einer Zeile halten
   (sonst rutscht "Geschenkideen" in eine zweite Zeile; darunter greift das Klappmenü) */
@media only screen and (min-width: 64rem) and (max-width: 79.999rem) {
  body #header .nav-main ul.level_1 {
    gap: 16px;
  }
  body #header .nav-main ul.level_1 > li > :is(a, strong, span) {
    font-size: 15px;
  }
}