/* Modern refinements, scoped to avoid the extracted Astro component collisions. */
[hidden] { display: none !important; }
body { font-family: var(--mg-sans); }
h1,h2 { letter-spacing: -.045em; line-height: 1.06; text-wrap: balance; }
h3 { font-family: var(--mg-sans); letter-spacing: -.02em; }
p { text-wrap: pretty; }
.site-header .bar { display: flex; flex-wrap: nowrap; align-items: center; min-height: 72px; gap: 1.5rem; position: relative; }
.site-header .brand { margin-right: auto; flex: 0 0 auto; }
.site-header .brand img { width: auto; height: 40px; }
.site-header .navwrap { order: 2; border: 0; padding: 0; flex: 0 1 auto; }
.site-header .nav { display: block; }
.site-header .cart { order: 3; margin: 0; flex: 0 0 44px; position: relative; }
.site-header .burger { display: none; border: 0; padding: 0; background: none; color: inherit; }
.site-header .burger::after { content: none; }
.site-header .nav a { font-size: 15px; }
.cart-zahl { position: absolute; right: 0; top: 0; min-width: 18px; padding: 1px 4px; border-radius: 50%; background: var(--mg-nuit); color: var(--mg-lait); font: 11px var(--mg-sans); text-align:center; }
@media (max-width:47.9375rem) {
 .site-header .bar { min-height: 68px; gap: .4rem; flex-wrap: wrap; }
 .site-header .brand img { height: 32px; }
 .site-header .navwrap { order: 4; flex-basis: 100%; }
 .site-header .navwrap.nav-ready { order: 3; flex-basis: auto; }
 .site-header .cart { order: 2; }
 .site-header .nav-ready .burger { display: grid; width: 44px; height: 44px; margin: 0; }
 .site-header .nav-ready .nav { display:none; }
 .site-header .nav-ready.is-open .nav { display:block; position:absolute; top:100%; inset-inline:0; background:var(--mg-sable); padding: .75rem var(--mg-gutter); border-block:1px solid var(--mg-linie); }
}
.mg-hero { min-height: min(78svh, 48rem); aspect-ratio: auto; }
.mg-hero::after { content:none; }
.mg-hero .inhalt { padding-block: clamp(5rem,10vw,9rem) 7rem; }
.mg-hero h1 { font-size: clamp(3.2rem,7.7vw,7.5rem); max-width: 10ch; }
.mg-hero .bilder figure img { animation: none; transform: scale(1.015); will-change: auto; }
.mg-hero .bilder figure { transition: opacity 1.4s ease; }
.mg-hero .hero-satz { font-size: clamp(1rem,1.8vw,1.2rem); max-width: 34ch; }
.mg-hero .hero-aktion { display:flex; align-items:center; flex-wrap:wrap; gap:1.25rem; }
.mg-hero .hero-preis { margin:0; font-size:14px; }
.mg-hero .hero-preis > span { display:block; font-size:12px; }
.mg-hero .punkte { align-items:center; gap: .1rem; }
.mg-hero .punkte button { min-width:44px; min-height:44px; }
.mg-hero .punkte [aria-pressed=true] span { background:var(--mg-lait); }
@media (prefers-reduced-motion:no-preference) {
 .mg-hero h1 { animation: mg-title 850ms ease-out both; }
 /* One continuous animation per image, including during fade-out: no reset/zoom jump. */
 .mg-hero .bilder figure img { animation:mg-drift 18s ease-in-out infinite alternate; animation-play-state:paused; }
 .mg-hero.motion-running .bilder figure img { animation-play-state:running; }
}
@keyframes mg-title { from {opacity:.35;transform:translateY(10px)} to {opacity:1;transform:none} }
@keyframes mg-drift { from {transform:scale(1.015)} to {transform:scale(1.04)} }
[data-reveal], [data-reveal].sichtbar { opacity:1; transform:none; transition:none; }
.karte { border-radius:var(--mg-radius-l); position:relative; }
.karte-bild { aspect-ratio:4/5; }
.karte-bild .karte-szene { position:absolute; inset:0; opacity:0; transition:opacity .45s ease; }
.karte:hover .karte-bild img { transform:none; }
@media (hover:hover) and (pointer:fine) { .karte-bild:hover .karte-szene { opacity:1; } }
.karte.szene-an .karte-szene { opacity:1; }
.bildwechsel { align-self:flex-start; margin:.75rem 1.25rem 0; border:1px solid var(--mg-linie); border-radius:var(--mg-pill); padding:.6rem .8rem; min-height:44px; background:transparent; color:var(--mg-nuit); font:13px var(--mg-sans); cursor:pointer; }
.karte-inhalt h2, .karte-inhalt h3 { font-size:20px; }
.karte-nutzen { font-size:15px; line-height:1.55; }
.karte-details { align-self:center; margin-top:.7rem; font-size:14px; color:var(--mg-nuit); text-underline-offset:.2em; }
.mg-kaufen { margin:0; }
.btn, .single_add_to_cart_button { transition:background-color .18s, transform .18s, box-shadow .18s; }
.btn:active, .single_add_to_cart_button:active { transform:translateY(1px); }
.btn:disabled, .single_add_to_cart_button:disabled { opacity:.65; cursor:wait; }
.mg-feedback { font-size:14px; line-height:1.5; margin:.65rem 0 0; flex-basis:100%; }
.mg-feedback:empty { display:none; }
.mg-feedback a { text-underline-offset:.2em; }
.pdp-info form.cart { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; }
.routine { display:grid; grid-template-columns:1fr 1.25fr; gap:clamp(2rem,6vw,6rem); align-items:center; padding-block:var(--mg-section); }
.routine figure { margin:0; }
.routine video { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:var(--mg-radius-l); background:var(--mg-nuit); }
.routine figcaption { font-size:13px; color:var(--mg-nuit-60); margin-top:.75rem; }
.eyebrow { font:600 12px var(--mg-sans); letter-spacing:.13em; text-transform:uppercase; }
.laufband .spur, .laufband .reihe { animation:none; }
@media (max-width:47.9375rem) {
 .mg-hero { min-height: min(740px,calc(100svh - 68px)); }
 .mg-hero .inhalt { padding-top:7rem; padding-bottom:6.5rem; }
 .mg-hero .punkte { bottom:1rem; left:var(--mg-gutter); right:auto; flex-wrap:wrap; }
 .mg-hero .punkte button { min-width:32px; width:32px; }
 .routine { grid-template-columns:1fr; }
 .karte-inhalt h2, .karte-inhalt h3 { font-size:19px; }
}
@media (prefers-reduced-motion:reduce) {
 *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
 .mg-hero .bilder figure img { transform:none; }
}

