/* Gemeinsame Bausteine fuer Seiten im neuen Design (Mosaik hell / Dunkel), die ueber scripts/site_lib.py erzeugt oder
   nach dem Muster der Startseite gebaut werden. Nach css/shop-c.css und css/studien-c.css laden. Gilt nur mit body.shop-c. */

/* Kopfleiste wie auf den Studien-Seiten: immer dunkel, Links hell (auch im Hellmodus und beim Scrollen) */
html[data-theme="light"] body.shop-c .header,body.shop-c .header.scrolled{background:rgba(10,26,20,.97)}
html[data-theme="light"] body.shop-c .nav-link{color:rgba(255,255,255,.9)}
html[data-theme="light"] body.shop-c .nav-link:hover{background:rgba(255,255,255,.12)}
html[data-theme="light"] body.shop-c .nav-link.active{color:#f3d36b}

/* Lesbarkeit des Hero-Textes ueber dem hellen Bildbereich */
body.shop-c .shop-hero p{text-shadow:0 0 5px #000d,0 1px 16px #000d}
body.shop-c .shop-hero h1{text-shadow:0 0 6px #000b,0 2px 26px #000c}

/* Hero-Marke und Kennzahlen (gleich wie css/pilze-c.css, fuer Seiten ohne .pz) */
body.shop-c:not(.pz) .shop-hero .pz-kicker{display:inline-block;font:700 15px var(--sc-body);letter-spacing:.04em;color:#fff;background:rgba(10,26,20,.55);border:1.5px solid rgba(255,255,255,.6);border-radius:999px;padding:6px 14px;margin:0 0 16px}

/* Seitengeruest der erzeugten Seiten: msx-Kopf/-Fuss bleiben, Inhalt wie Studien-Seiten */
body.shop-c .msx-header .nav-menu{align-items:center}
body.shop-c .msx-footer{margin-top:0}

/* Themen-Karten (Link-Karten) */
body.shop-c .sc-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:18px;margin:0;padding:0;list-style:none}
body.shop-c .sc-cards .st-card h3{margin-top:0}
body.shop-c .sc-cards .sc-more{margin-top:auto;font-weight:700;color:inherit;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}
body.shop-c .sc-note{font-size:17px}
body.shop-c .sc-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}
body.studien-b .sc-cards .st-card{--ac:#8FD1AE}
body.shop-c:not(.pz) .pz-hero-meta{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0}
body.shop-c:not(.pz) .pz-hero-meta li{font:700 15px var(--sc-body);color:#fff;background:rgba(10,26,20,.55);border:1.5px solid rgba(255,255,255,.6);border-radius:999px;padding:6px 14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* ---------- msx-Bausteine (erzeugte Seiten: Podcast, Folgen, Newsletter-Box) im neuen Design ---------- */
body.shop-c .msx-wrap,body.shop-c .msx-narrow{width:100%;margin:0}
body.shop-c .msx-section{padding:0;margin:48px 0 0;color:var(--st-ink)}
body.shop-c .msx-section h2{font:800 clamp(26px,3.4vw,38px)/1.12 var(--sc-head);color:var(--st-ink);margin:0 0 12px}
body.shop-c .msx-section h3,body.shop-c .msx-section summary{color:var(--st-ink)}
body.shop-c .msx-section p,body.shop-c .msx-section li{color:var(--st-ink);font-size:18px;line-height:1.6}
body.shop-c .msx-muted{color:var(--st-mute)!important}
body.shop-c .msx-section a:not(.msx-btn):not(.msx-card-link){color:inherit;text-decoration:underline;text-underline-offset:3px;font-weight:700}
body.shop-c .msx-section details{background:var(--lg-surface,#F1EDE5);border-radius:20px;padding:14px 18px}
body.studien-b.shop-c .msx-section details{--lg-surface:#16281F}
body.shop-c .msx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:18px}
body.shop-c .msx-card{background:var(--tc,#E9E5DC);color:var(--st-ink);border:0;border-radius:28px;padding:24px;gap:10px}
body.shop-c .msx-grid>.msx-card:nth-child(6n+1){--tc:var(--cannabis);--ac:#59D68F}
body.shop-c .msx-grid>.msx-card:nth-child(6n+2){--tc:var(--terpene);--ac:#F2B04D}
body.shop-c .msx-grid>.msx-card:nth-child(6n+3){--tc:var(--psilo);--ac:#F07FA6}
body.shop-c .msx-grid>.msx-card:nth-child(6n+4){--tc:var(--med);--ac:#6CAEF5}
body.shop-c .msx-grid>.msx-card:nth-child(6n+5){--tc:var(--pilze);--ac:#B49CF0}
body.shop-c .msx-grid>.msx-card:nth-child(6n+6){--tc:var(--ebv);--ac:#5CCBD3}
body.shop-c .msx-card h3{font:800 21px/1.2 var(--sc-head);color:inherit}
body.shop-c .msx-card p{font-size:17px;color:inherit}
body.shop-c .msx-card .msx-muted{color:var(--st-mute)!important}
body.shop-c .msx-card-link{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}
body.shop-c .msx-tag{font:700 13px var(--sc-body);letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.7);color:#1B1B24;padding:4px 12px;align-self:flex-start}
body.studien-b.shop-c .msx-card{border:1.5px solid color-mix(in srgb,var(--ac,#7BD9A5) 55%,transparent);border-left:6px solid var(--ac,#7BD9A5)}
body.studien-b.shop-c .msx-tag{background:rgba(255,255,255,.1);color:#EAF2EE}
body.shop-c .msx-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 8px}
body.shop-c .msx-btn{border-radius:999px;min-height:52px;padding:0 26px;font:700 18px var(--sc-body);border:2.5px solid var(--st-ink);background:transparent;color:var(--st-ink)}
body.shop-c .msx-btn:hover{background:var(--st-ink);color:var(--sc-bg,#FBF9F6);transform:none}
body.shop-c .msx-btn-gold{background:var(--st-ink);color:var(--sc-bg,#FBF9F6);border-color:var(--st-ink)}
body.shop-c .msx-btn-spotify{background:#1db954;color:#08210f;border-color:#1db954}
body.shop-c .msx-btn-spotify:hover{background:#17a34a;color:#08210f}
body.shop-c .msx-note{background:var(--erg);color:var(--st-ink);border:2.5px solid var(--st-ink);border-left-width:2.5px;border-radius:20px;padding:16px 20px;font-size:17px}
body.studien-b.shop-c .msx-note{background:#2A2712}
body.shop-c .msx-newsletter-inner{background:var(--neu);border:0;border-radius:28px;color:var(--st-ink)}
body.studien-b.shop-c .msx-newsletter-inner{border-left:6px solid #8FD1AE;background:#16251D}
body.shop-c .msx-newsletter h2,body.shop-c .msx-newsletter p,body.shop-c .msx-newsletter-sub,body.shop-c .msx-check,body.shop-c .msx-check span{color:var(--st-ink)}
body.shop-c .msx-newsletter-form input[type=email]{background:var(--sc-card,#fff);color:#1B1B24;border:2.5px solid var(--st-ink);border-radius:999px;min-height:52px;font:700 17px var(--sc-body)}
body.studien-b.shop-c .msx-newsletter-form input[type=email]{background:#0f2018;color:#EAF2EE;border-color:rgba(255,255,255,.55)}
body.shop-c .msx-check input{accent-color:var(--st-ink);width:22px;height:22px}
body.shop-c .msx-form-msg,body.shop-c .msx-form-msg.ok,body.shop-c .msx-form-msg.err{color:var(--st-ink);font-weight:700}
body.shop-c .msx-embed-ph{background:rgba(8,16,12,.88);border:0;color:#fff}
body.shop-c .msx-embed-ph p{color:#fff}

/* ---------- Aufklapp-Gruppen im uebersetzten Menue (Desktop: Dropdown, mobil: im Drawer aufgeklappt) ---------- */
.msx-nav .nav-group { position: relative; }
body .msx-nav .nav-group-btn { background: transparent; border: 0; font: inherit; font-size: inherit; color: rgba(255, 255, 255, 0.9); cursor: pointer; border-radius: 8px; white-space: nowrap; }
.msx-nav .nav-group-btn .nav-caret { font-size: 0.7em; opacity: 0.8; }
.msx-nav .nav-sub { list-style: none; margin: 0; padding: 6px; }
@media (min-width: 1101px) {
    .msx-nav .nav-sub { display: none; position: absolute; top: 100%; left: 0; min-width: 230px; z-index: 1200;
        background: rgba(10, 26, 20, 0.98); border: 1px solid var(--msx-line, rgba(212, 175, 55, 0.35)); border-radius: 12px;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45); }
    .msx-nav .nav-group:hover > .nav-sub, .msx-nav .nav-group:focus-within > .nav-sub, .msx-nav .nav-group.open > .nav-sub { display: block; }
    .msx-nav .nav-sub .nav-link { display: block; width: 100%; padding: 0.55rem 0.8rem; white-space: nowrap; }
    body .msx-nav .nav-group-btn:hover, body .msx-nav .nav-group:hover > .nav-group-btn { color: #fff; background: rgba(212, 175, 55, 0.12); }
    .msx-nav .nav-sub .nav-link:hover { background: rgba(212, 175, 55, 0.12); }
}
@media (max-width: 1100px) {
    .msx-nav .nav-group-btn { width: 100%; text-align: left; font-weight: 700; padding: 0.75rem 1rem; pointer-events: none; opacity: 0.85;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
    .msx-nav .nav-group-btn .nav-caret { display: none; }
    .msx-nav .nav-sub { padding: 0 0 0 0.75rem; }
    .msx-nav .nav-group { width: 100%; }
}

.msx-footer .footer-links button.msx-linkbtn{color:rgba(255,255,255,.8);background:none;border:0;padding:0;font:inherit;font-size:.92rem;margin:6px 0;cursor:pointer;text-align:left}