.mg-hero .hero-preis { display:block; }
.mg-hero .hero-preis b, .mg-hero .hero-preis b span { display:inline; white-space:nowrap; }
.karte form.mg-kaufen { padding:0; border:0; background:none; box-shadow:none; }
.pdp .galerie .woocommerce-product-gallery { width:100% !important; float:none; margin:0; }
.pdp .galerie .woocommerce-product-gallery__wrapper { margin:0; }
.pdp .galerie .wp-post-image { width:100%; height:auto; border-radius:var(--mg-radius-l); }
.pdp .pdp-info h1 { font-size:clamp(2.6rem,4.3vw,4.5rem); }
.pdp .pdp-grid { align-items:start; }
.pdp-info form.cart { padding:1.25rem 0; border:0; background:none; }
.pdp-info .single_add_to_cart_button { background:var(--mg-majorelle) !important; color:var(--mg-lait) !important; font-family:var(--mg-sans); min-height:52px; }
.pdp-info .single_add_to_cart_button:hover { background:var(--mg-majorelle-hover) !important; }
.pdp .galerie { display:block; padding:0; }
.pdp .pdp-grid { padding-block:clamp(2rem,4vw,4rem); }

.laufband { -webkit-mask-image:none; mask-image:none; }
.laufband .spur { width:auto; }
.laufband .reihe { flex-wrap:wrap; justify-content:center; gap:1rem 2rem; }
.laufband .reihe li { white-space:normal; gap:1.25rem; font-size:11px; }
.laufband .reihe[aria-hidden=true] { display:none; }
.motion-toggle { margin:0 0 1.5rem; padding:.6rem .9rem; min-height:44px; background:transparent; color:var(--mg-lait); border:1px solid var(--mg-nuit-60); border-radius:var(--mg-pill); font:13px var(--mg-sans); cursor:pointer; }
.motion-reduced *, .motion-reduced *::before, .motion-reduced *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
.motion-reduced .mg-hero .bilder figure img { transform:none; }
.cart-zahl { transform:none; top:0; right:0; }
.pdp .galerie .woocommerce-product-gallery { opacity:1 !important; }


/* Editorial pages: contain the inherited section spacing and portrait image sizes. */
.mg-editorial > section { padding-block:clamp(2.25rem,5vw,4rem); }
.mg-editorial .wrap.schmal { max-width:52rem; }
.mg-editorial h1 { font-size:clamp(2.6rem,5.5vw,4.6rem); max-width:18ch; margin-bottom:1.5rem; }
.mg-editorial h2 { font-size:clamp(1.8rem,3vw,2.5rem); margin-top:2rem; margin-bottom:.8rem; }
.mg-editorial p { max-width:65ch; line-height:1.7; }
.mg-editorial .lead { font-size:clamp(1.05rem,1.6vw,1.2rem); }
.mg-origin .bildbahn { padding:0 var(--mg-gutter); max-width:78rem; margin:auto; }
.mg-origin .bildbahn figure { margin:0; }
.mg-origin .bildbahn img { display:block; width:100%; height:clamp(240px,38vw,480px); object-fit:cover; border-radius:var(--mg-radius-l); }
.mg-origin .kauf-bild { margin:0; }
.mg-origin .kauf-bild img { max-height:540px; object-fit:cover; }
.mg-origin .kauf-preis { display:block; margin-block:1rem; }
.mg-usage .anwendung { background:var(--mg-lait); }
.mg-usage .anwendung h2 { margin-top:0; }
.mg-usage .schritte { margin-bottom:0; }
.mg-usage .schritte figure { margin:0 0 1rem; }
.mg-usage .schritte img { aspect-ratio:4/5; object-fit:cover; width:100%; }
.mg-usage .schritte p { font-size:16px; }
:root { --mg-ease:cubic-bezier(.22,.68,.25,1); }
.mg-hero .bilder figure { transition:opacity 1.4s var(--mg-ease); }
.mg-hero h1 { animation-timing-function:var(--mg-ease); }
.mg-hero .bilder figure img { animation-timing-function:cubic-bezier(.4,0,.6,1); }
.karte-bild .karte-szene { transition:opacity .65s var(--mg-ease); }
.btn,.single_add_to_cart_button { transition:background-color .25s var(--mg-ease),transform .25s var(--mg-ease),box-shadow .25s var(--mg-ease); }
.mg-usage .schritte img { transition:transform .7s var(--mg-ease); }
@media (prefers-reduced-motion:no-preference) {
 html:not(.motion-reduced) .laufband .spur { width:max-content; animation:wandern 46s cubic-bezier(0,0,1,1) infinite; }
 html:not(.motion-reduced) .laufband .reihe { flex-wrap:nowrap; flex-shrink:0; gap:2.75rem; justify-content:flex-start; }
 html:not(.motion-reduced) .laufband .reihe li { white-space:nowrap; gap:2.75rem; }
 html:not(.motion-reduced) .laufband .reihe[aria-hidden=true] { display:flex; }
html:not(.motion-reduced) .laufband:hover .spur { animation-play-state:paused; }

.mg-chat{position:fixed;right:1.25rem;bottom:1.25rem;z-index:30;font-family:var(--mg-sans)}
.mg-chat-open{min-width:5.5rem;min-height:3rem;border:1px solid var(--mg-argan);border-radius:999px;background:var(--mg-argan);color:var(--mg-nuit);font:600 15px var(--mg-sans);cursor:pointer;box-shadow:0 8px 24px #1d191633}
.mg-chat-open:hover,.mg-chat-open:focus-visible{background:var(--mg-nuit);border-color:var(--mg-nuit);color:var(--mg-lait)}
.mg-chat-panel{position:absolute;right:0;bottom:4rem;width:min(22rem,calc(100vw - 2rem));overflow:hidden;border:1px solid var(--mg-argan);border-radius:1rem;background:var(--mg-lait);box-shadow:0 18px 50px #1d191633}
.mg-chat-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1rem;background:var(--mg-nuit);color:var(--mg-lait)}
.mg-chat-head span{display:block;margin-top:.15rem;font-size:.75rem;opacity:.75}.mg-chat-close{border:0;background:transparent;color:inherit;font-size:1.5rem;line-height:1;cursor:pointer}
.mg-chat-log{display:grid;gap:.55rem;max-height:16rem;overflow:auto;padding:1rem}.mg-chat-msg{max-width:88%;margin:0;padding:.6rem .7rem;border-radius:.8rem;background:var(--mg-sable);color:var(--mg-nuit);font-size:.88rem;line-height:1.4}.mg-chat-msg.user{justify-self:end;background:var(--mg-argan);color:var(--mg-nuit)}
.mg-chat-suggestions{display:flex;flex-wrap:wrap;gap:.35rem;padding:0 1rem .75rem}.mg-chat-suggestions button{border:1px solid var(--mg-argan);border-radius:999px;background:var(--mg-lait);color:var(--mg-nuit);padding:.35rem .55rem;font:inherit;font-size:.75rem;cursor:pointer}
.mg-chat-form{display:flex;gap:.4rem;padding:.7rem 1rem 1rem;border-top:1px solid var(--mg-linie)}.mg-chat-form input{min-width:0;flex:1;border:1px solid var(--mg-argan);border-radius:.4rem;padding:.6rem;font:inherit}.mg-chat-form button{border:0;border-radius:.4rem;background:var(--mg-argan);color:var(--mg-nuit);padding:.6rem .7rem;font:inherit;cursor:pointer}
@media (max-width:40rem){.mg-chat{right:.75rem;bottom:.75rem}}
}
@media (prefers-reduced-motion:reduce) {
 .mg-hero .bilder figure,.karte-bild .karte-szene,.btn,.single_add_to_cart_button,.mg-usage .schritte img { transition:none !important; }
}

/* Herkunftsfoto als kleine Begleitaufnahme im Text statt eigener Bildbühne. */
.herkunft-baumbild { float:right; width:220px; margin:2rem 0 1rem 2rem; }
.herkunft-baumbild img { width:100%; height:190px; object-fit:cover; border-radius:var(--mg-radius-l); }
.mg-origin > section:first-child .schmal::after { content:""; display:block; clear:both; }
@media(max-width:47.9375rem) { .herkunft-baumbild { float:none; width:100%; max-width:280px; margin:1.5rem 0; } .herkunft-baumbild img { height:170px; } }